timknip / easel-gwt Goto Github PK
View Code? Open in Web Editor NEWGWT port of EaselJS
GWT port of EaselJS
Easel-GWT ====================================== Easel-GWT is a GWT port of EaselJS : http://easeljs.com/ NOTE ====================================== The code is still in alpha and not much tested. Hence there might be bugs, problems and performance issues. The architecture is still in flux and will probably change in the future. So beware! USAGE ====================================== 1] Add the jar in the /bin directory to your classpath. 2] In your module.gwt.xml add: <inherits name='easeljs.EaselJS'/> EXAMPLE http://easel-gwt.appspot.com/ ====================================== package com.floorplanner.easeljs.client; import com.google.gwt.core.client.EntryPoint; import com.google.gwt.dom.client.Style.Unit; import com.google.gwt.user.client.Timer; import com.google.gwt.user.client.ui.DockLayoutPanel; import com.google.gwt.user.client.ui.RootLayoutPanel; import easeljs.client.EaselJS; import easeljs.client.display.Container; import easeljs.client.display.Graphics; import easeljs.client.display.Shadow; import easeljs.client.display.Shape; import easeljs.client.display.Stage; /** * Entry point classes define <code>onModuleLoad()</code>. */ public class EaseljsTest implements EntryPoint { private float angle = 0; /** * This is the entry point method. */ public void onModuleLoad() { DockLayoutPanel panel = new DockLayoutPanel(Unit.PX); EaselJS easel = new EaselJS(640, 480); panel.add(easel); RootLayoutPanel.get().add(panel); test(easel); RootLayoutPanel.get().animate(500); } private void test(EaselJS easel) { final Stage stage = easel.getStage(); Container container = easel.getContainer(); final Container center = new Container(); Shape shape = new Shape(); Graphics graphics = shape.getGraphics(); center.addChild(shape); graphics.beginFill("#ff0000") .moveTo(-50, -50) .lineTo( 50, -50) .lineTo( 50, 50) .lineTo(-50, 50) .endFill(); shape.cache(-50, -50, 100, 100); final Shape clone = (Shape) shape.clone(); clone.setRotation(45); clone.setX(140); clone.setY(140); clone.setShadow(new Shadow("#000000", 20, 20, 10)); center.addChild(clone); container.addChild(center); clone.cache(-50, -50, 100, 100); Timer timer = new Timer() { public void run() { center.setRotation(angle); stage.tick(); angle++; } }; timer.scheduleRepeating(10); } } =================================================== The EaseljsTest.gwt.xml : =================================================== <?xml version="1.0" encoding="UTF-8"?> <module rename-to='easeljstest'> <!-- Inherit the core Web Toolkit stuff. --> <inherits name='com.google.gwt.user.User'/> <!-- Inherit the default GWT style sheet. You can change --> <!-- the theme of your GWT application by uncommenting --> <!-- 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='easeljs.EaselJS'/> <!-- Specify the app entry point class. --> <entry-point class='com.floorplanner.easeljs.client.EaseljsTest'/> <!-- Specify the paths for translatable code --> <source path='client'/> </module>
I made a gwt.xml file like the one in the example and it gave me this error when I did GWT compile.
[ERROR] The Cross-Site-Iframe linker does not support <script> tags in the gwt.xml files, but the gwt.xml file (or the gwt.xml files which it includes) contains the following script tags:
easeljs-min.js
In order for your application to run correctly, you will need to include these tags in your host page directly. In order to avoid this error, you will need to remove the script tags from the gwt.xml file, or add this property to the gwt.xml file:
I put in the "" tag like it said and it worked. I think you should add that tag to the example gwt.xml file in the README
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.