Add interaction gadget example.

Follow same conventions for gadgets' root file.

Add interaction gadget example.
Follow same conventions for gadgets' root file.
cd5ab325 · Ivan Tyagov · 8e35bd3c · cd5ab325 · cd5ab325 · cd5ab325
Commit cd5ab325 authored Aug 28, 2012 by Ivan Tyagov
5 changed files
--- a/OfficeJS/src/renderjs/examples/hello_world/hello_world.html
+++ b/OfficeJS/src/renderjs/examples/hello_world/hello_world.html
--- a/OfficeJS/src/renderjs/examples/interactions/A.html
+++ b/OfficeJS/src/renderjs/examples/interactions/A.html
+<div>
+  A (gadget)
+  <button onclick="RenderJs.GadgetIndex.getGadgetById('A').jsCall1()">A.jsCall1 -> C.jsCall1</button>
+  <button onclick="$('#A').trigger('htmlEvent1')">HTML event 1</button>
+  <button onclick="$('#A').trigger('htmlEvent2')">HTML event 2</button>
+  <p id="hide" style="display:none;"> hidden text on myownHTMlEvent1</p>
+</div>
+
+<script type="text/javascript" language="javascript">
+  //<![CDATA[
+     $(document).ready(function() {
+         gadget = RenderJs.GadgetIndex.getGadgetById("A");
+         gadget.jsCall1 = function (){alert("A.jscall1");};
+         gadget.jsCall2 = function (){alert("A.jscall2");};
+         gadget.myOwnHtmlEvent1 = function (){
+           $("#hide").toggle();
+           alert("A.myOwnHtmlEvent1");
+         };
+     });
+  //]]>
+</script>
\ No newline at end of file
--- a/OfficeJS/src/renderjs/examples/interactions/B.html
+++ b/OfficeJS/src/renderjs/examples/interactions/B.html
+<div>
+  B (gadget)
+  <button onclick="RenderJs.GadgetIndex.getGadgetById('B').jsCall2();">B.jsCall2 -> A.jsCall2</button>
+</div>
+
+<script type="text/javascript" language="javascript">
+  //<![CDATA[
+    $(document).ready(function() {
+        gadget = RenderJs.GadgetIndex.getGadgetById("B");
+        gadget.jsCall1 = function (){alert("B.jscall1");};
+        gadget.jsCall2 = function (){alert("B.jscall2");};
+        gadget.htmlEvent1 = function (){alert("B.htmlEvent1");};
+        gadget.htmlEvent2 = function (){alert("B.htmlEvent2");};
+    });
+  //]]>
+</script>
\ No newline at end of file
--- a/OfficeJS/src/renderjs/examples/interactions/index.html
+++ b/OfficeJS/src/renderjs/examples/interactions/index.html
+<html>
+  <head>
+    <script src="../../../../lib/jquery/jquery.js"> </script>
+    <script src="../../../../lib/jstorage/jstorage.js"> </script>
+    <script type="text/javascript" src="../../renderjs.js"></script>
+  <head>
+  <body>
+
+    <div id="A"
+         data-gadget="A.html"
+         data-gadget:property="{&quot;cacheable&quot;: &quot;1&quot;, &quot;cache_id&quot;: &quot;A&quot;}"></div>
+
+    <div id="B"
+         data-gadget="B.html"
+         data-gadget:property="{&quot;cacheable&quot;: &quot;1&quot;, &quot;cache_id&quot;: &quot;B&quot;}"></div>
+
+    <div data-gadget=""
+         id="main-interactor">
+
+      <connect source="A.jsCall1"
+               destination="B.jsCall1"></connect>
+      <connect source="A.htmlEvent1"
+               destination="B.htmlEvent1"></connect>
+      <connect source="A.htmlEvent1"
+               destination="A.myOwnHtmlEvent1"></connect>
+      <connect source="A.htmlEvent2"
+               destination="B.htmlEvent2"></connect>
+      <connect source="B.jsCall2"
+               destination="A.jsCall2"></connect>
+
+    </div>
+
+    <script type="text/javascript" language="javascript">
+      //<![CDATA[
+        $(document).ready(function() {
+        // XXX: using setTimeout is ugly, see non working example below to be fixed
+        window.setTimeout(function () {
+             RenderJs.InteractionGadget.bind($("#main-interactor"));}, 1000);
+//           RenderJs.GadgetIndex.getRootGadget().getDom().bind("ready", function () {
+//             RenderJs.InteractionGadget.bind($("#main-interactor"));});
+
+          });
+
+      //]]>
+    </script>
+
+  </body>
+</html>
+
+
+
--- a/OfficeJS/src/renderjs/test/renderjs_test.js
+++ b/OfficeJS/src/renderjs/test/renderjs_test.js
@@ -44,5 +44,7 @@ function setupRenderJSTest(){
               equal(RenderJs.GadgetIndex.getGadgetList().length, 1);
   });

+   // XXX: test InteractionGadget
+
 };