GWT doesn't render closed XHTML tags - gwt

I can't make GWT it generate valid XHTML. On our project we use table layout therefore there are many tables on the pages and they have <colgroup> tags along with <col> tags inside. The <col> tags are not closed regardless which doctype is put in the main HTML template. Both XHTML Transitional and XHTML String have been tried. The result is the same.
<table class="header-grid" cellpadding="0" cellspacing="0">
<colgroup>
<col class="header-left">
<col class="header-center">
<col class="header-right">
</colgroup>
<tbody>
...
</tbody>
</table>
<input> elements are not closed either. My guess that there could be other not properly closed elements, but they are not used in the application or I haven't found them.
FYI. GWT manipulates DOM and doesn't do any insertions to the inner HTML as text. It uses the JavaScript's appendChild(...) method along with doc.createElement(...).
The issue is reproduced in Chrome, Firefox and IE both in the Web and Dev modes. It occurs on the pages where UIBinder is not used.
GWT version: 2.4.0.
Main HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="svg.render.forceflash" content="false"/>
<meta name="gwt:property" content="locale=en"/>
<meta http-equiv="X-UA-Compatible" content="IE=8, IE9"/>
<title>NPQ Facility Management</title>
<script src="https://maps-api-ssl.google.com/maps/api/js?v=3&sensor=false" type="text/javascript"></script>
<script type="text/javascript" language="javascript" src="FMInsight.nocache.js"></script>
<script type="text/javascript" language="javascript" src="gr/abiss/js/sarissa/sarissa.js"></script>
<script type="text/javascript" src="js/svg-web/svg.js" data-path="js/svg-web" data-debug="false"></script>
<script type="text/javascript" src="js/svgviewer.js"></script>
<link media="all" type="text/css"
href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/base/jquery-ui.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"
type="text/javascript" charset="utf-8"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js"
type="text/javascript" charset="utf-8"></script>
</head>
<body>
<iframe id="__printingFrame" style="width:0; height:0;border: 0"></iframe>
<iframe id="__gwt_historyFrame" style="width:0;height:0;border:0"></iframe>
</body>
</html>
GWT XML file of the main module:
<?xml version="1.0" encoding="UTF-8"?>
<module rename-to="FMInsight">
<!-- Inheriting the core Web Toolkit stuff. -->
<inherits name="com.google.gwt.user.User"/>
<inherits name="com.google.gwt.inject.Inject"/>
<inherits name="com.npq.fm.core.common.Commons"/>
<inherits name="com.npq.fm.svg.viewer.SvgViewer"/>
<!-- Inheriting the default GWT style sheet. You can change -->
<!-- the theme of your GWT application by unommenting -->
<!-- any one of the following lines. -->
<inherits name="com.google.gwt.user.theme.standard.Standard"/>
<inherits name="com.google.gwt.user.theme.chrome.Chrome"/>
<!-- <inherits name="com.google.gwt.user.theme.dark.Dark"/> -->
<!-- Other module inherits. -->
<inherits name="com.google.gwt.xml.XML"/>
<inherits name="com.google.gwt.i18n.I18N"/>
<inherits name="com.google.gwt.http.HTTP"/>
<!-- Other module inherits. -->
<inherits name="com.google.gwt.user.ClippedImage"/>
<inherits name="com.google.gwt.maps.Maps" />
<!-- Compiled languages -->
<!-- In main file we set only EN language and only in compilation files,
that inherits from this file define what languages are allowed by
re-defining locale like in line below:
<extend-property name="locale" values="en,de,fr,nl,uk"/>
-->
<extend-property name="locale" values="en"/>
<set-property name="locale" value="en"/>
<set-property-fallback name="locale" value="en"/>
<!-- This property provider changes from GWT parameter name -->
<!-- for changing application locale from "locale" to -->
<!-- property "sap-language". -->
<property-provider name="locale"><![CDATA[
var defaultLocale = "en";
try {
var locale;
// Looking for the locale as a url argument in SAP way
if (locale == null) {
var args = location.search;
var startLang = args.indexOf("sap-language");
if (startLang < 0) {
startLang = args.indexOf("locale");
}
if (startLang >= 0) {
var language = args.substring(startLang);
var begin = language.indexOf("=") + 1;
var end = language.indexOf("&");
if (end == -1) {
end = language.length;
}
locale = language.substring(begin, end);
var lowerCase = locale.toLowerCase()
locale = lowerCase;
}
}
if (locale == null) {
// Looking for the locale on the web page
locale = __gwt_getMetaProperty("locale");
}
if (locale == null) {
return defaultLocale;
}
while (!__gwt_isKnownPropertyValue("locale", locale)) {
var lastIndex = locale.lastIndexOf("_");
if (lastIndex == -1) {
locale = defaultLocale;
break;
} else {
locale = locale.substring(0,lastIndex);
}
}
return locale;
} catch(e) {
alert("Unexpected exception in locale detection, using default=" + defaultLocale + ", " + e);
return defaultLocale;
}
]]></property-provider>
<!--
Inspired by Apache log4j PatternLayout:
http://logging.apache.org/log4j/1.2/apidocs/org/apache/log4j/PatternLayout.html
-->
<set-configuration-property name="log_pattern" value="%d [%-2p] %F %M: %m%n"/>
<!--<set-configuration-property name="log_pattern" value="%d [%-2p] %m%n"/>-->
<set-property name="log_FirebugLogger" value="ENABLED"/>
<set-property name="log_GWTLogger" value="ENABLED"/>
<set-property name="log_DivLogger" value="ENABLED"/>
<!-- Loggers are disabled by default -->
<set-property name="log_ConsoleLogger" value="DISABLED"/>
<set-property name="log_SystemLogger" value="DISABLED"/>
<set-property name="log_WindowLogger" value="DISABLED"/>
<!-- User Agent -->
<!-- In main file we set only user-agent to "ie8" and
only in compilation files, that inherits from this file we re-define
what user agents should be supported by re-defining locale like
in line below:
<set-property name="user.agent" value="gecko1_8,safari,ie6,ie8,ie9"/>
-->
<set-property name="user.agent" value="gecko1_8,safari"/>
<property-provider name="user.agent"><![CDATA[
var defaultUserAgent = "ie7";
var ua = navigator.userAgent.toLowerCase();
var makeVersion = function(result) {
return (parseInt(result[1]) * 1000) + parseInt(result[2]);
};
if (ua.indexOf("opera") != -1) {
return "opera";
} else if (ua.indexOf("webkit") != -1) {
return "safari";
} else if (ua.indexOf("msie") != -1) {
if (document.documentMode >= 8 && document.documentMode < 9) {
return "ie8";
} else if (document.documentMode >= 9) {
return "ie9";
} else {
return defaultUserAgent;
}
} else if (ua.indexOf("gecko") != -1) {
var result = /rv:([0-9]+)\.([0-9]+)/.exec(ua);
if (result && result.length == 3) {
if (makeVersion(result) >= 1008) {
return "gecko1_8";
}
}
return "gecko1_8";
}
return defaultUserAgent;
]]></property-provider>
<replace-with class="com.npq.fm.core.main.client.commons.browserspecific.impl.BrowserSpecificCommonsGecko">
<when-type-is class="com.npq.fm.core.main.client.commons.browserspecific.BrowserSpecificCommons" />
<any>
<when-property-is name="user.agent" value="gecko"/>
<when-property-is name="user.agent" value="gecko1_8" />
</any>
</replace-with>
<replace-with class="com.npq.fm.core.main.client.commons.browserspecific.impl.BrowserSpecificCommonsIE">
<when-type-is class="com.npq.fm.core.main.client.commons.browserspecific.BrowserSpecificCommons" />
<any>
<when-property-is name="user.agent" value="ie6"/>
<when-property-is name="user.agent" value="ie8" />
<when-property-is name="user.agent" value="ie9" />
</any>
</replace-with>
<replace-with class="com.npq.fm.core.main.client.commons.browserspecific.impl.BrowserSpecificSafari">
<when-type-is class="com.npq.fm.core.main.client.commons.browserspecific.BrowserSpecificCommons" />
<any>
<when-property-is name="user.agent" value="safari"/>
</any>
</replace-with>
<stylesheet src="FMInsight-main.css"/>
<stylesheet src="res_localized/default.css"/>
<!-- Specifying the app entry point class. -->
<entry-point class="com.npq.fm.core.main.client.Main"/>
<inherits name="org.cobogw.gwt.user.Button"/>
</module>

If this is happening client side, then GWT isn't generating tags at all. It is manipulating a DOM and you are using a tool to serialise it to HTML.
You might be able to persuade browsers to serialise to XHTML if you trigger XML parsing mode by serving the original document with an application/xhtml+xml content-type.
That said, HTML is the native markup language of browsers and it is best to use it to communicate with them. Instead of getting XHTML out, take HTML out and use an HTML parser at the place where you send the markup to.

Related

Primefaces Forms and LayoutUnit

I am new to primefaces and I am using the latest version 6.2. Following the guidelines on the user guide I have created a template using 2 forms (one for each layoutunit) setting different ID for each form.
<?xml version = "1.0" encoding = "UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:c="http://java.sun.com/jsp/jstl/core" xmlns:fn="http://java.sun.com/jsp/jstl/functions" xmlns:p="http://primefaces.org/ui">
<ui:composition>
<h:head>
<title>#{messages.appname}</title>
<link rel="shortcut icon" href="#{resource['images/favicon.ico']}" type="image/x-icon" />
</h:head>
<body>
<p:layout fullPage="true" id="myPage">
<p:layoutUnit id="up" position="north" size="130" header="" resizable="true" closable="false" collapsible="true">
<h:form id="upform">
<ui:include src="/templates/top.xhtml" />
</h:form>
</p:layoutUnit>
<p:layoutUnit id="center" position="center">
<h:form id="centerform">
<ui:include src="/templates/center.xhtml" />
</h:form>
</p:layoutUnit>
<p:layoutUnit id="down" position="south" size="60" header="" resizable="true" closable="true" collapsible="true">
<h:outputText value="© 2018 - IT" />
</p:layoutUnit>
</p:layout>
</body>
</ui:composition>
</html>
My problem is that when I load the page in Chrome and I inspect the elements, Chrome is complaining for DOM,as it tracks 2 elements with non-unique ID.
​login.xhtml:1 [DOM] Found 2 elements with non-unique id #j_id1:javax.faces.ViewState:0: (More info:) <input type=..."hidden" name=..."javax.faces.ViewState" id=..."j_id1:...javax.faces.ViewState:...0" value=..."bla bla" autocomplete=..."off">... <input type=..."hidden" name=..."javax.faces.ViewState" id=..."j_id1:...javax.faces.ViewState:...0" value=..."bla bla 2" autocomplete=..."off">...
As I suspect that this will cause javascript problems - how can I overcome this?

Why is styles.content.getRight not working?

I am trying to create a simple typo3 template. The template looks like this:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>T3 TEST BLAH</title>
<link rel="stylesheet" href="">
</head>
<body>
<!-- ###DOCUMENT_BODY### -->
<h1>Webpage</h1>
<div id="right">
<h2>RIGHT:</h2>
<!-- ###CONTENT_SIDEBAR### -->
<!-- ###CONTENT_SIDEBAR### -->
</div>
<div id="content">
<!-- ###CONTENT### -->
<!-- ###CONTENT### -->
</div>
<!-- ###DOCUMENT_BODY### -->
</body>
</html>
and my typoscript like this:
page = PAGE
page.10 = TEMPLATE
page.10{
template = FILE
template.file = fileadmin/template.html
workOnSubpart = DOCUMENT_BODY
subparts{
CONTENT_SIDEBAR < styles.content.getRight
CONTENT < styles.content.get
}
}
all I get is the content from styles.content.get but not styles.content.getRight (or getLeft). What am I doing wrong?
there are a few things you could try:
First of all, make sure there is content in the "right" column.
Then you could try whether it works if you use
CONTENT_SIDEBAR < styles.content.get
to see if the subpart gets recognized.
Another problem I have seen is that you need some content between the subpart markers (don't know if that was fixed yet) - so try writing
<!-- ###CONTENT_SIDEBAR### -->
test
<!-- ###CONTENT_SIDEBAR### -->
HTH,
Susanne
styles.content.getRight has been removed with fluid_styled_content:
https://docs.typo3.org/typo3cms/extensions/fluid_styled_content/7.6/Installation/Upgrading/
Because you don't have subpart "CONTENT_SIDEBAR", try use "RIGHT" like your subpart id.
Your template is valid and subparts are valid as well it's CONTENT_SIDEBAR NOT RIGHT.
Make sure you included correct CSS Styled Content (css_styled_content) in your TypoScript template and you cleared the cache.
Make sure you have some dummy code (whatever) between the subpart's comments like:
<!-- ###CONTENT_SIDEBAR### start--> Foo <!-- ###CONTENT_SIDEBAR### end-->
If you haven't and don't want to insert anything there, better use marker instead of subpart, like:
<body>
<!-- ###DOCUMENT_BODY### -->
<h1>Webpage</h1>
<div id="right">
<h2>RIGHT:</h2>
###CONTENT_SIDEBAR###
</div>
<div id="content">
###CONTENT###
</div>
<!-- ###DOCUMENT_BODY### -->
</body>
and TS:
page >
page = PAGE
page {
10 = TEMPLATE
10 {
template = FILE
template.file = fileadmin/template.html
workOnSubpart = DOCUMENT_BODY
marks {
CONTENT < styles.content.get
CONTENT_SIDEBAR < styles.content.getRight
}
}
}
Finally use TypoScript analyzer to check if some extension or additional TS doesn't override CONTENT_SIDEBAR and/or styles.content.getRight.
Last advice maybe weird, but make sure that you put the content element in valid column and it isn't hidden or disabled.

GWT Dynamic Locale

I want to set gwt-locale taking user chosen locale with the help of Spring LocaleContextHolder.
public static final String getCurrentLocale() {
return LocaleContextHolder.getLocale().getLanguage();
}
I actually have login interface in Spring MVC and inner Dashboard in gwtp. The same locale user chooses in outer interface before login has to be passed to gwt as well.
Unfortunately, I don't see any gwt inbuilt Locale setters.
My X.gwt.xml with default locale as kh is :
<inherits name="com.google.gwt.uibinder.UiBinder" />
<inherits name="com.google.gwt.inject.Inject" />
<inherits name="com.gwtplatform.mvp.Mvp" />
<inherits name="gwtquery.plugins.droppable.Droppable"/>
<source path="client" />
<source path="shared" />
<define-configuration-property name="gin.ginjector" is-multi-valued="false"/>
<set-configuration-property name="gin.ginjector" value="com.prayagupd.client.mvp.XGInjector"/>
<set-configuration-property name="UiBinder.useSafeHtmlTemplates" value="true" />
<extend-property name="locale" values="kh" />
<extend-property name="locale" values="en" />
<set-property name="locale" value="kh"/>
<set-property-fallback name="locale" value="kh"/>
<entry-point class="com.prayagupd.client.XEntryPoint"/>
My XEntryPoint.java reads as :
public class XEntryPoint implements EntryPoint {
private final IUserServiceAsync rpc = GWT.create(IUserService.class);
#Override
public void onModuleLoad() {
//
rpc.getLocale(new AsyncCallback<String>() {
#Override
public void onSuccess(String locale) {
GWT.log("Locale From Spring : " + locale);
GWT.log("Locale From GWT : " + LocaleInfo.getCurrentLocale().getLocaleName());
//here i want to set locale to gwt
//something like GWTLocale.setLocale(locale);
}
#Override
public void onFailure(Throwable caught) {
GWT.log(caught.getMessage());
}
});
DelayedBindRegistry.bind(ginjector);
ginjector.getPlaceManager().revealCurrentPlace();
}
}
home.jsp for gwt-loading
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >
<%#tag import="java.util.Calendar"%>
<%# tag body-content="scriptless"%>
<%# taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%# taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%# taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%# taglib prefix="spr" tagdir="/WEB-INF/tags"%>
<%# attribute name="isgwt" required="true" type="java.lang.Boolean"%>
<!-- <!DOCTYPE html> -->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="shortcut icon" type="image/png" href="/images/favicon.png" />
<script type="text/javascript" src="js/reload.captcha.js"></script>
<script type="text/javascript" src="js/date.picker.js"></script>
<link rel="stylesheet" href="/styles/innerstyle.css" type="text/css" />
<c:if test="${not isgwt}">
<link rel="stylesheet" href="/styles/mainstyler.css" type="text/css" />
<script type="text/javascript" src="js/modernizer.custom.js"></script>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery-ui-custom.min.js"></script>
<script src="js/jquery.thumbnailScroller.js"></script>
</c:if>
<c:if test="${isgwt}">
<meta name="gwt:property" content="locale=${locale}">
<script type="text/javascript" language="javascript" src="upd/upd.nocache.js"></script>
</c:if>
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider();
});
</script>
<title><c:out value="${locale}"></c:out><spring:message code="page.header" /></title>
</head>
<body>
<c:choose>
<c:when test="${empty username}">
<div class="header_con">
<div class="header_in">
<spr:header />
<spr:login />
<div class="clear"></div>
</div>
<div class="main_con">
<jsp:doBody />
<spr:footer />
</div>
<div class="clear"></div>
</div>
</c:when>
<c:otherwise>
<div id="mainHolder">
<div id="wrapper">
<spr:headerInner />
<iframe src="javascript:''" id="__gwt_historyFrame" tabIndex='-1'
style="position: absolute; width: 0; height: 0; border: 0"></iframe>
<div>
<div id="gwt_holder">
<c:if test="${isgwt}">
<div id="loader" class="loader">
</div>
</c:if>
<div id="gwt"></div>
</div>
</div>
</div>
</div>
</c:otherwise>
</c:choose>
</body>
</html>
Adding ?locale=en or ?locale=kh to gwt url works perfectly, but want to tell GWT only once that I want this locale programmatically and want it to work always with that locale onwards.
When I look at the *.html source code, I can see the injected the <meta> tag with proper locale passed from SpringController.
References
GWT dynamic internationalization, Colin Alworth
How i change the locale language of the application
Use a dynamic host page where you inject the proper <meta name="gwt:property" content="locale=XXX">.
Remember the GWT bootstrap sequence: once your onModuleLoad has been called, the choice of the permutation (which includes the locale) has already been made. You have to alter the bootstrap sequence so it chooses the proper permutation for the user. ?locale=XXX does this (because the locale property has a <property-provider> that reads the locale query-string parameter, among other things), as well as the <meta> above.
See also https://code.google.com/p/google-web-toolkit-incubator/wiki/ServerSideLocaleSelection for some idea (BEWARE: deprecated project!)
Finally, there are a few issues with your *.gwt.xml, starting with kh not being a valid locale.
The workflow for internationalizing your app is as follows:
list your locales:
<extend-property name="locale" value="en" />
<extend-property name="locale" value="fr" />
remove the default locale by setting the locale property to the full list of supported locales:
<set-property name="locale" value="en,fr" />
set the fallback locale:
<set-property-fallback name="locale" value="en" />
Optionally, you can select how the locale is determined using the properties locale.queryparam, locale.cookie, locale.usemeta, locale.useragent, and locale.searchorder (see the I18N.gwt.xml for their default and accepted values).
And finally, add code to select the locale (e.g. the dynamic <meta> above)
The solution inspired by Thomas Broyer,
X.gwt.xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE module PUBLIC "-//Google Inc.//DTD Google Web Toolkit 2.3.0//EN" "http://google-web-toolkit.googlecode.com/svn/tags/2.3.0/distro-source/core/src/gwt-module.dtd">
<module rename-to="x">
<inherits name="com.google.gwt.user.User"/>
<inherits name="com.google.gwt.i18n.I18N" />
<inherits name="com.google.gwt.http.HTTP" />
<inherits name="com.google.gwt.json.JSON"/>
<inherits name="com.google.gwt.uibinder.UiBinder" />
<inherits name="com.google.gwt.inject.Inject" />
<inherits name="com.gwtplatform.mvp.Mvp" />
<inherits name="gwtquery.plugins.droppable.Droppable"/>
<source path="client" />
<source path="shared" />
<define-configuration-property name="gin.ginjector" is-multi-valued="false"/>
<set-configuration-property name="gin.ginjector" value="com.prayagupd.client.mvp.XGInjector"/>
<set-configuration-property name="UiBinder.useSafeHtmlTemplates" value="true" />
<extend-property name="locale" values="kh" />
<extend-property name="locale" values="en" />
<set-property-fallback name="locale" value="kh"/>
<entry-point class="com.prayagupd.client.XEntryPoint"/>
</module>
And , home.jsp
<c:if test="${isgwt}">
<meta name="gwt:property" content="locale=${locale}">
<script type="text/javascript" language="javascript" src="upd/upd.nocache.js"></script>
</c:if>
locale being passed from Spring Controller
{
//...
modelMap.put("locale", locale);
return "home";
}
Thomas Broyer's answer is correct, except one thing. You don't mandatory need to use "dynamic host page", meta tag can be defined dynamically on the client side:
<script type="text/javascript">
$.ajax("rest/service/default-locale").done(function(data) {
if (data) {
var metaLocale = $("<meta name='gwt:property' content='locale=" + data + "'>");
$("head").append(metaLocale);
}
var jsLink = $("<script src='myapp.nocache.js'>");
$("head").append(jsLink);
});
</script>
This way any additional modifications can be done on the client side before GWT app starts.

Admin console is blank

I am trying to run the admin console but I click on the admin button a blank browser opens without anything in it. What am I missing? I have looked at the FAQs and the forum but still could not solve the issue. I have the server.properties file and I have added the sqlserver.jar to the lib
<?xml version="1.0" encoding="UTF-8"?>
<module rename-to='mysgwt'>
<!-- Inherit the core Web Toolkit stuff. -->
<inherits name='com.google.gwt.user.User' />
<inherits name="com.smartgwt.tools.SmartGwtTools" />
<inherits name="com.smartgwtpower.SmartGwtPower" />
<inherits name="com.smartgwtpower.tools.Tools" />
<!-- Specify the app entry point class. -->
<entry-point class='org.kai.client.MySGWT' />
<!-- Specify the paths for translatable code -->
<source path='client' />
<source path='shared' />
Code:
public class MySGWT implements EntryPoint {
private HLayout hLayout;
public void onModuleLoad() {
if (!GWT.isScript()) {
KeyIdentifier debugKey = new KeyIdentifier();
debugKey.setCtrlKey(true);
debugKey.setKeyName("D");
Page.registerKey(debugKey, new KeyCallback() {
public void execute(String keyName) {
SC.showConsole();
}
});
}
GWT.log("init OnLoadModule()...", null);
hLayout = new HLayout();
IButton adminButton = new IButton("Admin Console");
adminButton.addClickHandler(new ClickHandler() {
public void onClick(ClickEvent event) {
com.smartgwtpower.tools.client.SCPOWER.openDataSourceConsole ();
}
});
IButton visualButton = new IButton("Visual Console");
visualButton.addClickHandler(new ClickHandler() {
public void onClick(ClickEvent event) {
com.smartgwtpower.tools.client.SCPOWER.openVisualBuilder();
}
});
hLayout.setMembersMargin(20);
hLayout.addMember(adminButton);
hLayout.addMember(visualButton);
hLayout.draw();
}
}
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link type="text/css" rel="stylesheet" href="MySGWT.css">
<title>MySGWT Project</title>
<script> var isomorphicDir = "mySGWT/sc/"; </script>
<script type="text/javascript" language="javascript" src="mysgwt/mysgwt.nocache.js"></script>
</head>
<body>
<!-- OPTIONAL: include this if you want history support -->
<iframe src="javascript:''" id="__gwt_historyFrame" tabIndex='-1' style="position:absolute;width:0;height:0;border:0"></iframe>
<!-- RECOMMENDED if your web app will not function without JavaScript enabled -->
<noscript>
<div style="width: 22em; position: absolute; left: 50%; margin-left: -11em; color: red; background-color: white; border: 1px solid red; padding: 4px; font-family: sans-serif">
Your web browser must have JavaScript enabled
in order for this application to display correctly.
</div>
</noscript>
</body>
</html>`
This is the eclipse logging
log4j:WARN No appenders could be found for logger (org.apache.jasper.compiler.JspRuntimeContext).
log4j:WARN Please initialize the log4j system properly.
[WARN] Aliased resource: file:/C:/myworkspace/mySGWT/war/mySGWT/sc/skins/Enterprise/images/button/button_Over_stretch.png==fil e:/C:/myworkspace/mySGWT/war/mysgwt/sc/skins/Enterprise/images/button/button_Over_stretch.png
[WARN] Aliased resource: file:/C:/myworkspace/mySGWT/war/mySGWT/sc/skins/Enterprise/images/button/button_Over_stretch.png==fil e:/C:/myworkspace/mySGWT/war/mysgwt/sc/skins/Enterprise/images/button/button_Over_stretch.png
[WARN] 404 - GET /mySGWT/sc/skins/Enterprise/images/button/button_Over_stretch.png (127.0.0.1) 1450 bytes

How to get the camera to work with Blackberry Webworks

I am fairly new to webworks. I am trying to get the camera api to work and I keep getting the error:
Error in supported: TypeError: 'undefined' is not an object (evaluating 'blackberry.media.camera')
The page I am trying to use is on a hosted server. The code is as follows:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" id="viewport" content="height=device-height,width=device-width,user-scalable=no" />
<script language="javascript" type="text/JavaScript" >
function takePicture() {
try {
blackberry.media.camera.takePicture(successCB, closedCB, errorCB);
} catch(e) {
alert("Error in supported: " + e);
}
}
function successCB(filePath) {
document.getElementById("path").innerHTML = filePath;
//alert("Succeed: " + filePath);
}
function closedCB() {
// alert("Camera closed event");
}
function errorCB(e) {
alert("Error occured: " + e);
}
</script>
<title>Camera Test Widget</title>
</head>
<body >
<p>Test the Camera by pressing the button below</p>
<b>Take a Picture</b>
<div id="path"></div>
</body>
</html>
And my config.xml file is as follows:
<?xml version="1.0" encoding="UTF-8"?>
<widget xmlns="http://www.w3.org/ns/widgets"
xmlns:rim="http://www.blackberry.com/ns/widgets"
version="1.0.0.0" rim:header="WebWorks Sample">
<access uri="http://www.flyloops.net/" subdomains="true">
<feature id="blackberry.app.event" required="true" version="1.0.0.0"/>
<feature id="blackberry.media.camera" />
</access>
<name>Flyloops.net</name>
<description>This is a sample application.</description>
<content src="index.html"/>
</widget>
The page is hosted at: http://www.flyloops.net/mobile/bb/camera.html
I have been tearing my hair out for the past 3 hours...any help would be greatly appreciated.
If using PlayBook, make sure to have the correct element(s) defined
https://developer.blackberry.com/html5/apis/blackberry.media.camera.html
otherwise, if you are trying to access the blackberry.media.camera API from a remote website, then you need to white list that correctly in config.xml like this:
<access uri="http://www.flyloops.net/" subdomains="true">
<feature id="blackberry.media.camera" />
</access>
What device are you running? The code seems fine and it should work. You can get the eventlogs from the device and see what exceptions are being thrown.
Thanks
Naveen M