GWT showing blank page. - gwt

my GWT app is designed to be multipage. And separated into modules. So far all other modules works, except for my 'login' module.
I don't understand why when I access http://127.0.0.1:8888/login.html?gwt.codesvr=127.0.0.1:9997 I get a blank page.
LoginEntryPoint:
public void onModuleLoad() {
GWT.log("Loading module");
if (!Window.Location.getPath().toLowerCase().endsWith("login.html")) {
return;
}
RootPanel.get().add(new Button("Test"));
}
And in the login.html file:
<script type="text/javascript" language="javascript" src="login/login.nocache.js"></script>
and finally in the Login.gwt.xml:
<entry-point class='com.mygwtapp.client.LoginEntryPoint' />
How to fix this kind of situation?

Make sure also when you compile the project Remember to add the new module to be compiled
Right Click on the Project >> Google >> Gwt Compile >> Add (add your new module)

Does your log statement happen? If not, is the login.cache.js file even loading (use firebug or the like to check)? If so, can you set a breakpoint on that log statement and step forward, see where it gets to?
And is there anything shown when you run in web mode?
If the login.nocache.js isn't loading, make sure you added rename-to="login" in the module tag, make sure it is actually being compiled, etc

This problem was happening to me, and I figured out that it was all because I had Buttons in a FormPanel. As soon as I removed them from the FormPanel everything showed up again. I am not sure where exactly you were sticking the button up there, but you might want to try removing the button out of the equation, trying another type of panel and some text, and see if it shows up without the button present.

If you are running in hosted mode, this if if (!Window.Location.getPath().toLowerCase().endsWith("login.html")) { is true, so no button should appear. Try changing the "endsWith" by "contains" method

Related

Everything undefined after postback after removing AjaxControlToolkit ScriptManager

I just removed AjaxControlToolkit v7 from my project, and therefore replaced the ToolkitScriptManager with the standard ScriptManager.
Now after postback on iframe in popup window all script functions (including jquery, $ etc) are undefined. Just about everything on the window object is undefined. The location is correct and all the script files are there in the head. I put a breakpoint in the script file and when it tries to call a function defined in that very same script file it is undefined.
Any ideas where to look?
Always ask: "What has changed?"
In my case, I no longer use the Modal Popup Extender with a PERMANENT div. I now use jquery dialog with a dynamic div that I destroy when we click an OK button.
It seems IE still tries to execute scripts after the IFRAME container has been removed from the DOM (with $(div).dialog("destroy").remove()). Chrome at least seems to behave differently and not try to run the scripts.
Related:
Issue with Iframe inside JQuery dialog only for IE
https://msdn.microsoft.com/en-us/library/gg622929(v=VS.85).aspx?ppud=4

Anyone implemented/used Mobile Device Screen Orientation plugin?

Has anyone successfully implemented screen orientation plugin in Sitecatalyst to capture mobile device orientation?. When we use the below code in the s_code, in the web page i am seeing some unusual behavior(ie: when we scroll the page to the bottom and then if i click anywhere on the content section, page goes to the top by default). I understand, that's happening because of this line "window.scroll(0,0)". Any help or thoughts?
Plugin Code below:
function screenOrientation(){switch(window.orientation){case 0:case 180:return("Portrait");break;case 90:case -90:return("Landscape");}window.scroll(0,0)}
Reference: [http://webanalyticsland.com/sitecatalyst-implementation/capture-mobile-device-screen-orientation-in-sitecatalyst]
Thanks in Advance.
This is clearly a code bug (or more a typo I think) and the line window.scroll(0,0) can be safely removed from the 'plugin' (its not really a plugin, just a js function that returns the orientation).
The reason this fires every time a user clicks on anywhere on the page is because you have ClickMap functionality enabled in your s_code.js configuration. This will fire an s.tl() everytime a click event occurs. the s.tl() will call the screenOrientation() function to populate your required prop/eVar.
So if you were to turn off clickMap (s.trackInlineStats=false;) this random scrolling to the top would stop even if you didn't remove the offending line. That said, remove the scrolling code, its not right or required!

Why can't I see script injected using GWT ScriptInjector?

I'm trying out using GWT's ScriptInjector for the first time, and was wondering why I can't see the injected script as a tag anywhere in the page when I view page source. I'd expect it to show up in the page head.
I'm using a dead simple example, which works in that it displays the alert. I'm just wondering why I can't physically see it injected in the page. Also if I declare a JavaScript variable inside my script, it doesn't seem available on the global scope.
ScriptInjector.fromString("window.alert('testing');")
.setWindow(ScriptInjector.TOP_WINDOW)
.inject();
ScriptInjector works by injecting your js snippet into the top level window object and, by default, remove it just after it got evaluated (if you used fromString(); with fromUrl() the element is not removed by default). This is why you do not see it, but it actually executes.
If you want to keep the injected script element, just use setRemoveTag(false) on your builder FromString object, i.e.:
ScriptInjector.fromString("window.alert('testing');")
.setRemoveTag(false)
.setWindow(ScriptInjector.TOP_WINDOW)
.inject();
Please have a look at below sample.
I have modified the inner HTML of a div. The changes are visible in Firebug but if you view the source it will be not there.
EntryPointClass:
ScriptInjector.fromString("document.getElementById('mydiv').innerHTML='hi';")
.setWindow(ScriptInjector.TOP_WINDOW).inject();
HTML:
<html>
...
<body>
<div id='mydiv'></div>
</body>
...
</html>
Snapshot:
View Source:

Reloading an iframe in GWT

I am currently working on a GWT project where I am displaying an HTML file within an iframe in my application. This HTML file is actually being written to as it is getting displayed, and I am hoping to be able to reload the frame so that the changes made to the HTML file are reflected on screen. I am able to do this two different ways that both work when running in development mode, however neither seem to work when the project is deployed.
The first method I tried was setting the frame's URL to itself:
frame.setUrl(frame.getUrl());
The second method I tried using JSNI:
public native void refresh() /*-{
if($doc.getElementById('__reportFrame') != null) {
$doc.getElementById('__reportFrame').src =
$doc.getElementById('__reportFrame').src;
}
}-*/;
When deployed, the frame gets displayed in a Window, and when the file is finished being written to, a call to either of these refresh methods is made, and the frame refreshes to contain the finished HTML file. When I am deployed, the call to refresh does not reload the contents of the frame, however if I bring up the frame's context menu (in Firefox), then go into 'This Frame', and click Reload, it successfully reloads the frame to contain the finished HTML file. I have tested this on multiple versions of Firefox without any luck.
Does anyone have any suggestions? Why would the behavior be different from one mode to the other?
Thanks.
wow, google is really fast with his search^^
You can use some JSNI to do this. Create a method such as
protected native void reloadIFrame(Element iframeEl) /-{
iframeEl.contentWindow.location.reload(true); }-/;
Then call it with your iFrame element
so your question you posted twice was already answerd here
http://groups.google.com/group/google-web-toolkit/browse_thread/thread/64aa7712890652d3
We had a requirement where one GWT application(parent) had another GWT application(child) loaded in an iframe. The child application had to refresh the iframe after it performs certain DB operations. We used JSNI to accomplish the same.
private native void refreshChild(String url)/*-{
$wnd.location.href=url;
}-*/
In case, if the child frame needs to be redirected to another webpage, the url can be modified accordingly.
We did try to use the reload() method, but it did not help.
The above piece of code, of course needs to be written in the child application.

How to prevent GWT onload flicker in the Web Application Starter Project?

I'm new to GWT, and I'm sure this is answered in SO somewhere but I've yet to find
I downloaded the GWT 2.0 eclipse plugin, and was pleased to see it comes with a starter project.
However, I was surprised that when running it, there is an unpleasent flickering...
The text loads without the CSS first
It takes a while untill the select box apears
(If you don't see the flicker, try and press F5 to refresh)
All mature GWT apps seem to have a loader before that but I didn't find an easy, standard way to add it.
It seems this app loads in this order: (correct me please if I mixed it up, its only my guess)
Basic layout HTML,
All JavaScript, and CSS
Runs the logic on the "onload" event (soonest time your compiled javaScript can start - ?)
So I can't programmatically add a loading spinner before GWT was loaded, a bit of a catch 22 for me
Am I missing something basic? is there a best practice way to add that initial spinner?
I was thinking simply adding a div with an animated gif, and in the onload event - hide it.
But I'm sure there is something better.
Let me know if this is a duplicate question
Update: found this related question, not answering mine though...
I've handled this problem before by not using the GWT module to load CSS, but loading it directly in the tag itself. If you do this, the browser will always load the CSS first, even before the GWT JS is loaded.
This means you'll lose a bit of flexibility and speed, but its the only workaround I've used so far.
EDIT: Extra info cause I want the bounty :D
If you do not remove the
<inherits name='com.google.gwt.user.theme.standard.Standard'/> from your module.gwt.xml file, then the GWT standard theme is loaded in the JS file that GWT creates. This JS file loads after the HTML page renders, and injects the CSS after load. Hence the flicker.
To avoid the flicker, you can comment out that line and insert your own stylesheet into the <head> of your HTML file. This ensures your CSS loads before the HTML renders, avoiding any flicker. If you really want the GWT theme, you get it out of the source code.
To use a spinner with GWT is quite easy. One simple way would be to keep it in a div with an id in the HTML file itself. Then, in the onModuleLoad(), simply hide that div by calling RootPanel.get("spinner").setVisible(false);
That should show the spinner till GWT loads itself.
Here's what we do to implement a spinner.
You put something like the following HTML just below the script line that loads your application (ie. the one with nocache.js). e.g.:
<div id="loading">
<div id="loading-msg">
<img src="icons/loading-page.gif" lt="loading">
<span>Loading the application, please wait...</span>
</div>
</div>
Then in your application EntryPoint you reach into the page using the DOM and remove that div. e.g.
final RootPanel loading = RootPanel.get("loading");
if (loading != null) {
DOM.removeChild(RootPanel.getBodyElement(),
loading.getElement());
}
Ehrann: I'm afraid the practice mentioned in the above answers is the only way for now. GWT doesn't provide similar features to show/hide a "loading" frame "on the fly". I guess one of the reason is that this requirement is not so "common" for all GWT users, one person might want a very different style of the "loading" than others. So you have to do that by yourself.
You can have a look at the GXT showcase page (based on GWT too): http://www.extjs.com/explorer/ for how they do that. For the source of it, download Ext GWT 2.1.0 SDK here: http://www.extjs.com/products/gxt/download.php and check the samples/explorer folder after extracting it. For details see the edit below:
EDIT
Check the source code for http://www.extjs.com/examples/explorer.html and you can see a div with id "loading". For each samples (extending Viewport), GXT.hideLoadingPanel(loadingPanelId) is called in onAttach() (the initialization), which hides the loading frame.
Check source code of Viewport here
Check source code of GXT.hideLoadingPanel here
You can do it in a similar way.
You could put an HTML loading message in the host page (use style attributes or embed the style tag in the header to make sure that it's styled), and remove the message once your modules has loaded, e. g. Document.get().getBody() with .setInnerHTML("") or .removeChild(), and then present your application programmatically however you want.