Prepare for moving adhoc code into a separate file
authorFlorian Zeitz <florob@babelmonkeys.de>
Sat, 25 Dec 2010 03:16:10 +0000 (04:16 +0100)
committerFlorian Zeitz <florob@babelmonkeys.de>
Sat, 25 Dec 2010 03:16:10 +0000 (04:16 +0100)
* Don't explicitly use '#output' everywhere
* Separate UI and protocol better
* Some XHTML 1.1 fixes

index.html
js/main.js
style.css

index b99d27e4755f4b5e170c99ec9645f4bfaa7edde3..195bd949a65ea6c7c40fe8d8b60999fb3b97eba3 100644 (file)
 </head>
 <body>
 <div id='login'>
-  <form id='cred' name='cred'>
-    <label for='jid'>JID:</label><br/>
-    <input type='text' id='jid' />
-    <br />
-    <label for='pass'>Password:</label><br/>
-    <input type='password' id='pass' />
-    <br />
-    <input type='submit' id='connect' value='connect' />
+  <form id='cred' action='#'>
+    <fieldset>
+      <label for='jid'>JID:</label><br/>
+      <input type='text' id='jid' />
+      <br/>
+      <label for='pass'>Password:</label><br/>
+      <input type='password' id='pass' />
+      <br/>
+      <input type='submit' id='connect' value='connect' />
+    </fieldset>
   </form>
 </div>
 
 <div id='main'>
   <div id='query'>
-    <form id='queryForm' name='queryForm'>
-      <label for='queryJID'>Query:</label>
-      <input type='text' id='queryJID' />
-      <input type='submit' value='Query' />
+    <form id='queryForm' action='#'>
+      <fieldset>
+        <label for='queryJID'>Query:</label>
+        <input type='text' id='queryJID' />
+        <input type='submit' value='Query' />
+      </fieldset>
     </form>
   </div>
 
index 955ceb9f5d9a0795529b5f9a9d577e134789b73c..85f2ccaeaa2ec8887710ca2fe8baed05aff0ada7 100644 (file)
@@ -45,7 +45,7 @@ function onConnect(status) {
         adhoc_status.queryJID = connection.domain;
         $('#queryJID').val(adhoc_status.queryJID);
         $('#query').show();
-        checkFeatures();
+        checkFeatures("#output");
     }
 }
 
@@ -58,8 +58,11 @@ function addNote(elem, text, type) {
 }
 
 function addForm(elem, x) {
-    var form = $("<form/>");
-    form.submit(function(event){event.preventDefault();});
+    var form = $("<form action='#'/>");
+    form.submit(function(event) {
+        executeCommand("execute", serializeToDataform('form'), function(e) { displayResult(elem, e) });
+        event.preventDefault();
+    });
     var fieldset = $("<fieldset/>");
     form.append(fieldset);
     if ($(x).find("title").length > 0)
@@ -145,8 +148,8 @@ function addForm(elem, x) {
     $(elem).append(form);
 }
 
-function serializeToDataform(form, st) {
-    st.c("x", {"xmlns": "jabber:x:data", "type": "submit"});
+function serializeToDataform(form) {
+    st = $build("x", {"xmlns": "jabber:x:data", "type": "submit"});
     $(form).find(".df-item").each(function(){
         st.c("field", {"var": $(this).attr("name")});
         if (this.nodeName.toLowerCase() == "select" && this.multiple) {
@@ -170,111 +173,107 @@ function serializeToDataform(form, st) {
         st.up();
     });
     st.up();
+    return st.tree();
 }
 
-function displayResult(result) {
+function displayResult(elem, result) {
     var status = $(result).find("command").attr("status");
+    var kinds = {'prev': 'Prev', 'next': 'Next', 'complete': 'Complete'};
 
-    $("#output").empty();
+    $(elem).empty();
     $(result).find("command > *").each(function(index, e) {
         if ($(e).is("note")) {
-            addNote("#output", $(e).text(), $(e).attr("type"));
+            addNote(elem, $(e).text(), $(e).attr("type"));
         } else if ($(e).is("x[xmlns=jabber:x:data]")) {
-            addForm("#output", e);
+            addForm(elem, e);
         }
     });
     if (status == "executing") {
-        $("#output").append("<input type='button' disabled='true' id='prevButton' value='Prev'/>"+
-                            "<input type='button' disabled='true' id='nextButton' value='Next'/>"+
-                            "<input type='button' disabled='true' id='completeButton' value='Complete'/>"+
-                            "<input type='button' id='executeButton' value='Execute'/>"+
-                            "<input type='button' id='cancelButton' value='Cancel'/>");
-        for (kind in ['prev', 'next', 'complete']) {
+        for (kind in kinds) {
+            input = $("<input type='button' disabled='disabled' value='" + kinds[kind] + "'/>").click(function() {
+                if (kind == 'prev')
+                    executeCommand(kind, false, function(e) { displayResult(elem, e) });
+                else
+                    executeCommand(kind, serializeToDataform('form'), function(e) { displayResult(elem, e) });
+            });
             if ($(result).find('actions ' + kind).length > 0)
-                $('#' + kind + 'Button').attr("disabled", "false");
+                input.removeAttr("disabled");
+            $(elem).append(input);
         }
-        $('#executeButton').bind("click", function() {
-            var execIQ = $iq({ type: "set", to: adhoc_status.queryJID, id: connection.getUniqueId() })
-                .c("command", { xmlns: Strophe.NS.ADHOC, node: adhoc_status.cmdNode, sessionid: adhoc_status.sessionid, action: "execute" });
-            serializeToDataform($('form'), execIQ);
-            connection.sendIQ(execIQ, displayResult);
-        });
 
-        $('#cancelButton').bind("click", function() {
-            cancelCommand(displayResult);
-        });
-
-        $('#queryForm').unbind('submit');
-        $('#queryForm').bind('submit', function (event) {
-            cancelCommand(function(result) {
-                $('#queryForm').unbind('submit');
-                $('#queryForm').bind('submit', function (event) {
-                    adhoc_status.queryJID = $('#queryJID').val();
-                    checkFeatures();
-                    event.preventDefault();
-                });
-            });
-            adhoc_status.queryJID = $('#queryJID').val();
-            checkFeatures();
-            event.preventDefault();
-        });
+        $("<input type='button' id='executeButton' value='Execute'/>").click(function() {
+            executeCommand("execute", serializeToDataform('form'), function(e) { displayResult(elem, e) });
+        }).appendTo(elem);
 
+        $("<input type='button' value='Cancel'/>").click(function() {
+            cancelCommand(function(e) { displayResult(elem, e) });
+        }).appendTo(elem);
     } else {
         input = $("<input type='button' value='Start over'/>").bind("click", function() {
-            $('#output').empty();
+            $(elem).empty();
             adhoc_status.sessionid = null;
             adhoc_status.cmdNode = null;
-            getCommandNodes();
+            getCommandNodes(elem);
         });
-        $("#output").append(input);
+        $(elem).append(input);
     }
 }
 
-function runCommand(event) {
-    adhoc_status.cmdNode = $(this).attr("id"); // Save node of executed command (in global var)
-    var execIQ = $iq({ type: "set", to: adhoc_status.queryJID, id: connection.getUniqueId() })
-        .c("command", { xmlns: Strophe.NS.ADHOC, node: adhoc_status.cmdNode, action: "execute" });
-    connection.sendIQ(execIQ, function(result) {
+function runCommand(item, callback) {
+    adhoc_status.cmdNode = $(item).attr("id"); // Save node of executed command (in global var)
+    executeCommand("execute", false, function(result) {
         adhoc_status.sessionid = $(result).find("command").attr("sessionid");
-        displayResult(result);
+        callback(result);
     });
-    event.preventDefault();
+}
+
+function executeCommand(type, childs, callback) {
+    if (adhoc_status.sessionid)
+        var execIQ = $iq({ type: "set", to: adhoc_status.queryJID, id: connection.getUniqueId() })
+            .c("command", { xmlns: Strophe.NS.ADHOC, node: adhoc_status.cmdNode, sessionid: adhoc_status.sessionid, action: type });
+    else
+        var execIQ = $iq({ type: "set", to: adhoc_status.queryJID, id: connection.getUniqueId() })
+            .c("command", { xmlns: Strophe.NS.ADHOC, node: adhoc_status.cmdNode, action: type });
+    if (childs)
+        execIQ.cnode(childs);
+        connection.sendIQ(execIQ, callback);
 }
 
 function cancelCommand(callback) {
-    var cancelIQ = $iq({ type: "set", to: adhoc_status.queryJID, id: connection.getUniqueId() })
-        .c("command", { xmlns: Strophe.NS.ADHOC, node: adhoc_status.cmdNode, sessionid: adhoc_status.sessionid, action: "cancel" });
+    executeCommand("cancel", false, callback);
     adhoc_status.cmdNode = null
     adhoc_status.sessionid = null;
-    connection.sendIQ(cancelIQ, callback);
 }
 
-function getCommandNodes() {
-    var nodesIQ = $iq({ type: "get", to: adhoc_status.queryJID, id: "nodes1" }).c("query", {xmlns: Strophe.NS.DISCO_ITEMS, node: Strophe.NS.ADHOC});
+function getCommandNodes(elem) {
+    var nodesIQ = $iq({ type: "get", to: adhoc_status.queryJID, id: connection.getUniqueId() }).c("query", {xmlns: Strophe.NS.DISCO_ITEMS, node: Strophe.NS.ADHOC});
     connection.sendIQ(nodesIQ, function(result) {
-        $('#output').append("<ul id='items'></ul>");
+        var items = $("<ul></ul>");
+        $(elem).append(items);
         $(result).find("item").each(function(index, e) {
-            link = $("<a href='#' id='" + $(e).attr("node") + "'>" + $(e).attr("name") + "</a>").click(runCommand)
-            item = $("<li></li>").append(link);
-            $("#items").append(item);
+            $("<li></li>").append($("<a href='#' id='" + $(e).attr("node") + "'>" + $(e).attr("name") + "</a>").click(function (event) {
+                runCommand(this, function (result) { displayResult(elem, result); });
+                event.preventDefault();
+            })).appendTo(items);
         });
     });
 }
 
-function checkFeatures() {
-    featureIQ = $iq({ type: "get", to: adhoc_status.queryJID, id: "features1" }).c("query", {xmlns: Strophe.NS.DISCO_INFO});
-    $('#output').empty();
+function checkFeatures(elem) {
+    if (adhoc_status.sessionid)
+        cancelCommand();
+    featureIQ = $iq({ type: "get", to: adhoc_status.queryJID, id: connection.getUniqueId() }).c("query", {xmlns: Strophe.NS.DISCO_INFO});
+    $(elem).empty();
     connection.sendIQ(featureIQ,
         function(result) { /* Callback */
-                if ($(result).find("feature[var='" + Strophe.NS.ADHOC + "']").length > 0) {
-                    $('#output').append("<p>This entitiy does support AdHoc commands</p>");
-                    getCommandNodes();
-                } else {
-                    $('#output').append("<p>This entitiy does NOT support AdHoc commands</p>");
-                }
+            if ($(result).find("feature[var='" + Strophe.NS.ADHOC + "']").length > 0) {
+                getCommandNodes(elem);
+            } else {
+                $(elem).append("<p>" + adhoc_status.queryJID + " does NOT support AdHoc commands</p>");
+            }
         },
         function(result) { /* Errback */
-            $('#output').append("<p>Couldn't get list of supported features</p>");
+            $(elem).append("<p>Couldn't get list of supported features</p>");
         }
     );
 }
@@ -337,7 +336,7 @@ $(document).ready(function () {
 
     $('#queryForm').bind('submit', function (event) {
         adhoc_status.queryJID = $('#queryJID').val();
-        checkFeatures();
+        checkFeatures("#output");
         event.preventDefault();
     });
 });
index 26e8b371567968763806706ef8a5c424af752b1e..b26b844f5226fdc3be6e7c2ed05ce31f1f0fe57c 100644 (file)
--- a/style.css
+++ b/style.css
@@ -25,7 +25,7 @@ a {
   display: none
 }
 
-#login{
+#login {
   float: left;
   margin-right: 2em;
   padding: 1em;
@@ -33,6 +33,10 @@ a {
   color: #000000
 }
 
+#login fieldset, #query fieldset {
+  border: 0px
+}
+
 #cred input[type="submit"] {
   margin-left: 0em
 }