Some improvements to the edit module. Add a few sample apps and test cases, show current user and links to app data.

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

5 files changed, 64 insertions, 20 deletions

diff --git a/sca-cpp/trunk/modules/edit/htdocs/dash/dashboard.html b/sca-cpp/trunk/modules/edit/htdocs/dash/dashboard.html
index 9d63253830..3307d193ca 100644
--- a/sca-cpp/trunk/modules/edit/htdocs/dash/dashboard.html
+++ b/sca-cpp/trunk/modules/edit/htdocs/dash/dashboard.html
@@ -146,7 +146,7 @@ $('createAppOKButton').onclick = function() {
     var entry = atom.writeATOMEntry(app);
     dashboard.put(name, car(entry));
     getapps();
-    div.style.visibility = 'hidden';
+    $('newApp').style.visibility = 'hidden';
     return false;
 };
 
diff --git a/sca-cpp/trunk/modules/edit/htdocs/dash/index.html b/sca-cpp/trunk/modules/edit/htdocs/dash/index.html
index 834bca6201..308afdb13a 100644
--- a/sca-cpp/trunk/modules/edit/htdocs/dash/index.html
+++ b/sca-cpp/trunk/modules/edit/htdocs/dash/index.html
@@ -43,7 +43,9 @@ ui.loadwidget('menu', '/menu.html');
 <script type="text/javascript">
 
 // Load the dashboard
-ui.loadiframe('dashboard', 'dashboard.html');
+$('dashboard').innerHTML =
+    '<iframe id="dashboardFrame" style="height: 5000px; width: 100%; border: 0px;" scrolling="no" frameborder="0" src="dashboard.html"></iframe>';
+
 </script>
 </body>
 </html>
diff --git a/sca-cpp/trunk/modules/edit/htdocs/graph/graph.html b/sca-cpp/trunk/modules/edit/htdocs/graph/graph.html
index 6de3617651..e03cc6038d 100644
--- a/sca-cpp/trunk/modules/edit/htdocs/graph/graph.html
+++ b/sca-cpp/trunk/modules/edit/htdocs/graph/graph.html
@@ -39,6 +39,7 @@
 <th class="thr" style="padding-left: 4px; padding-top: 0px; padding-bottom: 0px;">
 <input id="compName" type="text" value="component name" style="position: relative; width: 200px;"/>
 <input id="propValue" type="text" value="property value" style="position: relative; width: 300px;"/>
+<span id="compValue" style="position: relative"></span>
 </th>
 
 <th class="thl thr" style="padding-top: 0px; padding-bottom: 0px; padding-right: 0px; text-align: right;">
@@ -99,7 +100,7 @@ function getapp(name, g) {
                 '</composite>';
             composite = readXML(mklist(x));
         }
-        graph.edit(composite, graph.composite(composite, graph.mkpath().move(palcx,0)), g);
+        graph.edit(name, composite, graph.composite(composite, graph.mkpath().move(palcx,0)), g);
     });
 }
 
@@ -147,7 +148,7 @@ $('saveButton').onclick = function(e) {
 };
 
 // Create editor graph area
-var g = graph.mkgraph(graph.mkpath().move(0,40), $('compName'), $('propValue'));
+var g = graph.mkgraph(graph.mkpath().move(0,40), $('compName'), $('propValue'), $('compValue'));
 var bg = graph.mkgroup(graph.mkpath());
 
 // Install the palettes
@@ -155,14 +156,14 @@ var gpalettes = new Array();
 var spalette = 'events';
 var pos = graph.mkpath();
 installpalette('events', pos.rmove(0,0), g, bg, spalette, gpalettes);
-installpalette('values', pos.rmove(0,50), g, bg, spalette, gpalettes);
-installpalette('url', pos.rmove(0, 50), g, bg, spalette, gpalettes);
-installpalette('lists', pos.rmove(0, 50), g, bg, spalette, gpalettes);
-installpalette('text', pos.rmove(0, 50), g, bg, spalette, gpalettes);
-installpalette('logic', pos.rmove(0, 50), g, bg, spalette, gpalettes);
-installpalette('math', pos.rmove(0, 50), g, bg, spalette, gpalettes);
-installpalette('social', pos.rmove(0, 50), g, bg, spalette, gpalettes);
-installpalette('sensors', pos.rmove(0, 50), g, bg, spalette, gpalettes);
+installpalette('values', pos.rmove(0,40), g, bg, spalette, gpalettes);
+installpalette('url', pos.rmove(0, 40), g, bg, spalette, gpalettes);
+installpalette('lists', pos.rmove(0, 40), g, bg, spalette, gpalettes);
+installpalette('text', pos.rmove(0, 40), g, bg, spalette, gpalettes);
+installpalette('logic', pos.rmove(0, 40), g, bg, spalette, gpalettes);
+installpalette('math', pos.rmove(0, 40), g, bg, spalette, gpalettes);
+installpalette('social', pos.rmove(0, 40), g, bg, spalette, gpalettes);
+installpalette('sensors', pos.rmove(0, 40), g, bg, spalette, gpalettes);
 
 // Get and display the current app
 getapp(appname, g);
diff --git a/sca-cpp/trunk/modules/edit/htdocs/graph/graph.js b/sca-cpp/trunk/modules/edit/htdocs/graph/graph.js
index fa202d6b86..7273dae1bf 100644
--- a/sca-cpp/trunk/modules/edit/htdocs/graph/graph.js
+++ b/sca-cpp/trunk/modules/edit/htdocs/graph/graph.js
@@ -56,7 +56,7 @@ var trashcx = 230;
 var proxcx = 20;
 var proxcy = 20;
 var buttoncx = 70;
-var buttoncy = 40;
+var buttoncy = 30;
 var curvsz = 6;
 var tabsz = 3;
 
@@ -114,7 +114,7 @@ if (ui.isIE()) {
     /**
      * Make a VML graph.
      */
-    graph.mkgraph = function(pos, cname, pvalue) {
+    graph.mkgraph = function(pos, cname, pvalue, cvalue) {
 
         // Create div element to host the graph
         var div = document.createElement('div');
@@ -160,6 +160,7 @@ if (ui.isIE()) {
                 // Reset current selection
                 cname.value = '';
                 pvalue.value = '';
+                cvalue.innerHTML = '';
                 return false;
             }
 
@@ -185,6 +186,7 @@ if (ui.isIE()) {
             // Update the component name and property value fields
             cname.value = graph.selected.id;
             pvalue.value = graph.property(graph.selected.comp);
+            cvalue.innerHTML = graph.compvaluelink(vmlg.appname, graph.selected.id);
             return false;
         };
 
@@ -232,6 +234,7 @@ if (ui.isIE()) {
                     graph.selected = null;
                     cname.value = '';
                     pvalue.value = '';
+                    cvalue.innerHTML = '';
                 }
             }
 
@@ -281,6 +284,7 @@ if (ui.isIE()) {
             var compos = scdl.composite(svg.compos);
             cname.value = graph.ucid(cname.value, compos);
             graph.selected.id = cname.value;
+            cvalue.innerHTML = graph.compvaluelink(svg.appname, graph.selected.id);
             setElement(compos, graph.renamecomp(graph.selected.comp, compos, cname.value));
 
             // Refresh the composite
@@ -575,7 +579,7 @@ if (ui.isIE()) {
     /**
      * Make an SVG graph.
      */
-    graph.mkgraph = function(pos, cname, pvalue) {
+    graph.mkgraph = function(pos, cname, pvalue, cvalue) {
 
         // Create a div element to host the graph
         var div = document.createElement('div');
@@ -624,6 +628,7 @@ if (ui.isIE()) {
                 // Reset current selection
                 cname.value = '';
                 pvalue.value = '';
+                cvalue.innerHTML ='';
                 return false;
             }
 
@@ -649,6 +654,7 @@ if (ui.isIE()) {
             // Update the component name and property value fields
             cname.value = graph.selected.id;
             pvalue.value = graph.property(graph.selected.comp);
+            cvalue.innerHTML = graph.compvaluelink(svg.appname, graph.selected.id);
             return false;
         };
 
@@ -699,6 +705,7 @@ if (ui.isIE()) {
                     graph.selected = null;
                     cname.value = '';
                     pvalue.value = '';
+                    cvalue.innerHTML = '';
                 }
             }
 
@@ -766,6 +773,7 @@ if (ui.isIE()) {
             var compos = scdl.composite(svg.compos);
             cname.value = graph.ucid(cname.value, compos);
             graph.selected.id = cname.value;
+            cvalue.innerHTML = graph.compvaluelink(svg.appname, graph.selected.id);
             setElement(compos, graph.renamecomp(graph.selected.comp, compos, cname.value));
 
             // Refresh the composite
@@ -1121,7 +1129,7 @@ graph.lsvcs = function(comp) {
  */
 graph.brefs = function(comp) {
     return memo(comp, 'brefs', function() {
-        return filter(function(r) { return scdl.align(r) == 'bottom'; }, scdl.references(comp));
+        return filter(function(r) { return scdl.align(r) == 'bottom' && scdl.visible(r) != 'false'; }, scdl.references(comp));
     });
 };
 
@@ -1130,7 +1138,11 @@ graph.brefs = function(comp) {
  */
 graph.rrefs = function(comp) {
     return memo(comp, 'rrefs', function() {
-        return filter(function(r) { var a = scdl.align(r); return a == null || a == 'right'; }, scdl.references(comp));
+        return filter(function(r) {
+            var a = scdl.align(r);
+            var v = scdl.visible(r);
+            return (a == null || a == 'right') && v != 'false';
+        }, scdl.references(comp));
     });
 };
 
@@ -1791,12 +1803,25 @@ graph.refresh = function(g) {
  * Display and enable editing of a composite and the graphical
  * nodes that represent it.
  */
-graph.edit = function(compos, nodes, g, cname, pvalue) {
+graph.edit = function(appname, compos, nodes, g) {
 
-    // Store the composite in the graphical canvas
+    // Store the appname and composite in the graphical canvas
+    g.appname = appname;
     g.compos = compos;
 
     // Display the composite nodes
     return graph.display(nodes, g);
 };
 
+/**
+ * Return the link to a component value.
+ */
+graph.compvaluelink = function(appname, cname) {
+    var scheme = 'http';
+    var domain = "sca-store.com";
+    var port = '8090';
+    var link = scheme + '://' + appname + '.' + domain + ':' + port + '/components/' + cname;
+    return '<a href="' + link + '">' + link + '</a>';
+
+};
+
diff --git a/sca-cpp/trunk/modules/edit/htdocs/menu.html b/sca-cpp/trunk/modules/edit/htdocs/menu.html
index d46fd8a882..d60d80b1cb 100644
--- a/sca-cpp/trunk/modules/edit/htdocs/menu.html
+++ b/sca-cpp/trunk/modules/edit/htdocs/menu.html
@@ -21,6 +21,7 @@
 <link rel="stylesheet" type="text/css" href="/ui.css">
 <script type="text/javascript" src="/util.js"></script>
 <script type="text/javascript" src="/ui.js"></script>
+<script type="text/javascript" src="/component.js"></script>
 </head>
 <body>
 <div id="menu"></div>
@@ -28,6 +29,21 @@
 <script type="text/javascript">
 ui.installwidget();
 
+var menuWidget = sca.component("MenuWidget");
+var user = sca.defun(sca.reference(menuWidget, "user"), "id");
+
+/**
+ * Display the current signed in user.
+ */
+function userMenu() {
+    function UserMenu() {
+        this.content = function() {
+            return '<span><b>' + user.id() + '</b></span>';
+        };
+    }
+    return new UserMenu();
+}
+
 /**
  * Return the current app name.
  */
@@ -41,7 +57,7 @@ var name = appname();
 mdiv.innerHTML = ui.menubar(
     append(mklist(ui.menu('Home', '/'), ui.menu('Dashboard', '/dash')),
             (isNil(name) || name == 'undefined')? mklist() : mklist(ui.menu('Composition', '/graph/?app=' + name), ui.menu('Page', '/page/?app=' + name), ui.menu('Settings', '/app/?app=' + name))),
-    mklist(ui.menu('Sign out', '/logout')));
+    mklist(userMenu(), ui.menu('Sign out', '/logout')));
 
 </script>
 </body>