]> source.dussan.org Git - gwtquery.git/commitdiff
widgets plugin take care of widgets hierarchy
authorJulien Dramaix <julien.dramaix@gmail.com>
Mon, 14 Mar 2011 11:52:30 +0000 (11:52 +0000)
committerJulien Dramaix <julien.dramaix@gmail.com>
Mon, 14 Mar 2011 11:52:30 +0000 (11:52 +0000)
22 files changed:
gwtquery-core/src/main/java/com/google/gwt/query/client/GQuery.java
gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/Widgets.java
gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/ButtonWidgetFactory.java
gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/DateBoxWidgetFactory.java
gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/DisclosurePanelWidgetFactory.java
gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/ListBoxWidgetFactory.java
gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/PasswordTextBoxWidgetFactory.java
gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/RichTextWidgetFactory.java
gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/StackPanelWidgetFactory.java [new file with mode: 0644]
gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/SuggestBoxWidgetFactory.java
gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/TabPanelWidgetFactory.java
gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/TextAreaWidgetFactory.java [new file with mode: 0644]
gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/TextBoxBaseWidgetFactory.java [new file with mode: 0644]
gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/TextBoxWidgetFactory.java
gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/WidgetFactory.java
gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/WidgetInitializer.java
gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/WidgetOptions.java
gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/WidgetsHtmlPanel.java [new file with mode: 0644]
gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/WidgetsUtils.java
gwtquery-core/src/main/java/com/google/gwt/user/client/ui/GqUi.java
samples/src/main/java/gwtquery/samples/client/GwtQueryWidgetModule.java
samples/src/main/java/gwtquery/samples/public/GwtQueryWidgets.html

index 542bfd96ad2676a18381965781e3b7d106ccaeca..d6adeb09ae4154a030cff1fb7531cee884e68108 100644 (file)
@@ -46,7 +46,6 @@ import com.google.gwt.query.client.js.JsNodeArray;
 import com.google.gwt.query.client.js.JsUtils;\r
 import com.google.gwt.query.client.plugins.Plugin;\r
 import com.google.gwt.query.client.plugins.events.EventsListener;\r
-import com.google.gwt.query.client.plugins.widgets.WidgetsUtils;\r
 import com.google.gwt.user.client.DOM;\r
 import com.google.gwt.user.client.Event;\r
 import com.google.gwt.user.client.EventListener;\r
@@ -2842,8 +2841,8 @@ public class GQuery implements Lazy<GQuery, LazyGQuery> {
         e = e.<Document> cast().getBody();\r
       }  \r
       for (int j = 0; j < g.size(); j++) {\r
-        Widget w = getAssociatedWidget(g.get(j));\r
-        GqUi.detachWidget(w);\r
+        /*Widget w = getAssociatedWidget(g.get(j));\r
+        GqUi.detachWidget(w);*/\r
         Node n = g.get(j);\r
         if (g.size() > 1) {\r
           n = n.cloneNode(true);\r
@@ -2863,7 +2862,7 @@ public class GQuery implements Lazy<GQuery, LazyGQuery> {
             newNodes.addNode(e.getParentNode().insertBefore(n, e));\r
             break;\r
         }\r
-        GqUi.attachWidget(w);\r
+        //GqUi.attachWidget(w);\r
       }\r
     }\r
     if (newNodes.size() > g.size()) {\r
index b32fc82ce91d44cc708c6a051754649bb54b7b23..9137cf73313160d0b0ee7d609e0fa4df4b3f7d8c 100755 (executable)
  */\r
 package com.google.gwt.query.client.plugins;\r
 \r
-import java.util.ArrayList;\r
-import java.util.List;\r
-\r
 import com.google.gwt.dom.client.Element;\r
 import com.google.gwt.query.client.GQuery;\r
 import com.google.gwt.query.client.plugins.widgets.ButtonWidgetFactory;\r
 import com.google.gwt.query.client.plugins.widgets.DateBoxWidgetFactory;\r
 import com.google.gwt.query.client.plugins.widgets.DisclosurePanelWidgetFactory;\r
-import com.google.gwt.query.client.plugins.widgets.WidgetsUtils;\r
-import com.google.gwt.query.client.plugins.widgets.DisclosurePanelWidgetFactory.DisclosurePanelOptions;\r
 import com.google.gwt.query.client.plugins.widgets.ListBoxWidgetFactory;\r
-import com.google.gwt.query.client.plugins.widgets.ListBoxWidgetFactory.ListBoxOptions;\r
 import com.google.gwt.query.client.plugins.widgets.PasswordTextBoxWidgetFactory;\r
-import com.google.gwt.query.client.plugins.widgets.RichTextWidgetFactory;\r
+import com.google.gwt.query.client.plugins.widgets.StackPanelWidgetFactory;\r
 import com.google.gwt.query.client.plugins.widgets.SuggestBoxWidgetFactory;\r
-import com.google.gwt.query.client.plugins.widgets.SuggestBoxWidgetFactory.SuggestBoxOptions;\r
 import com.google.gwt.query.client.plugins.widgets.TabPanelWidgetFactory;\r
-import com.google.gwt.query.client.plugins.widgets.TabPanelWidgetFactory.TabPanelOptions;\r
+import com.google.gwt.query.client.plugins.widgets.TextAreaWidgetFactory;\r
 import com.google.gwt.query.client.plugins.widgets.TextBoxWidgetFactory;\r
 import com.google.gwt.query.client.plugins.widgets.WidgetFactory;\r
 import com.google.gwt.query.client.plugins.widgets.WidgetInitializer;\r
+import com.google.gwt.query.client.plugins.widgets.WidgetsUtils;\r
+import com.google.gwt.query.client.plugins.widgets.DisclosurePanelWidgetFactory.DisclosurePanelOptions;\r
+import com.google.gwt.query.client.plugins.widgets.ListBoxWidgetFactory.ListBoxOptions;\r
+import com.google.gwt.query.client.plugins.widgets.StackPanelWidgetFactory.StackPanelOptions;\r
+import com.google.gwt.query.client.plugins.widgets.SuggestBoxWidgetFactory.SuggestBoxOptions;\r
+import com.google.gwt.query.client.plugins.widgets.TabPanelWidgetFactory.TabPanelOptions;\r
 import com.google.gwt.user.client.ui.Button;\r
 import com.google.gwt.user.client.ui.DisclosurePanel;\r
 import com.google.gwt.user.client.ui.ListBox;\r
 import com.google.gwt.user.client.ui.PasswordTextBox;\r
+import com.google.gwt.user.client.ui.StackPanel;\r
 import com.google.gwt.user.client.ui.SuggestBox;\r
 import com.google.gwt.user.client.ui.TabPanel;\r
+import com.google.gwt.user.client.ui.TextArea;\r
 import com.google.gwt.user.client.ui.TextBox;\r
 import com.google.gwt.user.client.ui.Widget;\r
 import com.google.gwt.user.datepicker.client.DateBox;\r
 \r
+import java.util.ArrayList;\r
+import java.util.List;\r
+\r
 /**\r
  * Widgets plugin for Gwt Query. Be careful, this plugin is still experimental.\r
  * The api can change in next releases.\r
@@ -53,7 +57,7 @@ import com.google.gwt.user.datepicker.client.DateBox;
 public class Widgets extends QueuePlugin<Widgets> {\r
 \r
   public static final Class<Widgets> Widgets = Widgets.class;\r
-  \r
+\r
   // list of html tags that cannot be replaced by a widget, in order to avoid to\r
   // break the html structure\r
   private static final String[] excludedTags = {\r
@@ -78,7 +82,17 @@ public class Widgets extends QueuePlugin<Widgets> {
    * by passing them in parameter.\r
    * \r
    */\r
-  public Widgets button(WidgetInitializer... initializers) {\r
+  public Widgets button() {\r
+    return widgets(new ButtonWidgetFactory(), null);\r
+  }\r
+\r
+  /**\r
+   * Create a {@link Button} widget for each selected element. The\r
+   * <code>initializers</code> will be called on each new {@link Button} created\r
+   * by passing them in parameter.\r
+   * \r
+   */\r
+  public Widgets button(WidgetInitializer<Button> initializers) {\r
     return widgets(new ButtonWidgetFactory(), initializers);\r
   }\r
 \r
@@ -87,22 +101,45 @@ public class Widgets extends QueuePlugin<Widgets> {
    * <code>initializers</code> will be called on each new {@link Button} created\r
    * by passing them in parameter.\r
    */\r
-  public Widgets datebox(WidgetInitializer... initializers) {\r
+  public Widgets datebox() {\r
+    return widgets(new DateBoxWidgetFactory(), null);\r
+  }\r
+\r
+  /**\r
+   * Create a {@link DateBox} widget for each selected element. The\r
+   * <code>initializers</code> will be called on each new {@link Button} created\r
+   * by passing them in parameter.\r
+   */\r
+  public Widgets datebox(WidgetInitializer<DateBox> initializers) {\r
     return widgets(new DateBoxWidgetFactory(), initializers);\r
   }\r
 \r
+  /**\r
+   * Create a {@link DisclosurePanel} widget for each selected elements.\r
+   */\r
+  public Widgets disclosurePanel() {\r
+    return disclosurePanel(new DisclosurePanelOptions(), null);\r
+  }\r
+\r
   /**\r
    * Create a {@link DisclosurePanel} widget for each selected elements.\r
    */\r
   public Widgets disclosurePanel(DisclosurePanelOptions o,\r
-      WidgetInitializer... initializers) {\r
+      WidgetInitializer<DisclosurePanel> initializers) {\r
     return widgets(new DisclosurePanelWidgetFactory(o), initializers);\r
   }\r
+  \r
+  /**\r
+   * Create a {@link DisclosurePanel} widget for each selected elements.\r
+   */\r
+  public Widgets disclosurePanel(DisclosurePanelOptions o) {\r
+    return widgets(new DisclosurePanelWidgetFactory(o), null);\r
+  }\r
 \r
   /**\r
    * Create {@link DisclosurePanel} widget for each selected elements.\r
    */\r
-  public Widgets disclosurePanel(WidgetInitializer... initializers) {\r
+  public Widgets disclosurePanel(WidgetInitializer<DisclosurePanel> initializers) {\r
     return disclosurePanel(new DisclosurePanelOptions(), initializers);\r
   }\r
 \r
@@ -111,40 +148,95 @@ public class Widgets extends QueuePlugin<Widgets> {
    * <code>initializers</code> will be called on each new {@link ListBox}\r
    * created by passing them in parameter.\r
    * \r
-   * A {@link ListBox} is created if the element is a <i>input</i> with type\r
-   * <i>password</i>, a <i>div</i> or a<i>span</i> element.\r
    */\r
   public Widgets listBox(ListBoxOptions options,\r
-      WidgetInitializer... initializers) {\r
+      WidgetInitializer<ListBox> initializers) {\r
     return widgets(new ListBoxWidgetFactory(options), initializers);\r
   }\r
-\r
+  \r
   /**\r
    * Create a {@link ListBox} widget for each selected element. The\r
    * <code>initializers</code> will be called on each new {@link ListBox}\r
    * created by passing them in parameter.\r
    * \r
-   * A {@link ListBox} is created if the element is a <i>input</i> with type\r
-   * <i>password</i>, a <i>div</i> or a<i>span</i> element.\r
    */\r
-  public Widgets listBox(WidgetInitializer... initializers) {\r
+  public Widgets listBox(ListBoxOptions options) {\r
+    return widgets(new ListBoxWidgetFactory(options), null);\r
+  }\r
+\r
+  /**\r
+   * Create a {@link ListBox} widget for each selected element. The\r
+   * <code>initializers</code> will be called on each new {@link ListBox}\r
+   * created by passing them in parameter.\r
+   */\r
+  public Widgets listBox(WidgetInitializer<ListBox> initializers) {\r
     return listBox(new ListBoxOptions(), initializers);\r
   }\r
 \r
+  /**\r
+   * Create a {@link ListBox} widget for each selected element.\r
+   */\r
+  public Widgets listBox() {\r
+    return listBox(new ListBoxOptions(), null);\r
+  }\r
+\r
+  /**\r
+   * Create a {@link PasswordTextBox} widget for each selected element.\r
+   */\r
+  public Widgets passwordBox() {\r
+    return widgets(new PasswordTextBoxWidgetFactory(), null);\r
+  }\r
+\r
   /**\r
    * Create a {@link PasswordTextBox} widget for each selected element. The\r
    * <code>initializers</code> will be called on each new\r
    * {@link PasswordTextBox} created by passing them in parameter.\r
    * \r
-   * A {@link PasswordTextBox} is created if the element is a <i>input</i> with\r
-   * type <i>password</i>, a <i>div</i> or a<i>span</i> element.\r
    */\r
-  public Widgets passwordBox(WidgetInitializer... initializers) {\r
+  public Widgets passwordBox(WidgetInitializer<PasswordTextBox> initializers) {\r
     return widgets(new PasswordTextBoxWidgetFactory(), initializers);\r
   }\r
 \r
-  public Widgets richtext(WidgetInitializer... initializers) {\r
-    return widgets(new RichTextWidgetFactory(), initializers);\r
+  /*\r
+   * public Widgets richtext(WidgetInitializer initializers) { return\r
+   * widgets(new RichTextWidgetFactory(), initializers); }\r
+   */\r
+\r
+  /**\r
+   * Create a {@link StackPanel} widget for each selected elements. Each div\r
+   * element inside a selected element will create a tab and the first h3\r
+   * element inside the div will be used as title\r
+   */\r
+  public Widgets stackPanel(StackPanelOptions o,\r
+      WidgetInitializer<StackPanel> initializers) {\r
+    return widgets(new StackPanelWidgetFactory(o), initializers);\r
+  }\r
+  \r
+  /**\r
+   * Create a {@link StackPanel} widget for each selected elements. Each div\r
+   * element inside a selected element will create a tab and the first h3\r
+   * element inside the div will be used as title\r
+   */\r
+  public Widgets stackPanel(StackPanelOptions o) {\r
+    return widgets(new StackPanelWidgetFactory(o), null);\r
+  }\r
+\r
+  /**\r
+   * Create {@link TabPanel} widget for each selected elements. Each div element\r
+   * will create a tab and the first h3 element inside the div will be used as\r
+   * title\r
+   */\r
+  public Widgets stackPanel(WidgetInitializer<StackPanel> initializers) {\r
+    return stackPanel(new StackPanelOptions(), initializers);\r
+  }\r
+\r
+  /**\r
+   * Create {@link TabPanel} widget for each selected elements. Each div element\r
+   * will create a tab and the first h3 element inside the div will be used as\r
+   * title\r
+   */\r
+  public Widgets stackPanel() {\r
+    return stackPanel(new StackPanelOptions(), null);\r
   }\r
 \r
   /**\r
@@ -154,9 +246,19 @@ public class Widgets extends QueuePlugin<Widgets> {
    * \r
    */\r
   public Widgets suggestBox(SuggestBoxOptions options,\r
-      WidgetInitializer... initializers) {\r
+      WidgetInitializer<SuggestBox> initializers) {\r
     return widgets(new SuggestBoxWidgetFactory(options), initializers);\r
   }\r
+  \r
+  /**\r
+   * Create a {@link SuggestBox} widget for each selected element. The\r
+   * <code>initializers</code> will be called on each new {@link SuggestBox}\r
+   * created by passing them in parameter.\r
+   * \r
+   */\r
+  public Widgets suggestBox(SuggestBoxOptions options) {\r
+    return widgets(new SuggestBoxWidgetFactory(options), null);\r
+  }\r
 \r
   /**\r
    * Create a {@link SuggestBox} widget for each selected element. The\r
@@ -164,47 +266,101 @@ public class Widgets extends QueuePlugin<Widgets> {
    * created by passing them in parameter.\r
    * \r
    */\r
-  public Widgets suggestBox(WidgetInitializer... initializers) {\r
+  public Widgets suggestBox(WidgetInitializer<SuggestBox> initializers) {\r
     return suggestBox(new SuggestBoxOptions(), initializers);\r
   }\r
 \r
+  /**\r
+   * Create a {@link SuggestBox} widget for each selected element.\r
+   */\r
+  public Widgets suggestBox() {\r
+    return suggestBox(new SuggestBoxOptions(), null);\r
+  }\r
+\r
   /**\r
    * Create a {@link TabPanel} widget for each selected elements. Each div\r
    * element inside a selected element will create a tab and the first h3\r
    * element inside the div will be used as title\r
    */\r
-  public Widgets tabPanel(TabPanelOptions o, WidgetInitializer... initializers) {\r
+  public Widgets tabPanel(TabPanelOptions o,\r
+      WidgetInitializer<TabPanel> initializers) {\r
     return widgets(new TabPanelWidgetFactory(o), initializers);\r
   }\r
+  \r
+  /**\r
+   * Create a {@link TabPanel} widget for each selected elements. Each div\r
+   * element inside a selected element will create a tab and the first h3\r
+   * element inside the div will be used as title\r
+   */\r
+  public Widgets tabPanel(TabPanelOptions o) {\r
+    return widgets(new TabPanelWidgetFactory(o), null);\r
+  }\r
 \r
   /**\r
    * Create {@link TabPanel} widget for each selected elements. Each div element\r
    * will create a tab and the first h3 element inside the div will be used as\r
    * title\r
    */\r
-  public Widgets tabPanel(WidgetInitializer... initializers) {\r
+  public Widgets tabPanel(WidgetInitializer<TabPanel> initializers) {\r
     return tabPanel(new TabPanelOptions(), initializers);\r
   }\r
 \r
+  /**\r
+   * Create {@link TabPanel} widget for each selected elements. Each div element\r
+   * will create a tab and the first h3 element inside the div will be used as\r
+   * title\r
+   */\r
+  public Widgets tabPanel() {\r
+    return tabPanel(new TabPanelOptions(), null);\r
+  }\r
+\r
+  /**\r
+   * Create a {@link TextBox} widget for each selected element. The\r
+   * <code>initializers</code> will be called on each new {@link TextBox}\r
+   * created by passing them in parameter.\r
+   * \r
+   */\r
+  public Widgets textBox() {\r
+    return widgets(new TextBoxWidgetFactory(), null);\r
+  }\r
+\r
   /**\r
    * Create a {@link TextBox} widget for each selected element. The\r
    * <code>initializers</code> will be called on each new {@link TextBox}\r
    * created by passing them in parameter.\r
    * \r
-   * A {@link TextBox} is created if the element is a <i>input</i> with type\r
-   * text, a <i>div</i> or a<i>span</i> element.\r
    */\r
-  public Widgets textBox(WidgetInitializer... initializers) {\r
+  public Widgets textBox(WidgetInitializer<TextBox> initializers) {\r
     return widgets(new TextBoxWidgetFactory(), initializers);\r
   }\r
 \r
+  /**\r
+   * Create a {@link TextArea} widget for each selected element. The\r
+   * <code>initializers</code> will be called on each new {@link TextBox}\r
+   * created by passing them in parameter.\r
+   * \r
+   */\r
+  public Widgets textArea() {\r
+    return widgets(new TextAreaWidgetFactory(), null);\r
+  }\r
+\r
+  /**\r
+   * Create a {@link TextArea} widget for each selected element. The\r
+   * <code>initializers</code> will be called on each new {@link TextBox}\r
+   * created by passing them in parameter.\r
+   * \r
+   */\r
+  public Widgets textArea(WidgetInitializer<TextArea> initializers) {\r
+    return widgets(new TextAreaWidgetFactory(), initializers);\r
+  }\r
+\r
   /**\r
    * Try to create a widget using the given factory and the given options for\r
    * each element of the query. Returns a new gquery set of elements with the\r
    * new widgets created.\r
    */\r
   public <W extends Widget> Widgets widgets(WidgetFactory<W> factory,\r
-      WidgetInitializer... initializers) {\r
+      WidgetInitializer<W> initializers) {\r
     List<Element> result = new ArrayList<Element>();\r
     for (Element e : elements()) {\r
       W w = widget(e, factory, initializers);\r
@@ -215,34 +371,36 @@ public class Widgets extends QueuePlugin<Widgets> {
     return $(result).as(Widgets);\r
   }\r
 \r
+  protected boolean isWidgetCreationAuthorizedFrom(Element e) {\r
+    return $(e).widget() == null && !WidgetsUtils.matchesTags(e, excludedTags);\r
+  }\r
+\r
   /**\r
    * Create and return a widget using the given factory and the given options\r
    */\r
   protected <W extends Widget> W widget(Element e, WidgetFactory<W> factory,\r
-      WidgetInitializer... initializers) {\r
+      WidgetInitializer<W> initializer) {\r
 \r
     if (!isWidgetCreationAuthorizedFrom(e)) {\r
       return null;\r
     }\r
 \r
     W widget = factory.create(e);\r
-    if (initializers != null) {\r
-      for (WidgetInitializer initializer : initializers) {\r
-        initializer.initialize(widget, e);\r
-      }\r
+    if (initializer != null) {\r
+\r
+      initializer.initialize(widget, e);\r
+\r
     }\r
     return widget;\r
   }\r
+\r
   /**\r
    * Create and return a widget using the given factory and the given options\r
    */\r
   protected <W extends Widget> W widget(WidgetFactory<W> factory,\r
-      WidgetInitializer... initializers) {\r
+      WidgetInitializer<W> initializers) {\r
 \r
     return widget(get(0), factory, initializers);\r
   }\r
-  \r
-  protected boolean isWidgetCreationAuthorizedFrom(Element e) {\r
-    return $(e).widget() == null && !WidgetsUtils.matchesTags(e, excludedTags);\r
-  }\r
+\r
 }\r
index 31b1a7a7cd882afddde81d9c4c4495860fc1de9d..90b8002c72538142754f8595cd35eb3d751a1bb0 100644 (file)
@@ -1,5 +1,22 @@
+/*
+ * Copyright 2011, The gwtquery team.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
 package com.google.gwt.query.client.plugins.widgets;
 
+
+import com.google.gwt.dom.client.ButtonElement;
 import com.google.gwt.dom.client.Element;
 import com.google.gwt.user.client.ui.Button;
 
@@ -12,15 +29,28 @@ public class ButtonWidgetFactory implements WidgetFactory<Button> {
 
   public Button create(Element e) {
 
-    if ("button".equalsIgnoreCase(e.getTagName())) {
+    //TODO manage button tag in an other way that wrapping it
+    /*if ("button".equalsIgnoreCase(e.getTagName())) {
       return Button.wrap(e);
-    }
+    }*/
+    
 
     
     Button button = new Button();
     button.getElement().setInnerText(e.getInnerText());
     
+    if ("button".equalsIgnoreCase(e.getTagName())){
+      copyAttributes((ButtonElement)e.cast(), (ButtonElement)button.getElement().cast());
+    }
+    
     WidgetsUtils.replaceOrAppend(e, button);
     return button;
   }
+
+  protected void copyAttributes(ButtonElement source,ButtonElement destination) {
+    destination.setAccessKey(source.getAccessKey());
+    destination.setDisabled(source.isDisabled());
+    destination.setName(source.getName());
+    destination.setValue(source.getValue());
+  }
 }
\ No newline at end of file
index b92130c7fed230ec46939b1568d1c3dfb49e2af7..c7e574e0cc681347e0d9b34ce31a9e0b1b3ada61 100644 (file)
@@ -1,3 +1,18 @@
+/*
+ * Copyright 2011, The gwtquery team.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
 package com.google.gwt.query.client.plugins.widgets;
 
 import static com.google.gwt.query.client.GQuery.$;
index 3de90040da5c517a807fd44060bea6e6d3f70b00..48378a3ded4ea15fbafa63dc9db043b9dd349813 100644 (file)
@@ -1,3 +1,18 @@
+/*
+ * Copyright 2011, The gwtquery team.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
 package com.google.gwt.query.client.plugins.widgets;
 
 import static com.google.gwt.query.client.GQuery.$;
@@ -5,7 +20,6 @@ import static com.google.gwt.query.client.GQuery.$;
 import com.google.gwt.dom.client.Element;
 import com.google.gwt.user.client.ui.Button;
 import com.google.gwt.user.client.ui.DisclosurePanel;
-import com.google.gwt.user.client.ui.HTMLPanel;
 import com.google.gwt.user.client.ui.Label;
 
 public class DisclosurePanelWidgetFactory implements
@@ -18,30 +32,35 @@ public class DisclosurePanelWidgetFactory implements
   public static class DisclosurePanelOptions implements WidgetOptions {
 
     private String headerSelector;
-    private String headerTitle;
+    //private String headerTitle;
 
     public DisclosurePanelOptions() {
       initDefault();
     }
+    
+    public DisclosurePanelOptions(String headerSelector) {
+      this.headerSelector = headerSelector;
+     
+    }
 
     public String getHeaderSelector() {
       return headerSelector;
     }
 
-    public String getHeaderTitle() {
+   /* public String getHeaderTitle() {
       return headerTitle;
-    }
+    }*/
     
     public void setHeaderSelector(String headerSelector) {
       this.headerSelector = headerSelector;
     }
 
-    public void setHeaderTitle(String headerTitle) {
+   /* public void setHeaderTitle(String headerTitle) {
       this.headerTitle = headerTitle;
-    }
+    }*/
 
     private void initDefault() {
-      headerTitle = null;
+      //headerTitle = null;
       headerSelector = "h3";
     }
   }
@@ -55,17 +74,20 @@ public class DisclosurePanelWidgetFactory implements
   public DisclosurePanel create(Element e) {
     
     String headerValue = "";
-    if (options.getHeaderTitle() != null){
+    /*if (options.getHeaderTitle() != null){
       headerValue = options.getHeaderTitle();
-    }else{
+    }else{*/
       headerValue = $(options.getHeaderSelector(), e).first().remove().text();
-    }
+    //}
     
     DisclosurePanel disclosurePanel = new DisclosurePanel();
     disclosurePanel.setHeader(new Label(headerValue));
-    disclosurePanel.add(new HTMLPanel(e.getString()));
     
     WidgetsUtils.replaceOrAppend(e, disclosurePanel);
+    
+    disclosurePanel.add(new WidgetsHtmlPanel(e));
+    
+
     return disclosurePanel;
   }
 
index 3698290378a6c40186506779b3b059ede526e962..870783449afdc95b6f9a3584bc98fb7296c72428 100644 (file)
@@ -1,8 +1,22 @@
+/*
+ * Copyright 2011, The gwtquery team.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
 package com.google.gwt.query.client.plugins.widgets;
 
 import static com.google.gwt.query.client.GQuery.$;
 
-import com.google.gwt.dom.client.Document;
 import com.google.gwt.dom.client.Element;
 import com.google.gwt.dom.client.SelectElement;
 import com.google.gwt.query.client.GQuery;
@@ -73,18 +87,12 @@ public class ListBoxWidgetFactory implements WidgetFactory<ListBox> {
   }
 
   public ListBox create(Element e) {
-
+    
+    ListBox listBox = new ListBox(options.isMultipleSelect());
     if (WidgetsUtils.matchesTags(e, "select")) {
-
-      SelectElement selectElement = e.cast();
-      if (selectElement.isMultiple() != options.isMultipleSelect()) {
-        selectElement.setMultiple(options.isMultipleSelect());
-      }
-      return ListBox.wrap(e);
+      copyAttributes((SelectElement)e.cast(),(SelectElement)listBox.getElement().cast());
     }
 
-    ListBox listBox = new ListBox(options.isMultipleSelect());
-    
     GQuery itemsList = getItemsList(e);
     for (Element item : itemsList.elements()) {
       listBox.addItem(item.getInnerText());
@@ -94,7 +102,18 @@ public class ListBoxWidgetFactory implements WidgetFactory<ListBox> {
     return listBox;
   }
 
-  private GQuery getItemsList(Element e) {
+  protected void copyAttributes(SelectElement source, SelectElement destination) {
+    destination.setDisabled(source.isDisabled());
+    destination.setName(source.getName());
+    destination.setSelectedIndex(source.getSelectedIndex());
+    destination.setSize(source.getSize());
+    
+  }
+
+  protected GQuery getItemsList(Element e) {
+    if ("select".equalsIgnoreCase(e.getTagName())){
+      return $("option", e);
+    }
     if (options.getOptionsSelector() != null) {
       return $(options.getOptionsSelector(), e);
     }
index 6e988b4d4a17d307dec2312baf0f1e5cd2c4bdee..2d98e941fa32e87e0e8fda7d059c82df9fe2ee89 100644 (file)
@@ -1,9 +1,20 @@
+/*
+ * Copyright 2011, The gwtquery team.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
 package com.google.gwt.query.client.plugins.widgets;
 
-import static com.google.gwt.query.client.GQuery.$;
-
-import com.google.gwt.dom.client.Element;
-import com.google.gwt.query.client.GQuery;
 import com.google.gwt.user.client.ui.PasswordTextBox;
 
 /**
@@ -12,22 +23,10 @@ import com.google.gwt.user.client.ui.PasswordTextBox;
  * <i>password</i>, a <i>div</i> or a<i>span</i> element.
  * 
  */
-public class PasswordTextBoxWidgetFactory implements
-    WidgetFactory<PasswordTextBox> {
-
-  public PasswordTextBox create(Element e) {
-
-    GQuery input = $(e).filter("input[type='password']");
-
-    if (input.get(0) != null) {
-      return PasswordTextBox.wrap(e);
-    }
-
-    PasswordTextBox textBox = new PasswordTextBox();
-    textBox.setValue(e.getInnerText());
-    WidgetsUtils.replaceOrAppend(e, textBox);
-
-    return textBox;
+public class PasswordTextBoxWidgetFactory extends
+    TextBoxBaseWidgetFactory<PasswordTextBox> {
 
+  protected PasswordTextBox createWidget() {
+    return new PasswordTextBox();
   }
-}
\ No newline at end of file
+}
index 59ec23d1863c3229932d4fe7cd16c62fbc454a84..8e4677b4be0b3969f940051c718021cfa1ef0d53 100644 (file)
@@ -1,3 +1,18 @@
+/*
+ * Copyright 2011, The gwtquery team.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
 package com.google.gwt.query.client.plugins.widgets;
 
 import static com.google.gwt.query.client.GQuery.$;
diff --git a/gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/StackPanelWidgetFactory.java b/gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/StackPanelWidgetFactory.java
new file mode 100644 (file)
index 0000000..92d2794
--- /dev/null
@@ -0,0 +1,112 @@
+/*
+ * Copyright 2011, The gwtquery team.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
+package com.google.gwt.query.client.plugins.widgets;
+
+import static com.google.gwt.query.client.GQuery.$;
+
+import com.google.gwt.dom.client.Element;
+import com.google.gwt.query.client.GQuery;
+import com.google.gwt.user.client.ui.Button;
+import com.google.gwt.user.client.ui.DecoratedStackPanel;
+import com.google.gwt.user.client.ui.StackPanel;
+import com.google.gwt.user.client.ui.Widget;
+
+public class StackPanelWidgetFactory implements WidgetFactory<StackPanel> {
+
+  /**
+   * Options used to initialize new {@link Button}
+   * 
+   */
+  public static class StackPanelOptions implements WidgetOptions {
+
+    private String headerSelector;
+    private String contentSelector;
+    private boolean decorated;
+
+    public StackPanelOptions() {
+      initDefault();
+    }
+    
+    public StackPanelOptions(String headerSelector, String contentSelector, boolean decorated){
+      this.headerSelector = headerSelector;
+      this.contentSelector = contentSelector;
+      this.decorated = decorated;
+    }
+
+    public String getHeaderSelector() {
+      return headerSelector;
+    }
+
+    public String getContentSelector() {
+      return contentSelector;
+    }
+
+    public boolean isDecorated() {
+      return decorated;
+    }
+    
+    public void setHeaderSelector(String headerSelector) {
+      this.headerSelector = headerSelector;
+    }
+
+    public void setContentSelector(String contentSelector) {
+      this.contentSelector = contentSelector;
+    }
+    
+    public void setDecorated(boolean decorated) {
+      this.decorated = decorated;
+    }
+
+    private void initDefault() {
+      contentSelector = "div";
+      headerSelector = "h3";
+      decorated = true;
+    }
+  }
+  
+  private StackPanelOptions options;
+
+  public StackPanelWidgetFactory(StackPanelOptions o) {
+    this.options = o;
+  }
+
+  public StackPanel create(Element e) {
+    StackPanel stackPanel = options.isDecorated() ? new DecoratedStackPanel() : new StackPanel();
+    
+    WidgetsUtils.replaceOrAppend(e, stackPanel);
+    
+    GQuery contents = $(options.getContentSelector(), e);
+    GQuery headers = $(options.getHeaderSelector(), e);
+
+    for (int i = 0; i < contents.length(); i++) {
+      Element content = contents.get(i);
+      Element header = headers.get(i);
+
+      Widget contentWidget = $(content).widget();
+      if (contentWidget == null){
+        contentWidget = new WidgetsHtmlPanel(content);
+      }
+      
+      stackPanel.add(contentWidget, header != null ? header.getInnerText() : "Undefined" );
+
+    }
+    
+
+    
+    return stackPanel;
+  }
+
+}
index 77b3f39104088315880b6f6ac3a1e9ac1f580dbb..12f11406a0e7e87e28171c949b0fe7e4b08beb64 100644 (file)
@@ -1,10 +1,23 @@
+/*
+ * Copyright 2011, The gwtquery team.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
 package com.google.gwt.query.client.plugins.widgets;
 
 import static com.google.gwt.query.client.GQuery.$;
 
-import com.google.gwt.dom.client.Document;
 import com.google.gwt.dom.client.Element;
-import com.google.gwt.dom.client.InputElement;
 import com.google.gwt.query.client.GQuery;
 import com.google.gwt.user.client.ui.MultiWordSuggestOracle;
 import com.google.gwt.user.client.ui.SuggestBox;
index 8143b685f80a0b8ed81eaaedcf660e95e0643c39..56219cc05b866bc0a70d46bf75ad1ee129476496 100644 (file)
@@ -1,3 +1,18 @@
+/*
+ * Copyright 2011, The gwtquery team.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
 package com.google.gwt.query.client.plugins.widgets;
 
 import static com.google.gwt.query.client.GQuery.$;
@@ -5,7 +20,6 @@ import static com.google.gwt.query.client.GQuery.$;
 import com.google.gwt.dom.client.Element;
 import com.google.gwt.query.client.GQuery;
 import com.google.gwt.user.client.ui.Button;
-import com.google.gwt.user.client.ui.HTMLPanel;
 import com.google.gwt.user.client.ui.TabPanel;
 import com.google.gwt.user.client.ui.Widget;
 
@@ -29,6 +43,12 @@ public class TabPanelWidgetFactory implements WidgetFactory<TabPanel> {
     public TabPanelOptions() {
       initDefault();
     }
+    
+    public TabPanelOptions(String tabSelector, String titleSelector) {
+      this.tabSelector = tabSelector;
+      this.titleSelector = titleSelector;
+      
+    }
 
     public String getTabSelector() {
       return tabSelector;
@@ -65,16 +85,16 @@ public class TabPanelWidgetFactory implements WidgetFactory<TabPanel> {
     GQuery titles = $(options.getTitleSelector(), e);
 
     for (int i = 0; i < tabs.length(); i++) {
-      Element tab = tabs.get(i);
-      Element title = titles.get(i);
+      GQuery tab = tabs.eq(i);
+      GQuery title = titles.eq(i);
 
-      Widget tabWidget = $(tab).widget();
+      Widget tabWidget = tab.widget();
       if (tabWidget == null){
-        tabWidget = new HTMLPanel(tab.getString());
+        tabWidget = new WidgetsHtmlPanel(tab.get(0));
       }
       
-      tabPanel.add(tabWidget, title != null
-          ? title.getInnerText() : "Tab " + (i + 1));
+      tabPanel.add(tabWidget, title.get(0) != null
+          ? title.text() : "Tab " + (i + 1));
 
     }
     if (tabs.length() > 0) {
diff --git a/gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/TextAreaWidgetFactory.java b/gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/TextAreaWidgetFactory.java
new file mode 100644 (file)
index 0000000..2fab94c
--- /dev/null
@@ -0,0 +1,52 @@
+/*
+ * Copyright 2011, The gwtquery team.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
+package com.google.gwt.query.client.plugins.widgets;
+
+import com.google.gwt.dom.client.Element;
+import com.google.gwt.dom.client.TextAreaElement;
+import com.google.gwt.user.client.ui.TextArea;
+
+/**
+ * Factory used to create a {@link TextArea} widget.
+ * 
+ */
+public class TextAreaWidgetFactory extends TextBoxBaseWidgetFactory<TextArea> {
+
+  @Override
+  protected void copyAttributes(Element src, Element dest) {
+    TextAreaElement source= src.cast();
+    TextAreaElement destination = dest.cast();
+    
+    destination.setAccessKey(source.getAccessKey());
+    destination.setCols(source.getCols());
+    destination.setDefaultValue(source.getDefaultValue());
+    destination.setDisabled(source.isDisabled());
+    destination.setName(source.getName());
+    destination.setReadOnly(source.isReadOnly());
+    destination.setRows(source.getRows());
+    destination.setValue(source.getValue());
+  }
+  
+  @Override
+  protected String getEquivalentTagName() {
+    return "textarea";
+  }
+  
+  
+  protected TextArea createWidget() {
+    return new TextArea();
+  }
+}
\ No newline at end of file
diff --git a/gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/TextBoxBaseWidgetFactory.java b/gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/TextBoxBaseWidgetFactory.java
new file mode 100644 (file)
index 0000000..c0b03d3
--- /dev/null
@@ -0,0 +1,63 @@
+/*
+ * Copyright 2011, The gwtquery team.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
+package com.google.gwt.query.client.plugins.widgets;
+
+import com.google.gwt.dom.client.Element;
+import com.google.gwt.dom.client.InputElement;
+import com.google.gwt.user.client.ui.TextBoxBase;
+
+/**
+ * 
+ * 
+ */
+public abstract class TextBoxBaseWidgetFactory<T extends TextBoxBase>
+    implements WidgetFactory<T> {
+
+  public T create(Element e) {
+    T textBox = createWidget();
+
+    if (getEquivalentTagName().equalsIgnoreCase(e.getTagName())) {
+      copyAttributes((InputElement) e.cast(),
+          (InputElement) textBox.getElement().cast());
+    } else {
+      textBox.setValue(e.getInnerText());
+    }
+    WidgetsUtils.replaceOrAppend(e, textBox);
+
+    return (T) textBox;
+  }
+  
+  protected String getEquivalentTagName(){
+    return "input";
+  }
+
+  protected void copyAttributes(Element src, Element dest) {
+    InputElement source = src.cast();
+    InputElement destination = dest.cast();
+    
+    destination.setAccessKey(source.getAccessKey());
+    destination.setDefaultValue(source.getDefaultValue());
+    destination.setDisabled(source.isDisabled());
+    destination.setMaxLength(source.getMaxLength());
+    destination.setReadOnly(source.isReadOnly());
+    destination.setSize(source.getSize());
+    destination.setName(source.getName());
+    destination.setValue(source.getValue());
+    
+  }
+
+  protected abstract T createWidget();
+}
\ No newline at end of file
index 22de997e98d946f1aa3cb6bf6c9ba211cf586098..4cbe5c541818a94174eac07da4486070af6c9392 100644 (file)
@@ -1,9 +1,20 @@
+/*
+ * Copyright 2011, The gwtquery team.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
 package com.google.gwt.query.client.plugins.widgets;
 
-import static com.google.gwt.query.client.GQuery.$;
-
-import com.google.gwt.dom.client.Element;
-import com.google.gwt.query.client.GQuery;
 import com.google.gwt.user.client.ui.TextBox;
 
 /**
@@ -12,20 +23,9 @@ import com.google.gwt.user.client.ui.TextBox;
  * element.
  * 
  */
-public class TextBoxWidgetFactory implements WidgetFactory<TextBox> {
-
-  public TextBox create(Element e) {
-
-    GQuery input = $(e).filter("input[type='text']");
-
-    if (input.get(0) != null) {
-      return TextBox.wrap(e);
-    }
-
-    TextBox textBox = new TextBox();
-    textBox.setValue(e.getInnerText());
-    WidgetsUtils.replaceOrAppend(e, textBox);
+public class TextBoxWidgetFactory extends TextBoxBaseWidgetFactory<TextBox> {
 
-    return textBox;
+  protected TextBox createWidget() {
+    return new TextBox();
   }
 }
\ No newline at end of file
index 9b434fdf833f89c5672f716c84d9c890ccfaed74..101f2ca871131dfd92c8916308faf591dcdb2364 100644 (file)
@@ -1,3 +1,18 @@
+/*
+ * Copyright 2011, The gwtquery team.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
 package com.google.gwt.query.client.plugins.widgets;
 
 import com.google.gwt.dom.client.Element;
index ae131e87aa85ecc995491a12aa0ec0008f1ed5c6..edf22d2d8352883ec350d3c4d9731946e6ca8faa 100644 (file)
@@ -1,13 +1,28 @@
+/*
+ * Copyright 2011, The gwtquery team.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
 package com.google.gwt.query.client.plugins.widgets;
 
 import com.google.gwt.dom.client.Element;
 import com.google.gwt.user.client.ui.Widget;
 
-public interface WidgetInitializer {
+public interface WidgetInitializer<W extends Widget> {
     /**
      * Initialize the newly created widget <code>w</code>. The element <code>e</code>
      * is the element used to construct the widget.
      *
      */
-    void initialize(Widget w, Element e);
+    void initialize(W w, Element e);
   }
index 31399b365dabfa7c9c775038515c1f9f79f6321f..d5ca9aac68a12f2019bcccf40cf13cb2855b3788 100644 (file)
@@ -1,3 +1,18 @@
+/*
+ * Copyright 2011, The gwtquery team.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
 package com.google.gwt.query.client.plugins.widgets;
 
 /**
diff --git a/gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/WidgetsHtmlPanel.java b/gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/widgets/WidgetsHtmlPanel.java
new file mode 100644 (file)
index 0000000..14a192b
--- /dev/null
@@ -0,0 +1,107 @@
+/*
+ * Copyright 2011, The gwtquery team.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
+package com.google.gwt.query.client.plugins.widgets;
+
+import static com.google.gwt.query.client.GQuery.$;
+
+import com.google.gwt.dom.client.Element;
+import com.google.gwt.query.client.GQuery;
+import com.google.gwt.user.client.DOM;
+import com.google.gwt.user.client.ui.GqUi;
+import com.google.gwt.user.client.ui.HTMLPanel;
+import com.google.gwt.user.client.ui.RootPanel;
+import com.google.gwt.user.client.ui.Widget;
+
+/**
+ * This {@link HTMLPanel} takes as content the outer html of an element already
+ * attached to the DOM. If {@link Widget widgets} are present in the children of
+ * the element to attach, they will be automatically adopted by the panel in
+ * order to keep a consistent widgets hierarchy.
+ * 
+ */
+public class WidgetsHtmlPanel extends HTMLPanel {
+
+  public WidgetsHtmlPanel(Element e) {
+    super("");
+    e.removeFromParent();
+    getElement().appendChild(e);
+    adoptSubWidgets();
+  }
+
+  /**
+   * Iterate over the children of this widget's element to find widget. If
+   * widgets are find adopt it automatically
+   */
+  protected void adoptSubWidgets() {
+    adoptSubWidgets(getElement());
+  }
+
+  /**
+   * Check if the {@link Element Element} <code>root</code> is attached to the
+   * widget. If it is the case, adopt the widget. If not, check if the chidren
+   * are linked to a widget to adopt them.
+   * 
+   */
+  protected void adoptSubWidgets(Element root) {
+
+    GQuery children = $(root).children();
+
+    for (Element child : children.elements()) {
+      Widget w = $(child).widget();
+      if (w != null) {
+        doAdopt(w);
+      } else {
+        adoptSubWidgets(child);
+      }
+    }
+  }
+
+  /**
+   * Adopt the {@link Widget widet} <code>w</code>. if the current parent of the
+   * widget is an {@link HTMLPanel} or is null, the widget will not detach
+   * physically in order to maintain the html structure. If the parent is an
+   * other widget, it will be physically detach and reattach to this panel.
+   * 
+   * @param w
+   */
+  protected void doAdopt(Widget w) {
+    Widget parent = w.getParent();
+    boolean mustBePhysicallyReattach = false;
+
+    if (parent == null) {
+      if (RootPanel.isInDetachList(w)) {
+        RootPanel.detachNow(w);
+      }
+
+    } else if (parent instanceof HTMLPanel) {
+      GqUi.doLogicalDetachFromHtmlPanel(w);
+
+    } else {
+      // the widget will be physically detach
+      w.removeFromParent();
+      mustBePhysicallyReattach = true;
+    }
+
+    getChildren().add(w);
+
+    if (mustBePhysicallyReattach) {
+      DOM.appendChild(getElement(), w.getElement());
+    }
+
+    adopt(w);
+
+  }
+}
index cd73f6a0ae7c1a47eae1f456967c4edb1f203429..d022f83897ef081d696be85e54fbf9f1c438b3c9 100644 (file)
@@ -1,3 +1,18 @@
+/*
+ * Copyright 2011, The gwtquery team.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
 package com.google.gwt.query.client.plugins.widgets;
 
 import com.google.gwt.dom.client.Element;
@@ -48,16 +63,21 @@ public class WidgetsUtils {
     }else{
       GQuery.$(oldElement).replaceWith(newElement);
   
+      //copy class
       String c = oldElement.getClassName();
       if (!c.isEmpty()) {
         newElement.addClassName(c);
       }
+      //copy id
+      newElement.setId(oldElement.getId());
+      //ensure no duplicate id
+      oldElement.setId("");
+      
     }
    }
    
    /**
     * Replace a dom element by a widget.
-    * If the widget implements Attachable the method attach will be called.
     * Old element classes will be copied to the new widget.
     */
    public static void replaceOrAppend(Element e, Widget widget)  {
@@ -66,4 +86,5 @@ public class WidgetsUtils {
      replaceOrAppend(e, widget.getElement());
      GqUi.attachWidget(widget);
    }
+  
 }
index be5699a692d5091377a88d7415521fe0cfb2ef88..834d2fb230d752ae236f0612520fb73d1aec866b 100644 (file)
+/*
+ * Copyright 2011, The gwtquery team.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
 package com.google.gwt.user.client.ui;
 
+import static com.google.gwt.query.client.GQuery.$;
+
 import com.google.gwt.dom.client.BodyElement;
 import com.google.gwt.dom.client.Document;
 import com.google.gwt.dom.client.Element;
 import com.google.gwt.user.client.Event;
 
+import java.util.Iterator;
 
 /**
- * GQuery Utility class to access protected methods in ui package. 
+ * GQuery Utility class to access protected methods in ui package.
  */
 public class GqUi {
-  
-  
+
   public static void attachWidget(Widget widget) {
+    if (widget != null && widget.getParent() == null) {
+
+      Widget parentWidget = getFirstParentWidget(widget);
+
+      if (parentWidget == null) {
+        RootPanel.detachOnWindowClose(widget);
+        widget.onAttach();
+      } else if (parentWidget instanceof HTMLPanel) {
+        ((HTMLPanel) parentWidget).add(widget,
+            widget.getElement().getParentElement());
+      } else {
+        throw new RuntimeException(
+            "No HTMLPanel available to attach the widget.");
+      }
+    }
+  }
+
+  public static void detachWidget(final Widget widget) {
     if (widget != null) {
-      
-      boolean hasParentWidget = false;
-      Element e = widget.getElement();
-      e = e.getParentElement();
-      BodyElement body = Document.get().getBody();
-      while ((e != null) && (body != e)) {
-        if (Event.getEventListener(e) != null) {
-          hasParentWidget = true;
-          break;
+      widget.removeFromParent();
+    }
+  }
+
+  private static Widget getFirstParentWidget(Widget w) {
+    Element e = w.getElement().getParentElement();
+    BodyElement body = Document.get().getBody();
+    while ((e != null) && (body != e)) {
+      if (Event.getEventListener(e) != null) {
+        Widget p = $(e).widget();
+        if (p != null){
+          return p;
         }
-        e = e.getParentElement();
-      }
-      
-      if (!hasParentWidget) {
-        RootPanel.detachOnWindowClose(widget);
       }
+      e = e.getParentElement();
+    }
+    return null;
+  }
+
+  /**
+   * This method detach a widget of its parent without do a physical detach (DOM
+   * manipulation)
+   * 
+   * @param w
+   */
+  public static void doLogicalDetachFromHtmlPanel(Widget w) {
+    Widget parent = w.getParent();
+    
+    if (parent instanceof HTMLPanel) {
+      ((HTMLPanel) parent).getChildren().remove(w);
+      w.setParent(null);
       
-      widget.onAttach();
+    } else{
+      throw new IllegalStateException(
+          "You can only use this method to detach a child from an HTMLPanel");
     }
+   
+
   }
   
-  public static void detachWidget(Widget widget){
-    if (widget != null) {
-      if (widget.isAttached()) {
-        widget.removeFromParent();
-      }
+  public static Iterator<Widget> getChildren(Widget w){
+    if(w instanceof Panel){
+      return ((Panel)w).iterator();
+    }
+    if(w instanceof Composite){
+      return getChildren(((Composite)w).getWidget());
     }
+    
+    return null;
   }
 }
index 10fa40c8be80291a8eaad6a7f28301c1c59055fa..70c4aac19a6fda4ddef85acdcf08646be43a760a 100644 (file)
@@ -19,53 +19,100 @@ import static com.google.gwt.query.client.GQuery.$;
 import static com.google.gwt.query.client.plugins.Widgets.Widgets;\r
 \r
 import com.google.gwt.core.client.EntryPoint;\r
+import com.google.gwt.core.client.GWT;\r
 import com.google.gwt.dom.client.Element;\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.plugins.widgets.WidgetInitializer;\r
 import com.google.gwt.query.client.plugins.widgets.ListBoxWidgetFactory.ListBoxOptions;\r
 import com.google.gwt.query.client.plugins.widgets.SuggestBoxWidgetFactory.SuggestBoxOptions;\r
+import com.google.gwt.query.client.plugins.widgets.TabPanelWidgetFactory.TabPanelOptions;\r
 import com.google.gwt.user.client.ui.Button;\r
+import com.google.gwt.user.client.ui.DisclosurePanel;\r
+import com.google.gwt.user.client.ui.GqUi;\r
 import com.google.gwt.user.client.ui.Label;\r
 import com.google.gwt.user.client.ui.PopupPanel;\r
+import com.google.gwt.user.client.ui.RootPanel;\r
+import com.google.gwt.user.client.ui.Tree;\r
+import com.google.gwt.user.client.ui.TreeItem;\r
 import com.google.gwt.user.client.ui.Widget;\r
 \r
+import java.util.Iterator;\r
+\r
 public class GwtQueryWidgetModule implements EntryPoint {\r
 \r
-  public void onModuleLoad() {\r
+  public static class MyButtonInitializer implements WidgetInitializer<Button> {\r
 \r
-    $(".inputText").as(Widgets).textBox();\r
-    $(".inputPsw").as(Widgets).passwordBox();\r
+    public void initialize(Button button, Element e) {\r
 \r
-    $(".btn").as(Widgets).button(new WidgetInitializer() {\r
+      final String tag = e.getTagName();\r
+      button.addClickHandler(new ClickHandler() {\r
 \r
-      public void initialize(Widget w, Element e) {\r
-        final String tag = e.getTagName();\r
-        Button button = (Button) w;\r
-        button.addClickHandler(new ClickHandler() {\r
+        public void onClick(ClickEvent event) {\r
+          Label l = new Label("You click on a GWT Button create from a " + tag);\r
+          PopupPanel panel = new PopupPanel(true, true);\r
+          panel.setGlassEnabled(true);\r
+          panel.add(l);\r
+          panel.center();\r
 \r
-          public void onClick(ClickEvent event) {\r
-            Label l = new Label("You click on a GWT Button create from a "+tag);\r
-            PopupPanel panel = new PopupPanel(true, true);\r
-            panel.setGlassEnabled(true);\r
-            panel.add(l);\r
-            panel.center();\r
+        }\r
+      });\r
 \r
-          }\r
-        });\r
+    }\r
+  }\r
 \r
-      }\r
+  public void onModuleLoad() {\r
 \r
-    });\r
-    \r
-    $("#tabs").as(Widgets).tabPanel();\r
-    $(".date").as(Widgets).datebox();\r
-    $(".editable").as(Widgets).richtext();  \r
     $("#disclosure").as(Widgets).disclosurePanel();\r
+\r
+    $(".inputText").as(Widgets).textBox();\r
+    $(".inputPsw").as(Widgets).passwordBox();\r
+    $(".textArea").as(Widgets).textArea();\r
+\r
+    $(".btn").as(Widgets).button(new MyButtonInitializer());\r
+\r
+    $("#tabs").as(Widgets).tabPanel(\r
+        new TabPanelOptions("div.tab", "h3.tabTitle"));\r
+    //$(".editable").as(Widgets).richtext().widget();\r
+\r
+    $(".date").as(Widgets).datebox();\r
+\r
     $(".list").as(Widgets).listBox();\r
     $("#multiSelect").as(Widgets).listBox(new ListBoxOptions(".item", true));\r
     $("#suggestBox1").as(Widgets).suggestBox(new SuggestBoxOptions("div"));\r
     $("#suggestBox2").as(Widgets).suggestBox(new SuggestBoxOptions("li"));\r
+    $(".stack").as(Widgets).stackPanel();\r
+\r
+    GWT.log("Found " + $(".btn").widgets().size() + " buttons widget");\r
+\r
+    displayWidgetHierarchy();\r
+  }\r
+\r
+  private void displayWidgetHierarchy() {\r
+    DisclosurePanel disclosurePanel = $("#disclosure").widget();\r
+    Tree widgetHierarchy = new Tree();\r
+    TreeItem rootItem = new TreeItem(disclosurePanel.getClass().getName());\r
+    widgetHierarchy.addItem(rootItem);\r
+    widgetHierarchy.setAnimationEnabled(true);\r
+    addChildren(rootItem, disclosurePanel);\r
+\r
+    RootPanel.get().add(new Label("Widgets hierarchy :"));\r
+    RootPanel.get().add(widgetHierarchy);\r
+  }\r
+\r
+  private void addChildren(TreeItem item, Widget w) {\r
+    Iterator<Widget> children = GqUi.getChildren(w);\r
+    if (children != null) {\r
+      while (children.hasNext()) {\r
+        Widget child = children.next();\r
+        TreeItem subItem = new TreeItem(child.getClass().getName());\r
+        item.addItem(subItem);\r
+\r
+        addChildren(subItem, child);\r
+\r
+      }\r
+    }\r
+\r
   }\r
 \r
 }\r
index 7d6b276dafa22b7647b9952ab2bb30ee2c965a68..1b15c3413893c4fb2a8c3834973da7fe7e0920a4 100644 (file)
@@ -2,7 +2,7 @@
 <head>\r
 <title>GQuery Demo</title>\r
 <script language="javascript"\r
-    src="gwtquery.samples.GwtQueryWidgets.nocache.js"></script>\r
+    src="gwtquery.samples.GwtQueryWidgets.nocache.js" ></script>\r
 <style type="text/css">\r
 .outer {\r
     margin: 5px;\r
 </head>\r
 <body>\r
 \r
-<div class="outer">\r
-<div class="btn">Make me a button 1!</div>\r
-<a class="btn">Make me a button 2!</a> <span class="btn">Make me\r
-a button 3!</span>\r
-<button class="btn">Make me a button 4!</button>\r
-<div class="btn">Make me a button 5!</div>\r
-<div class="btn">Make me a button 6!</div>\r
-\r
-</div>\r
-\r
-<input type="text" class="date" value="dd/MM/yyyy" />\r
-\r
-<div class="outer">\r
-<div class="inputText">I will be an Input</div>\r
-<span class="inputText">I will be an Input</span> <input\r
-    class="inputText" type="text"></input></div>\r
-\r
-<div class="outer">\r
-<div class="inputPsw">I will be an password input</div>\r
-<span class="inputPsw">I will be an password input</span> <input\r
-    class="inputPsw" type="password"></input></div>\r
-\r
-<div class="outer">\r
-<div id="tabs">\r
-<h3>First tab</h3>\r
-<div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut\r
-mollis dignissim mattis. In hac habitasse platea dictumst. Cras gravida\r
-pellentesque purus, ullamcorper euismod enim ornare ac. Suspendisse sed\r
-tortor diam. Cum sociis natoque penatibus et magnis dis parturient\r
-montes, nascetur ridiculus mus. Integer a cursus erat. Nam in molestie\r
-lacus. Nullam adipiscing fermentum magna vel sagittis. Pellentesque et\r
-nisi orci. Nunc volutpat ornare malesuada. Aliquam erat volutpat. Duis\r
-hendrerit adipiscing mauris, vitae tincidunt dui sodales eget. Nulla ac\r
-velit ac nunc dapibus volutpat eget vel eros. Maecenas tincidunt, turpis\r
-vel placerat imperdiet, metus elit mollis sapien, et egestas felis felis\r
-vitae metus.</div>\r
-\r
-<h3>Second tab</h3>\r
-<div>Pellentesque habitant morbi tristique senectus et netus et\r
-malesuada fames ac turpis egestas. Duis feugiat dapibus nunc, sit amet\r
-sodales dolor bibendum eget. Pellentesque ac libero et nibh ultrices\r
-vehicula. Morbi convallis auctor ultricies. Class aptent taciti sociosqu\r
-ad litora torquent per conubia nostra, per inceptos himenaeos. Aenean\r
-gravida eros at massa fringilla vestibulum. Sed justo dui, euismod et\r
-venenatis in, vehicula ut nisi. Sed sodales lorem vel est luctus vitae\r
-ornare erat pulvinar. Maecenas lacus sem, ultrices vitae tincidunt in,\r
-gravida eget quam. Vestibulum condimentum, augue nec consectetur\r
-egestas, mi sapien ullamcorper diam, sit amet molestie mauris odio at\r
-lacus.</div>\r
-\r
-<h3>Third tab</h3>\r
-<div class='editable'>Vestibulum turpis eros, tempor et hendrerit\r
-sit amet, hendrerit ut urna. Integer aliquam, neque non sollicitudin\r
-pulvinar, orci neque faucibus mauris, a molestie massa ligula vitae\r
-eros. Proin egestas, purus in pharetra aliquam, dolor odio faucibus\r
-lorem, ac egestas mi orci ac est. Maecenas pellentesque dui id felis\r
-tempus vestibulum. Vestibulum vitae nisi tortor. Etiam risus arcu,\r
-gravida quis pellentesque non, sodales at felis. Cras eros diam, pretium\r
-ut sollicitudin ut, vulputate a ipsum. Curabitur quis leo urna, in\r
-bibendum nibh. Ut viverra convallis purus vitae eleifend. Cras bibendum\r
-nulla a felis vestibulum consequat. Aliquam erat volutpat.</div>\r
-</div>\r
-</div>\r
-\r
 <div class="outer">\r
 <div id="disclosure">\r
-<h3>Show me</h3>\r
-Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut mollis\r
-dignissim mattis. In hac habitasse platea dictumst. Cras gravida\r
-pellentesque purus, ullamcorper euismod enim ornare ac. Suspendisse sed\r
-tortor diam. Cum sociis natoque penatibus et magnis dis parturient\r
-montes, nascetur ridiculus mus. Integer a cursus erat. Nam in molestie\r
-lacus. Nullam adipiscing fermentum magna vel sagittis. Pellentesque et\r
-nisi orci. Nunc volutpat ornare malesuada. Aliquam erat volutpat. Duis\r
-hendrerit adipiscing mauris, vitae tincidunt dui sodales eget. Nulla ac\r
-velit ac nunc dapibus volutpat eget vel eros. Maecenas tincidunt, turpis\r
-vel placerat imperdiet, metus elit mollis sapien, et egestas felis felis\r
-vitae metus.</div>\r
-\r
-</div>\r
-\r
-<div class="outer"><select class="list">\r
-    <option>option 11</option>\r
-    <option>option 12</option>\r
-    <option>option 13</option>\r
-    <option>option 14</option>\r
-</select>\r
-\r
-<ul class="list">\r
-    <li>option 21</li>\r
-    <li>option 22</li>\r
-    <li>option 23</li>\r
-    <li>option 23</li>\r
-</ul>\r
-\r
-<div class="list">\r
-<div>div 1</div>\r
-<div>div 2</div>\r
-<span>span 1</span> <span>span 1</span></div>\r
-\r
-<div id="multiSelect">\r
-<div>div 1</div>\r
-<div class="item">div 2</div>\r
-<span>span 1</span> <span class="item">span 1</span></div>\r
-</div>\r
-\r
-<div class="outer">\r
-<div  id="suggestBox1">\r
-    <div>suggestion a</div>\r
-    <div>suggestion b</div>\r
-    <div>suggestion c</div>\r
-    <div>suggestion d</div>\r
-    <div>suggestion e</div>\r
-    <div>suggestion f</div>\r
-    <div>suggestion g</div>\r
-    <div>suggestion h</div>\r
-    <div>suggestion i</div>\r
-    <div>suggestion j</div>\r
-    <div>suggestion k</div>\r
-    <div>suggestion l</div>\r
-    <div>suggestion m</div>\r
-    <div>suggestion n</div>\r
-    <div>suggestion o</div>\r
-    <div>suggestion p</div>\r
-    <div>suggestion q</div>\r
-    <div>suggestion r</div>\r
-    <div>suggestion s</div>\r
-    <div>suggestion t</div>\r
-    <div>suggestion u</div>\r
-    <div>suggestion v</div>\r
-    <div>suggestion w</div>\r
-    <div>suggestion x</div>\r
-    <div>suggestion y</div>\r
-    <div>suggestion z</div>\r
+<h3>Show the widgets</h3>\r
+<div>\r
+    <div id="tabs">\r
+    \r
+        <h3 class="tabTitle">Buttons</h3>\r
+        <div class="tab">\r
+            <div class="outer">\r
+                <div class="btn">Make me a button 1!</div>\r
+                <a class="btn">Make me a button 2!</a> \r
+                <span class="btn">Make me a button 3!</span>\r
+                <button class="btn">Make me a button 4!</button>\r
+                <div class="btn">Make me a button 5!</div>\r
+                <div class="btn">Make me a button 6!</div>\r
+            </div>\r
+        </div>\r
+    \r
+        <h3 class="tabTitle">Inputs</h3>\r
+        \r
+        <div class="tab">\r
+            <input type="text" class="date"\r
+                value="dd/MM/yyyy" />\r
+            \r
+            <div class="outer">\r
+                <div class="inputText">I will be a text input</div>\r
+                <span class="inputText">I will be a text input</span> \r
+                <input\r
+                    class="inputText" type="text" value="I will be a text input"></input>\r
+             </div>\r
+            \r
+            <div class="outer">\r
+                <div class="inputPsw">I will be an password input</div>\r
+                <span class="inputPsw">I will be an password input</span> \r
+                <input\r
+                    class="inputPsw" type="password" value="I will be an password input"></input>\r
+            </div>\r
+            <input type="text" class="date" value="dd/MM/yyyy" />\r
+            \r
+            <div class="outer">\r
+                <div class="textArea">I will be a text area</div>\r
+                <span class="textArea">I will be a text area</span> \r
+                <textarea class="textArea">I will be a text area</textarea>\r
+             </div>\r
+             \r
+             <div class="outer">\r
+                <div id="suggestBox1">\r
+                    <div>suggestion a</div>\r
+                    <div>suggestion b</div>\r
+                    <div>suggestion c</div>\r
+                    <div>suggestion d</div>\r
+                    <div>suggestion e</div>\r
+                    <div>suggestion f</div>\r
+                    <div>suggestion g</div>\r
+                    <div>suggestion h</div>\r
+                    <div>suggestion i</div>\r
+                    <div>suggestion j</div>\r
+                    <div>suggestion k</div>\r
+                    <div>suggestion l</div>\r
+                    <div>suggestion m</div>\r
+                    <div>suggestion n</div>\r
+                    <div>suggestion o</div>\r
+                    <div>suggestion p</div>\r
+                    <div>suggestion q</div>\r
+                    <div>suggestion r</div>\r
+                    <div>suggestion s</div>\r
+                    <div>suggestion t</div>\r
+                    <div>suggestion u</div>\r
+                    <div>suggestion v</div>\r
+                    <div>suggestion w</div>\r
+                    <div>suggestion x</div>\r
+                    <div>suggestion y</div>\r
+                    <div>suggestion z</div>\r
+                </div>\r
+\r
+                <ul id="suggestBox2">\r
+                    <li>suggestion a</li>\r
+                    <li>suggestion b</li>\r
+                    <li>suggestion c</li>\r
+                    <li>suggestion d</li>\r
+                    <li>suggestion e</li>\r
+                    <li>suggestion f</li>\r
+                    <li>suggestion g</li>\r
+                    <li>suggestion h</li>\r
+                    <li>suggestion i</li>\r
+                    <li>suggestion j</li>\r
+                    <li>suggestion k</li>\r
+                    <li>suggestion l</li>\r
+                    <li>suggestion m</li>\r
+                    <li>suggestion n</li>\r
+                    <li>suggestion o</li>\r
+                    <li>suggestion p</li>\r
+                    <li>suggestion q</li>\r
+                    <li>suggestion r</li>\r
+                    <li>suggestion s</li>\r
+                    <li>suggestion t</li>\r
+                    <li>suggestion u</li>\r
+                    <li>suggestion v</li>\r
+                    <li>suggestion w</li>\r
+                    <li>suggestion x</li>\r
+                    <li>suggestion y</li>\r
+                    <li>suggestion z</li>\r
+                </ul>\r
+        </div>\r
+            \r
+            \r
+        </div>\r
+    \r
+        <h3 class="tabTitle">Normal Tab</h3>\r
+        <div class="tab">Pellentesque habitant morbi tristique senectus et netus et\r
+        malesuada fames ac turpis egestas. Duis feugiat dapibus nunc, sit amet\r
+        sodales dolor bibendum eget. Pellentesque ac libero et nibh ultrices\r
+        vehicula. Morbi convallis auctor ultricies. Class aptent taciti sociosqu\r
+        ad litora torquent per conubia nostra, per inceptos himenaeos. Aenean\r
+        gravida eros at massa fringilla vestibulum. Sed justo dui, euismod et\r
+        venenatis in, vehicula ut nisi. Sed sodales lorem vel est luctus vitae\r
+        ornare erat pulvinar. Maecenas lacus sem, ultrices vitae tincidunt in,\r
+        gravida eget quam. Vestibulum condimentum, augue nec consectetur\r
+        egestas, mi sapien ullamcorper diam, sit amet molestie mauris odio at\r
+        lacus.</div>\r
+    \r
+        <h3 class="tabTitle">SelectBoxes</h3>\r
+        <div class="tab">\r
+            <div class="outer">\r
+                <select class="list">\r
+                    <option>option 11</option>\r
+                    <option>option 12</option>\r
+                    <option>option 13</option>\r
+                    <option>option 14</option>\r
+                </select>\r
+                \r
+                <ul class="list">\r
+                    <li>option 21</li>\r
+                    <li>option 22</li>\r
+                    <li>option 23</li>\r
+                    <li>option 23</li>\r
+                </ul>\r
+                \r
+                <div class="list">\r
+                    <div>div 1</div>\r
+                    <div>div 2</div>\r
+                    <span>span 1</span> \r
+                    <span>span 1</span>\r
+                </div>\r
+            \r
+                <div id="multiSelect">\r
+                    <div>div 1</div>\r
+                    <div class="item">div 2</div>\r
+                    <span>span 1</span> \r
+                    <span class="item">span 1</span>\r
+                </div>\r
+            </div>\r
+        </div>\r
+        \r
+        <h3 class="tabTitle">StackPanel</h3>\r
+        <div class="tab">\r
+            <div class="stack">\r
+                <h3>header 1</h3>\r
+                <div> content 1</div>\r
+                \r
+                <h3>header 2</h3>\r
+                <div> content 2</div>\r
+                \r
+                <h3>header 3</h3>\r
+                <div> content 3</div>\r
+            </div>\r
+        </div>\r
+    </div>      \r
+ </div>\r
 </div>\r
-\r
-<ul id="suggestBox2">\r
-    <li>suggestion a</li>\r
-    <li>suggestion b</li>\r
-    <li>suggestion c</li>\r
-    <li>suggestion d</li>\r
-    <li>suggestion e</li>\r
-    <li>suggestion f</li>\r
-    <li>suggestion g</li>\r
-    <li>suggestion h</li>\r
-    <li>suggestion i</li>\r
-    <li>suggestion j</li>\r
-    <li>suggestion k</li>\r
-    <li>suggestion l</li>\r
-    <li>suggestion m</li>\r
-    <li>suggestion n</li>\r
-    <li>suggestion o</li>\r
-    <li>suggestion p</li>\r
-    <li>suggestion q</li>\r
-    <li>suggestion r</li>\r
-    <li>suggestion s</li>\r
-    <li>suggestion t</li>\r
-    <li>suggestion u</li>\r
-    <li>suggestion v</li>\r
-    <li>suggestion w</li>\r
-    <li>suggestion x</li>\r
-    <li>suggestion y</li>\r
-    <li>suggestion z</li>\r
-</ul>\r
 </div>\r
 \r
-<ul>\r
-<li class="btn">Append a button here</li>\r
-<li class="inputText">Append a textbox here</li>\r
-<li class="list"><div>item1</div><div>item2</div></li>\r
-</ul>\r
+</body>\r
 </html>\r