Refactor and cleanup edit module, add text components, store page and app run page.

git-svn-id: http://svn.us.apache.org/repos/asf/tuscany@1083694 13f79535-47bb-0310-9956-ffa450edef68

6 files changed, 146 insertions, 23 deletions

diff --git a/sca-cpp/trunk/modules/js/htdocs/component.js b/sca-cpp/trunk/modules/js/htdocs/component.js
index 8e25292018..beef9357e5 100644
--- a/sca-cpp/trunk/modules/js/htdocs/component.js
+++ b/sca-cpp/trunk/modules/js/htdocs/component.js
@@ -102,9 +102,9 @@ JSONClient.toJSON = function(o) {
 /**
  * Construct an HTTPBindingClient.
  */
-function HTTPBindingClient(cname, uri, objectID) {
-    this.uri = "/references/" + cname + "/" + uri;
-    this.objectID = objectID;
+function HTTPBindingClient(name, uri) {
+    this.name = name;
+    this.uri = uri;
     this.apply = this.createApplyMethod();
 }
 
@@ -407,21 +407,17 @@ HTTPBindingClient.getHTTPRequest = function() {
 var sca = {};
 
 /**
- * Return a component.
+ * Return a component proxy.
  */
 sca.component = function(name) {
-    function ClientComponent(name) {
-        this.name = name;
-    }
-
-    return new ClientComponent(name);
+    return new HTTPBindingClient(name, '/components/' + name);
 };
 
 /**
  * Return a reference proxy.
  */
-sca.reference = function(comp, name) {
-    return new HTTPBindingClient(comp.name, name);
+sca.reference = function(comp, rname) {
+    return new HTTPBindingClient(comp.name + '/' + rname, "/references/" + comp.name + "/" + rname);
 };
 
 /**
diff --git a/sca-cpp/trunk/modules/js/htdocs/jsonutil.js b/sca-cpp/trunk/modules/js/htdocs/jsonutil.js
index 1a1a027e88..47e3ec4130 100644
--- a/sca-cpp/trunk/modules/js/htdocs/jsonutil.js
+++ b/sca-cpp/trunk/modules/js/htdocs/jsonutil.js
@@ -80,7 +80,7 @@ json.jsValToValue = function(jsv) {
     if (isList(jsv))
         return json.jsPropertiesToValues(mklist(), jsv, reverse(range(0, jsv.length)));
     if (typeof jsv == 'object')
-        return json.jsPropertiesToValues(mklist(), jsv, properties(jsv));
+        return json.jsPropertiesToValues(mklist(), jsv, reverse(properties(jsv)));
     if (typeof jsv == 'string')
         return '' + jsv;
     return jsv;
diff --git a/sca-cpp/trunk/modules/js/htdocs/ui.css b/sca-cpp/trunk/modules/js/htdocs/ui.css
index 88d1806aaa..9b960e95ca 100644
--- a/sca-cpp/trunk/modules/js/htdocs/ui.css
+++ b/sca-cpp/trunk/modules/js/htdocs/ui.css
@@ -22,10 +22,18 @@ white-space: margin: 0px;
 font-family: arial,sans-serif; font-style: normal; font-variant: normal; font-size: 13px;
 }
 
+.delayed {
+visibility: hidden;
+}
+
 table {
 border: 0px; border-collapse: collapse; border-color: #a2bae7; border-style: solid;
 font-family: arial,sans-serif; font-style: normal; font-variant: normal; font-size: 13px;
-overflow: hidden;
+overflow: visible;
+}
+
+.trb {
+border-bottom: 1px; border-bottom-style: solid; border-color: #dcdcdc;
 }
 
 th {
@@ -36,6 +44,14 @@ border-style: solid; border-top-color: #a2bae7; border-bottom-color: #d1d3d4; bo
 overflow: hidden;
 }
 
+.section {
+font-weight: bold; background-color: #e5ecf9; color: #000000;
+text-align: left; padding-left: 2px; padding-right: 8px; padding-top: 2px; padding-bottom: 4px; vertical-align: text-top; white-space: nowrap;
+border-top: 1px; border-bottom: 1px; border-left: 0px; border-right: 0px;
+border-style: solid; border-top-color: #a2bae7; border-bottom-color: #d1d3d4; border-left-color: #a2bae7; border-right-color: #a2bae7;
+overflow: hidden;
+}
+
 .thl {
 border-left: 0px;
 }
@@ -50,11 +66,10 @@ padding: 0px;
 
 td {
 padding-left: 2px; padding-top: 2px; padding-right: 8px; white-space: nowrap; vertical-align: text-top; border: 0px;
-overflow: hidden;
 }
 
 .tdl {
-border-right: 1px; border-style: solid; border-color: #a2bae7;
+border-right: 1px; border-style: solid; border-color: #a2bae7; width: 10px;
 }
 
 .tdr {
@@ -65,6 +80,25 @@ border-left: 1px; border-style: solid; border-color: #a2bae7;
 padding-left: 2px; padding-top: 2px; padding-right: 8px; white-space: normal; vertical-align: text-top;
 }
 
+.datatdl {
+border-right: 1px; border-top: 1px; border-bottom: 1px; border-style: solid; border-color: #dcdcdc; width: 10px;
+}
+
+.datatdr {
+border-left: 1px; border-top: 1px; border-bottom: 1px; border-style: solid; border-color: #dcdcdc;
+}
+
+.datatable {
+border-top: 1px; border-bottom: 1px; border-style: solid; border-color: #dcdcdc;
+overflow: visible;
+}
+
+.databg {
+opacity: .6;  
+-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
+filter: alpha(opacity=60);
+}
+
 .widgetframe {
 visibility: hidden; width: 0px; height: 0px; border: 0px;
 }
@@ -125,6 +159,10 @@ font-size: 200%; font-weight: bold;
 font-size: 150%; font-weight: bold;
 }
 
+img {
+border: 0px;
+}
+
 .imgbutton {
 width: 142px; height: 64px; margin-left: 20px; margin-right: 20px; padding: 0px; border: 1px;
 cursor: pointer; cursor: hand;
diff --git a/sca-cpp/trunk/modules/js/htdocs/ui.js b/sca-cpp/trunk/modules/js/htdocs/ui.js
index b2527dc66b..db8c439de4 100644
--- a/sca-cpp/trunk/modules/js/htdocs/ui.js
+++ b/sca-cpp/trunk/modules/js/htdocs/ui.js
@@ -233,19 +233,28 @@ ui.queryParams = function() {
 /**
  * Bind a widget iframe to an element.
  */
-ui.widgets = new Array();
+ui.widgets = {};
+ui.onload = {};
 
-ui.loadwidget = function(el, doc) {
+ui.loadwidget = function(el, doc, cb) {
     var f = el + 'Frame';
+    window.ui.widgets[f] = el;
+    window.ui.onload[f] = cb;
     var div = document.createElement('div');
     div.id = f + 'Div';
-    div.innerHTML = '<iframe id="' + f + '" class="widgetframe" scrolling="no" frameborder="0" src="' + doc + '"></iframe>';
+    div.innerHTML = '<iframe id="' + f + '" class="widgetframe" scrolling="no" frameborder="0" src="' + doc + '" onload="window.ui.onload[this.id]()"></iframe>';
     document.body.appendChild(div);
-    window.ui.widgets[f] = el;
     return f;
 };
 
 /**
+ * Show the current document body.
+ */
+ui.showbody = function() {
+    document.body.style.visibility = 'visible';
+};
+
+/**
  * Install a widget into the element bound to its iframe.
  */
 ui.installwidget = function() {
@@ -282,3 +291,43 @@ ui.csspos = function(p) {
     return Number(p.substr(0, p.length - 2));
 };
 
+/**
+ * Convert a list of elements to an HTML table.
+ */
+ui.datatable = function(l) {
+    log('datatable', writeValue(l));
+
+    function indent(i) {
+        if (i == 0)
+            return '';
+        return '&nbsp;&nbsp;' + indent(i - 1);
+    }
+
+    function rows(l, i) {
+        if (isNil(l))
+            return '';
+        var e = car(l);
+
+        if (!isList(e))
+            return rows(expandElementValues("'value", l), i);
+
+        if (elementHasValue(e)) {
+            var v = elementValue(e);
+            if (!isList(v)) {
+                return '<tr><td class="datatdl">' + indent(i) + elementName(e).slice(1) + '</td>' +
+                    '<td class="datatdr">' + v + '</td></tr>' +
+                    rows(cdr(l), i);
+            }
+
+            return rows(expandElementValues(elementName(e), v), i) + rows(cdr(l), i);
+        }
+
+        return '<tr><td class="datatdl">' + indent(i) + elementName(e).slice(1) + '</td>' +
+            '<td class="datatdr">' + '</td></tr>' +
+            rows(elementChildren(e), i + 1) +
+            rows(cdr(l), i);
+    }
+
+    return '<table class="datatable ' + (window.name == 'dataFrame'? ' databg' : '') + '" style="width: 100%;">' + rows(l, 0) + '</table>';
+}
+
diff --git a/sca-cpp/trunk/modules/js/htdocs/uicyan.css b/sca-cpp/trunk/modules/js/htdocs/uicyan.css
index 88d1806aaa..9b960e95ca 100644
--- a/sca-cpp/trunk/modules/js/htdocs/uicyan.css
+++ b/sca-cpp/trunk/modules/js/htdocs/uicyan.css
@@ -22,10 +22,18 @@ white-space: margin: 0px;
 font-family: arial,sans-serif; font-style: normal; font-variant: normal; font-size: 13px;
 }
 
+.delayed {
+visibility: hidden;
+}
+
 table {
 border: 0px; border-collapse: collapse; border-color: #a2bae7; border-style: solid;
 font-family: arial,sans-serif; font-style: normal; font-variant: normal; font-size: 13px;
-overflow: hidden;
+overflow: visible;
+}
+
+.trb {
+border-bottom: 1px; border-bottom-style: solid; border-color: #dcdcdc;
 }
 
 th {
@@ -36,6 +44,14 @@ border-style: solid; border-top-color: #a2bae7; border-bottom-color: #d1d3d4; bo
 overflow: hidden;
 }
 
+.section {
+font-weight: bold; background-color: #e5ecf9; color: #000000;
+text-align: left; padding-left: 2px; padding-right: 8px; padding-top: 2px; padding-bottom: 4px; vertical-align: text-top; white-space: nowrap;
+border-top: 1px; border-bottom: 1px; border-left: 0px; border-right: 0px;
+border-style: solid; border-top-color: #a2bae7; border-bottom-color: #d1d3d4; border-left-color: #a2bae7; border-right-color: #a2bae7;
+overflow: hidden;
+}
+
 .thl {
 border-left: 0px;
 }
@@ -50,11 +66,10 @@ padding: 0px;
 
 td {
 padding-left: 2px; padding-top: 2px; padding-right: 8px; white-space: nowrap; vertical-align: text-top; border: 0px;
-overflow: hidden;
 }
 
 .tdl {
-border-right: 1px; border-style: solid; border-color: #a2bae7;
+border-right: 1px; border-style: solid; border-color: #a2bae7; width: 10px;
 }
 
 .tdr {
@@ -65,6 +80,25 @@ border-left: 1px; border-style: solid; border-color: #a2bae7;
 padding-left: 2px; padding-top: 2px; padding-right: 8px; white-space: normal; vertical-align: text-top;
 }
 
+.datatdl {
+border-right: 1px; border-top: 1px; border-bottom: 1px; border-style: solid; border-color: #dcdcdc; width: 10px;
+}
+
+.datatdr {
+border-left: 1px; border-top: 1px; border-bottom: 1px; border-style: solid; border-color: #dcdcdc;
+}
+
+.datatable {
+border-top: 1px; border-bottom: 1px; border-style: solid; border-color: #dcdcdc;
+overflow: visible;
+}
+
+.databg {
+opacity: .6;  
+-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
+filter: alpha(opacity=60);
+}
+
 .widgetframe {
 visibility: hidden; width: 0px; height: 0px; border: 0px;
 }
@@ -125,6 +159,10 @@ font-size: 200%; font-weight: bold;
 font-size: 150%; font-weight: bold;
 }
 
+img {
+border: 0px;
+}
+
 .imgbutton {
 width: 142px; height: 64px; margin-left: 20px; margin-right: 20px; padding: 0px; border: 1px;
 cursor: pointer; cursor: hand;
diff --git a/sca-cpp/trunk/modules/js/htdocs/util.js b/sca-cpp/trunk/modules/js/htdocs/util.js
index 512e3c26d5..5697ad27d4 100644
--- a/sca-cpp/trunk/modules/js/htdocs/util.js
+++ b/sca-cpp/trunk/modules/js/htdocs/util.js
@@ -25,7 +25,9 @@
  * Scheme-like lists.
  */
 function cons(car, cdr) {
-    return new Array(car).concat(cdr);
+    var a = new Array();
+    a.push(car);
+    return a.concat(cdr);
 }
 
 function car(l) {