I am building a web application using GWT and SMartGWT and I need to integrate an external script for a Photo Gallery: http://slideshow.triptracker.net/.
My current attempt is:
ScriptInjector.fromUrl("http://slideshow.triptracker.net/slide.js").setCallback(
new Callback<Void, Exception>() {
public void onFailure(Exception reason) {
Window.alert("Script load failed.");
}
public void onSuccess(Void result) {
Window.alert("Script load success.");
}
}).inject();
Afterwards, I call this method:
Code:
native static void example(String p) /*-{
$wnd.viewer = new $wnd.PhotoViewer();
$wnd.viewer.add(p)
$wnd.viewer.show(0);
}-*/;
This does not give any error, but the photogallery appears BEHIND my Entry Point Layout, so it's not possible to use it.
So, I am trying to find a workaround and I would like to refer to the main layout from Javasript, to run the script on that. Is this possible? I've tried with
foo.getElement().getId();
but it returns me something like
isc_VLayout_0_wrapper
However, Javascript doesn't like it.
Then I tried
foo.getDOM.getId();
isc_1
But the result doesn't change.
Can someone help me fix this issue?
Thank You.
I think here are two things, that are possibly wrong:
You have an onSuccess() callback you can call the jsni call from within.
//1
ScriptInjector.fromUrl("http://slideshow.triptracker.net/slide.js").setCallback(
new Callback<Void, Exception>() {
public void onFailure(Exception reason) {
//3a
}
public void onSuccess(Void result) {
example("works");
//3b
}
}).inject();
//2
example("not loaded");
You may also try to call .setWindow(ScriptInjector.TOP_WINDOW) before calling .inject()
Related
I need to use a text to speech library. I decided to use https://responsivevoice.org/ . The integration is fairly easy, however, since my project uses GWT it is - obviously - not so straight forward.
Here is my java code that is a minimal proof of concept class:
import com.google.gwt.core.client.Callback;
import com.google.gwt.core.client.GWT;
import com.google.gwt.core.client.ScriptInjector;
import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.user.client.ui.*;
public class InverseVoiceTrainer extends SimplePanel implements ClickHandler {
Button playBtn;
public InverseVoiceTrainer() {
ScriptInjector.fromUrl("https://code.responsivevoice.org/responsivevoice.js").setCallback(
new Callback<Void, Exception>() {
#Override
public void onSuccess(Void result) {
GWT.log("ResponsiveVoiceJS loaded.");
}
#Override
public void onFailure(Exception reason) {
GWT.log("ResponsiveVoiceJS loading FAILED!");
}
}).inject();
playBtn = new Button("Play");
playBtn.addClickHandler(this);
this.add(playBtn);
}
#Override
public void onClick(ClickEvent event) {
GWT.log("Onclick pressed");
playWord("This is a test message...");
}
public static native void playWord(String s) /*-{
console.log("playWord - 1");
responsiveVoice.speak(s);
console.log("playWord - 2");
}-*/;
}
So, looking into the console log I can see the following:
ResponsiveVoice r1.5.3
SuperDevModeLogger.java:71 ResponsiveVoiceJS loaded.
SuperDevModeLogger.java:71 Onclick pressed
InverseVoiceTrainer.java:40 playWord - 1
InverseVoiceTrainer.java:42 playWord - 2
Which tells me that (a) ResponsiveVoice seems to have been correctly loaded and (b) the sound should have been played. However, I do not hear anything and my sound volume is hearable. So, what is going wrong here?
Well, this might be not the best answer, but it worked for me.
First, just link the responsivevoice.js in hosting html page:
<script type="text/javascript" language="javascript" src="https://code.responsivevoice.org/responsivevoice.js"></script>
Then remove the ScriptInjector part of your code.
The last change is to add $wnd in playWord() method:
$wnd.responsiveVoice.speak(s);
Tested. Worked.
I am working on a project using GWT and d3. i have used d3 in javascript files. Let me explain a bit more . i have a class name AstForm in GWT. in this class i have a function which i have called in my javascript file using following code.it the code works fine for me.
public native void PrepareFunctionsForJS() /*-{
$wnd.ExtractOFFNetWork = this.#org.valcri.asstsrchui.client.AstForm::ExtractOFFNetWork(*);
}-*/;
public void ExtractOFFNetWork(JsArrayMixed args)
{
Window.alert("thisCurrent row and Column is " +
args.getString(0) + " " + args.getString(1)+"OffenderNetwork?");
}
void testfunction ()
{
Window.alert("testfunction)
}
in java script i have used the following code
window.ExtractOFFNetWork(["GWT","JS"]);
my code works fine. i can call the ExtractOFFNetWork in javascript file. however the problem is in the ExtractOFFNetWork function when i call testfunction which is also the member function of the ASTFORM class the programe error saying testfunction is not a function. however when i changed testfunction as static than i can access this function within ExtractOFFNetWork. alternatievly i can also use the testfunction inside ExtractOFFNetWork by creating a separate object of ASTForm as
AstForm my =new AstForm();
my.testfunction();
however i do not want to use either static or separate ASTform object to access member function of ASTForm. i also used this.testfunction() within ExtractOFFNetWork but it also does not work. i would appreciate if any body can help to solve my problem i have spend full day without any success :)
already tried this when calling your PrepareFunctionsForJS(btw by java naming conventions method names start with lowercase letter..)
//assuming that you are calling the prepare function from inside the AstForm
public class AstForm() {
//...
PrepareFunctionsForJS(this);
}
public native void PrepareFunctionsForJS(AstForm instance) /*-{
$wnd.ExtractOFFNetWork = instance.#org.valcri.asstsrchui.client.AstForm::ExtractOFFNetWork(*);
}-*/;
Primefaces 4.0 is generating lots of overhead during page loading as seen from PageSpeed Insights:
**605.3KiB of JavaScript is parsed during initial page load. Defer parsing JavaScript to reduce blocking of page rendering.**
http://localhost:8888/.../primefaces.js.xhtml?... (219.5KiB)
http://localhost:8888/.../jquery-plugins.js.xhtml?... (191.8KiB)
http://localhost:8888/.../jquery.js.xhtml?... (95.3KiB)
http://localhost:8888/.../tooltip.js.xhtml?... (34.5KiB)
http://localhost:8888/.../jsf.js.xhtml?... (25.4KiB)
http://localhost:8888/.../primefaces-extensions.js.xhtml?... (19.7KiB)
http://localhost:8888/.../watermark.js.xhtml?... (4.7KiB)
http://localhost:8888/.../hotkey.js.xhtml?... (1.2KiB)
Any idea how these 3rd party javascript files could be set to be in the bottom of the body section instead head or use defer/async parameters? Javascript loaders do not help in this case as these are coming from the JSF renderer. Also I tried to create a Listener for PreRenderView (Best way for JSF to defer parsing of JavaScript?) but that did not work out. Any other options that could solve this problem? Thanks for your help!
I got the moving of the scripts to work with the followind snippet:
public class ScriptValidateListener implements SystemEventListener {
#Override
public void processEvent(SystemEvent event) throws AbortProcessingException {
UIViewRoot root = (UIViewRoot) event.getSource();
FacesContext ctx = FacesContext.getCurrentInstance();
List<UIComponent> resources = root.getComponentResources(ctx, "HEAD");
for (UIComponent r : resources) {
String name = (String) r.getAttributes().get("name");
if (name == null) {
continue;
}
if (name.contains(".js")) {
root.removeComponentResource(ctx, r, "HEAD");
root.addComponentResource(ctx, r, "BODY");
}
}
}
#Override
public boolean isListenerForSource(Object source) {
return (source instanceof UIViewRoot);
}
}
This moves all javascripts from HEAD to end of the BODY. But. There is this problem with Primefaces that the components rendered will try to access either JQuery ($.) or PrimeFaces javascript functions and that will break all ajax functionality on the page. Propably I will need to decide what of the scripts to move and what not to move. Also a part from the Listener I needed to define the following to faces-config.xml to make it work:
<application>
<system-event-listener>
<system-event-listener-class>com.example.listener.ScriptValidateListener</system-event-listener-class>
<system-event-class>javax.faces.event.PreRenderViewEvent</system-event-class>
</system-event-listener>
</application>
Hi In my android phonegap app i need to call the javascript method from android code (DroidGap).I have tried the sample code.
Here is my code:
super.loadUrl("file:///android_asset/www/index.html");
super.loadUrl("javascript:onload()");
When i use super.loadUrl("javascript:alert('hai')"); i am getting this alert.But when i use the method "onload" i am getting the error.
Here is my error in logcat:
Uncaught TypeError: Property 'onload' of object [object DOMWindow] is not a function at null:1
Here is my script in index.html:
<script type="text/javascript">
function onload()
{
alert("hai");
}
</script>
I dont know where i am wrong.Please guide me.Thanks in Advance.
Try this one and add this line also
super.setWebChromeClient(new WebChromeClient());
super.loadUrl("file:///android_asset/www/index.html");
After this line call like this onPageFinished
webview.setWebViewClient(new WebViewClient() {
#Override
public void onPageFinished(WebView view, String url) {
webview.loadUrl("javascript:(function() {alert("hai") }
);
}
});
Android can only call the javascript method if an html page is currently loaded in webView
first call
webview.loadUrl("Your html page url");
then call
webView.loadUrl("javascript:hello()");
Try to handle the alert function in the java file, like this :
mWebView.setWebChromeClient(new MyWebChromeClient());
final class MyWebChromeClient extends WebChromeClient {
#Override
public boolean onJsAlert(WebView view,String url,
String message,JsResult result) {
new AlertDialog.Builder(MainActivity.this).
setTitle("Alert").setMessage(message).setPositiveButton("OK",
new DialogInterface.OnClickListener() {
#Override
public void onClick(DialogInterface arg0, int arg1) {
}
}).create().show();
result.confirm();
return super.onJsConfirm(view,url,message, result);
}
}
I had the same problem when I moved the target javascript function from the main page to an separate .js file. For some reason, the loadUrl() function can't find externally-loaded functions - only the ones in the main page. Once I moved the function back, it immediately started working.
Go figure.
when i m trying to invoke javascript function which is present in my default.aspx page, it is showing some error --> Failed to Invoke: TalkToJavaScript.
coding in my silverlight page is--
public MainPage()
{
InitializeComponent();
HtmlPage.RegisterScriptableObject("Page", this);
HtmlPage.Window.Invoke("TalkToJavaScript", "Hello from Silverlight");
}
[ScriptableMember]
public void UpdateText(string result)
{
myTextbox.Text = result;
}
I would consider using this approach:-
public MainPage()
{
InitializeComponent();
HtmlPage.RegisterScriptableObject("Page", this);
Loaded += (s, args) => {
HtmlPage.Window.Invoke("TalkToJavaScript", "Hello from Silverlight");
};
}
I'm not sure why but I'd be uncomfortable calling back into Javascript from a constructor that I know is running in response to an Application_Startup. I'm either being irrational or this is the cause of your problem. Of course currently you aren't showing us the Javascript so you could simply have that messed up.