From 41706606b271c9f4c9bd27c4a6ef172d808f25c3 Mon Sep 17 00:00:00 2001
From: Marc Englund <marc.englund@itmill.com>
Date: Fri, 18 Jan 2008 08:57:52 +0000
Subject: [PATCH] ApplicationConnection publishes javascript function
 itmill.forceSync(). FeatureBrowser contains example.

svn changeset:3577/svn branch:trunk
---
 .../demo/featurebrowser/FeatureBrowser.java   |  4 +
 .../featurebrowser/JavaScriptAPIExample.java  | 94 +++++++++++++++++++
 .../gwt/client/ApplicationConnection.java     | 17 ++++
 3 files changed, 115 insertions(+)
 create mode 100644 src/com/itmill/toolkit/demo/featurebrowser/JavaScriptAPIExample.java

diff --git a/src/com/itmill/toolkit/demo/featurebrowser/FeatureBrowser.java b/src/com/itmill/toolkit/demo/featurebrowser/FeatureBrowser.java
index 983aa9dd23..c1989d597a 100644
--- a/src/com/itmill/toolkit/demo/featurebrowser/FeatureBrowser.java
+++ b/src/com/itmill/toolkit/demo/featurebrowser/FeatureBrowser.java
@@ -99,6 +99,10 @@ public class FeatureBrowser extends com.itmill.toolkit.Application implements
                     EmbeddedBrowserExample.class },
             // Windowing
             { "Misc", "Windowing", "About windowing", WindowingExample.class },
+            // JavaScript API
+            { "Misc", "JavaScript API",
+                    "JavaScript to IT Mill Toolkit communication",
+                    JavaScriptAPIExample.class },
     // END
     };
 
diff --git a/src/com/itmill/toolkit/demo/featurebrowser/JavaScriptAPIExample.java b/src/com/itmill/toolkit/demo/featurebrowser/JavaScriptAPIExample.java
new file mode 100644
index 0000000000..032d9aaf4c
--- /dev/null
+++ b/src/com/itmill/toolkit/demo/featurebrowser/JavaScriptAPIExample.java
@@ -0,0 +1,94 @@
+/* 
+@ITMillApache2LicenseForJavaFiles@
+ */
+
+package com.itmill.toolkit.demo.featurebrowser;
+
+import java.util.Date;
+
+import com.itmill.toolkit.terminal.PaintException;
+import com.itmill.toolkit.terminal.PaintTarget;
+import com.itmill.toolkit.ui.Button;
+import com.itmill.toolkit.ui.CustomComponent;
+import com.itmill.toolkit.ui.Label;
+import com.itmill.toolkit.ui.OrderedLayout;
+import com.itmill.toolkit.ui.RichTextArea;
+import com.itmill.toolkit.ui.Button.ClickEvent;
+
+/**
+ * An example using a RichTextArea to edit a Label in XHTML-mode.
+ * 
+ */
+public class JavaScriptAPIExample extends CustomComponent {
+
+    public static final String txt = "<A href=\"javascript:itmill.forceSync();\">javascript:itmill.forceSync();</A>";
+
+    private final OrderedLayout main;
+    private final Label l;
+    private final RichTextArea editor = new RichTextArea();
+
+    public JavaScriptAPIExample() {
+        // main layout
+        main = new OrderedLayout();
+        main.setMargin(true);
+        setCompositionRoot(main);
+        // Add the label
+        l = new Label(txt);
+        l.setContentMode(Label.CONTENT_XHTML);
+        main.addComponent(l);
+        // Edit button with inline click-listener
+        Button b = new Button("Edit", new Button.ClickListener() {
+            public void buttonClick(ClickEvent event) {
+                // swap Label <-> RichTextArea
+                if (main.getComponentIterator().next() == l) {
+                    editor.setValue(l.getValue());
+                    main.replaceComponent(l, editor);
+                    event.getButton().setCaption("Save");
+                } else {
+                    l.setValue(editor.getValue());
+                    main.replaceComponent(editor, l);
+                    event.getButton().setCaption("Edit");
+                }
+            }
+        });
+        main.addComponent(b);
+        main.setComponentAlignment(b, OrderedLayout.ALIGNMENT_RIGHT,
+                OrderedLayout.ALIGNMENT_VERTICAL_CENTER);
+
+        // 
+        Label l = new Label(
+                "This label will update it's value AFTER it's rendered to the client. "
+                        + "The client will be synchronized on reload, when you click a button, "
+                        + "or when itmill.forceSync() is called.") {
+
+            public void paintContent(PaintTarget target) throws PaintException {
+
+                super.paintContent(target);
+                Delay d = new Delay(this);
+                d.start();
+            }
+
+        };
+        main.addComponent(l);
+
+    }
+
+    private class Delay extends Thread {
+        Label label;
+
+        public Delay(Label l) {
+            label = l;
+        }
+
+        public void run() {
+            try {
+                Thread.sleep(500);
+                label.setValue(new Date().toString());
+                join();
+            } catch (Exception e) {
+                e.printStackTrace();
+            }
+        }
+
+    }
+}
diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ApplicationConnection.java b/src/com/itmill/toolkit/terminal/gwt/client/ApplicationConnection.java
index d6a7c3a36f..1c016d560a 100755
--- a/src/com/itmill/toolkit/terminal/gwt/client/ApplicationConnection.java
+++ b/src/com/itmill/toolkit/terminal/gwt/client/ApplicationConnection.java
@@ -89,6 +89,8 @@ public class ApplicationConnection {
             initializeTestingTools(getTestServerUri(), this);
         }
 
+        initializeClientHooks();
+
         makeUidlRequest("repaintAll=1");
         applicationRunning = true;
 
@@ -136,6 +138,21 @@ public class ApplicationConnection {
          $wnd.itmill.startTT(testServerUri, client);
     }-*/;
 
+    /**
+     * Publishes functions for use from javascript.
+     * <ul>
+     * <li><code>itmill.forceSync()</code> sends pending variable changes, in
+     * effect synchronizing the server and client state.</li>
+     * </ul>
+     */
+    private native void initializeClientHooks()
+    /*-{
+        var app = this;
+        $wnd.itmill.forceSync = function() {
+            app.@com.itmill.toolkit.terminal.gwt.client.ApplicationConnection::sendPendingVariableChanges()();
+        }
+    }-*/;
+
     public static Console getConsole() {
         return console;
     }
-- 
2.39.5