Add ability to render forms (no submitting yet)

[adhocweb.git] / js / main.js

diff --git a/js/main.js b/js/main.js
index 2cf542ec2cadb8c251f54a8fa790a6c945b68b7b..c20969d3d5a59c1e9e250eac5b5d993743aa522f 100644 (file)
--- a/js/main.js
+++ b/js/main.js
@@ -4,6 +4,8 @@ Strophe.addNamespace("ADHOC", "http://jabber.org/protocol/commands");
 
 var localJID = null;
 var connection   = null;
+var sessionid = null;
+var cmdNode = null;
 
 function log(msg) {
     var entry = $('<div></div>').append(document.createTextNode(msg));
@@ -40,29 +42,126 @@ function onConnect(status) {
     }
 }
 
+function addNote(elem, text, type) {
+    if (!type) {
+       type = "info";
+    }
+    $(elem).append("<p class='" + type + "Note'>" + text + "</p>");
+}
+
+function addForm(elem, x) {
+    var form = $("<form/>");
+    form.submit(function(){return false;});
+    var fieldset = $("<fieldset/>");
+    form.append(fieldset);
+    $("<legend/>").text($(x).find("title").text()).appendTo(fieldset);
+    $("<p/>").text($(x).find("instructions").text()).appendTo(fieldset);
+    $(x).find("field").each(function(){
+            var item = null;
+            var type = $(this).attr("type");
+            if($(this).attr("label")) {
+                $("<label/>").text($(this).attr("label")).attr("for", $(this).attr("var")).appendTo(fieldset);
+            }
+            switch(type) {
+            case "hidden":
+                item = $("<input type='hidden'/>");
+                break;
+            case "boolean":
+                item = $("<input type='checkbox'/>");
+                break;
+            case "text-multi":
+                item = $("<textarea/>");
+                break;
+            case "text-single":
+                item = $("<input type='text'/>");
+                break;
+            case "fixed":
+                item = $("<input type='text'/>").attr("readonly",true);
+                break;
+            case "jid-multi":
+                item = $("<textarea/>");
+                break;
+            case "jid-single":
+                item = $("<input type='text'/>");
+                break;
+            case "list-multi":
+                item = $("<select multiple='multiple'/>");
+                $(this).find("option").each(function(){
+                        $("<option/>").val($(this).find("value").text()).text($(this).attr("label")).appendTo(item);
+                        });
+                break;
+            case "list-single":
+                item = $("<select/>");
+                $(this).find("option").each(function(){
+                        $("<option/>").val($(this).find("value").text()).text($(this).attr("label")).appendTo(item);
+                        });
+                break;
+            case "text-private":
+                item = $("<input type='password'/>");
+                break;
+            default:
+                item = $("<input/>");
+            }
+            if ($(this).find("value")) {
+                var value = null;
+                if ((type == "text-multi") || (type == "jid-multi")) {
+                    value = "";
+                    $(this).find("value").each(function() {
+                        value = value + $(this).text() + "\n";
+                    });
+                    item.val(value);
+                } else if (type == "list-multi") {
+                    value = new Array();
+                    $(this).find("value").each(function() {
+                        value[value.length] = $(this).text();
+                    });
+                } else {
+                    item.val($(this).find("value").text());
+                }
+            }
+            if ($(this).attr("var")) {
+                item.attr("name", $(this).attr("var"));
+                item.attr("id", $(this).attr("var"));
+            }
+            fieldset.append(item);
+            fieldset.append("<br/>");
+    });
+    $(elem).append(form);
+}
+
 function displayResult(result) {
     var status = $(result).find("command").attr("status");
 
     $("#output *").remove();
-    $(result).find("note").each(function(index, e) {
-        type = $(e).attr("type");
-        if (!type) {
-           type = "info";
+    $(result).find("command > *").each(function(index, e) {
+        if ($(e).is("note")) {
+            addNote("#output", $(e).text(), $(e).attr("type"));
+        } else if ($(e).is("x[xmlns=jabber:x:data]")) {
+            addForm("#output", e);
         }
-        $("#output").append("<p class='" + type + "Note'>" + $(e).text() + "</p>");
     });
     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'/>");
+        $("#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']) {
             if ($(result).find('actions ' + kind).length > 0)
                 $('#' + kind + 'Button').attr("disabled", "false");
         }
+        $('#cancelButton').bind("click", function() {
+            var cancelIQ = $iq({ type: "set", to: "localhost", id: connection.getUniqueId() })
+                .c("command", { xmlns: Strophe.NS.ADHOC, node: cmdNode, sessionid: sessionid, action: "cancel" });
+            cmdNode = null
+            sessionid = null;
+            connection.sendIQ(cancelIQ, displayResult);
+        });
     } else {
         input = $("<input type='button' value='Restart'/>").bind("click", function() {
             $('#output *').remove();
+            sessionid = null;
+            cmdNode = null;
             getCommandNodes();
         });
         $("#output").append(input);
@@ -70,14 +169,17 @@ function displayResult(result) {
 }
 
 function runCommand() {
-    execIQ = $iq({ type: "set", to: "localhost", id: connection.getUniqueId() })
-        .c("command", { xmlns: Strophe.NS.ADHOC, node: $(this).attr("id"),
-            action: "execute" });
-    connection.sendIQ(execIQ, displayResult);
+    cmdNode = $(this).attr("id"); // Save not of executed command (in global)
+    var execIQ = $iq({ type: "set", to: "localhost", id: connection.getUniqueId() })
+        .c("command", { xmlns: Strophe.NS.ADHOC, node: cmdNode, action: "execute" });
+    connection.sendIQ(execIQ, function(result) {
+        sessionid = $(result).find("command").attr("sessionid");
+        displayResult(result);
+    });
 }
 
 function getCommandNodes() {
-    nodesIQ = $iq({ type: "get", to: "localhost", id: "nodes1" }).c("query", {xmlns: Strophe.NS.DISCO_ITEMS, node: Strophe.NS.ADHOC});
+    var nodesIQ = $iq({ type: "get", to: "localhost", id: "nodes1" }).c("query", {xmlns: Strophe.NS.DISCO_ITEMS, node: Strophe.NS.ADHOC});
     connection.sendIQ(nodesIQ, function(result) {
         $('#output').append("<ul id='items'></ul>");
         $(result).find("item").each(function(index, e) {