\r
<generate-with class="com.google.gwt.query.rebind.SelectorGeneratorNative">\r
<when-type-assignable class="com.google.gwt.query.client.Selectors"/>\r
- <all>\r
- <when-property-is name="selectorCapability" value="native"/>\r
- <when-property-is name="user.agent" value="safari"/>\r
- </all>\r
+ <when-property-is name="selectorCapability" value="native"/>\r
</generate-with>\r
\r
- \r
+\r
<replace-with class="com.google.gwt.query.client.impl.DocumentStyleImpl">\r
- <when-type-assignable class="com.google.gwt.query.client.impl.DocumentStyleImpl"/>\r
+ <when-type-assignable\r
+ class="com.google.gwt.query.client.impl.DocumentStyleImpl"/>\r
</replace-with>\r
\r
<replace-with class="com.google.gwt.query.client.impl.DocumentStyleImplIE">\r
- <when-type-assignable class="com.google.gwt.query.client.impl.DocumentStyleImpl"/>\r
+ <when-type-assignable\r
+ class="com.google.gwt.query.client.impl.DocumentStyleImpl"/>\r
<when-property-is name="user.agent" value="ie6"/>\r
</replace-with>\r
\r
\r
<replace-with class="com.google.gwt.query.client.impl.SelectorEngineJS">\r
- <when-type-assignable class="com.google.gwt.query.client.impl.SelectorEngineImpl"/>\r
+ <when-type-assignable\r
+ class="com.google.gwt.query.client.impl.SelectorEngineImpl"/>\r
<when-property-is name="user.agent" value="gecko"/>\r
</replace-with>\r
\r
<replace-with class="com.google.gwt.query.client.impl.SelectorEngineJSIE">\r
- <when-type-assignable class="com.google.gwt.query.client.impl.SelectorEngineImpl"/>\r
+ <when-type-assignable\r
+ class="com.google.gwt.query.client.impl.SelectorEngineImpl"/>\r
<when-property-is name="user.agent" value="ie6"/>\r
</replace-with>\r
\r
<replace-with class="com.google.gwt.query.client.impl.SelectorEngineXPath">\r
- <when-type-assignable class="com.google.gwt.query.client.impl.SelectorEngineImpl"/>\r
+ <when-type-assignable\r
+ class="com.google.gwt.query.client.impl.SelectorEngineImpl"/>\r
<any>\r
<when-property-is name="user.agent" value="gecko1_8"/>\r
<when-property-is name="user.agent" value="opera"/>\r
</replace-with>\r
\r
<replace-with class="com.google.gwt.query.client.impl.SelectorEngineNative">\r
- <when-type-assignable class="com.google.gwt.query.client.impl.SelectorEngineImpl"/>\r
- <all>\r
- <when-property-is name="user.agent" value="safari"/>\r
+ <when-type-assignable\r
+ class="com.google.gwt.query.client.impl.SelectorEngineImpl"/>\r
<when-property-is name="selectorCapability" value="native"/>\r
- </all>\r
</replace-with>\r
\r
<entry-point class='com.google.gwt.query.client.css.CSS'/>\r
- \r
+\r
</module>\r
* some form of height and width associated with them.\r
*/\r
public Effects fadeIn(Speed speed, Function callback) {\r
- return animate($$("opacity: \"hide\""), speed, Easing.LINEAR, callback);\r
+ return animate($$("opacity: \"show\""), speed, Easing.LINEAR, callback);\r
}\r
\r
/**\r
* some form of height and width associated with them.\r
*/\r
public Effects fadeIn(int speed, Function callback) {\r
- return animate($$("opacity: \"hide\""), speed, Easing.LINEAR, callback);\r
+ return animate($$("opacity: \"show\""), speed, Easing.LINEAR, callback);\r
}\r
\r
/**\r
import com.google.gwt.user.client.DOM;
import com.google.gwt.dom.client.Element;
-import java.util.List;
-import java.util.ArrayList;
-
/**
* This class implements an event queue instance for one element. This queue
* instance is configured as the default event listener in GWT.
elem.__gqueryevent = gqevent;
}-*/;
- private List<EventsListener.BindFunction> elementEvents
- = new ArrayList<EventsListener.BindFunction>();
+ private JsObjectArray<EventsListener.BindFunction> elementEvents
+ = JsObjectArray.createArray().cast();
private Element element;
public void onBrowserEvent(Event event) {
int etype = DOM.eventGetType(event);
- for (EventsListener.BindFunction listener : elementEvents) {
+ for (int i=0; i<elementEvents.length(); i++) {
+ EventsListener.BindFunction listener = elementEvents.get(i);
if (listener.hasEventType(etype)) {
if (!listener.fire(event)) {
event.cancelBubble(true);
}
public void unbind(int eventbits) {
- ArrayList<EventsListener.BindFunction> newList
- = new ArrayList<EventsListener.BindFunction>();
- for (EventsListener.BindFunction listener : elementEvents) {
+ JsObjectArray<EventsListener.BindFunction> newList
+ = JsObjectArray.createArray().cast();
+ for (int i=0; i<elementEvents.length(); i++) {
+ EventsListener.BindFunction listener = elementEvents.get(i);
if (!listener.hasEventType(eventbits)) {
newList.add(listener);
}
\r
import com.google.gwt.core.client.GWT;\r
import com.google.gwt.core.client.JavaScriptObject;\r
+import com.google.gwt.core.client.JsArrayString;\r
import com.google.gwt.dom.client.BodyElement;\r
import com.google.gwt.dom.client.ButtonElement;\r
import com.google.gwt.dom.client.Document;\r
import com.google.gwt.user.client.Event;\r
import com.google.gwt.user.client.Window;\r
\r
-import java.util.ArrayList;\r
-import java.util.HashMap;\r
-import java.util.List;\r
-import java.util.Map;\r
-\r
/**\r
* Gwt Query is a GWT clone of the popular jQuery library.\r
*/\r
return !!this[id];\r
}-*/;\r
\r
- public native Object getObject(String id) /*-{\r
- return this[id];\r
- }-*/;\r
-\r
public native JavaScriptObject get(String id) /*-{\r
return this[id];\r
}-*/;\r
return this[id];\r
}-*/;\r
\r
+ public native Object getObject(String id) /*-{\r
+ return this[id];\r
+ }-*/;\r
+\r
public native String getString(String id) /*-{\r
return this[id];\r
}-*/;\r
\r
public static Class<GQuery> GQUERY = GQuery.class;\r
\r
- private static Map<Class<? extends GQuery>, Plugin<? extends GQuery>> plugins;\r
+ private static JsMap<Class<? extends GQuery>, Plugin<? extends GQuery>> plugins;\r
\r
private static Element windowData = null;\r
\r
public static void registerPlugin(Class<? extends GQuery> plugin,\r
Plugin<? extends GQuery> pluginFactory) {\r
if (plugins == null) {\r
- plugins = new HashMap();\r
+ plugins = JsMap.createObject().cast();\r
}\r
plugins.put(plugin, pluginFactory);\r
}\r
\r
+ protected static String[] jsArrayToString(JsArrayString array) {\r
+ if(GWT.isScript()) {\r
+ return jsArrayToString0(array);\r
+ }\r
+ else {\r
+ String result[]=new String[array.length()];\r
+ for(int i=0; i<result.length; i++) {\r
+ result[i]=array.get(i);\r
+ }\r
+ return result;\r
+ }\r
+ }\r
+\r
/**\r
* Copied from UIObject.\r
*/\r
}\r
}\r
\r
+ private static JSArray copyNodeList(NodeList n) {\r
+ JSArray res = JSArray.create();\r
+ for (int i = 0; i < n.getLength(); i++) {\r
+ res.addNode(n.getItem(i));\r
+ }\r
+ return res;\r
+ }\r
+\r
private static String curCSS(Element elem, String name) {\r
return curCSS(elem, name, false);\r
}\r
copyNodeList((NodeList<Element>) (NodeList<?>) div.getChildNodes()));\r
}\r
\r
+ private static native String[] jsArrayToString0(JsArrayString array) /*-{\r
+ return array;\r
+ }-*/;\r
+\r
private static native <T extends Node> T[] reinterpretCast(NodeList<T> nl) /*-{\r
return nl;\r
}-*/;\r
return res;\r
}\r
\r
- private static JSArray copyNodeList(NodeList n) {\r
- JSArray res = JSArray.create();\r
- for (int i = 0; i < n.getLength(); i++) {\r
- res.addNode(n.getItem(i));\r
- }\r
- return res;\r
- }\r
-\r
protected NodeList<Element> elements = null;\r
\r
private String currentSelector;\r
if (e.getNodeName().equalsIgnoreCase("select")) {\r
SelectElement se = SelectElement.as(e);\r
if (se.isMultiple()) {\r
- List<String> result = new ArrayList<String>();\r
+ JsArrayString result = JsArrayString.createArray().cast();\r
for (OptionElement oe : asArray(se.getOptions())) {\r
if (oe.isSelected()) {\r
- result.add(oe.getValue());\r
+ result.set(result.length(), oe.getValue());\r
}\r
}\r
- return result.toArray(new String[0]);\r
+ return jsArrayToString(result);\r
} else if (se.getSelectedIndex() >= 0) {\r
return new String[]{\r
se.getOptions().getItem(se.getSelectedIndex()).getValue()};\r
--- /dev/null
+package com.google.gwt.query.client;
+
+import com.google.gwt.core.client.JavaScriptObject;
+
+/**
+ * Lightweight JSO backed implemented of a Map, using Object.hashCode() as
+ * key.
+*/
+final public class JsMap<S,T> extends JavaScriptObject {
+ protected JsMap() {}
+ public T get(S key) {
+ return get(key.hashCode());
+ }
+
+ public native T get(int hashCode) /*-{
+ return this[hashCode] || null;
+ }-*/;
+
+ public void put(S key, T val) {
+ put(key.hashCode(), val);
+ }
+
+ public native void put(int hashCode, T val) /*-{
+ this[hashCode]=val;
+ }-*/;
+}
--- /dev/null
+package com.google.gwt.query.client;
+
+import com.google.gwt.core.client.JavaScriptObject;
+
+/**
+ * Lightweight JSO based array class that can store objects rather than just
+ * other JSOs.
+ */
+public final class JsObjectArray<T> extends JavaScriptObject {
+ protected JsObjectArray() {}
+
+ public void add(T val) {
+ set(length(), val);
+ }
+
+ public native T get(int i) /*-{
+ return this[i];
+ }-*/;
+ public native int length() /*-{
+ return this.length;
+ }-*/;
+
+ public native void set(int i, T val) /*-{
+ this[i]=val;
+ }-*/;
+}
import com.google.gwt.dom.client.Element;
import com.google.gwt.dom.client.NodeList;
-import com.google.gwt.user.client.ui.Button;
+import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.query.client.GQuery;
-import com.google.gwt.query.client.Plugin;
import com.google.gwt.query.client.JSArray;
+import com.google.gwt.query.client.Plugin;
+import com.google.gwt.user.client.ui.Button;
+
+import java.util.ArrayList;
+import java.util.Collection;
/**
* Experimental Gwt Query plugin for integrating Gwt Widgets.
*/
public class Widgets extends GQuery {
+
/**
* Used to register the plugin.
*/
}
/**
- * Create a builder capable of instantiating a GWT Button object over
- * every matched element. Call end() to execute builder and return to the
- * current query object.
+ * Create a builder capable of instantiating a GWT Button object over every
+ * matched element. Call end() to execute builder and return to the current
+ * query object.
+ *
* @return a ButtonBuilder
*/
public ButtonBuilder button() {
private String selector;
- private String label;
+ private String label = null;
- private String labelSelector;
+ private String labelSelector = null;
+
+ private Collection<ClickHandler> handlers = new ArrayList<ClickHandler>();
public ButtonBuilder(String selector) {
- this.selector=selector;
+ this.selector = selector;
}
- public ButtonBuilder label(String label) {
+ public ButtonBuilder labelQuery(String label) {
this.labelSelector = label;
return this;
}
- public Widgets end() {
- for(Element e: elements()) {
- Button b = Button.wrap(e);
- b.setText($(labelSelector, e).text());
+ public ButtonBuilder label(String label) {
+ this.label = label;
+ return this;
+ }
+ public ButtonBuilder addClickHandler(ClickHandler handler) {
+ handlers.add(handler);
+ return this;
+ }
+
+ public Widgets end() {
+ for (Element e : elements()) {
+ Button b = null;
+ if ("button".equalsIgnoreCase(e.getTagName())) {
+ b = Button.wrap(e);
+ } else {
+ Element bElt = $("<button name='button' value='Click Me'>").get(0);
+ $(e).hide().before(bElt);
+ b = Button.wrap(bElt);
+ }
+
+ b.setText(label != null ? label
+ : (labelSelector == null ? $(e) : $(labelSelector, e)).text());
+ for (ClickHandler handler : handlers) {
+ b.addClickHandler(handler);
+ }
}
return Widgets.this;
}
<properties>
<gwtversion>1.6.4</gwtversion>
+ <gwt.loglevel>ERROR</gwt.loglevel>
+ <gwt.outputstyle>PRETTY</gwt.outputstyle>
+ <gwt.modulesuffix></gwt.modulesuffix>
+ <gwt.localRepository>${user.home}/.m2/repository
+ </gwt.localRepository>
+ <!-- <maven.test.skip>true</maven.test.skip> -->
</properties>
</profile>
</activation>
<properties>
<gwtplatform>linux</gwtplatform>
+ <google.webtoolkit.extrajvmargs>-Xmx512m
+ </google.webtoolkit.extrajvmargs>
+
</properties>
</profile>
</activation>
<properties>
<gwtplatform>windows</gwtplatform>
+ <google.webtoolkit.extrajvmargs>-Xmx512m
+ </google.webtoolkit.extrajvmargs>
</properties>
</profile>
</google.webtoolkit.extrajvmargs>
</properties>
</profile>
+ <profile>
+ <id>dev</id>
+ <properties>
+ <gwt.loglevel>WARN</gwt.loglevel>
+ <gwt.modulesuffix>Dev</gwt.modulesuffix>
+ <gwt.outputstyle>PRETTY</gwt.outputstyle>
+ </properties>
+ </profile>
+
+ <profile>
+ <id>prod</id>
+ <properties>
+ <gwtversion>1.6.4</gwtversion>
+ <gwt.loglevel>ERROR</gwt.loglevel>
+ <gwt.outputstyle>OBF</gwt.outputstyle>
+ <gwt.modulesuffix></gwt.modulesuffix>
+ <!-- <maven.test.skip>true</maven.test.skip> -->
+ </properties>
+ </profile>
+
</profiles>
</project>
-<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
- <modelVersion>4.0.0</modelVersion>
- <parent>
- <groupId>com.google.gwt</groupId>
- <artifactId>gwtquery-project</artifactId>
- <version>1.0-SNAPSHOT</version>
- </parent>
+<project xmlns="http://maven.apache.org/POM/4.0.0"
+ xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+ xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
+ <modelVersion>4.0.0</modelVersion>
+ <parent>
+ <groupId>com.google.gwt</groupId>
+ <artifactId>gwtquery-project</artifactId>
+ <version>1.0-SNAPSHOT</version>
+ </parent>
- <name>GwtQuery Samples</name>
- <artifactId>gwtquery-samples</artifactId>
- <packaging>jar</packaging>
- <dependencies>
- <dependency>
- <groupId>${groupId}</groupId>
- <artifactId>gwtquery</artifactId>
- <version>${version}</version>
- <type>jar</type>
- </dependency>
+ <name>GwtQuery Samples</name>
+ <artifactId>gwtquery-samples</artifactId>
+ <packaging>jar</packaging>
+ <dependencies>
+ <dependency>
+ <groupId>${groupId}</groupId>
+ <artifactId>gwtquery</artifactId>
+ <version>${version}</version>
+ <type>jar</type>
+ </dependency>
- </dependencies>
- <build>
- <plugins>
- <plugin>
- <groupId>org.apache.maven.plugins</groupId>
- <artifactId>maven-dependency-plugin</artifactId>
- <executions>
- <execution>
- <id>unpack</id>
- <phase>compile</phase>
- <goals>
- <goal>unpack</goal>
- </goals>
- <configuration>
- <artifactItems>
- <artifactItem>
- <groupId>com.google.gwt</groupId>
- <artifactId>gwt-dev</artifactId>
- <version>${gwtversion}</version>
- <classifier>${gwtplatform}-libs</classifier>
- <type>zip</type>
- <overWrite>true</overWrite>
- <outputDirectory>
- ${settings.localRepository}/com/google/gwt/gwt-dev/${gwtversion}
- </outputDirectory>
- </artifactItem>
- </artifactItems>
- </configuration>
- </execution>
- </executions>
- </plugin>
- <plugin>
- <groupId>com.totsp.gwt</groupId>
- <artifactId>maven-googlewebtoolkit2-plugin</artifactId>
- <version>2.0-beta24</version>
- <configuration>
- <gwtVersion>${gwtversion}</gwtVersion>
- <logLevel>WARN</logLevel>
- <runTarget>
- gwtquery.samples.GwtQueryDemo/index.html
- </runTarget>
- <compileTargets>
- <compileTarget>
- gwtquery.samples.GwtQueryDemo
- </compileTarget>
- <compileTarget>
- gwtquery.samples.GwtQueryBench
- </compileTarget>
- <compileTarget>
- gwtquery.samples.GwtQuerySample
- </compileTarget>
- </compileTargets>
- <style>OBF</style>
- </configuration>
- <executions>
- <execution>
- <id>compilegwt</id>
- <goals>
- <goal>compile</goal>
- </goals>
- </execution>
- </executions>
- </plugin>
- </plugins>
- </build>
+ </dependencies>
+ <build>
+ <plugins>
+ <plugin>
+ <groupId>org.apache.maven.plugins</groupId>
+ <artifactId>maven-dependency-plugin</artifactId>
+ <executions>
+ <execution>
+ <id>unpack</id>
+ <phase>compile</phase>
+ <goals>
+ <goal>unpack</goal>
+ </goals>
+ <configuration>
+ <artifactItems>
+ <artifactItem>
+ <groupId>com.google.gwt</groupId>
+ <artifactId>gwt-dev</artifactId>
+ <version>${gwtversion}</version>
+ <classifier>${gwtplatform}-libs</classifier>
+ <type>zip</type>
+ <overWrite>true</overWrite>
+ <outputDirectory>
+ ${settings.localRepository}/com/google/gwt/gwt-dev/${gwtversion}
+ </outputDirectory>
+ </artifactItem>
+ </artifactItems>
+ </configuration>
+ </execution>
+ </executions>
+ </plugin>
+ <plugin>
+ <groupId>com.totsp.gwt</groupId>
+ <artifactId>maven-googlewebtoolkit2-plugin</artifactId>
+ <version>2.0-beta24</version>
+ <configuration>
+ <logLevel>${gwt.loglevel}</logLevel>
+ <style>${gwt.outputstyle}</style>
+ <gwtVersion>${gwtversion}</gwtVersion>
+
+ <logLevel>WARN</logLevel>
+ <runTarget>
+ gwtquery.samples.GwtQueryDemo/index.html
+ </runTarget>
+ <compileTargets>
+ <compileTarget>
+ gwtquery.samples.GwtQueryDemo
+ </compileTarget>
+ <compileTarget>
+ gwtquery.samples.GwtQueryBench
+ </compileTarget>
+ <compileTarget>
+ gwtquery.samples.GwtQuerySample
+ </compileTarget>
+ <compileTarget>
+ gwtquery.samples.GwtQueryPlugin
+ </compileTarget>
+ <compileTarget>
+ gwtquery.samples.GwtQueryWidgets
+ </compileTarget>
+ <compileTarget>
+ gwtquery.samples.GwtQueryEffects
+ </compileTarget>
+
+ </compileTargets>
+ </configuration>
+ <executions>
+ <execution>
+ <id>compilegwt</id>
+ <goals>
+ <goal>compile</goal>
+ </goals>
+ </execution>
+ </executions>
+ </plugin>
+ </plugins>
+ </build>
</project>
--- /dev/null
+<module>
+ <inherits name='com.google.gwt.query.Query'/>
+ <entry-point class='gwtquery.samples.client.GwtQueryEffectsModule'/>
+
+
+</module>
+
--- /dev/null
+<module>
+ <inherits name='com.google.gwt.query.Query'/>
+ <entry-point class='gwtquery.samples.client.GwtQueryPluginModule'/>
+
+
+</module>
+
--- /dev/null
+<module>
+ <inherits name='com.google.gwt.query.Query'/>
+ <entry-point class='gwtquery.samples.client.GwtQueryWidgetModule'/>
+
+
+</module>
+
// Ask GWT compiler to generate our interface\r
final Slide s = GWT.create(Slide.class);\r
\r
- // Find all slides, set css to display: none\r
- // change first slide to display: block\r
- $(s.allSlides()).css("display", "none")\r
- .eq(0).css("display", "block");\r
+ $(s.allSlides()).hide().eq(0).show();\r
\r
-\r
- // we initially hide all bullets by setting opacity to 0\r
- $(s.allSlideBullets()).css("opacity", "0");\r
+ // we initially hide all bullets\r
+ $(s.allSlideBullets()).hide();\r
\r
// add onclick handler to body element\r
$(Document.get().getBody()).click(new Function() {\r
public boolean f(Event e) {\r
// onclick, if not all bullets shown, show a bullet and increment\r
if (curBullets < bullets.size()) {\r
- bullets.eq(curBullets++).as(Effects).fadeIn();\r
+ bullets.eq(curBullets++).show();\r
} else {\r
// all bullets shown, hide them and current slide\r
- bullets.css("opacity","0");\r
- slides.eq(curSlide).css("display", "none");\r
+// bullets.css("opacity","0");\r
+ bullets.hide();\r
+ slides.eq(curSlide).hide();\r
+\r
+// slides.eq(curSlide).css("display", "none");\r
// move to next slide, checking for wrap around\r
curSlide++;\r
if(curSlide == slides.size()) {\r
// query for new set of bullets, and show next slide\r
// by changing opacity to 1 and display to block\r
bullets = $(s.slideBulletsCtx(slides.get(curSlide)));\r
- slides.eq(curSlide).css("display", "block").as(Effects).fadeIn();\r
+ slides.eq(curSlide).show();\r
}\r
return true;\r
}\r
--- /dev/null
+package gwtquery.samples.client;\r
+\r
+import com.google.gwt.core.client.EntryPoint;\r
+import com.google.gwt.query.client.Effects;\r
+import com.google.gwt.query.client.Function;\r
+import static com.google.gwt.query.client.Effects.Effects;\r
+import static com.google.gwt.query.client.Effects.Easing.*;\r
+import static com.google.gwt.query.client.GQuery.$;\r
+import static com.google.gwt.query.client.GQuery.$$;\r
+import static com.google.gwt.query.client.GQuery.lazy;\r
+import com.google.gwt.user.client.Event;\r
+\r
+\r
+public class GwtQueryEffectsModule implements EntryPoint {\r
+\r
+ public void onModuleLoad() {\r
+\r
+ $("div > div").\r
+ css("color", "blue").\r
+ hover(lazy().\r
+ css("color", "red").\r
+ done(), lazy().\r
+ css("color", "blue").\r
+ done());\r
+\r
+\r
+ $("div.outer > div").css("position", "relative").dblclick(new Function() {\r
+ public boolean f(Event e) {\r
+ $("div.outer > div").as(Effects).\r
+ animate($$("left: '+=100'"), 400, LINEAR, null).\r
+ animate($$("top: '+=100'"), 400, LINEAR, null).\r
+ animate($$("left: '-=100'"), 400, LINEAR, null).\r
+ animate($$("top: '-=100'"), 400, LINEAR, null);\r
+\r
+ return true;\r
+ }\r
+ });\r
+ $(".note").click(lazy().fadeOut().done());\r
+ $(".note").append(" Hello");\r
+ }\r
+}
\ No newline at end of file
--- /dev/null
+package gwtquery.samples.client;\r
+\r
+import com.google.gwt.core.client.EntryPoint;\r
+import com.google.gwt.event.dom.client.ClickEvent;\r
+import com.google.gwt.event.dom.client.ClickHandler;\r
+import com.google.gwt.query.client.Function;\r
+import static com.google.gwt.query.client.GQuery.$;\r
+import com.google.gwt.query.client.plugins.Ratings;\r
+import com.google.gwt.query.client.plugins.Widgets;\r
+import com.google.gwt.user.client.Event;\r
+import com.google.gwt.user.client.Window;\r
+\r
+\r
+public class GwtQueryPluginModule implements EntryPoint {\r
+\r
+ public void onModuleLoad() {\r
+\r
+ $(".outer").eq(0).after("<button id='enhance'>Enhance</button>");\r
+ $("#enhance").one(Event.ONCLICK, null, new Function() {\r
+ @Override\r
+ public boolean f(Event e) {\r
+ $(e).attr("disabled", "true");\r
+ $("input").as(Ratings.Ratings).rating();\r
+ return true;\r
+ }\r
+ });\r
+ $(".btn:nth-child(odd)").as(Widgets.Widgets).button()\r
+ .addClickHandler(new ClickHandler() {\r
+ public void onClick(ClickEvent clickEvent) {\r
+ Window.alert("You Clicked the Button");\r
+ }\r
+ }).end();\r
+\r
+ }\r
+}
\ No newline at end of file
package gwtquery.samples.client;\r
\r
import com.google.gwt.core.client.EntryPoint;\r
-import com.google.gwt.query.client.Effects;\r
-import com.google.gwt.query.client.Function;\r
+import com.google.gwt.core.client.GWT;\r
import com.google.gwt.query.client.GQuery;\r
-import com.google.gwt.query.client.plugins.Ratings;\r
import static com.google.gwt.query.client.GQuery.$;\r
-import static com.google.gwt.query.client.GQuery.$$;\r
-import static com.google.gwt.query.client.GQuery.lazy;\r
-import com.google.gwt.user.client.Event;\r
+import com.google.gwt.query.client.Selector;\r
+import com.google.gwt.query.client.Selectors;\r
+import static com.google.gwt.query.client.css.CSS.TOP;\r
+import static com.google.gwt.query.client.css.CSS.VERTICAL_ALIGN;\r
\r
\r
public class GwtQuerySampleModule implements EntryPoint {\r
-// public interface Sample extends Selectors {\r
-// @Selector(".note")\r
-// GQuery allNotes();\r
\r
- // }\r
+ public interface Sample extends Selectors {\r
\r
- public void onModuleLoad() {\r
- GQuery q = $(".note");\r
-\r
- $("div > div").\r
- css("color", "blue").\r
- hover(\r
- lazy().\r
- css("color", "red").\r
- done(),\r
- lazy().\r
- css("color", "blue").\r
- done());\r
- $("div.outer > div").css("position", "relative").dblclick(new Function() {\r
- public boolean f(Event e) {\r
- $("div.outer > div").as(Effects.Effects).\r
- animate($$("left: '+=100'"), 400, Effects.Easing.LINEAR, null).\r
- animate($$("top: '+=100'"), 400, Effects.Easing.LINEAR, null).\r
- animate($$("left: '-=100'"), 400, Effects.Easing.LINEAR, null).\r
- animate($$("top: '-=100'"), 400, Effects.Easing.LINEAR, null);\r
+ @Selector(".note")\r
+ GQuery allNotes();\r
\r
- return true;\r
- }\r
- });\r
- $(".note").click(lazy().fadeOut().done());\r
- $(".note").append(" Hello");\r
- $(".outer").eq(0).after("<button id='enhance'>Enhance</button>");\r
- $("#enhance").one(Event.ONCLICK, null, new Function() {\r
- @Override\r
- public boolean f(Event e) {\r
- $(e).attr("disabled", "true");\r
- $("input").as(Ratings.Ratings).rating();\r
- return true;\r
- }\r
- });\r
+ }\r
\r
+ public void onModuleLoad() {\r
+ Sample s = GWT.create(Sample.class);\r
+ s.allNotes().text("Hello Google I/O");\r
}\r
}\r
--- /dev/null
+package gwtquery.samples.client;\r
+\r
+import com.google.gwt.core.client.EntryPoint;\r
+import com.google.gwt.event.dom.client.ClickEvent;\r
+import com.google.gwt.event.dom.client.ClickHandler;\r
+import com.google.gwt.query.client.Function;\r
+import static com.google.gwt.query.client.GQuery.$;\r
+import com.google.gwt.query.client.plugins.Widgets;\r
+import com.google.gwt.user.client.Event;\r
+import com.google.gwt.user.client.Window;\r
+\r
+\r
+public class GwtQueryWidgetModule implements EntryPoint {\r
+\r
+ public void onModuleLoad() {\r
+\r
+ $(".outer").eq(0).after("<button id='enhance'>Enhance</button>");\r
+ $("#enhance").one(Event.ONCLICK, null, new Function() {\r
+ @Override\r
+ public boolean f(Event e) {\r
+ $(".btn:nth-child(odd)").as(Widgets.Widgets).button().label("Foo")\r
+ .addClickHandler(new ClickHandler() {\r
+ public void onClick(ClickEvent clickEvent) {\r
+ Window.alert("You Clicked the Button");\r
+ }\r
+ }).end();\r
+\r
+ return true;\r
+ }\r
+ });\r
+\r
+ }\r
+}
\ No newline at end of file
background-color: black;\r
color: white\r
}\r
+\r
\r
</style>\r
</head>\r
<iframe id="dojobench" src="dojobench.html" style="display: none"></iframe>\r
<iframe id="prototypebench" src="prototypebench.html" style="display: none"></iframe>\r
\r
-<code style="display: block; height: 200px; width:790px; overflow-y:scroll; overflow-x: hidden">\r
-<table id="resultstable" border="1" style="width: 780px; border-collapse: collapse">\r
+<!-- hack, we don't use DIV because we don't want to effect the result of the selectors -->\r
+<blockquote style="display: block; height: 200px; width:790px; overflow-y:scroll; overflow-x: hidden; margin: 0">\r
+<table id="resultstable" border="1" style="width: 100%; border-collapse: collapse">\r
\r
</table>\r
-</code>\r
+</blockquote>\r
<div style="display: none">\r
<div style="display: none" class="head">\r
<p><a href="http://www.w3.org/"><img height=48 alt=W3C\r
<script language="javascript" src="gwtquery.samples.GwtQueryDemo.nocache.js"></script>\r
<style type="text/css">\r
.slide { border: 1px solid black; width: 800px; height: 600px; display: none}\r
- .slide { font-size: 200%; }\r
+ .slide {\r
+ background: -webkit-gradient(linear, left top, left bottom, from(#000000), to(#808080), color-stop(0.9, #808080));\r
+ -webkit-background-origin: padding-box; -webkit-background-clip: content-box;\r
+ }\r
+ .slide, .slide * { color: white; font-size: 150%; }\r
</style>\r
</head>\r
<body>\r
<p>\r
- Short example of how to do animated powerpoint-like slides with GQuery Effects\r
- module.\r
+ Short example of how to do progressively enhance DIV, UL, LI elements into powerpoint-like slides \r
</p>\r
-<div class="slide transition-fade">\r
+<div class="slide transition-appear">\r
Slide 1\r
- <ul class="transition-slidein">\r
+ <ul class="transition-appear">\r
<li>jQuery is</li>\r
<li>such a</li>\r
<li>Cool Library</li>\r
</ul>\r
</div>\r
-<div class="slide transition-fade">\r
+<div class="slide transition-appear">\r
Slide 2\r
- <ul class="transition-dropin">\r
+ <ul class="transition-appear">\r
<li>Now GWT</li>\r
<li>has a</li>\r
<li>jQuery-like API Too!</li>\r
<li>GwtQuery Rocks!</li>\r
</ul>\r
</div>\r
+\r
</body>\r
</html>\r
\ No newline at end of file
--- /dev/null
+<html>\r
+<head>\r
+ <title>GQuery Demo</title>\r
+ <script language="javascript" src="gwtquery.samples.GwtQueryEffects.nocache.js"></script>\r
+ <link href='gquery-star-ratings.css' type="text/css" rel="stylesheet"/>\r
+ \r
+</head>\r
+<body>\r
+<div class="outer">\r
+<div>Foo <span class="note">bar</span> baz</div>\r
+ <div>Foo <span class="note">bar</span> <span class="xyz">baz</span></div>\r
+ <div>Foo <span class="note">bar</span> <span class="xyz">baz</span></div>\r
+ <div>Foo <span class="note">bar</span> <span class="xyz">baz</span></div>\r
+ <div>Foo <span class="note">bar</span> <span class="xyz">baz</span></div>\r
+ <div>Foo <span class="note">bar</span> <span class="xyz">baz</span></div>\r
+ <div>Foo <span class="note">bar</span> <span class="xyz">baz</span></div>\r
+ <div>Foo <span class="note">bar</span> <span class="xyz">baz</span></div>\r
+</div>\r
+ \r
+ \r
+</body>\r
+</html>\r
+
\ No newline at end of file
--- /dev/null
+<html>\r
+<head>\r
+ <title>GQuery Demo</title>\r
+ <script language="javascript" src="gwtquery.samples.GwtQueryPlugin.nocache.js"></script>\r
+ <link href='gquery-star-ratings.css' type="text/css" rel="stylesheet"/>\r
+ \r
+</head>\r
+<body>\r
+\r
+<div class="outer">\r
+<div id="tab-Overview">\r
+ <h2>What is this?</h2>\r
+ <p>\r
+ The <strong>Star Rating Plugin</strong> is a plugin\r
+ for the jQuery Javascript library that creates a non-obstrusive\r
+ star rating control based on a set of radio input boxes.\r
+ </p>\r
+ \r
+ <h2>What does it do?</h2>\r
+ <ul>\r
+ <li>\r
+ It turns a collection of radio boxes into a neat star-rating control.\r
+ </li>\r
+ <li>\r
+ It creates the interface based on standard form elements, which means the\r
+ basic functionality will still be available even if Javascript is disabled.\r
+ </li>\r
+ <li>\r
+ <strong style="color: rgb(0, 153, 0);">NEW</strong> (12-Mar-08):\r
+ In read only mode (using the 'readOnly' option or <code>disabled</code> property), the plugin is a neat way of\r
+ displaying star-like values without any additional code\r
+ </li>\r
+ </ul>\r
+ \r
+ <h2>How do I use it?</h2>\r
+ <p>\r
+ Just add the <code><strong>star</strong></code> class to your radio boxes\r
+ </p>\r
+ <table cellspacing="5" width="100%">\r
+ <tr>\r
+ <td valign="top">\r
+ <pre class="code"><code class="html"><input name="star1" type="radio" class="star"/>\r
+ <input name="star1" type="radio" class="star"/>\r
+ <input name="star1" type="radio" class="star"/>\r
+ <input name="star1" type="radio" class="star"/>\r
+ <input name="star1" type="radio" class="star"/></code></pre>\r
+ </td>\r
+ <td valign="top" width="10">»</td>\r
+ <td valign="top" width="180">\r
+ <input name="star1" type="radio" class="star"/>\r
+ <input name="star1" type="radio" class="star"/>\r
+ <input name="star1" type="radio" class="star"/>\r
+ <input name="star1" type="radio" class="star"/>\r
+ <input name="star1" type="radio" class="star"/>\r
+ </td>\r
+ </tr>\r
+ </table>\r
+ \r
+ <p>\r
+ Use the <code><strong>checked</strong></code> property to specify the initial/default value of the control\r
+ </p>\r
+ <table cellspacing="5" width="100%">\r
+ <tr>\r
+ <td valign="top">\r
+ <pre class="code"><code class="html"><input name="star2" type="radio" class="star"/>\r
+ <input name="star2" type="radio" class="star"/>\r
+ <input name="star2" type="radio" class="star" checked="checked"/>\r
+ <input name="star2" type="radio" class="star"/>\r
+ <input name="star2" type="radio" class="star"/></code></pre>\r
+ </td>\r
+ <td valign="top" width="10">»</td>\r
+ <td valign="top" width="180">\r
+ <input name="star2" type="radio" class="star"/>\r
+ <input name="star2" type="radio" class="star"/>\r
+ <input name="star2" type="radio" class="star" checked="checked"/>\r
+ <input name="star2" type="radio" class="star"/>\r
+ <input name="star2" type="radio" class="star"/>\r
+ </td>\r
+ </tr>\r
+ </table>\r
+ \r
+ <p>\r
+ Use the <code><strong>disabled</strong></code> property to use a control for display purposes only\r
+ </p>\r
+ <table cellspacing="5" width="100%">\r
+ <tr>\r
+ <td valign="top">\r
+ <pre class="code"><code class="html"><input name="star3" type="radio" class="star" disabled="disabled"/>\r
+ <input name="star3" type="radio" class="star" disabled="disabled"/>\r
+ <input name="star3" type="radio" class="star" disabled="disabled" checked="checked"/>\r
+ <input name="star3" type="radio" class="star" disabled="disabled"/>\r
+ <input name="star3" type="radio" class="star" disabled="disabled"/></code></pre>\r
+ </td>\r
+ <td valign="top" width="10">»</td>\r
+ <td valign="top" width="180">\r
+ <input name="star3" type="radio" class="star" disabled="disabled"/>\r
+ <input name="star3" type="radio" class="star" disabled="disabled"/>\r
+ <input name="star3" type="radio" class="star" disabled="disabled" checked="checked"/>\r
+ <input name="star3" type="radio" class="star" disabled="disabled"/>\r
+ <input name="star3" type="radio" class="star" disabled="disabled"/>\r
+ </td>\r
+ </tr>\r
+ </table>\r
+ \r
+ <h2>What about split stars and 'half ratings'???</h2>\r
+ <p>\r
+ Use metadata plugin to pass advanced settings to the plugin via the class property.\r
+ </p>\r
+ <table cellspacing="5" width="100%">\r
+ <tr>\r
+ <td valign="top">\r
+ <pre class="code"><code class="html"><input name="adv1" type="radio" class="star {split:4}"/>\r
+ <input name="adv1" type="radio" class="star {split:4}"/>\r
+ <input name="adv1" type="radio" class="star {split:4}"/>\r
+ <input name="adv1" type="radio" class="star {split:4}"/>\r
+ <input name="adv1" type="radio" class="star {split:4}" checked="checked"/>\r
+ <input name="adv1" type="radio" class="star {split:4}"/>\r
+ <input name="adv1" type="radio" class="star {split:4}"/>\r
+ <input name="adv1" type="radio" class="star {split:4}"/></code></pre>\r
+ </td>\r
+ <td valign="top" width="10">»</td>\r
+ <td valign="top" width="180">\r
+ <input name="adv1" type="radio" class="star {split:4}"/>\r
+ <input name="adv1" type="radio" class="star {split:4}"/>\r
+ <input name="adv1" type="radio" class="star {split:4}"/>\r
+ <input name="adv1" type="radio" class="star {split:4}"/>\r
+ <input name="adv1" type="radio" class="star {split:4}" checked="checked"/>\r
+ <input name="adv1" type="radio" class="star {split:4}"/>\r
+ <input name="adv1" type="radio" class="star {split:4}"/>\r
+ <input name="adv1" type="radio" class="star {split:4}"/>\r
+ </td>\r
+ </tr>\r
+ </table>\r
+ \r
+ <p>\r
+ Use custom selector\r
+ </p>\r
+ <table cellspacing="5" width="100%">\r
+ <tr>\r
+ <td valign="top">\r
+ <script>$(function(){ // wait for document to load\r
+ $('input.wow').rating();\r
+ });</script>\r
+ <pre class="code"><code class="js">$(function(){ // wait for document to load\r
+ $('input.wow').rating();\r
+ });</code></pre>\r
+ <pre class="code"><code class="html"><input name="adv2" type="radio" class="wow {split:4}"/>\r
+ <input name="adv2" type="radio" class="wow {split:4}"/>\r
+ <input name="adv2" type="radio" class="wow {split:4}"/>\r
+ <input name="adv2" type="radio" class="wow {split:4}"/>\r
+ <input name="adv2" type="radio" class="wow {split:4}" checked="checked"/>\r
+ <input name="adv2" type="radio" class="wow {split:4}"/>\r
+ <input name="adv2" type="radio" class="wow {split:4}"/>\r
+ <input name="adv2" type="radio" class="wow {split:4}"/></code></pre>\r
+ </td>\r
+ <td valign="top" width="10">»</td>\r
+ <td valign="top" width="180">\r
+ <input name="adv2" type="radio" class="wow {split:4}"/>\r
+ <input name="adv2" type="radio" class="wow {split:4}"/>\r
+ <input name="adv2" type="radio" class="wow {split:4}"/>\r
+ <input name="adv2" type="radio" class="wow {split:4}"/>\r
+ <input name="adv2" type="radio" class="wow {split:4}" checked="checked"/>\r
+ <input name="adv2" type="radio" class="wow {split:4}"/>\r
+ <input name="adv2" type="radio" class="wow {split:4}"/>\r
+ <input name="adv2" type="radio" class="wow {split:4}"/>\r
+ </td>\r
+ </tr>\r
+ </table>\r
+ </div><!--// tab-Overview //-->\r
+</div>\r
+ \r
+</body>\r
+</html>\r
+
\ No newline at end of file
<body>\r
<div class="outer">\r
<div>Foo <span class="note">bar</span> baz</div>\r
- <div>Foo <span class="note">bar</span> baz</div>\r
- <div>Foo <span class="note">bar</span> baz</div>\r
- <div>Foo <span class="note">bar</span> baz</div>\r
- <div>Foo <span class="note">bar</span> baz</div>\r
- <div>Foo <span class="note">bar</span> baz</div>\r
- <div>Foo <span class="note">bar</span> baz</div>\r
- <div>Foo <span class="note">bar</span> baz</div>\r
- \r
+ <div>Foo <span class="note">bar</span> <span class="xyz">baz</span></div>\r
+ <div>Foo <span class="note">bar</span> <span class="xyz">baz</span></div>\r
+ <div>Foo <span class="note">bar</span> <span class="xyz">baz</span></div>\r
+ <div>Foo <span class="note">bar</span> <span class="xyz">baz</span></div>\r
+ <div>Foo <span class="note">bar</span> <span class="xyz">baz</span></div>\r
+ <div>Foo <span class="note">bar</span> <span class="xyz">baz</span></div>\r
+ <div>Foo <span class="note">bar</span> <span class="xyz">baz</span></div>\r
</div>\r
-<div id="tab-Overview">\r
- <h2>What is this?</h2>\r
- <p>\r
- The <strong>Star Rating Plugin</strong> is a plugin\r
- for the jQuery Javascript library that creates a non-obstrusive\r
- star rating control based on a set of radio input boxes.\r
- </p>\r
- \r
- <h2>What does it do?</h2>\r
- <ul>\r
- <li>\r
- It turns a collection of radio boxes into a neat star-rating control.\r
- </li>\r
- <li>\r
- It creates the interface based on standard form elements, which means the\r
- basic functionality will still be available even if Javascript is disabled.\r
- </li>\r
- <li>\r
- <strong style="color: rgb(0, 153, 0);">NEW</strong> (12-Mar-08):\r
- In read only mode (using the 'readOnly' option or <code>disabled</code> property), the plugin is a neat way of\r
- displaying star-like values without any additional code\r
- </li>\r
- </ul>\r
- \r
- <h2>How do I use it?</h2>\r
- <p>\r
- Just add the <code><strong>star</strong></code> class to your radio boxes\r
- </p>\r
- <table cellspacing="5" width="100%">\r
- <tr>\r
- <td valign="top">\r
- <pre class="code"><code class="html"><input name="star1" type="radio" class="star"/>\r
- <input name="star1" type="radio" class="star"/>\r
- <input name="star1" type="radio" class="star"/>\r
- <input name="star1" type="radio" class="star"/>\r
- <input name="star1" type="radio" class="star"/></code></pre>\r
- </td>\r
- <td valign="top" width="10">»</td>\r
- <td valign="top" width="180">\r
- <input name="star1" type="radio" class="star"/>\r
- <input name="star1" type="radio" class="star"/>\r
- <input name="star1" type="radio" class="star"/>\r
- <input name="star1" type="radio" class="star"/>\r
- <input name="star1" type="radio" class="star"/>\r
- </td>\r
- </tr>\r
- </table>\r
- \r
- <p>\r
- Use the <code><strong>checked</strong></code> property to specify the initial/default value of the control\r
- </p>\r
- <table cellspacing="5" width="100%">\r
- <tr>\r
- <td valign="top">\r
- <pre class="code"><code class="html"><input name="star2" type="radio" class="star"/>\r
- <input name="star2" type="radio" class="star"/>\r
- <input name="star2" type="radio" class="star" checked="checked"/>\r
- <input name="star2" type="radio" class="star"/>\r
- <input name="star2" type="radio" class="star"/></code></pre>\r
- </td>\r
- <td valign="top" width="10">»</td>\r
- <td valign="top" width="180">\r
- <input name="star2" type="radio" class="star"/>\r
- <input name="star2" type="radio" class="star"/>\r
- <input name="star2" type="radio" class="star" checked="checked"/>\r
- <input name="star2" type="radio" class="star"/>\r
- <input name="star2" type="radio" class="star"/>\r
- </td>\r
- </tr>\r
- </table>\r
- \r
- <p>\r
- Use the <code><strong>disabled</strong></code> property to use a control for display purposes only\r
- </p>\r
- <table cellspacing="5" width="100%">\r
- <tr>\r
- <td valign="top">\r
- <pre class="code"><code class="html"><input name="star3" type="radio" class="star" disabled="disabled"/>\r
- <input name="star3" type="radio" class="star" disabled="disabled"/>\r
- <input name="star3" type="radio" class="star" disabled="disabled" checked="checked"/>\r
- <input name="star3" type="radio" class="star" disabled="disabled"/>\r
- <input name="star3" type="radio" class="star" disabled="disabled"/></code></pre>\r
- </td>\r
- <td valign="top" width="10">»</td>\r
- <td valign="top" width="180">\r
- <input name="star3" type="radio" class="star" disabled="disabled"/>\r
- <input name="star3" type="radio" class="star" disabled="disabled"/>\r
- <input name="star3" type="radio" class="star" disabled="disabled" checked="checked"/>\r
- <input name="star3" type="radio" class="star" disabled="disabled"/>\r
- <input name="star3" type="radio" class="star" disabled="disabled"/>\r
- </td>\r
- </tr>\r
- </table>\r
- \r
- <h2>What about split stars and 'half ratings'???</h2>\r
- <p>\r
- Use metadata plugin to pass advanced settings to the plugin via the class property.\r
- </p>\r
- <table cellspacing="5" width="100%">\r
- <tr>\r
- <td valign="top">\r
- <pre class="code"><code class="html"><input name="adv1" type="radio" class="star {split:4}"/>\r
- <input name="adv1" type="radio" class="star {split:4}"/>\r
- <input name="adv1" type="radio" class="star {split:4}"/>\r
- <input name="adv1" type="radio" class="star {split:4}"/>\r
- <input name="adv1" type="radio" class="star {split:4}" checked="checked"/>\r
- <input name="adv1" type="radio" class="star {split:4}"/>\r
- <input name="adv1" type="radio" class="star {split:4}"/>\r
- <input name="adv1" type="radio" class="star {split:4}"/></code></pre>\r
- </td>\r
- <td valign="top" width="10">»</td>\r
- <td valign="top" width="180">\r
- <input name="adv1" type="radio" class="star {split:4}"/>\r
- <input name="adv1" type="radio" class="star {split:4}"/>\r
- <input name="adv1" type="radio" class="star {split:4}"/>\r
- <input name="adv1" type="radio" class="star {split:4}"/>\r
- <input name="adv1" type="radio" class="star {split:4}" checked="checked"/>\r
- <input name="adv1" type="radio" class="star {split:4}"/>\r
- <input name="adv1" type="radio" class="star {split:4}"/>\r
- <input name="adv1" type="radio" class="star {split:4}"/>\r
- </td>\r
- </tr>\r
- </table>\r
- \r
- <p>\r
- Use custom selector\r
- </p>\r
- <table cellspacing="5" width="100%">\r
- <tr>\r
- <td valign="top">\r
- <script>$(function(){ // wait for document to load\r
- $('input.wow').rating();\r
- });</script>\r
- <pre class="code"><code class="js">$(function(){ // wait for document to load\r
- $('input.wow').rating();\r
- });</code></pre>\r
- <pre class="code"><code class="html"><input name="adv2" type="radio" class="wow {split:4}"/>\r
- <input name="adv2" type="radio" class="wow {split:4}"/>\r
- <input name="adv2" type="radio" class="wow {split:4}"/>\r
- <input name="adv2" type="radio" class="wow {split:4}"/>\r
- <input name="adv2" type="radio" class="wow {split:4}" checked="checked"/>\r
- <input name="adv2" type="radio" class="wow {split:4}"/>\r
- <input name="adv2" type="radio" class="wow {split:4}"/>\r
- <input name="adv2" type="radio" class="wow {split:4}"/></code></pre>\r
- </td>\r
- <td valign="top" width="10">»</td>\r
- <td valign="top" width="180">\r
- <input name="adv2" type="radio" class="wow {split:4}"/>\r
- <input name="adv2" type="radio" class="wow {split:4}"/>\r
- <input name="adv2" type="radio" class="wow {split:4}"/>\r
- <input name="adv2" type="radio" class="wow {split:4}"/>\r
- <input name="adv2" type="radio" class="wow {split:4}" checked="checked"/>\r
- <input name="adv2" type="radio" class="wow {split:4}"/>\r
- <input name="adv2" type="radio" class="wow {split:4}"/>\r
- <input name="adv2" type="radio" class="wow {split:4}"/>\r
- </td>\r
- </tr>\r
- </table>\r
- </div><!--// tab-Overview //-->\r
- \r
+\r
\r
</body>\r
</html>\r
--- /dev/null
+<html>\r
+<head>\r
+ <title>GQuery Demo</title>\r
+ <script language="javascript" src="gwtquery.samples.GwtQueryWidgets.nocache.js"></script>\r
+ <link href='gquery-star-ratings.css' type="text/css" rel="stylesheet"/>\r
+ \r
+</head>\r
+<body>\r
+<div class="outer">\r
+<div class="btn">Make me a button 1!</div>\r
+<div class="btn">Make me a button 2!</div>\r
+<div class="btn">Make me a button 3!</div>\r
+<div class="btn">Make me a button 4!</div>\r
+<div class="btn">Make me a button 5!</div>\r
+<div class="btn">Make me a button 6!</div>\r
+</div> \r
+\r
+ \r
+</body>\r
+</html>\r
+
\ No newline at end of file
}
</script>
<style type="text/css">
- img {
+ img.himg {
width: 124px;
height: 73px;
}
<div id="racefield"
style="width:790px; background-image: url(grass-texture-small.jpg); background-repeat: repeat;">
<div id="gwthorse" class="horse">
- <img src="horse.png"><span>GWT</span><br>
+ <nobr><img class="himg" src="horse.gif"><img src="gwt-logo-cs.gif"></nobr>
</div>
<div id="jqueryhorse" class="horse">
- <img src="horse.png"><span>jQuery</span><br>
+ <nobr><img class="himg" src="horse.gif"><img src="logo_jquery.gif"></nobr>
</div>
<div id="dojohorse" class="horse">
- <img src="horse.png"><span>dojo</span><br>
+ <img class="himg" src="horse.gif"><img src="dojo-logo-text.gif"></nobr>
</div>
<div id="prototypehorse" class="horse">
- <img src="horse.png"><span>Prototype</span>
+ <img class="himg" src="horse.gif"><img src="prototype_logo.gif"></nobr>
</div>
</div>