Updated Asterix SDK + Easy XDM
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/blank.html b/asterix-examples/src/main/resources/js/easyXDM/example/blank.html
new file mode 100644
index 0000000..33b64d6
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/blank.html
@@ -0,0 +1,10 @@
+<!doctype html>
+<html>
+ <head>
+ <title>Blank page</title>
+ </head>
+ <body>
+ This page will be replaced with the actuall content in just a jiffy..
+ </body>
+</html>
+
\ No newline at end of file
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/bookmark.html b/asterix-examples/src/main/resources/js/easyXDM/example/bookmark.html
new file mode 100644
index 0000000..2da7a2c
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/bookmark.html
@@ -0,0 +1,50 @@
+<!doctype html>
+<html>
+ <head>
+ <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
+ <title></title>
+ </head>
+ <body>
+ <img src="../tests/s.gif" />
+ <script type="text/javascript">
+ if (location.host.indexOf("easyxdm.net") !== -1) {
+ var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
+ document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
+ }
+ </script>
+ <script type="text/javascript">
+ if (location.host.indexOf("easyxdm.net") !== -1) {
+ try {
+ var pageTracker = _gat._getTracker("UA-9535591-3");
+ pageTracker._setDomainName(".easyxdm.net");
+ pageTracker._trackPageview();
+ }
+ catch (err) {
+ }
+ }
+ </script>
+ <a id="bookmark" src="">Bookmark</a>
+ <script type="text/javascript">
+ var baseUrl = location.href.substring(0, location.href.lastIndexOf("/"));
+
+ // to simplify development, we create the bookmarklet as a regular function
+ function bookmark(){
+ if (typeof myBookmark === "undefined") {
+ var script = document.createElement("script");
+ script.type = "text/javascript";
+ script.src = baseUrl + "/bookmark.js";
+ document.getElementsByTagName("head")[0].appendChild(script);
+ }
+ else {
+ myBookmark.run();
+ }
+ }
+
+ // and then we include it using .toString().
+ document.getElementById("bookmark").href = 'javascript:(' +
+ (bookmark.toString().replace('baseUrl + "', '"' + baseUrl)).replace(/\s+/g, " ") +
+ ')();';
+ // when finished, you just copy the url from the rendered page
+ </script>
+ </body>
+</html>
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/bookmark.js b/asterix-examples/src/main/resources/js/easyXDM/example/bookmark.js
new file mode 100644
index 0000000..7f0d0ff
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/bookmark.js
@@ -0,0 +1,74 @@
+var myBookmark = (function(){
+ var s1, s2, isLoaded = false, xhr, head = document.getElementsByTagName('head')[0];
+ var scripts = document.getElementsByTagName("script");
+ var REMOTE = (function(){
+ var remote = location.href;
+ switch (location.host) {
+ case "provider.easyxdm.net":
+ location.href = remote.replace("provider", "consumer");
+ break;
+ case "xdm1":
+ remote = remote.replace("xdm1", "xdm2");
+ break;
+ default:
+ remote = "http://provider.easyxdm.net/current/example/";
+ }
+ return remote.substring(0, remote.lastIndexOf("/"));
+ }());
+
+ function run(){
+ if (typeof xhr === "undefined") {
+ return;
+ }
+ xhr.post("example/glossary.php", {
+ param1: "a",
+ param2: "b"
+ }, function(json){
+ alert(json.glossary.title);
+ });
+ }
+
+ function scriptOnLoad(){
+ if (isLoaded || typeof easyXDM === "undefined" || typeof JSON === "undefined") {
+ return;
+ }
+ isLoaded = true;
+ xhr = new easyXDM.Rpc({
+ remote: REMOTE + "/../xhr.html",
+ onReady: function(){
+ run();
+ }
+ }, {
+ remote: {
+ post: {}
+ }
+ });
+
+ }
+ s1 = document.createElement("script");
+ s1.type = "text/javascript";
+ s1.src = REMOTE + "/../easyXDM.debug.js";
+ s1.onreadystatechange = function(){
+ if (this.readyState === "complete" || this.readyState === "loaded") {
+ scriptOnLoad();
+ }
+ };
+ s1.onload = scriptOnLoad;
+ head.appendChild(s1);
+
+ if (typeof JSON === "undefined" || !JSON) {
+ s2 = document.createElement("script");
+ s2.type = "text/javascript";
+ s2.src = REMOTE + "/../json2.js";
+ s2.onreadystatechange = function(){
+ if (this.readyState === "complete" || this.readyState === "loaded") {
+ scriptOnLoad();
+ }
+ };
+ s2.onload = scriptOnLoad;
+ head.appendChild(s2);
+ }
+ return {
+ run: run
+ };
+})();
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/bridge.html b/asterix-examples/src/main/resources/js/easyXDM/example/bridge.html
new file mode 100644
index 0000000..af840e8
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/bridge.html
@@ -0,0 +1,135 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM</title>
+ <script type="text/javascript" src="../easyXDM.debug.js">
+ </script>
+ <script type="text/javascript">
+ /**
+ * Request the use of the JSON object
+ */
+ easyXDM.DomHelper.requiresJSON("../json2.js");
+ </script>
+ <script type="text/javascript">
+ /* Here we demo how to have two visible web applications communicate together.
+ * This is done by having the remote interface open a visible window and loading
+ * the application in this.
+ * Since the remote interface has access to the entire DOM (including javascript)
+ * of the opened window, the remote interface is able to interface freely with the
+ * remote web application and can serve as a bridge between the two applications.
+ */
+ var REMOTE = (function(){
+ var remote = location.href;
+ switch (location.host) {
+ case "provider.easyxdm.net":
+ location.href = remote.replace("provider", "consumer");
+ break;
+ case "easyxdm.net":
+ remote = remote.replace("easyxdm.net", "consumer.easyxdm.net");
+ break;
+ case "consumer.easyxdm.net":
+ remote = remote.replace("consumer", "provider");
+ break;
+ case "xdm1":
+ remote = remote.replace("xdm1", "xdm2");
+ break;
+ }
+ return remote.substring(0, remote.lastIndexOf("/"));
+ }());
+
+
+
+
+ var proxy, win;
+ function openPopup(){
+ if (win) {
+ // this allows to open new windows if the popup was closed
+ if (win.closed) {
+ win = window.open(REMOTE + '/blank.html', 'mainapp', "width=400, height=400");
+ proxy.open("mainapp");
+ }
+ return;
+ }
+ // open up the popup
+ win = window.open(REMOTE + '/blank.html', 'mainapp', "width=400, height=400");
+
+ document.getElementById("btn").disabled = "";
+
+ proxy = new easyXDM.Rpc(/** The configuration */{
+ /**
+ * Register the url to name.html, this must be an absolute path
+ * or a path relative to the root.
+ * @field
+ */
+ local: "../name.html",
+ swf: REMOTE + "/../easyxdm.swf",
+ /**
+ * Register the url to the remote interface
+ * @field
+ */
+ remote: REMOTE + "/remote.html",
+ remoteHelper: REMOTE + "/../name.html"
+ }, {
+ remote: {
+ open: {},
+ postMessage: {}
+ },
+ local: {
+ /**
+ * Register the method that should handle incoming data
+ * @param {Object} data
+ * @param {String} origin
+ */
+ postMessage: function(data){
+ var div = document.createElement("div");
+ div.innerHTML = "data from '" + proxy.origin + "'";
+ document.body.appendChild(div);
+ for (var key in data) {
+ if (data.hasOwnProperty(key)) {
+ div = document.createElement("div");
+ div.innerHTML = key + "=" + data[key];
+ document.body.appendChild(div);
+ }
+ }
+ }
+ }
+ });
+
+ // lets tell the proxy to open up the window as soon as possible
+ proxy.open("mainapp");
+ }
+ </script>
+ </head>
+ <body>
+ <div style="border:1px solid black;padding:3px;margin:10px;">
+ <a href="index.html">Index of examples</a>
+ | <a href="http://github.com/oyvindkinsey/easyXDM/#readme">Readme at github</a>
+ |
+ | <a href="http://easyxdm.net/">easyXDM.net</a>
+ | <a href="http://groups.google.com/group/easyxdm">easyXDM at Google Groups</a>
+ <br/>
+ The examples are executing slower than the production build due to the extensive tracing.
+ <br/>
+ If you are alerted about a popup, then this is only the trace log feature. You can ignore this.
+ </div>
+ <!-- easyXDM.Debug.trace(msg) will output its messages to any element with the id "log" -->
+ <div id="log" style="height:100px;border:1px dotted black;overflow:auto">
+ </div>
+ <input id="btnOpen" type="button" onclick="openPopup();" value="Open popup"/><!-- Send som data to the other side --><input id="btn" disabled="disabled" type="button" onclick="proxy.postMessage({a:'b',c:'d',e:'f'});" value="send data to remote"/>
+ <script type="text/javascript">
+ var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
+ document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
+ </script>
+ <script type="text/javascript">
+ if (location.host.indexOf("easyxdm.net") !== -1) {
+ try {
+ var pageTracker = _gat._getTracker("UA-9535591-3");
+ pageTracker._setDomainName(".easyxdm.net");
+ pageTracker._trackPageview();
+ }
+ catch (err) {
+ }
+ }
+ </script>
+ </body>
+</html>
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/data.html b/asterix-examples/src/main/resources/js/easyXDM/example/data.html
new file mode 100644
index 0000000..47eaeed
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/data.html
@@ -0,0 +1,133 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM</title>
+ <script type="text/javascript" src="../easyXDM.debug.js">
+ </script>
+ <script type="text/javascript">
+ var serializer = {
+ /**
+ * Serializes a hashtable and returns it as a string
+ * @param {Object} data The data to serialize
+ * @returns The serialized string
+ * @type {String}
+ */
+ stringify: function(data){
+ var message = "";
+ for (var key in data) {
+ if (data.hasOwnProperty(key)) {
+ message += key + "=" + escape(data[key]) + "&";
+ }
+ }
+ return message.substring(0, message.length - 1);
+ },
+ /**
+ * Deserializes a string and returns a hashtable
+ * @param {String} message The string to deserialize
+ * @returns An hashtable populated with key-value pairs
+ * @type {Object}
+ */
+ parse: function(message){
+ var data = {};
+ var d = message.split("&");
+ var pair, key, value;
+ for (var i = 0, len = d.length; i < len; i++) {
+ pair = d[i];
+ key = pair.substring(0, pair.indexOf("="));
+ value = pair.substring(key.length + 1);
+ data[key] = unescape(value);
+ }
+ return data;
+ }
+ };
+
+ var channel;
+ var REMOTE = (function(){
+ var remote = location.href;
+ switch (location.host) {
+ case "provider.easyxdm.net":
+ location.href = remote.replace("provider", "consumer");
+ break;
+ case "easyxdm.net":
+ remote = remote.replace("easyxdm.net", "consumer.easyxdm.net");
+ break;
+ case "consumer.easyxdm.net":
+ remote = remote.replace("consumer", "provider");
+ break;
+ case "xdm1":
+ remote = remote.replace("xdm1", "xdm2");
+ break;
+ }
+ return remote.substring(0, remote.lastIndexOf("/"));
+ }());
+ window.onload = function(){
+ /**
+ * When the window is finished loading start setting up the channel
+ */
+ channel = new easyXDM.Socket(/** The configuration */{
+ /**
+ * Register the url to hash.html, this must be an absolute path
+ * or a path relative to the root.
+ * @field
+ */
+ local: "../name.html",
+ swf: REMOTE + "/../easyxdm.swf",
+ /**
+ * Register the url to the remote interface
+ * @field
+ */
+ remote: REMOTE + "/remotedata.html",
+ remoteHelper: REMOTE + "/../name.html",
+ onReady: function(){
+ /**
+ * Send some data to the other side
+ */
+ channel.postMessage(serializer.stringify({
+ propA: "abc",
+ propB: "def",
+ propC: 44
+ }));
+ }
+ });
+ };
+ </script>
+ </head>
+ <body>
+ <div style="border:1px solid black;padding:3px;margin:10px;">
+ <a href="index.html">Index of examples</a>
+ | <a href="http://github.com/oyvindkinsey/easyXDM/#readme">Readme at github</a>
+ |
+ | <a href="http://easyxdm.net/">easyXDM.net</a>
+ | <a href="http://groups.google.com/group/easyxdm">easyXDM at Google Groups</a>
+ <br/>
+ The examples are executing slower than the production build due to the extensive tracing.
+ <br/>
+ If you are alerted about a popup, then this is only the trace log feature. You can ignore this.
+ </div>
+ <!-- easyXDM.Debug.trace(msg) will output its messages to any element with the id "log" -->
+ <div id="log" style="height:100px;border:1px dotted black;overflow:auto">
+ </div>
+ </div>
+ <br/>
+ <br/>
+ <input type="text" id="code" size="100" value="channel.postMessage(serializer.stringify({propC:'c',procD:'d',propE:88}))"/>
+ <button onclick="eval(document.getElementById('code').value);">
+ eval code
+ </button>
+ <script type="text/javascript">
+ var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
+ document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
+ </script>
+ <script type="text/javascript">
+ if (location.host.indexOf("easyxdm.net") !== -1) {
+ try {
+ var pageTracker = _gat._getTracker("UA-9535591-3");
+ pageTracker._setDomainName(".easyxdm.net");
+ pageTracker._trackPageview();
+ }
+ catch (err) {
+ }
+ }
+ </script>
+</body>
+</html>
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/glossary.aspx b/asterix-examples/src/main/resources/js/easyXDM/example/glossary.aspx
new file mode 100644
index 0000000..c815101
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/glossary.aspx
@@ -0,0 +1,29 @@
+<%
+ Response.ContentType = "application/json"
+ Response.AddHeader("x-foo", "bar")
+ Response.AddHeader("Access-Control-Allow-Origin", "http://xdm4")
+ Response.AddHeader("Access-Control-Allow-Methods", "POST")
+
+%>
+{
+ "glossary": {
+ "title": "example glossary",
+ "GlossDiv": {
+ "title": "S",
+ "GlossList": {
+ "GlossEntry": {
+ "ID": "SGML",
+ "SortAs": "SGML",
+ "GlossTerm": "Standard Generalized Markup Language",
+ "Acronym": "SGML",
+ "Abbrev": "ISO 8879:1986",
+ "GlossDef": {
+ "para": "A meta-markup language, used to create markup languages such as DocBook.",
+ "GlossSeeAlso": ["GML", "XML"]
+ },
+ "GlossSee": "markup"
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/index.html b/asterix-examples/src/main/resources/js/easyXDM/example/index.html
new file mode 100644
index 0000000..3690577
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/index.html
@@ -0,0 +1,75 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM</title>
+ </head>
+ <body>
+ <div style="border:1px solid black;padding:3px;margin:10px;">
+ <a href="http://github.com/oyvindkinsey/easyXDM/#readme">Readme at github</a>
+ |
+ | <a href="http://easyxdm.net/">easyXDM.net</a>
+ | <a href="http://groups.google.com/group/easyxdm">easyXDM at Google Groups</a>
+ <br/>
+ The examples are executing slower than the production build due to the extensive tracing.
+ <br/>
+ If you are alerted about a popup, then this is only the trace log feature. You can ignore this.
+ </div>
+ <ul>
+ <li>
+ <a href="transport.html">Transport</a>
+ <br/>
+ Example of passing a string message from one domain to another using the Socket.
+ </li>
+ <li>
+ <a href="data.html">Data</a>
+ <br/>
+ Example of passing data using a Socket and a custom serializer/deserializer.
+ </li>
+ <li>
+ <a href="methods.html">Methods</a>
+ <br/>
+ Example of using the Rpc object for executing Remote Procedure Calls with arguments and having results returned.
+ </li>
+ <li>
+ <a href="resize_iframe.html">Resize iframe</a>
+ <br/>
+ Example on how to use easyXDM to automatically resize an iframe. This uses an intermediate frame to enable navigation of the contained document
+ </li>
+ <li>
+ <a href="upload.html">Upload</a>
+ <br/>
+ Example on how to facilitate 'cross domain AJAX upload'.
+ </li>
+ <li>
+ <a href="widgets.html">Widgets</a>
+ <br/>
+ Example on how to use easyXDM to build a framework for widgets using a pub/sub schema.
+ </li>
+ <li>
+ <a href="xhr.html">XHR</a>
+ <br/>
+ Example of using the shipped /cors/ endpoint to retrieve resources across the domain boundary.
+ </li>
+ <li>
+ <a href="bridge.html">Bridge</a>
+ <br/>
+ Experimental example of how to 'bridge' two web apps together.
+ </li>
+ </ul>
+ <script type="text/javascript">
+ var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
+ document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
+ </script>
+ <script type="text/javascript">
+ if (location.host.indexOf("easyxdm.net") !== -1) {
+ try {
+ var pageTracker = _gat._getTracker("UA-9535591-3");
+ pageTracker._setDomainName(".easyxdm.net");
+ pageTracker._trackPageview();
+ }
+ catch (err) {
+ }
+ }
+ </script>
+ </body>
+</html>
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/methods.html b/asterix-examples/src/main/resources/js/easyXDM/example/methods.html
new file mode 100644
index 0000000..9bbd15a
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/methods.html
@@ -0,0 +1,148 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM</title>
+ <script type="text/javascript" src="../easyXDM.debug.js">
+ </script>
+ <script type="text/javascript">
+ /**
+ * Request the use of the JSON object
+ */
+ easyXDM.DomHelper.requiresJSON("../json2.js");
+ </script>
+ <script type="text/javascript">
+ var REMOTE = (function(){
+ var remote = location.href;
+ switch (location.host) {
+ case "provider.easyxdm.net":
+ location.href = remote.replace("provider", "consumer");
+ break;
+ case "easyxdm.net":
+ remote = remote.replace("easyxdm.net", "consumer.easyxdm.net");
+ break;
+ case "consumer.easyxdm.net":
+ remote = remote.replace("consumer", "provider");
+ break;
+ case "xdm1":
+ remote = remote.replace("xdm1", "xdm2");
+ break;
+ }
+ return remote.substring(0, remote.lastIndexOf("/"));
+ }());
+ var remote = new easyXDM.Rpc(/** The channel configuration */{
+ /**
+ * Register the url to hash.html, this must be an absolute path
+ * or a path relative to the root.
+ * @field
+ */
+ local: "../name.html",
+ swf: REMOTE + "/../easyxdm.swf",
+ /**
+ * Register the url to the remote interface
+ * @field
+ */
+ remote: REMOTE + "/remotemethods.html",
+ remoteHelper: REMOTE + "/../name.html",
+ /**
+ * Register the DOMElement that the generated IFrame should be inserted into
+ */
+ container: "embedded",
+ props: {
+ style: {
+ border: "2px dotted red",
+ height: "200px"
+ }
+ },
+ onReady: function(){
+ /**
+ * Call a method on the other side
+ */
+ remote.noOp();
+ }
+ }, /** The interface configuration */ {
+ remote: {
+ addNumbers: {},
+ multiplyNumbers: {},
+ noOp: {}
+ },
+ local: {
+ alertMessage: function(msg){
+ alert(msg);
+ }
+ }
+ });
+
+ function add(a, b){
+ remote.addNumbers(a, b, function(result){
+ alert(a + " + " + b + " = " + result);
+ });
+ }
+
+ function multiply(a, b){
+ remote.multiplyNumbers(a, b, function(result){
+ alert(a + " x " + b + " = " + result);
+ });
+ }
+ </script>
+ <style type="text/css">
+
+ #embedded iframe {
+ width: 100%;
+ height: 100%;
+ }
+ </style>
+ </head>
+ <body>
+ <div style="border:1px solid black;padding:3px;margin:10px;">
+ <a href="index.html">Index of examples</a>
+ | <a href="http://github.com/oyvindkinsey/easyXDM/#readme">Readme at github</a>
+ |
+ | <a href="http://easyxdm.net/">easyXDM.net</a>
+ | <a href="http://groups.google.com/group/easyxdm">easyXDM at Google Groups</a>
+ <br/>
+ The examples are executing slower than the production build due to the extensive tracing.
+ <br/>
+ If you are alerted about a popup, then this is only the trace log feature. You can ignore this.
+ </div>
+ <script type="text/javascript">
+ document.write("Domain: " + location.host);
+ </script>
+ <!-- easyXDM.Debug.trace(msg) will output its messages to any element with the id "log" -->
+ <div id="log" style="height:100px;border:1px dotted black;overflow:auto">
+ </div>
+ <div id="embedded">
+ </div>
+ <div>
+ The remote implementation is synchronous and will return immediately
+ <br/>
+ <input type="button" onclick="add(3,5);" value="call addNumbers on remote domain"/>
+ <br/>
+ <br/>
+ The remote implementation of multiplyNumbers is asynchronous and will return after 5seconds
+ <br/>
+ This shows that you can use async calls in the remote method, eg. XHR calls
+ <br/>
+ <input type="button" onclick="multiply(3,5);" value="call multiplyNumbers on remote domain"/>
+ <br/>
+ <br/>
+ This calls a non-returning method on the remote side
+ <br/>
+ <input type="button" onclick="remote.noOp();" value="call noOp on the remote domain"/>
+ </div>
+ <script type="text/javascript">
+ var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
+ document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
+ </script>
+ <script type="text/javascript">
+ if (location.host.indexOf("easyxdm.net") !== -1) {
+ try {
+ var pageTracker = _gat._getTracker("UA-9535591-3");
+ pageTracker._setDomainName(".easyxdm.net");
+ pageTracker._trackPageview();
+ }
+ catch (err) {
+ }
+ }
+ </script>
+ </body>
+</html>
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/remote.html b/asterix-examples/src/main/resources/js/easyXDM/example/remote.html
new file mode 100644
index 0000000..ad82e8a
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/remote.html
@@ -0,0 +1,83 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM</title>
+ <script type="text/javascript" src="../easyXDM.debug.js">
+ </script>
+ <script type="text/javascript">
+ /**
+ * Request the use of the JSON object
+ */
+ easyXDM.DomHelper.requiresJSON("../json2.js");
+ </script>
+ <script type="text/javascript">
+ var win, remoteapp; // reference to the popups window
+ var proxy = new easyXDM.Rpc(/** The configuration */{
+ local: "../name.html",
+ swf: "../easyxdm.swf"
+ }, {
+ local: {
+ /**
+ * This is used to open up the popup. A popup with the given name should already be opened
+ * in the user click handler.
+ */
+ open: function(name){
+ remoteapp = null;
+ // we now open the window, passing the name of this window (includes the channel name)
+ // in case it has to look us up using the framename
+ win = window.open('remoteapp.html' + '#easyXDM_' + easyXDM.query.xdm_c + '_provider', name, "width=400, height=400");
+ },
+ /**
+ * This is where we receive the data
+ * @param {Object} data The data
+ */
+ postMessage: function(data){
+ if (win.closed) {
+ alert("the popup has been closed - please open it again");
+ return;
+ }
+ var div = remoteapp.document.createElement("div");
+ div.innerHTML = "data from '" + proxy.origin + "'";
+ if (remoteapp) {
+ remoteapp.document.body.appendChild(div);
+ for (var key in data) {
+ if (data.hasOwnProperty(key)) {
+ div = remoteapp.document.createElement("div");
+ div.innerHTML = key + "=" + data[key];
+ remoteapp.document.body.appendChild(div);
+ }
+ }
+ remoteapp.focus();
+ }
+ }
+ },
+ remote: {
+ postMessage: {}
+ }
+ });
+
+
+ /**
+ * The popup must use this window to register itself
+ * @param {DOMWindow} app The window object of the popup
+ */
+ function setApp(app){
+ remoteapp = app;
+ }
+
+ /**
+ * The popup must use this method to send data. This clones the object in order to
+ * work around a but in IE
+ * @param {Object} data The data to send
+ */
+ function sendData(data){
+ var copy = {};
+ // copy the object in order to avoid the JSON serialization bug
+ easyXDM.apply(copy, data);
+ proxy.postMessage(copy);
+ }
+ </script>
+ </head>
+ <body>
+ </body>
+</html>
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/remoteapp.html b/asterix-examples/src/main/resources/js/easyXDM/example/remoteapp.html
new file mode 100644
index 0000000..e493b68
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/remoteapp.html
@@ -0,0 +1,37 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM</title>
+ <script type="text/javascript">
+ var target = location.hash.substring(1);
+
+ var host = window.opener.frames[target];
+
+ if (window.opener) {
+ try {
+ // test if we have access to the document
+ if (window.opener.document.title) {
+ host = window.opener;
+ }
+
+ }
+ catch (xDomainError) {
+ // we have an opener, but it's not on our domain,
+ host = window.opener.frames[target];
+ }
+
+ if (host) {
+ try {
+ host.setApp(window);
+ }
+ catch (browserHostError) {
+ alert("was unable to gain a reference to the iframe");
+ }
+ }
+ }
+ </script>
+ </head>
+ <body>
+ <!-- Send some data to the other side using the proxy --><input type="button" onclick="host.sendData({a:'b',c:'d',e:'f'});" value="send data to local"/>
+ </body>
+</html>
\ No newline at end of file
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/remotedata.html b/asterix-examples/src/main/resources/js/easyXDM/example/remotedata.html
new file mode 100644
index 0000000..814355c
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/remotedata.html
@@ -0,0 +1,64 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM</title>
+ <script type="text/javascript" src="../easyXDM.debug.js">
+ </script>
+ <script type="text/javascript">
+ var serializer = {
+ /**
+ * Serializes a hashtable and returns it as a string
+ * @param {Object} data The data to serialize
+ * @returns The serialized string
+ * @type {String}
+ */
+ stringify: function(data){
+ var message = "";
+ for (var key in data) {
+ if (data.hasOwnProperty(key)) {
+ message += key + "=" + escape(data[key]) + "&";
+ }
+ }
+ return message.substring(0, message.length - 1);
+ },
+ /**
+ * Deserializes a string and returns a hashtable
+ * @param {String} message The string to deserialize
+ * @returns An hashtable populated with key-value pairs
+ * @type {Object}
+ */
+ parse: function(message){
+ var data = {};
+ var d = message.split("&");
+ var pair, key, value;
+ for (var i = 0, len = d.length; i < len; i++) {
+ pair = d[i];
+ key = pair.substring(0, pair.indexOf("="));
+ value = pair.substring(key.length + 1);
+ data[key] = unescape(value);
+ }
+ return data;
+ }
+ };
+
+ var socket = new easyXDM.Socket(/** The configuration */{
+ local: "../name.html",
+ swf: "../easyxdm.swf",
+ /**
+ * Register the method that should handle incoming data
+ * @param {Object} data
+ * @param {String} origin
+ */
+ onMessage: function(data, origin){
+ data = serializer.parse(data);
+ alert("Received data from '" + origin + "':");
+ for (var key in data) {
+ alert("Property '" + key + "'=" + data[key]);
+ }
+ }
+ });
+ </script>
+ </head>
+ <body>
+ </body>
+</html>
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/remotemethods.html b/asterix-examples/src/main/resources/js/easyXDM/example/remotemethods.html
new file mode 100644
index 0000000..2ea8c1f
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/remotemethods.html
@@ -0,0 +1,46 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM</title>
+ <script type="text/javascript" src="../easyXDM.debug.js">
+ </script>
+ <script type="text/javascript">
+ /**
+ * Request the use of the JSON object
+ */
+ easyXDM.DomHelper.requiresJSON("../json2.js");
+ </script>
+ <script type="text/javascript">
+ var remote = new easyXDM.Rpc(/** The channel configuration*/{
+ local: "../name.html",
+ swf: "../easyxdm.swf"
+ }, /** The configuration */ {
+ remote: {
+ alertMessage: {}
+ },
+ local: {
+ addNumbers: function(a, b){
+ return a + b;
+ },
+ multiplyNumbers: function(a, b, fn){
+ window.setTimeout(function(){
+ fn(a * b);
+ }, 5000);
+ },
+ noOp: function(){
+ alert("Method not returning any data");
+ }
+ }
+ });
+ </script>
+ </head>
+ <body>
+ <script type="text/javascript">
+ document.write("Domain: " + location.host);
+ </script>
+ <!-- easyXDM.Debug.trace(msg) will output its messages to any element with the id "log" -->
+ <div id="log" style="height:100px;border:1px dotted black;overflow:auto">
+ </div>
+ <input type="button" onclick="remote.alertMessage('message from remote');" value="call alertMessage on local domain"/>
+ </body>
+</html>
\ No newline at end of file
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/remoterpcbackend.html b/asterix-examples/src/main/resources/js/easyXDM/example/remoterpcbackend.html
new file mode 100644
index 0000000..59a411a
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/remoterpcbackend.html
@@ -0,0 +1,36 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM</title>
+ <script type="text/javascript" src="../easyXDM.debug.js">
+ </script>
+ <script type="text/javascript">
+ /**
+ * Request the use of the JSON object
+ */
+ easyXDM.DomHelper.requiresJSON("../json2.js");
+ </script>
+ <script type="text/javascript">
+ var remote = new easyXDM.Rpc(/** The channel configuration*/{
+ local: "../name.html"
+ }, /** The configuration */ {
+ /**
+ *
+ * @param {Object} rpc A JSON-RPC 2.0 request object
+ * @param {Function} reply The callback method. Takes a single JSON-RPC 2.0 response object.
+ */
+ handle: function(rpc, reply){
+ alert("requested to execute procedure '" + rpc.method + "'");
+ }
+ });
+ </script>
+ </head>
+ <body>
+ <script type="text/javascript">
+ document.write("Domain: " + location.host);
+ </script>
+ <!-- easyXDM.Debug.trace(msg) will output its messages to any element with the id "log" -->
+ <div id="log" style="height:100px;border:1px dotted black;overflow:auto">
+ </div>
+ </body>
+</html>
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/remotetransport.html b/asterix-examples/src/main/resources/js/easyXDM/example/remotetransport.html
new file mode 100644
index 0000000..64093a7
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/remotetransport.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM</title>
+ <script type="text/javascript" src="../easyXDM.debug.js">
+ </script>
+ <script type="text/javascript">
+ var transport = new easyXDM.Socket(/** The configuration */{
+ local: "../name.html",
+ swf: "../easyxdm.swf",
+ /**
+ * Register the method that should handle incoming messages
+ * @param {String} data
+ * @param {String} origin
+ */
+ onMessage: function(message, origin){
+ alert("Received '" + message + "' from '" + origin + "'");
+ }
+ });
+ </script>
+ </head>
+ <body>
+ </body>
+</html>
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/resize_iframe.html b/asterix-examples/src/main/resources/js/easyXDM/example/resize_iframe.html
new file mode 100644
index 0000000..e0b0adb
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/resize_iframe.html
@@ -0,0 +1,70 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM</title>
+ <script type="text/javascript" src="../easyXDM.debug.js">
+ </script>
+ <script type="text/javascript">
+ var REMOTE = (function(){
+ var remote = location.href;
+ switch (location.host) {
+ case "provider.easyxdm.net":
+ location.href = remote.replace("provider", "consumer");
+ break;
+ case "easyxdm.net":
+ remote = remote.replace("easyxdm.net", "consumer.easyxdm.net");
+ break;
+ case "consumer.easyxdm.net":
+ remote = remote.replace("consumer", "provider");
+ break;
+ case "xdm1":
+ remote = remote.replace("xdm1", "xdm2");
+ break;
+ }
+ return remote.substring(0, remote.lastIndexOf("/"));
+ }());
+
+ var transport = new easyXDM.Socket(/** The configuration */{
+ remote: REMOTE + "/resize_intermediate.html?url=resized_iframe_1.html",
+ swf: REMOTE + "/../easyxdm.swf",
+ container: "embedded",
+ onMessage: function(message, origin){
+ this.container.getElementsByTagName("iframe")[0].style.height = message + "px";
+ }
+ });
+ </script>
+ </head>
+ <body>
+ <div style="border:1px solid black;padding:3px;margin:10px;">
+ <a href="index.html">Index of examples</a>
+ | <a href="http://github.com/oyvindkinsey/easyXDM/#readme">Readme at github</a>
+ |
+ | <a href="http://easyxdm.net/">easyXDM.net</a>
+ | <a href="http://groups.google.com/group/easyxdm">easyXDM at Google Groups</a>
+ <br/>
+ The examples are executing slower than the production build due to the extensive tracing.
+ <br/>
+ If you are alerted about a popup, then this is only the trace log feature. You can ignore this.
+ </div>
+ <!-- easyXDM.Debug.trace(msg) will output its messages to any element with the id "log" -->
+ <div id="log" style="height:100px;border:1px dotted black;overflow:auto">
+ </div>
+ <div id="embedded">
+ </div>
+ <script type="text/javascript">
+ var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
+ document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
+ </script>
+ <script type="text/javascript">
+ if (location.host.indexOf("easyxdm.net") !== -1) {
+ try {
+ var pageTracker = _gat._getTracker("UA-9535591-3");
+ pageTracker._setDomainName(".easyxdm.net");
+ pageTracker._trackPageview();
+ }
+ catch (err) {
+ }
+ }
+ </script>
+ </body>
+</html>
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/resize_intermediate.html b/asterix-examples/src/main/resources/js/easyXDM/example/resize_intermediate.html
new file mode 100644
index 0000000..8b5f03e
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/resize_intermediate.html
@@ -0,0 +1,67 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM</title>
+ <script type="text/javascript" src="../easyXDM.debug.js"></script>
+ <script type="text/javascript">
+ var iframe;
+ var socket = new easyXDM.Socket({
+ swf : "../easyxdm.swf",
+ onReady : function() {
+ iframe = document.createElement("iframe");
+ iframe.frameBorder = 0;
+ document.body.appendChild(iframe);
+ iframe.src = easyXDM.query.url;
+
+ var timer;
+ iframe.onload = function() {
+ var d = iframe.contentWindow.document;
+ var originalHeight = d.body.clientHeight || d.body.offsetHeight || d.body.scrollHeight;
+
+ // We want to monitor the document for resize events in case of the use of accordions and such,
+ // but unfortunately only the window node emits the resize event, and we need the body's.
+ // The only solution then is to use polling..
+
+ // Lets start the polling if not all ready started
+ if(!timer) {
+ timer = setInterval(function() {
+ try {
+ var d = iframe.contentWindow.document;
+ var newHeight = d.body.clientHeight || d.body.offsetHeight || d.body.scrollHeight;
+ if(newHeight != originalHeight) {
+ // The height has changed since last we checked
+ originalHeight = newHeight;
+ socket.postMessage(originalHeight);
+ }
+ } catch(e) {
+ // We tried to read the property at some point when it wasn't available
+ }
+ }, 300);
+ }
+ // Send the first message
+ socket.postMessage(originalHeight);
+ };
+ },
+ onMessage : function(url, origin) {
+ iframe.src = url;
+ }
+ });
+
+ </script>
+ <style type="text/css">
+ html, body {
+ overflow: hidden;
+ margin: 0px;
+ padding: 0px;
+ width: 100%;
+ height: 100%;
+ }
+ iframe {
+ width: 100%;
+ height: 100%;
+ border: 0px;
+ }
+ </style>
+ </head>
+ <body></body>
+</html>
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/resized_iframe_1.html b/asterix-examples/src/main/resources/js/easyXDM/example/resized_iframe_1.html
new file mode 100644
index 0000000..8b4b7ad
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/resized_iframe_1.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM</title>
+ <style type="text/css">
+ html, body {
+ overflow: hidden;
+ margin: 0px;
+ padding: 0px;
+ background-color: green;
+ }
+ </style>
+ </head>
+ <body>
+ <a href="resized_iframe_2.html">resized_iframe_2.html</a>
+ <br/>
+ Nam nulla nibh, tempus ut dictum eget, euismod vitae metus. Donec vitae nulla nec quam sagittis gravida vel quis eros. Nullam vel est justo. Donec euismod interdum magna, et rutrum libero tincidunt vel. Praesent imperdiet, magna et suscipit facilisis, nulla justo consequat nisl, et mollis elit nunc a est. Sed felis quam, condimentum eget gravida non, semper non quam. Duis vestibulum sem id erat tristique eleifend. Phasellus ante nunc, pulvinar nec facilisis at, hendrerit sed leo. Morbi lacinia nisl id nunc faucibus lacinia. Curabitur adipiscing leo a odio aliquet hendrerit. Nullam laoreet pulvinar suscipit.
+ Cras ante tortor, rutrum non pharetra vel, tempor et velit. Mauris semper, libero sit amet interdum interdum, metus purus rutrum libero, eget suscipit lectus augue eu magna. Aliquam quis dui a nunc luctus faucibus. Sed viverra augue rutrum odio placerat laoreet. Nulla scelerisque augue nec enim condimentum sollicitudin. Proin accumsan, turpis in viverra lobortis, nulla mauris euismod turpis, sit amet auctor felis lacus sed leo. Nullam posuere bibendum urna, ut mattis eros varius ac. Mauris sed metus orci, ut lobortis eros. Sed imperdiet bibendum tincidunt. Donec adipiscing sapien vitae ligula faucibus quis auctor nisi pretium. Morbi at nulla quam, in aliquet quam. Suspendisse potenti. Fusce varius gravida egestas. Nulla lectus velit, posuere et auctor a, congue id massa. Quisque ut lectus eu metus malesuada sollicitudin ac a risus.
+ Nullam massa ipsum, pulvinar ut facilisis a, commodo ut orci. Mauris ac ipsum diam, sit amet laoreet tortor. In pretium, nulla vel ornare euismod, nibh augue pharetra magna, at semper felis diam in ipsum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus blandit ornare dignissim. Fusce et nulla urna. Morbi nec ante erat. Nullam ut urna libero. Nulla non ipsum purus, et cursus lectus. Etiam vehicula, mauris in faucibus vehicula, dolor quam sodales neque, sed laoreet est augue at lacus. Nunc tincidunt lacinia elit eu dignissim. Mauris at enim mauris. Donec congue auctor dui, eget posuere ante accumsan in. Nulla non quam enim, eget tempor arcu. Suspendisse nec nibh diam, ut congue est. Fusce at urna eget velit posuere ornare nec eget mauris. Sed accumsan magna et enim mollis dignissim.
+ </body>
+</html>
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/resized_iframe_2.html b/asterix-examples/src/main/resources/js/easyXDM/example/resized_iframe_2.html
new file mode 100644
index 0000000..7c4085d
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/resized_iframe_2.html
@@ -0,0 +1,33 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM</title>
+ <style type="text/css">
+ html, body {
+ overflow: hidden;
+ margin: 0px;
+ padding: 0px;
+ background-color: red;
+ }
+ </style>
+ </head>
+ <body>
+ <a href="resized_iframe_1.html">resized_iframe_1.html</a>
+ <br/>
+ (This page will resize its content after three seconds)
+ <br/>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam eu felis libero, non ultricies ligula. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed in lorem libero. Phasellus malesuada, mauris eget suscipit tristique, dolor dui blandit purus, ut mollis eros dolor et elit. Ut consequat ultrices metus, pretium mattis dui adipiscing vitae. Nunc cursus, sapien vehicula auctor faucibus, enim orci pretium risus, id congue ligula justo sed felis. Proin nec quam justo. Cras tempor odio eget orci lacinia sit amet malesuada leo feugiat. In accumsan tincidunt enim, vitae ultricies arcu egestas in. Nulla rhoncus eros vel ipsum venenatis porta. Suspendisse id erat nec mauris ultricies consectetur id feugiat odio. Vestibulum pretium tristique magna sed ultrices. Suspendisse tortor mauris, facilisis et lobortis quis, suscipit sed est. Sed vitae tortor at lacus pretium blandit. Donec vitae nibh quis orci mollis fringilla. Duis tempus augue nec ipsum euismod elementum.
+ Donec pharetra sem nec lacus posuere et lacinia ligula sollicitudin. Morbi semper commodo posuere. In adipiscing nulla ut urna fermentum vestibulum. Sed consectetur massa non neque facilisis interdum. Quisque semper massa et urna euismod nec fermentum metus feugiat. Morbi tempor commodo enim non lacinia. Aliquam elementum tortor mattis odio congue a egestas lacus bibendum. Integer nec leo massa, a ullamcorper mi. Morbi vitae massa arcu. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
+ Nam nulla nibh, tempus ut dictum eget, euismod vitae metus. Donec vitae nulla nec quam sagittis gravida vel quis eros. Nullam vel est justo. Donec euismod interdum magna, et rutrum libero tincidunt vel. Praesent imperdiet, magna et suscipit facilisis, nulla justo consequat nisl, et mollis elit nunc a est. Sed felis quam, condimentum eget gravida non, semper non quam. Duis vestibulum sem id erat tristique eleifend. Phasellus ante nunc, pulvinar nec facilisis at, hendrerit sed leo. Morbi lacinia nisl id nunc faucibus lacinia. Curabitur adipiscing leo a odio aliquet hendrerit. Nullam laoreet pulvinar suscipit.
+ Cras ante tortor, rutrum non pharetra vel, tempor et velit. Mauris semper, libero sit amet interdum interdum, metus purus rutrum libero, eget suscipit lectus augue eu magna. Aliquam quis dui a nunc luctus faucibus. Sed viverra augue rutrum odio placerat laoreet. Nulla scelerisque augue nec enim condimentum sollicitudin. Proin accumsan, turpis in viverra lobortis, nulla mauris euismod turpis, sit amet auctor felis lacus sed leo. Nullam posuere bibendum urna, ut mattis eros varius ac. Mauris sed metus orci, ut lobortis eros. Sed imperdiet bibendum tincidunt. Donec adipiscing sapien vitae ligula faucibus quis auctor nisi pretium. Morbi at nulla quam, in aliquet quam. Suspendisse potenti. Fusce varius gravida egestas. Nulla lectus velit, posuere et auctor a, congue id massa. Quisque ut lectus eu metus malesuada sollicitudin ac a risus.
+ Nullam massa ipsum, pulvinar ut facilisis a, commodo ut orci. Mauris ac ipsum diam, sit amet laoreet tortor. In pretium, nulla vel ornare euismod, nibh augue pharetra magna, at semper felis diam in ipsum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus blandit ornare dignissim. Fusce et nulla urna. Morbi nec ante erat. Nullam ut urna libero. Nulla non ipsum purus, et cursus lectus. Etiam vehicula, mauris in faucibus vehicula, dolor quam sodales neque, sed laoreet est augue at lacus. Nunc tincidunt lacinia elit eu dignissim. Mauris at enim mauris. Donec congue auctor dui, eget posuere ante accumsan in. Nulla non quam enim, eget tempor arcu. Suspendisse nec nibh diam, ut congue est. Fusce at urna eget velit posuere ornare nec eget mauris. Sed accumsan magna et enim mollis dignissim.
+ <script type="text/javascript">
+ // here we fake an action that would the casue the body's size to mutate.
+ setTimeout(function() {
+ var html = document.body.innerHTML;
+ document.body.innerHTML = html.substring(0, html.length / 2);
+ }, 3000);
+
+ </script>
+ </body>
+</html>
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/transport.html b/asterix-examples/src/main/resources/js/easyXDM/example/transport.html
new file mode 100644
index 0000000..769feb0
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/transport.html
@@ -0,0 +1,82 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM</title>
+ <script type="text/javascript" src="../easyXDM.debug.js">
+ </script>
+ <script type="text/javascript">
+
+ var REMOTE = (function(){
+ var remote = location.href;
+ switch (location.host) {
+ case "provider.easyxdm.net":
+ location.href = remote.replace("provider", "consumer");
+ break;
+ case "easyxdm.net":
+ remote = remote.replace("easyxdm.net", "consumer.easyxdm.net");
+ break;
+ case "consumer.easyxdm.net":
+ remote = remote.replace("consumer", "provider");
+ break;
+ case "xdm1":
+ remote = remote.replace("xdm1", "xdm2");
+ break;
+ }
+ return remote.substring(0, remote.lastIndexOf("/"));
+ }());
+ var transport = new easyXDM.Socket(/** The configuration */{
+ /**
+ * Register the url to name.html, this must be an absolute path
+ * or a path relative to the root.
+ * @field
+ */
+ local: "../name.html",
+ swf: REMOTE + "/../easyxdm.swf",
+ /**
+ * Register the url to the remote interface
+ * @field
+ */
+ remote: REMOTE + "/remotetransport.html",
+ remoteHelper: REMOTE + "/../name.html",
+ onReady: function(){
+ /**
+ * If we want to do something once the transport is ready then we can place it here
+ */
+ }
+ });
+ // messages will be buffered until the transport is ready
+ transport.postMessage("This is a message sent from " + location);
+ </script>
+ </head>
+ <body>
+ <div style="border:1px solid black;padding:3px;margin:10px;">
+ <a href="index.html">Index of examples</a>
+ | <a href="http://github.com/oyvindkinsey/easyXDM/#readme">Readme at github</a>
+ |
+ | <a href="http://easyxdm.net/">easyXDM.net</a>
+ | <a href="http://groups.google.com/group/easyxdm">easyXDM at Google Groups</a>
+ <br/>
+ The examples are executing slower than the production build due to the extensive tracing.
+ <br/>
+ If you are alerted about a popup, then this is only the trace log feature. You can ignore this.
+ </div>
+ <!-- easyXDM.Debug.trace(msg) will output its messages to any element with the id "log" -->
+ <div id="log" style="height:100px;border:1px dotted black;overflow:auto">
+ </div>
+ <script type="text/javascript">
+ var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
+ document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
+ </script>
+ <script type="text/javascript">
+ if (location.host.indexOf("easyxdm.net") !== -1) {
+ try {
+ var pageTracker = _gat._getTracker("UA-9535591-3");
+ pageTracker._setDomainName(".easyxdm.net");
+ pageTracker._trackPageview();
+ }
+ catch (err) {
+ }
+ }
+ </script>
+ </body>
+</html>
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/upload.html b/asterix-examples/src/main/resources/js/easyXDM/example/upload.html
new file mode 100644
index 0000000..569feb4
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/upload.html
@@ -0,0 +1,100 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM</title>
+ <script type="text/javascript" src="../easyXDM.debug.js">
+ </script>
+ <script type="text/javascript">
+ /**
+ * Request the use of the JSON object
+ */
+ easyXDM.DomHelper.requiresJSON("../json2.js");
+ </script>
+ <script type="text/javascript">
+
+ // this is just some bootstrapping code in order to provide
+ // the correct host name depending on where it is being run.
+ var REMOTE = (function(){
+ var remote = location.href;
+ switch (location.host) {
+ case "provider.easyxdm.net":
+ location.href = remote.replace("provider", "consumer");
+ break;
+ case "easyxdm.net":
+ remote = remote.replace("easyxdm.net", "consumer.easyxdm.net");
+ break;
+ case "consumer.easyxdm.net":
+ remote = remote.replace("consumer", "provider");
+ break;
+ case "xdm1":
+ remote = remote.replace("xdm1", "xdm2");
+ break;
+ }
+ return remote.substring(0, remote.lastIndexOf("/"));
+ }());
+
+
+
+ var btn;
+ var remote = new easyXDM.Rpc({
+ remote: REMOTE + "/upload_rpc.html",
+ swf: REMOTE + "/../easyxdm.swf",
+ onReady: function(){
+ //display the upload form
+ var frm = document.getElementById("frmUpload");
+ frm.action = REMOTE + "/upload_handler.aspx";
+ frm.style.display = "block";
+ btn = document.getElementById("btnSubmit");
+
+ frm.onsubmit = function(){
+ btn.disabled = "disabled";
+ };
+ }
+ }, {
+ local: {
+ returnUploadResponse: function(response){
+ // here you should call back into your regular workflow
+ btn.disabled = null;
+ alert(response.msg);
+ }
+ }
+ });
+ </script>
+ </head>
+ <body>
+ <div style="border:1px solid black;padding:3px;margin:10px;">
+ <a href="index.html">Index of examples</a>
+ | <a href="http://github.com/oyvindkinsey/easyXDM/#readme">Readme at github</a>
+ |
+ | <a href="http://easyxdm.net/">easyXDM.net</a>
+ | <a href="http://groups.google.com/group/easyxdm">easyXDM at Google Groups</a>
+ <br/>
+ The examples are executing slower than the production build due to the extensive tracing.
+ <br/>
+ If you are alerted about a popup, then this is only the trace log feature. You can ignore this.
+ </div>
+ <!-- easyXDM.Debug.trace(msg) will output its messages to any element with the id "log" -->
+ <div id="log" style="height:100px;border:1px dotted black;overflow:auto">
+ </div>
+ <form id="frmUpload" style="display:none" method="POST" target="upload_target" enctype="multipart/form-data">
+ <input type="file" name="upload_file"/><input type="submit" id="btnSubmit" value="Upload file"/>
+ </form><!--
+ tracking code
+ -->
+ <script type="text/javascript">
+ var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
+ document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
+ </script>
+ <script type="text/javascript">
+ if (location.host.indexOf("easyxdm.net") !== -1) {
+ try {
+ var pageTracker = _gat._getTracker("UA-9535591-3");
+ pageTracker._setDomainName(".easyxdm.net");
+ pageTracker._trackPageview();
+ }
+ catch (err) {
+ }
+ }
+ </script>
+ </body>
+</html>
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/upload_handler.aspx b/asterix-examples/src/main/resources/js/easyXDM/example/upload_handler.aspx
new file mode 100644
index 0000000..8c652ee
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/upload_handler.aspx
@@ -0,0 +1,15 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM</title>
+ </head>
+ <body>
+ <script type="text/javascript">
+ // this should be outputted by the server side code
+ parent.rpc.returnUploadResponse({
+ status: "success",
+ msg: "The upload succeeded!"
+ });
+ </script>
+ </body>
+</html>
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/upload_rpc.html b/asterix-examples/src/main/resources/js/easyXDM/example/upload_rpc.html
new file mode 100644
index 0000000..37123ec
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/upload_rpc.html
@@ -0,0 +1,25 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM</title>
+ <script type="text/javascript" src="../easyXDM.debug.js">
+ </script>
+ <script type="text/javascript">
+ easyXDM.DomHelper.requiresJSON("../json2.js");
+ </script>
+ <script type="text/javascript">
+ // the `rpc` object will be referenced by the upload handler
+ var rpc = new easyXDM.Rpc({
+ swf: "../easyxdm.swf"
+ }, {
+ remote: {
+ returnUploadResponse: {}
+ }
+ });
+ </script>
+ </head>
+ <body>
+ <iframe name="upload_target" src="about:blank">
+ </iframe>
+ </body>
+</html>
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/widget.html b/asterix-examples/src/main/resources/js/easyXDM/example/widget.html
new file mode 100644
index 0000000..5093eeb
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/widget.html
@@ -0,0 +1,49 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM.Widget</title>
+ <script type="text/javascript" src="../easyXDM.debug.js">
+ </script>
+ <script type="text/javascript">
+ easyXDM.DomHelper.requiresJSON("../json2.js");
+ </script>
+ <script type="text/javascript" src="../easyXDM.Widgets.debug.js">
+ </script>
+ <script type="text/javascript">
+ easyXDM.whenReady(function(){
+ var widget = new easyXDM.Widget({
+ subscriptions: ["testtopic"],
+ swf: "../easyxdm.swf",
+ initialize: function(widget, widgetManager){
+ // Set up the widget
+ var _container, _btnPublish;
+
+ // Render the UI
+ _container = document.body.appendChild(document.createElement("div"));
+ _btnPublish = _container.appendChild(document.createElement("button"));
+ _btnPublish.innerHTML = "Publish";
+ easyXDM.DomHelper.on(_btnPublish, "click", function(){
+ widget.publish("testtopic", {
+ latitude: 1,
+ longitude: 2
+ });
+ });
+
+ // Register the handler for incoming messages
+ widget.registerMessageHandler(function(url, topic, data){
+ _container.appendChild(document.createElement("div")).innerHTML = "got data on topic " + topic + " from " + url;
+ });
+ },
+ initialized: function(widget, widgetManager){
+ widget.publish("testtopic", {
+ latitude: 1,
+ longitude: 2
+ });
+ }
+ });
+ });
+ </script>
+ </head>
+ <body>
+ </body>
+</html>
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/widgets.html b/asterix-examples/src/main/resources/js/easyXDM/example/widgets.html
new file mode 100644
index 0000000..17bff03
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/widgets.html
@@ -0,0 +1,75 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM</title>
+ <script type="text/javascript" src="../easyXDM.debug.js">
+ </script>
+ <script type="text/javascript">
+ easyXDM.DomHelper.requiresJSON("../json2.js");
+ </script>
+ <script type="text/javascript" src="../easyXDM.Widgets.debug.js">
+ </script>
+ <script type="text/javascript">
+ var _widgetManager;
+ easyXDM.whenReady(function(){
+ _widgetManager = new easyXDM.WidgetManager({
+ swf: "../easyxdm.swf",
+ container: document.getElementById("widgets")
+ });
+ document.getElementById("widget1url").value = location.href.replace("consumer", "provider").replace("widgets.html", "widget.html");
+ document.getElementById("widget2url").value = location.href.replace("consumer.", "").replace("widgets.html", "widget.html");
+ });
+ </script>
+ <style type="text/css">
+
+ #widgets {
+ height: 400px;
+ }
+
+ #widgets iframe {
+ width: 200px;
+ height: 300px;
+ float: left;
+ }
+ </style>
+ </head>
+ <body>
+ <div style="border:1px solid black;padding:3px;margin:10px;">
+ <a href="index.html">Index of examples</a>
+ | <a href="http://github.com/oyvindkinsey/easyXDM/#readme">Readme at github</a>
+ |
+ | <a href="http://easyxdm.net/">easyXDM.net</a>
+ | <a href="http://groups.google.com/group/easyxdm">easyXDM at Google Groups</a>
+ <br/>
+ The examples are executing slower than the production build due to the extensive tracing.
+ <br/>
+ If you are alerted about a popup, then this is only the trace log feature. You can ignore this.
+ </div>
+ <!-- easyXDM.Debug.trace(msg) will output its messages to any element with the id "log" -->
+ <div id="log" style="height:100px;border:1px dotted black;overflow:auto">
+ </div>
+ <div>
+ <input type="text" id="widget1url" style="width:300px" value=""/><input type="button" onclick="_widgetManager.addWidget(document.getElementById('widget1url').value,{});" value="Add Widget"/><input type="button" onclick="_widgetManager.removeWidget(document.getElementById('widget1url').value);" value="Remove Widget"/>
+ </div>
+ <div>
+ <input type="text" id="widget2url" style="width:300px" value=""/><input type="button" onclick="_widgetManager.addWidget(document.getElementById('widget2url').value,{});" value="Add Widget"/><input type="button" onclick="_widgetManager.removeWidget(document.getElementById('widget2url').value);" value="Remove Widget"/>
+ </div><input type="button" onclick="_widgetManager.publish('testtopic','abc');" value="publish"/>
+ <div id="widgets">
+ </div>
+ <script type="text/javascript">
+ var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
+ document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
+ </script>
+ <script type="text/javascript">
+ if (location.host.indexOf("easyxdm.net") !== -1) {
+ try {
+ var pageTracker = _gat._getTracker("UA-9535591-3");
+ pageTracker._setDomainName(".easyxdm.net");
+ pageTracker._trackPageview();
+ }
+ catch (err) {
+ }
+ }
+ </script>
+ </body>
+</html>
diff --git a/asterix-examples/src/main/resources/js/easyXDM/example/xhr.html b/asterix-examples/src/main/resources/js/easyXDM/example/xhr.html
new file mode 100644
index 0000000..a6d7f5d
--- /dev/null
+++ b/asterix-examples/src/main/resources/js/easyXDM/example/xhr.html
@@ -0,0 +1,112 @@
+<!doctype html>
+<html>
+ <head>
+ <title>easyXDM</title>
+ <script type="text/javascript" src="../easyXDM.debug.js">
+ </script>
+ <script type="text/javascript">
+ /**
+ * Request the use of the JSON object
+ */
+ easyXDM.DomHelper.requiresJSON("../json2.js");
+ </script>
+ <script type="text/javascript">
+ // this is only bootstrapping code
+ var REMOTE = (function(){
+ var remote = location.href;
+ switch (location.host) {
+ case "provider.easyxdm.net":
+ location.href = remote.replace("provider", "consumer");
+ break;
+ case "easyxdm.net":
+ remote = remote.replace("easyxdm.net", "consumer.easyxdm.net");
+ break;
+ case "consumer.easyxdm.net":
+ remote = remote.replace("consumer", "provider");
+ break;
+ case "xdm1":
+ remote = remote.replace("xdm1", "xdm2");
+ break;
+ }
+ return remote.substring(0, remote.lastIndexOf("/"));
+ }());
+
+ // this is really what you are after
+ var xhr = new easyXDM.Rpc({
+ local: "../name.html",
+ swf: REMOTE + "/../easyxdm.swf",
+ remote: REMOTE + "/../cors/",
+ remoteHelper: REMOTE + "/../name.html"
+ }, {
+ remote: {
+ request: {}
+ }
+ });
+
+ function getGlossary(){
+ xhr.request({
+ url: "../example/glossary.aspx",
+ method: "POST",
+ headers: {
+ "x-auth-token": "abcde"
+ },
+ data: {
+ param1: "a",
+ param2: "b"
+ }
+ }, function(rpcdata){
+ var json = easyXDM.getJSONObject().parse(rpcdata.data);
+
+ document.getElementById("response").innerHTML = json.glossary.title;
+ document.getElementById("header").innerHTML = rpcdata.headers["x-foo"];
+ });
+
+ }
+ </script>
+ </head>
+ <body>
+ <div style="border:1px solid black;padding:3px;margin:10px;">
+ <a href="index.html">Index of examples</a>
+ | <a href="http://github.com/oyvindkinsey/easyXDM/#readme">Readme at github</a>
+ |
+ | <a href="http://easyxdm.net/">easyXDM.net</a>
+ | <a href="http://groups.google.com/group/easyxdm">easyXDM at Google Groups</a>
+ <br/>
+ The examples are executing slower than the production build due to the extensive tracing.
+ <br/>
+ If you are alerted about a popup, then this is only the trace log feature. You can ignore this.
+ </div>
+ <script type="text/javascript">
+ document.write("Domain: " + location.host);
+ </script>
+ <!-- easyXDM.Debug.trace(msg) will output its messages to any element with the id "log" -->
+ <div id="log" style="height:100px;border:1px dotted black;overflow:auto">
+ </div>
+ <div id="embedded">
+ </div>
+ <div>
+ This example shows how to use easyXDM to call regular ajax/cors services (no JSONP) from remote domains.
+ <br/>
+ <input type="button" onclick="getGlossary()" value="Call getGlossary using the exposed method"/>
+ <br/>
+ Data from response:<span id="response"></span>
+ <br/>
+ Data from header:<span id="header"></span>
+ </div>
+ <script type="text/javascript">
+ var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
+ document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
+ </script>
+ <script type="text/javascript">
+ if (location.host.indexOf("easyxdm.net") !== -1) {
+ try {
+ var pageTracker = _gat._getTracker("UA-9535591-3");
+ pageTracker._setDomainName(".easyxdm.net");
+ pageTracker._trackPageview();
+ }
+ catch (err) {
+ }
+ }
+ </script>
+ </body>
+</html>