ProcessingJs-GWT is a thin Google Web Toolkit (GWT) wrapper that allows to use processingjs sketches in GWT applications.
Following steps are required:
Either create new interface that extends or create a class that implements the base interface ProcessingInstance
and annotate it with @JsType
. To interact with methods on the processing sketch define methods on that interface (i.e. testMethod
):
@JsType
public interface MyCustomInstance extends ProcessingInstance {
String testMethod(String msg);
}
Load the Processing sketch either via ExternalTextResource
or URL
or pass it directly as a String
:
Loading via URL:
final Processing<MyCustomInstance> processing = new Processing<>();
processing.load(safeUri,new Runnable() {
@Override
public void run() {
GWT.log("Sample initialized.");
// Interact with sketch
processing.getInstance().textMethod("test");
}
});
Loading via ExternalTextResource:
interface ProcessingCodeBundle extends ClientBundle {
ProcessingCodeBundle INSTANCE = GWT.create(ProcessingCodeBundle.class);
@Source("sample.pde")
ExternalTextResource sampleCode();
}
final Processing<MyCustomInstance> processing = new Processing<>();
processing.load(ProcessingCodeBundle.INSTANCE.sampleCode(),()-> {
GWT.log("Sample initialized.");
// Interact with sketch
processing.getInstance().textMethod("test");
};
For a more sophisticated example that shows how to interact with the Processing sketch (Callbacks, etc) refer to the [LDViewer visualization][6]
If you're using Maven, you can add the following to your <dependencies>
section:
<dependency>
<groupId>com.github.timeu.gwt-libs.processingjs-gwt</groupId>
<artifactId>processingjs-gwt</artifactId>
<version>1.0.0</version>
</dependency>
ProcessingJs-GWT uses GWT 2.8's new JSInterop feature and thus it has to be enabled in the GWT compiler args. For maven:
<compilerArgs>
<compilerArg>-generateJsInteropExports</compilerArg>
</compilerArgs>
or passing it to the compiler via -generateJsInteropExports
You can also download the jar directly or check out the source using git from https://github.com/timeu/processing-js-gwt.git and build it yourself. Once you've installed ProcessingJs-GWT, be sure to inherit the module in your .gwt.xml file like this:
<inherits name='com.github.timeu.gwtlibs.processingjsgwt.ProcessingJsGWT'/>
- Check out the sample app (Source Code) for a full example of using ProcessingJs-GWT.