Refactor groups of reusable components and improve layout a bit. Fix bug preventing saving empty composites.

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

20 files changed, 540 insertions, 299 deletions

diff --git a/sca-cpp/trunk/modules/edit/apps/myprofile/app.composite b/sca-cpp/trunk/modules/edit/apps/myprofile/app.composite
new file mode 100644
index 0000000000..bc24ad1500
--- /dev/null
+++ b/sca-cpp/trunk/modules/edit/apps/myprofile/app.composite
@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<composite xmlns="http://docs.oasis-open.org/ns/opencsa/sca/200912" xmlns:t="http://tuscany.apache.org/xmlns/sca/1.1" targetNamespace="http://myprofile" name="myprofile"><component t:x="425" t:y="244" name="fbprofile" t:color="blue1"><documentation>facebook profile</documentation><t:implementation.python script="fbprofile.py"/><service name="fbprofile"/><reference target="first" name="id"/></component><component t:x="425" t:y="287" name="twprofile" t:color="blue1"><documentation>twitter profile</documentation><t:implementation.python script="twprofile.py"/><service name="twprofile"/><reference target="first2" name="id"/></component><component t:x="549" t:y="243" name="first" t:color="yellow1"><documentation>first</documentation><t:implementation.python script="first.py"/><service name="first"/><reference target="rest" name="value"/></component><component t:x="679" t:y="251" name="rest" t:color="yellow1"><documentation>rest</documentation><t:implementation.python script="rest.py"/><service name="rest"/><reference target="path" name="value"/></component><component t:x="726" t:y="253" name="path" t:color="orange1"><documentation>path</documentation><t:implementation.python script="path.py"/><service name="path"/><property name="path" t:visible="false"/></component><component t:x="625" t:y="323" name="path2" t:color="orange1"><documentation>path</documentation><t:implementation.python script="path.py"/><service name="path"/><property name="path" t:visible="false"/></component><component t:x="575" t:y="325" name="rest2" t:color="yellow1"><documentation>rest</documentation><t:implementation.python script="rest.py"/><service name="rest"/><reference target="path2" name="value"/></component><service name="page" promote="page"/><component t:x="25" t:y="25" name="page" t:color="green1"><documentation>page</documentation><t:implementation.python script="page.py"/><service name="page" t:visible="false"/><property>/mypage.html</property><reference target="list" name="value"/></component><component t:x="389" t:y="158" name="first2" t:color="yellow1"><documentation>first</documentation><t:implementation.python script="first.py"/><service name="first"/><reference target="rest2" name="value"/></component><component t:x="436" t:y="123" name="text" t:color="orange1"><t:implementation.python script="text.py"/><service name="text"/><property>This is my combined social profile</property></component><component t:x="128" t:y="25" name="list" t:color="yellow1"><documentation>list</documentation><t:implementation.python script="list_.py"/><service name="list"/><reference target="append" name="rest"/><property>This is my combined social profile</property></component><component t:x="352" t:y="26" name="append" t:color="yellow1"><documentation>append</documentation><t:implementation.python script="list_.py"/><service name="append"/><reference target="fbprofile" name="first"/><reference target="twprofile" name="second"/></component></composite>
diff --git a/sca-cpp/trunk/modules/edit/apps/myprofile/app.html b/sca-cpp/trunk/modules/edit/apps/myprofile/app.html
new file mode 100644
index 0000000000..3a57127751
--- /dev/null
+++ b/sca-cpp/trunk/modules/edit/apps/myprofile/app.html
@@ -0,0 +1,32 @@
+<!--
+    * Licensed to the Apache Software Foundation (ASF) under one
+    * or more contributor license agreements.  See the NOTICE file
+    * distributed with this work for additional information
+    * regarding copyright ownership.  The ASF licenses this file
+    * to you under the Apache License, Version 2.0 (the
+    * "License"); you may not use this file except in compliance
+    * with the License.  You may obtain a copy of the License at
+    * 
+    *   http://www.apache.org/licenses/LICENSE-2.0
+    * 
+    * Unless required by applicable law or agreed to in writing,
+    * software distributed under the License is distributed on an
+    * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+    * KIND, either express or implied.  See the License for the
+    * specific language governing permissions and limitations
+    * under the License.    
+-->
+<div id="page">
+
+<span id="storeh1" class="h1" style="position:absolute; left: 0px; top: 0px"><h1>Store</h1></span>
+<span id="catalogh2" class="h2" style="position:absolute; left: 0px; top: 40px"><h2>Catalog</h2></span>
+<span id="addToCart" class="button" style="position:absolute; left: 0px; top: 160px"><input type="button" value="Add to Cart"/></span>
+  
+<span id="carth2" class="h2" style="position:absolute; left: 0px; top: 200px"><h2>Your Shopping Cart</h2></span>
+<span id="total" class="text" style="position:absolute; left: 0px; top: 300px"><span>total</span></span>
+
+<span id="checkout" class="button" style="position:absolute; left: 0px; top: 340px"><input type="button" value="Checkout"/></span>
+<span id="empty" class="button" style="position:absolute; left: 120px; top: 340px"><input type="button" value="Empty"/></span>
+<span id="feed" class="link" style="position:absolute; left: 240px; top: 340px"><a href="shoppingCart/"><span>(feed)</span></a></span>
+
+</div>
diff --git a/sca-cpp/trunk/modules/edit/dashboards/joe@localhost b/sca-cpp/trunk/modules/edit/dashboards/joe@localhost
index b9419e75d0..ba2da90caf 100644
--- a/sca-cpp/trunk/modules/edit/dashboards/joe@localhost
+++ b/sca-cpp/trunk/modules/edit/dashboards/joe@localhost
@@ -1 +1 @@
-(("Sample Online Store App" "store" ()) ("Layout Variation of the Online Store App" "store2" ()) ("Another Variation of the Online Store App" "store3" ()) ("Sample HTTP Relay App" "relay" ()) ("Travel Tutorial App" "travel" ()))
+(("Sample Online Store App" "store" ()) ("Layout Variation of the Online Store App" "store2" ()) ("Another Variation of the Online Store App" "store3" ()) ("Sample HTTP Relay App" "relay" ()) ("Travel Tutorial App" "travel" ()) ("My Aggregated Profile" "myprofile" ()) ("An Empty Test App" "test" ()))
\ No newline at end of file
diff --git a/sca-cpp/trunk/modules/edit/htdocs/app/app.html b/sca-cpp/trunk/modules/edit/htdocs/app/app.html
index 7d95dcdd63..46de9d61c9 100644
--- a/sca-cpp/trunk/modules/edit/htdocs/app/app.html
+++ b/sca-cpp/trunk/modules/edit/htdocs/app/app.html
@@ -33,7 +33,7 @@
 
 <table style="width: 100%;">
 <tr>
-<th class="thl thr">Properties</th>
+<th class="thl thr">Settings</th>
 
 <th class="thl thr" style="padding-top: 0px; padding-bottom: 0px; padding-right: 0px; text-align: right;">
 <span id="source" style="font-weight: normal;">[atom]</span>
@@ -49,11 +49,11 @@
 <tr><tr><td><b>App Title:</b></td></tr>
 <tr><td><input type="text" id="appTitle" size="30"/></td></tr>
 <tr><tr><td><b>Category:</b></td></tr>
-<tr><td><input type="text" id="appCategory" size="15" value="Cool Apps"/></td></tr>
+<tr><td><input type="text" id="appCategory" size="15"/></td></tr>
 <tr><tr><td><b>Updated:</b></td></tr>
-<tr><td><span id="appUpdated">Feb 4, 2011</span></td></tr>
+<tr><td><span id="appUpdated"></span></td></tr>
 <tr><tr><td><b>Description:</b></td></tr>
-<tr><td><textarea id="appDescription" cols="30" rows="5">Enter a short description of your app here</textarea></td></tr>
+<tr><td><textarea id="appDescription" cols="30" rows="5"></textarea></td></tr>
 </table>
 </form>
 </div>
@@ -74,12 +74,23 @@ var appname = ui.queryParams()['app'];
 $('source').innerHTML = '[<a href="/apps/' + appname + '">atom</a>]';
 
 /**
+ * Default field values.
+ */
+var deftitle = 'Enter the title of your app here';
+var defcategory = 'Cool Apps';
+var defdate = 'Feb 4, 2011';
+var defdesc = 'Enter a short description of your app here';
+
+/**
  * Get and display an app.
  */
 function getapp(name) {
     dashboard.get(name, function(doc) {
-        var entry = atom.readATOMEntryDocument(doc);
-        $('appTitle').value = car(entry);
+        var entry = doc != null? atom.readATOMEntryDocument(doc) : mklist('', name);
+        $('appTitle').value = car(entry) != ''? car(entry) : deftitle;
+        $('appCategory').value = defcategory;
+        $('appUpdated').innerHTML = defdate;
+        $('appDescription').innerHTML = defdesc;
     });
 }
 
@@ -88,9 +99,8 @@ function getapp(name) {
  */
 $('saveButton').onclick = function() {
     var title = $('appTitle').value;
-    var app = mklist(title, appname, mklist());
+    var app = mklist(title != deftitle && title != ''? title : appname, appname, mklist());
     var entry = atom.writeATOMEntry(app);
-
     dashboard.put(appname, car(entry));
     return false;
 };
diff --git a/sca-cpp/trunk/modules/edit/htdocs/app/index.html b/sca-cpp/trunk/modules/edit/htdocs/app/index.html
index b4478dc8dd..633031b2b3 100644
--- a/sca-cpp/trunk/modules/edit/htdocs/app/index.html
+++ b/sca-cpp/trunk/modules/edit/htdocs/app/index.html
@@ -18,7 +18,7 @@
 -->
 <html>
 <head>
-<title>App Editor</title>
+<title>App Settings</title>
 <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0"/> 
 <meta name="apple-mobile-web-app-capable" content="yes"/>
 <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/>
diff --git a/sca-cpp/trunk/modules/edit/htdocs/dash/dashboard.html b/sca-cpp/trunk/modules/edit/htdocs/dash/dashboard.html
index 11c0b95979..6072624e84 100644
--- a/sca-cpp/trunk/modules/edit/htdocs/dash/dashboard.html
+++ b/sca-cpp/trunk/modules/edit/htdocs/dash/dashboard.html
@@ -49,6 +49,10 @@
 <tr><td><input type="text" id="appName" size="10"/></td></tr>
 <tr><tr><td><b>App Title:</b></td></tr>
 <tr><td><input type="text" id="appTitle" size="30"/></td></tr>
+<tr><tr><td><b>Category:</b></td></tr>
+<tr><td><input type="text" id="appCategory" size="15" value="Cool Apps"/></td></tr>
+<tr><tr><td><b>Description:</b></td></tr>
+<tr><td><textarea id="appDescription" cols="30" rows="5">Enter a short description of your app here</textarea></td></tr>
 <tr><td>
 <input id="createAppOKButton" type="button" style="font-weight: bold;" value="Create"/>
 <input id="createAppCancelButton" type="button" value="Cancel"/>
@@ -89,8 +93,7 @@ function getapps(sync) {
             title = car(entry);
 
             apps += '<tr>';
-            //apps += '<td><input name="apps" type="checkbox" value="' + name + '">' + '<a href=\"' + '/app/?app=' + name + '\">' + name + '</a></td>';
-            apps += '<td><a href=\"' + '/app/?app=' + name + '\" target=\"_parent\">' + name + '</a></td>';
+            apps += '<td><a href=\"' + '/graph/?app=' + name + '\" target=\"_parent\">' + name + '</a></td>';
             apps += '<td class="tdw" colspan="2">' + title + '</td>';
             apps += '</tr>';
         }
@@ -108,9 +111,21 @@ function getapps(sync) {
 }
 
 /**
+ * Default field values.
+ */
+var deftitle = 'Enter the title of your app here';
+var defcategory = 'Cool Apps';
+var defdate = 'Feb 4, 2011';
+var defdesc = 'Enter a short description of your app here';
+
+/**
  * Display create app form.
  */
 $('createAppButton').onclick = function() {
+    $('appName').value = '';
+    $('appTitle').value = deftitle;
+    $('appCategory').value = defcategory;
+    $('appDescription').value = defdesc;
     $('newApp').style.visibility = 'visible';
     $('appName').focus();
     return false;
@@ -121,14 +136,14 @@ $('createAppButton').onclick = function() {
  */
 $('createAppOKButton').onclick = function() {
     var name = $('appName').value;
+    if (name == '')
+        return false;
     var title = $('appTitle').value;
-    var app = mklist(title, name, mklist());
+    var app = mklist(title != deftitle && title != ''? title : name, name, mklist());
     var entry = atom.writeATOMEntry(app);
     dashboard.put(name, car(entry));
-    $('appName').value = '';
-    $('appTitle').title = '';
     getapps();
-    div.style.visibility = 'visible';
+    div.style.visibility = 'hidden';
     return false;
 };
 
@@ -137,8 +152,6 @@ $('createAppOKButton').onclick = function() {
  */
 $('createAppCancelButton').onclick = function() {
     $('newApp').style.visibility = 'hidden';
-    $('appName').value = '';
-    $('appTitle').title = '';
     return false;
 };
 
diff --git a/sca-cpp/trunk/modules/edit/htdocs/graph/graph.html b/sca-cpp/trunk/modules/edit/htdocs/graph/graph.html
index 3ca104a122..b5eceddb53 100644
--- a/sca-cpp/trunk/modules/edit/htdocs/graph/graph.html
+++ b/sca-cpp/trunk/modules/edit/htdocs/graph/graph.html
@@ -34,7 +34,7 @@
 
 <table style="width: 100%;">
 <tr>
-<th class="thl" style="width: 330px; min-width: 330px;">Palette</th><th class="ths" style="width: 3px; min-width: 3px;"></th>
+<th class="thl" style="width: 230px; min-width: 230px;">Palette</th><th class="ths" style="width: 3px; min-width: 3px;"></th>
 
 <th class="thr" style="padding-top: 0px; padding-bottom: 0px;">
 <input id="compName" type="text" value="component name" style="position: relative; width: 200px;"/>
@@ -90,7 +90,16 @@ function getapp(name, g) {
         return;
     apps.get(name, function(doc) {
         composite = atomcomposite(doc);
-        graph.edit(composite, graph.composite(composite, graph.mkpath().move(350,0)), g);
+        if (isNil(composite)) {
+
+            // Create a default empty composite if necessary
+            var x = '<composite xmlns="http://docs.oasis-open.org/ns/opencsa/sca/200912" xmlns:t="http://tuscany.apache.org/xmlns/sca/1.1"' +
+                'targetNamespace="http://' + name + '" ' +
+                'name="' + name + '">' +
+                '</composite>';
+            composite = readXML(mklist(x));
+        }
+        graph.edit(composite, graph.composite(composite, graph.mkpath().move(palcx,0)), g);
     });
 }
 
@@ -101,7 +110,7 @@ function getpalette(name, g, bg, palette, gpalettes) {
     if (isNil(name))
         return;
     palettes.get(name, function(doc) {
-        gpalettes[name] = graph.composite(atomcomposite(doc), graph.mkpath().move(150,0));
+        gpalettes[name] = graph.composite(atomcomposite(doc), graph.mkpath().move(85,0));
         graph.display(gpalettes[name], name == spalette? g : bg);
     });
 }
@@ -143,12 +152,16 @@ var bg = graph.mkgroup(graph.mkpath());
 
 // Install the palettes
 var gpalettes = new Array();
-var spalette = 'values';
-installpalette('values', graph.mkpath().move(0,10), g, bg, spalette, gpalettes);
-installpalette('control', graph.mkpath().move(0,60), g, bg, spalette, gpalettes);
-installpalette('operators', graph.mkpath().move(0,110), g, bg, spalette, gpalettes);
-installpalette('social', graph.mkpath().move(0,160), g, bg, spalette, gpalettes);
-installpalette('sensors', graph.mkpath().move(0,210), g, bg, spalette, gpalettes);
+var spalette = 'events';
+var pos = graph.mkpath();
+installpalette('events', pos.rmove(0,10), 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('operators', 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);
 
 // 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 e73c178267..aed29f345a 100644
--- a/sca-cpp/trunk/modules/edit/htdocs/graph/graph.js
+++ b/sca-cpp/trunk/modules/edit/htdocs/graph/graph.js
@@ -49,6 +49,18 @@ graph.colors.yellow1 = '#fcee21';
 graph.colors.magenta1 = '#c0688a';
 
 /**
+ * Default positions and sizes.
+ */
+var palcx = 250;
+var trashcx = 230;
+var proxcx = 20;
+var proxcy = 20;
+var buttoncx = 80;
+var buttoncy = 40;
+var curvsz = 5;
+var tabsz = 3;
+
+/**
  * Base path class.
  */
 graph.BasePath = function() {
@@ -185,11 +197,11 @@ if (ui.isIE()) {
 
             if (graph.dragging.parentNode == vmlg && graph.dragging.id.substring(0, 8) != 'palette:') {
                 var gpos = graph.relpos(graph.dragging);
-                if (gpos.xpos() >= 330) {
+                if (gpos.xpos() >= trashcx) {
 
                     // If component close enough to editing area, move it there
-                    if (gpos.xpos() < 350)
-                        graph.move(graph.dragging, graph.mkpath().move(350, gpos.ypos()));
+                    if (gpos.xpos() < palcx)
+                        graph.move(graph.dragging, graph.mkpath().move(palcx, gpos.ypos()));
 
                     // Add new dragged component to the composite
                     if (isNil(graph.dragging.compos)) {
@@ -282,6 +294,7 @@ if (ui.isIE()) {
 
             // Change the component property value
             graph.setproperty(graph.selected.comp, pvalue.value);
+            pvalue.value = graph.property(graph.selected.comp);
 
             // Refresh the composite
             graph.refresh(svg);
@@ -364,7 +377,7 @@ if (ui.isIE()) {
     graph.comptitle = function(comp) {
         var tsvcs = graph.tsvcs(comp);
         var lsvcs = graph.lsvcs(comp);
-        var pos = graph.mkpath().move(isNil(lsvcs)? 5 : 25, isNil(tsvcs)? 5 : 25);
+        var pos = graph.mkpath().move(isNil(lsvcs)? tabsz : (tabsz * 5), isNil(tsvcs)? tabsz : (tabsz * 5));
         return graph.mktitle(graph.title(comp), true, pos);
     };
 
@@ -385,7 +398,7 @@ if (ui.isIE()) {
     graph.proptitle = function(comp) {
         var tsvcs = graph.tsvcs(comp);
         var lsvcs = graph.lsvcs(comp);
-        var pos = graph.mkpath().move(isNil(lsvcs)? 5 : 25, isNil(tsvcs)? 20 : 40);
+        var pos = graph.mkpath().move(isNil(lsvcs)? tabsz : (tabsz * 5), isNil(tsvcs)? 15 + tabsz : 15 + (tabsz * 5));
         return graph.mktitle(graph.property(comp), false, pos);
     };
 
@@ -651,11 +664,11 @@ if (ui.isIE()) {
 
             if (graph.dragging.parentNode == svg && graph.dragging.id.substring(0, 8) != 'palette:') {
                 var gpos = graph.relpos(graph.dragging);
-                if (gpos.xpos() >= 330) {
+                if (gpos.xpos() >= trashcx) {
 
                     // If component close enough to editing area, move it there
-                    if (gpos.xpos() < 350)
-                        graph.move(graph.dragging, graph.mkpath().move(350, gpos.ypos()));
+                    if (gpos.xpos() < palcx)
+                        graph.move(graph.dragging, graph.mkpath().move(palcx, gpos.ypos()));
 
                     // Add new dragged component to the composite
                     if (isNil(graph.dragging.compos)) {
@@ -766,6 +779,7 @@ if (ui.isIE()) {
 
             // Change the component property value
             graph.setproperty(graph.selected.comp, pvalue.value);
+            pvalue.value = graph.property(graph.selected.comp);
 
             // Refresh the composite
             graph.refresh(svg);
@@ -1034,6 +1048,8 @@ graph.property = function(e) {
     var p = scdl.properties(e);
     if (isNil(p))
         return '';
+    if (scdl.visible(car(p)) == 'false')
+        return '';
     return scdl.propertyValue(car(p));
 };
 
@@ -1044,7 +1060,10 @@ graph.setproperty = function(e, value) {
     var p = scdl.properties(e);
     if (isNil(p))
         return '';
-    setElement(car(p), mklist(element, "'property", mklist(attribute, "'name", "property"), value));
+    if (scdl.visible(car(p)) == 'false')
+        return '';
+    var name = scdl.name(car(p));
+    setElement(car(p), mklist(element, "'property", mklist(attribute, "'name", name != null? name : "property"), value));
     return value;
 };
 
@@ -1117,7 +1136,7 @@ graph.rrefheight = function(ref, cassoc) {
     return memo(ref, 'rheight', function() {
         var target = assoc(scdl.target(ref), cassoc);
         if (isNil(target))
-            return 60;
+            return tabsz * 10;
         return graph.compclosureheight(cadr(target), cassoc);
     });
 };
@@ -1158,9 +1177,9 @@ graph.brefsheight = function(refs, cassoc) {
 graph.compheight = function(comp, cassoc) {
     return memo(comp, 'height', function() {
         var lsvcs = graph.lsvcs(comp);
-        var lsvcsh = Math.max(1, length(lsvcs)) * 60 + 20;
+        var lsvcsh = Math.max(1, length(lsvcs)) * (tabsz * 10) + (tabsz * 4);
         var rrefs = graph.rrefs(comp);
-        var rrefsh = graph.rrefsheight(rrefs, cassoc) + 20;
+        var rrefsh = graph.rrefsheight(rrefs, cassoc) + (tabsz * 4);
         var height = Math.max(lsvcsh, rrefsh);
         return height;
     });
@@ -1184,7 +1203,7 @@ graph.brefwidth = function(ref, cassoc) {
     return memo(ref, 'width', function() {
         var target = assoc(scdl.target(ref), cassoc);
         if (isNil(target))
-            return 60;
+            return tabsz * 10;
         return graph.compclosurewidth(cadr(target), cassoc);
     });
 };
@@ -1212,11 +1231,11 @@ graph.rrefswidth = function(refs, cassoc) {
  */
 graph.compwidth = function(comp, cassoc) {
     return memo(comp, 'width', function() {
-        var twidth = Math.max(graph.comptitlewidth(comp), graph.proptitlewidth(comp)) + 20;
+        var twidth = Math.max(graph.comptitlewidth(comp), graph.proptitlewidth(comp)) + (tabsz * 8);
         var tsvcs = graph.tsvcs(comp);
-        var tsvcsw = Math.max(1, length(tsvcs)) * 60 + 20;
+        var tsvcsw = Math.max(1, length(tsvcs)) * (tabsz * 10) + (tabsz * 4);
         var brefs = graph.brefs(comp);
-        var brefsw = graph.brefswidth(brefs, cassoc) + 20;
+        var brefsw = graph.brefswidth(brefs, cassoc) + (tabsz * 4);
         var width = Math.max(twidth, Math.max(tsvcsw, brefsw));
         return width;
     });
@@ -1242,10 +1261,11 @@ graph.rrefpath = function(ref, cassoc, path) {
     // Record reference position in the path
     var xpos = path.xpos();
     var ypos = path.ypos();
-    path.refpos = cons(mklist(ref, graph.mkpath().move(xpos, ypos + 30)), path.refpos);
+    //path.refpos = cons(mklist(ref, graph.mkpath().move(xpos, ypos + (tabsz * 6))), path.refpos);
+    path.refpos = cons(mklist(ref, graph.mkpath().move(xpos, ypos + (tabsz * 5))), path.refpos);
 
     // Compute the reference path
-    return path.rline(0,10).rline(0,10).rcurve(0,5,-5,0).rcurve(-5,0,0,-5).rcurve(0,-5,-5,0).rcurve(-5,0,0,5).rline(0,20).rcurve(0,5,5,0).rcurve(5,0,0,-5).rcurve(0,-5,5,0).rcurve(5,0,0,5).line(path.xpos(),ypos + height);
+    return path.rline(0,tabsz).rline(0,tabsz * 2).rcurve(0,tabsz,-tabsz,0).rcurve(-tabsz,0,0,-tabsz).rcurve(0,-tabsz,-tabsz,0).rcurve(-tabsz,0,0,tabsz).rline(0,tabsz * 4).rcurve(0,tabsz,tabsz,0).rcurve(tabsz,0,0,-tabsz).rcurve(0,-tabsz,tabsz,0).rcurve(tabsz,0,0,tabsz).line(path.xpos(),ypos + height);
 };
 
 /**
@@ -1257,40 +1277,40 @@ graph.brefpath = function(ref, cassoc, path) {
     // Record reference position in the path
     var xpos = path.xpos();
     var ypos = path.ypos();
-    path.refpos = cons(mklist(ref, graph.mkpath().move(xpos - width + 30, ypos)), path.refpos);
+    path.refpos = cons(mklist(ref, graph.mkpath().move(xpos - width + tabsz * 5, ypos)), path.refpos);
 
     // Compute the reference path
-    return path.line(xpos - width + 60,path.ypos()).rline(-10,0).rline(-10,0).rcurve(-5,0,0,-5).rcurve(0,-5,5,0).rcurve(5,0,0,-5).rcurve(0,-5,-5,0).rline(-20,0).rcurve(-5,0,0,5).rcurve(0,5,5,0).rcurve(5,0,0,5).rcurve(0,5,-5,0).line(xpos - width,path.ypos());
+    return path.line(xpos - width + (tabsz * 10),path.ypos()).rline(-tabsz,0).rline(-(tabsz *2),0).rcurve(-tabsz,0,0,-tabsz).rcurve(0,-tabsz,tabsz,0).rcurve(tabsz,0,0,-tabsz).rcurve(0,-tabsz,-tabsz,0).rline(-(tabsz * 4),0).rcurve(-tabsz,0,0,tabsz).rcurve(0,tabsz,tabsz,0).rcurve(tabsz,0,0,tabsz).rcurve(0,tabsz,-tabsz,0).line(xpos - width,path.ypos());
 };
 
 /**
  * Return a path representing a service positioned to the left of a component.
  */
 graph.lsvcpath = function(svc, cassoc, path) {
-    var height = 60;
+    var height = tabsz * 10;
 
     // Record service position in the path
     var xpos = path.xpos();
     var ypos = path.ypos();
-    path.svcpos = cons(mklist(svc, graph.mkpath().move(xpos, ypos - 30)), path.svcpos);
+    path.svcpos = cons(mklist(svc, graph.mkpath().move(xpos, ypos - (tabsz * 6))), path.svcpos);
 
     // Compute the service path
-    return path.rline(0,-10).rline(0, -10).rcurve(0,-5,-5,0).rcurve(-5,0,0,5).rcurve(0,5,-5,0).rcurve(-5,0,0,-5).rline(0,-20).rcurve(0,-5,5,0).rcurve(5,0,0,5).rcurve(0,5,5,0).rcurve(5,0,0,-5).line(path.xpos(), ypos - height);
+    return path.rline(0,-tabsz).rline(0, -(tabsz * 2)).rcurve(0,-tabsz,-tabsz,0).rcurve(-tabsz,0,0,tabsz).rcurve(0,tabsz,-tabsz,0).rcurve(-tabsz,0,0,-tabsz).rline(0,-(tabsz * 4)).rcurve(0,-tabsz,tabsz,0).rcurve(tabsz,0,0,tabsz).rcurve(0,tabsz,tabsz,0).rcurve(tabsz,0,0,-tabsz).line(path.xpos(), ypos - height);
 };
 
 /**
  * Return a path representing a service positioned at the top of a component.
  */
 graph.tsvcpath = function(svc, cassoc, path) {
-    var width = 60;
+    var width = tabsz * 10;
 
     // Record service position in the path
     var xpos = path.xpos();
     var ypos = path.ypos();
-    path.svcpos = cons(mklist(svc, graph.mkpath().move(xpos + 30, ypos)), path.svcpos);
+    path.svcpos = cons(mklist(svc, graph.mkpath().move(xpos + (tabsz * 5), ypos)), path.svcpos);
 
     // Compute the service path
-    return path.rline(10,0).rline(10,0).rcurve(5,0,0,-5).rcurve(0,-5,-5,0).rcurve(-5,0,0,-5).rcurve(0,-5,5,0).rline(20,0).rcurve(5,0,0,5).rcurve(0,5,-5,0).rcurve(-5,0,0,5).rcurve(0,5,5,0).line(xpos + width,path.ypos());
+    return path.rline(tabsz,0).rline(tabsz * 2,0).rcurve(tabsz,0,0,-tabsz).rcurve(0,-tabsz,-tabsz,0).rcurve(-tabsz,0,0,-tabsz).rcurve(0,-tabsz,tabsz,0).rline(tabsz * 4,0).rcurve(tabsz,0,0,tabsz).rcurve(0,tabsz,-tabsz,0).rcurve(-tabsz,0,0,tabsz).rcurve(0,tabsz,tabsz,0).line(xpos + width,path.ypos());
 };
 
 /**
@@ -1311,7 +1331,7 @@ graph.comppath = function(comp, cassoc) {
         return renderpath(cdr(x), f, cassoc, f(car(x), cassoc, path));
     }
 
-    var path = graph.mkpath().move(10,0);
+    var path = graph.mkpath().move(curvsz,0);
 
     // Store the positions of services and references in the path
     path.refpos = mklist();
@@ -1323,23 +1343,23 @@ graph.comppath = function(comp, cassoc) {
 
     // Render the references on the right side of the component
     var rrefs = graph.rrefs(comp);
-    path = path.line(width - 10,path.ypos()).rcurve(10,0,0,10);
+    path = path.line(width - curvsz,path.ypos()).rcurve(curvsz,0,0,curvsz);
     path = renderpath(rrefs, graph.rrefpath, cassoc, path);
 
     // Render the references on the bottom side of the component
     var brefs = reverse(graph.brefs(comp));
-    var boffset = 10 + graph.brefswidth(brefs, cassoc);
-    path = path.line(path.xpos(),height - 10).rcurve(0,10,-10,0).line(boffset, path.ypos());
+    var boffset = curvsz + graph.brefswidth(brefs, cassoc);
+    path = path.line(path.xpos(),height - curvsz).rcurve(0,curvsz,curvsz * -1,0).line(boffset, path.ypos());
     path = renderpath(brefs, graph.brefpath, cassoc, path);
 
     // Render the services on the left side of the component
     var lsvcs = graph.lsvcs(comp);
-    var loffset = 10 + (length(lsvcs) * 60);
-    path = path.line(10,path.ypos()).rcurve(-10,0,0,-10).line(path.xpos(), loffset);
+    var loffset = curvsz + (length(lsvcs) * (tabsz * 10));
+    path = path.line(curvsz,path.ypos()).rcurve(curvsz * -1,0,0,curvsz * -1).line(path.xpos(), loffset);
     path = renderpath(lsvcs, graph.lsvcpath, cassoc, path);
 
     // Close the component node path
-    path = path.line(0,10).rcurve(0,-10,10,0);
+    path = path.line(0,curvsz).rcurve(0,curvsz * -1,curvsz,0);
 
     return path.end();
 };
@@ -1348,13 +1368,11 @@ graph.comppath = function(comp, cassoc) {
  * Return a path representing a button node.
  */
 graph.buttonpath = function(t) {
-    var height = 40;
-    var width = 120;
-    var path = graph.mkpath().move(10,0);
-    path = path.line(width - 10,path.ypos()).rcurve(10,0,0,10);
-    path = path.line(path.xpos(),height - 10).rcurve(0,10,-10,0).line(10, path.ypos());
-    path = path.line(10,path.ypos()).rcurve(-10,0,0,-10).line(path.xpos(), 10);
-    path = path.line(0,10).rcurve(0,-10,10,0);
+    var path = graph.mkpath().move(curvsz,0);
+    path = path.line(buttoncx - curvsz,path.ypos()).rcurve(curvsz,0,0,curvsz);
+    path = path.line(path.xpos(),buttoncy - curvsz).rcurve(0,curvsz,-curvsz,0).line(curvsz, path.ypos());
+    path = path.line(curvsz,path.ypos()).rcurve(-curvsz,0,0,-curvsz).line(path.xpos(), curvsz);
+    path = path.line(0,curvsz).rcurve(0,-curvsz,curvsz,0);
     return path.end();
 };
 
@@ -1486,14 +1504,16 @@ graph.composite = function(compos, pos) {
         function comppos(comp, pos) {
             var x = scdl.x(comp);
             var y = scdl.y(comp);
-            return graph.mkpath().move(x != null? Number(x) + 350 : pos.xpos(), y != null? Number(y) : pos.ypos());
+            return graph.mkpath().move(
+                    x != null? Number(x) + palcx : pos.xpos(),
+                    y != null? Number(y) : (isNil(graph.tsvcs(comp))? pos.ypos() : pos.ypos() + (tabsz * 4)));
         }
 
         /**
          * Move the rendering cursor down below a component.
          */
         function rendermove(comp, cassoc, pos) {
-            return pos.clone().rmove(0, graph.compclosureheight(comp, cassoc) + 40);
+            return pos.clone().rmove(0, graph.compclosureheight(comp, cassoc) + (tabsz * 2));
         }
 
         if (isNil(svcs))
@@ -1570,7 +1590,7 @@ graph.clonepalette = function(e, compos) {
  * Move a SCDL component to the given position.
  */
 graph.movecomp = function(comp, pos) {
-    return append(mklist(element, "'component", mklist(attribute, "'t:x", '' + (pos.xpos() - 350)), mklist(attribute, "'t:y", '' + pos.ypos())),
+    return append(mklist(element, "'component", mklist(attribute, "'t:x", '' + (pos.xpos() - palcx)), mklist(attribute, "'t:y", '' + pos.ypos())),
             filter(function(e) { return !(isAttribute(e) && (attributeName(e) == "'t:x" || attributeName(e) == "'t:y")); }, elementChildren(comp)));
 };
 
@@ -1608,7 +1628,9 @@ graph.renamecomp = function(comp, compos, name) {
             return refactorrefs(cdr(refs), oname, nname);
 
         // Change the reference's target attribute
-        setElement(ref, append(mklist(element, "'reference"), append(filter(function(e) { return !(isAttribute(e) && attributeName(e) == "'target"); }, elementChildren(ref)), mklist(mklist(attribute, "'target", nname)))));
+        setElement(ref, append(mklist(element, "'reference"),
+            append(filter(function(e) { return !(isAttribute(e) && attributeName(e) == "'target"); }, elementChildren(ref)),
+                mklist(mklist(attribute, "'target", nname)))));
 
         return refactorrefs(cdr(refs), oname, nname);
     }
@@ -1619,10 +1641,11 @@ graph.renamecomp = function(comp, compos, name) {
 
     // Rename the SCDL promoted service and component
     var proms = filter(function(s) { return scdl.name(s) == oname }, scdl.services(compos));
-    if (!isNil(proms)) {
+    if (!isNil(proms))
         setElement(car(proms), mklist(element, "'service", mklist(attribute, "'name", name), mklist(attribute, "'promote", name)));
-    }
-    setElement(comp, append(mklist(element, "'component"), cons(mklist(attribute, "'name", name), filter(function(e) { return !(isAttribute(e) && attributeName(e) == "'name"); }, elementChildren(comp)))));
+    setElement(comp, append(mklist(element, "'component"),
+        cons(mklist(attribute, "'name", name),
+            filter(function(e) { return !(isAttribute(e) && attributeName(e) == "'name"); }, elementChildren(comp)))));
 
     return append(mklist(element, "'composite"), elementChildren(compos));
 };
@@ -1642,7 +1665,9 @@ graph.cutwire = function(node, compos, g) {
         var ref = car(refs);
         if (caddr(ref) == node) {
             setlist(ref, mklist(car(ref), cadr(ref), null));
-            setElement(car(ref), append(mklist(element, "'reference"), filter(function(e) { return !(isAttribute(e) && attributeName(e) == "'target"); }, elementChildren(car(ref)))));
+            setElement(car(ref),
+                append(mklist(element, "'reference"),
+                    filter(function(e) { return !(isAttribute(e) && attributeName(e) == "'target"); }, elementChildren(car(ref)))));
         }
         return cutref(cdr(refs), node);
     }
@@ -1658,7 +1683,8 @@ graph.cutwire = function(node, compos, g) {
     var comp = node.comp;
     var name = scdl.name(comp);
     var prom = mklist(element, "'service", mklist(attribute, "'name", name), mklist(attribute, "'promote", name));
-    return append(mklist(element, "'composite"), append(filter(function(c) {return !(isElement(c) && scdl.name(c) == name); }, elementChildren(compos)), mklist(prom, comp)));
+    return append(mklist(element, "'composite"),
+            append(filter(function(c) { return !(isElement(c) && scdl.name(c) == name); }, elementChildren(compos)), mklist(prom, comp)));
 }
 
 /**
@@ -1695,8 +1721,8 @@ graph.wire = function(n, compos, g) {
             var dx = Math.pow(rpos.xpos() - spos.xpos(), 2);
             var dy = Math.pow(rpos.ypos() - spos.ypos(), 2);
 
-            // Proximity threshold is 40 x 40 pixels
-            var rdist = (dx < 400 && dy < 400)? Math.sqrt(dx + dy) : 25000000;
+            // Check for proximity threshold
+            var rdist = (dx < (proxcx * proxcx) && dy < (proxcy * proxcy))? Math.sqrt(dx + dy) : 25000000;
 
             // Go through all the references in the component
             return closerefs(npos, cdr(refs), spos, fdist < rdist? cref : mklist(car(ref), cadr(ref), caddr(ref), rdist));
@@ -1750,7 +1776,7 @@ graph.refresh = function(g) {
 
     // Remove nodes and redisplay the composite associated with the graph
     map(function(n) { if (!isNil(n.comp) && n.id.substr(0, 8) != 'palette:') { g.removeChild(n); } return n; }, nodeList(g.childNodes));
-    graph.display(graph.composite(g.compos, graph.mkpath().move(350,0)), g);
+    graph.display(graph.composite(g.compos, graph.mkpath().move(palcx,0)), g);
     return g;
 };
 
diff --git a/sca-cpp/trunk/modules/edit/htdocs/main.html b/sca-cpp/trunk/modules/edit/htdocs/main.html
index 819af53c52..c0c948e091 100644
--- a/sca-cpp/trunk/modules/edit/htdocs/main.html
+++ b/sca-cpp/trunk/modules/edit/htdocs/main.html
@@ -33,15 +33,15 @@
 <h2>App Dashboard</h2>
 <p>Try the <a href="dash" target="_parent">App Dashboard</a> to manage your collection of apps.</p>
 
-<h2>App Editor</h2>
-<p>Try the <a href="app/?app=store" target="_parent">App Editor</a> to edit an app.</p>
-
 <h2>Composition Editor</h2>
 <p>Try the <a href="graph/?app=store" target="_parent">Composition Editor</a> to compose the logic of an app.</p>
 
 <h2>Page Editor</h2>
 <p>Try the <a href="page/?app=store" target="_parent">Page Editor</a> to draw an app page.</p>
 
+<h2>App Settings Editor</h2>
+<p>Try the <a href="app/?app=store" target="_parent">App Settings Editor</a> to edit the settings of app.</p>
+
 </div>
 
 <script type="text/javascript">
diff --git a/sca-cpp/trunk/modules/edit/htdocs/menu.html b/sca-cpp/trunk/modules/edit/htdocs/menu.html
index 21677c5602..d46fd8a882 100644
--- a/sca-cpp/trunk/modules/edit/htdocs/menu.html
+++ b/sca-cpp/trunk/modules/edit/htdocs/menu.html
@@ -40,7 +40,7 @@ var mdiv = $('menu');
 var name = appname();
 mdiv.innerHTML = ui.menubar(
     append(mklist(ui.menu('Home', '/'), ui.menu('Dashboard', '/dash')),
-            (isNil(name) || name == 'undefined')? mklist() : mklist(ui.menu('App', '/app/?app=' + name), ui.menu('Composition', '/graph/?app=' + name), ui.menu('Page', '/page/?app=' + name))),
+            (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')));
 
 </script>
diff --git a/sca-cpp/trunk/modules/edit/htdocs/page/page.html b/sca-cpp/trunk/modules/edit/htdocs/page/page.html
index f3fdb9def7..e1800bcdb5 100644
--- a/sca-cpp/trunk/modules/edit/htdocs/page/page.html
+++ b/sca-cpp/trunk/modules/edit/htdocs/page/page.html
@@ -34,7 +34,7 @@
 
 <table style="width: 100%;">
 <tr>
-<th class="thl thr" style="width: 330px; min-width: 330px;">Palette</th><th class="ths" style="width: 3px; min-width: 3px;"></th>
+<th class="thl thr" style="width: 230px; min-width: 230px;">Palette</th><th class="ths" style="width: 3px; min-width: 3px;"></th>
 
 <th class="thl thr" style="padding-top: 0px; padding-bottom: 0px;">
 <input id="widgetName" type="text" value="widget name" style="position: relative; width: 150px;"/>
@@ -99,16 +99,21 @@ function getpage(name, edit) {
         return;
     pages.get(name, function(doc) {
 
-        // Convert the page to XHTML
-        var xhtml = writeStrings(writeXML(atompage(doc), false));
-
-        // Prepare page DOM in hidden buffer
+        // Convert the page to XHTML and place it in a hidden buffer
         var buffer = $('buffer');
-        buffer.innerHTML = xhtml;
+        var el = atompage(doc);
+        if (isNil(el)) {
+
+            // Create a default empty page if necessary
+            buffer.innerHTML = '<div id="page"></div>';
+        } else {
+            var xhtml = writeStrings(writeXML(atompage(doc), false));
+            buffer.innerHTML = xhtml;
+        }
 
         // Append page nodes to editor
         map(function(e) {
-                e.style.left = ui.csspos(e.style.left) + 350;
+                e.style.left = ui.csspos(e.style.left) + 250;
                 edit.appendChild(e);
                 return page.cover(e);
             }, nodeList(buffer.childNodes[0].childNodes));
@@ -135,7 +140,7 @@ $('saveButton').onclick = function(e) {
                 div.removeChild(e);
                 return e;
             }
-            var x = ui.csspos(e.style.left) - 350;
+            var x = ui.csspos(e.style.left) - 250;
             if (x < 0 || ui.csspos(e.style.top) < 0) {
                 div.removeChild(e);
                 return e;
diff --git a/sca-cpp/trunk/modules/edit/htdocs/page/page.js b/sca-cpp/trunk/modules/edit/htdocs/page/page.js
index 41273d9824..c1a2311fa2 100644
--- a/sca-cpp/trunk/modules/edit/htdocs/page/page.js
+++ b/sca-cpp/trunk/modules/edit/htdocs/page/page.js
@@ -22,6 +22,12 @@
  */
 var page = {};
 
+/**
+ * Default positions and sizes.
+ */
+var palcx = 250;
+var trashcx = 230;
+
 if (ui.isIE()) {
 
     /**
@@ -78,12 +84,12 @@ if (ui.isIE()) {
                 return false;
 
             // Discard element dragged out of page area
-            if (ui.csspos(page.dragging.style.left) < 350 && page.dragging.id.substring(0, 8) != 'palette:') {
-                if (ui.csspos(page.dragging.style.left) >= 330) {
+            if (ui.csspos(page.dragging.style.left) < palcx && page.dragging.id.substring(0, 8) != 'palette:') {
+                if (ui.csspos(page.dragging.style.left) >= trashcx) {
 
                     // Unless it's close enough to page area, then move it there
-                    page.dragging.style.left = 350;
-                    page.dragging.cover.style.left = 350;
+                    page.dragging.style.left = palcx;
+                    page.dragging.cover.style.left = palcx;
                 } else {
                     page.dragging.parentNode.removeChild(page.dragging);
 
@@ -215,12 +221,12 @@ if (ui.isIE()) {
                 return false;
 
             // Discard element dragged out of page area
-            if (ui.csspos(page.dragging.style.left) < 350 && page.dragging.id.substring(0, 8) != 'palette:') {
-                if (ui.csspos(page.dragging.style.left) >= 330) {
+            if (ui.csspos(page.dragging.style.left) < palcx && page.dragging.id.substring(0, 8) != 'palette:') {
+                if (ui.csspos(page.dragging.style.left) >= trashcx) {
 
                     // Unless it's close enough to page area, then move it there
-                    page.dragging.style.left = 350;
-                    page.dragging.cover.style.left = 350;
+                    page.dragging.style.left = palcx;
+                    page.dragging.cover.style.left = palcx;
                 } else {
                     page.dragging.parentNode.removeChild(page.dragging);
 
diff --git a/sca-cpp/trunk/modules/edit/palettes/control/palette.composite b/sca-cpp/trunk/modules/edit/palettes/control/palette.composite
deleted file mode 100644
index acb1c15755..0000000000
--- a/sca-cpp/trunk/modules/edit/palettes/control/palette.composite
+++ /dev/null
@@ -1,71 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!--
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- * 
- *   http://www.apache.org/licenses/LICENSE-2.0
- * 
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied.  See the License for the
- * specific language governing permissions and limitations
- * under the License.    
--->
-<composite xmlns="http://docs.oasis-open.org/ns/opencsa/sca/200912"
-  xmlns:t="http://tuscany.apache.org/xmlns/sca/1.1"
-  targetNamespace="http://control"
-  name="palette">
-        
-    <service name="page" promote="page"/>
-    <service name="every" promote="every"/>
-    <service name="if" promote="if"/>
-    <service name="ifelse" promote="ifelse"/>
-    <service name="foreach" promote="foreach"/>
-
-    <component name="page" t:color="yellow1">
-        <documentation>when page requested</documentation>
-        <t:implementation.python script="page.py"/>
-        <service name="page" t:visible="false"/>
-        <reference name="url"/>
-        <reference name="do" t:align="bottom"/>
-    </component>
-    
-    <component name="every" t:color="yellow1">
-        <documentation>every n seconds</documentation>
-        <t:implementation.python script="every.py"/>
-        <service name="every" t:visible="false"/>
-        <reference name="seconds"/>
-        <reference name="do" t:align="bottom"/>
-    </component>
-    
-    <component name="if" t:color="yellow1">
-        <t:implementation.python script="if_.py"/>
-        <service name="if" t:align="top"/>
-        <reference name="condition"/>
-        <reference name="do" t:align="bottom"/>
-    </component>
-    
-    <component name="ifelse" t:color="yellow1">
-        <documentation>if else</documentation>
-        <t:implementation.python script="ifelse.py"/>
-        <service name="ifelse" t:align="top"/>
-        <reference name="condition"/>
-        <reference name="do" t:align="bottom"/>
-        <reference name="else" t:align="bottom"/>
-    </component>
-    
-    <component name="foreach" t:color="yellow1">
-        <documentation>for each</documentation>
-        <t:implementation.python script="ifelse.py"/>
-        <service name="foreach" t:align="top"/>
-        <reference name="list"/>
-        <reference name="do" t:align="bottom"/>
-    </component>
-    
-</composite>
diff --git a/sca-cpp/trunk/modules/edit/palettes/events/palette.composite b/sca-cpp/trunk/modules/edit/palettes/events/palette.composite
new file mode 100644
index 0000000000..0e33fa6431
--- /dev/null
+++ b/sca-cpp/trunk/modules/edit/palettes/events/palette.composite
@@ -0,0 +1,44 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ * 
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.    
+-->
+<composite xmlns="http://docs.oasis-open.org/ns/opencsa/sca/200912"
+  xmlns:t="http://tuscany.apache.org/xmlns/sca/1.1"
+  targetNamespace="http://events"
+  name="palette">
+        
+    <service name="page" promote="page"/>
+    <service name="every" promote="every"/>
+
+    <component name="page" t:color="green1">
+        <documentation>page</documentation>
+        <t:implementation.python script="page.py"/>
+        <service name="page" t:visible="false"/>
+        <property name="property">/mypage.html</property>
+        <reference name="value"/>
+    </component>
+    
+    <component name="every" t:color="green1">
+        <documentation>every</documentation>
+        <t:implementation.python script="every.py"/>
+        <service name="every" t:visible="false"/>
+        <property name="property">60</property>
+        <reference name="value"/>
+    </component>
+    
+</composite>
diff --git a/sca-cpp/trunk/modules/edit/palettes/lists/palette.composite b/sca-cpp/trunk/modules/edit/palettes/lists/palette.composite
new file mode 100644
index 0000000000..dab3d03f64
--- /dev/null
+++ b/sca-cpp/trunk/modules/edit/palettes/lists/palette.composite
@@ -0,0 +1,77 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ * 
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.    
+-->
+<composite xmlns="http://docs.oasis-open.org/ns/opencsa/sca/200912"
+  xmlns:t="http://tuscany.apache.org/xmlns/sca/1.1"
+  targetNamespace="http://lists"
+  name="palette">
+        
+    <service name="list" promote="list"/>
+    <service name="first" promote="first"/>
+    <service name="rest" promote="rest"/>
+    <service name="foreach" promote="foreach"/>
+    <service name="append" promote="append"/>
+    <service name="reverse" promote="reverse"/>
+
+    <component name="list" t:color="yellow1">
+        <documentation>list</documentation>
+        <t:implementation.python script="list_.py"/>
+        <service name="list"/>
+        <reference name="rest"/>
+        <property name="property">abc</property>
+    </component>
+    
+    <component name="first" t:color="yellow1">
+        <documentation>first</documentation>
+        <t:implementation.python script="first.py"/>
+        <service name="first"/>
+        <reference name="value"/>
+    </component>
+    
+    <component name="rest" t:color="yellow1">
+        <documentation>rest</documentation>
+        <t:implementation.python script="rest.py"/>
+        <service name="rest"/>
+        <reference name="value"/>
+    </component>
+    
+    <component name="foreach" t:color="yellow1">
+        <documentation>foreach</documentation>
+        <t:implementation.python script="ifelse.py"/>
+        <service name="foreach"/>
+        <reference name="list"/>
+        <reference name="apply"/>
+    </component>
+    
+    <component name="reverse" t:color="yellow1">
+        <documentation>reverse</documentation>
+        <t:implementation.python script="reverse.py"/>
+        <service name="reverse"/>
+        <reference name="value"/>
+    </component>
+    
+    <component name="append" t:color="yellow1">
+        <documentation>append</documentation>
+        <t:implementation.python script="list_.py"/>
+        <service name="append"/>
+        <reference name="first"/>
+        <reference name="second"/>
+    </component>
+    
+</composite>
diff --git a/sca-cpp/trunk/modules/edit/palettes/math/palette.composite b/sca-cpp/trunk/modules/edit/palettes/math/palette.composite
new file mode 100644
index 0000000000..2f2e542754
--- /dev/null
+++ b/sca-cpp/trunk/modules/edit/palettes/math/palette.composite
@@ -0,0 +1,70 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ * 
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.    
+-->
+<composite xmlns="http://docs.oasis-open.org/ns/opencsa/sca/200912"
+  xmlns:t="http://tuscany.apache.org/xmlns/sca/1.1"
+  targetNamespace="http://math"
+  name="palette">
+        
+    <service name="multiply" promote="multiply"/>
+    <service name="divide" promote="divide"/>
+    <service name="add" promote="add"/>
+    <service name="subtract" promote="subtract"/>
+
+    <component name="multiply" t:color="green1">
+        <documentation>*</documentation>
+        <t:implementation.python script="multiply.py"/>
+        <service name="multiply">
+            <documentation>*</documentation>
+        </service>
+        <reference name="value1"/>
+        <reference name="value2"/>
+    </component>
+    
+    <component name="divide" t:color="green1">
+        <documentation>/</documentation>
+        <t:implementation.python script="divide.py"/>
+        <service name="divide">
+            <documentation>/</documentation>
+        </service>
+        <reference name="value1"/>
+        <reference name="value2"/>
+    </component>
+    
+    <component name="add" t:color="green1">
+        <documentation>+</documentation>
+        <t:implementation.python script="add.py"/>
+        <service name="add">
+            <documentation>+</documentation>
+        </service>
+        <reference name="value1"/>
+        <reference name="value2"/>
+    </component>
+    
+    <component name="subtract" t:color="green1">
+        <documentation>-</documentation>
+        <t:implementation.python script="subtract.py"/>
+        <service name="subtract">
+            <documentation>-</documentation>
+        </service>
+        <reference name="value1"/>
+        <reference name="value2"/>
+    </component>
+    
+</composite>
diff --git a/sca-cpp/trunk/modules/edit/palettes/operators/palette.composite b/sca-cpp/trunk/modules/edit/palettes/operators/palette.composite
index 54fd47768a..aa92f13a26 100644
--- a/sca-cpp/trunk/modules/edit/palettes/operators/palette.composite
+++ b/sca-cpp/trunk/modules/edit/palettes/operators/palette.composite
@@ -22,27 +22,20 @@
   targetNamespace="http://operators"
   name="palette">
         
-    <service name="true" promote="true"/>
-    <service name="false" promote="false"/>
+    <service name="if" promote="if"/>
     <service name="and" promote="and"/>
     <service name="or" promote="or"/>
     <service name="not" promote="not"/>
     <service name="equals" promote="equals"/>
     <service name="greater" promote="greater"/>
     <service name="lesser" promote="lesser"/>
-    <service name="multiply" promote="multiply"/>
-    <service name="divide" promote="divide"/>
-    <service name="add" promote="add"/>
-    <service name="subtract" promote="subtract"/>
 
-    <component name="true" t:color="green1">
-        <t:implementation.python script="true_.py"/>
-        <service name="true"/>
-    </component>
-    
-    <component name="false" t:color="green1">
-        <t:implementation.python script="false_.py"/>
-        <service name="false"/>
+    <component name="if" t:color="green1">
+        <t:implementation.python script="if_.py"/>
+        <service name="if"/>
+        <reference name="condition"/>
+        <reference name="then"/>
+        <reference name="else"/>
     </component>
     
     <component name="and" t:color="green1">
@@ -95,44 +88,4 @@
         <reference name="value2"/>
     </component>
     
-    <component name="multiply" t:color="green1">
-        <documentation>*</documentation>
-        <t:implementation.python script="multiply.py"/>
-        <service name="multiply">
-            <documentation>*</documentation>
-        </service>
-        <reference name="value1"/>
-        <reference name="value2"/>
-    </component>
-    
-    <component name="divide" t:color="green1">
-        <documentation>/</documentation>
-        <t:implementation.python script="divide.py"/>
-        <service name="divide">
-            <documentation>/</documentation>
-        </service>
-        <reference name="value1"/>
-        <reference name="value2"/>
-    </component>
-    
-    <component name="add" t:color="green1">
-        <documentation>+</documentation>
-        <t:implementation.python script="add.py"/>
-        <service name="add">
-            <documentation>+</documentation>
-        </service>
-        <reference name="value1"/>
-        <reference name="value2"/>
-    </component>
-    
-    <component name="subtract" t:color="green1">
-        <documentation>-</documentation>
-        <t:implementation.python script="subtract.py"/>
-        <service name="subtract">
-            <documentation>-</documentation>
-        </service>
-        <reference name="value1"/>
-        <reference name="value2"/>
-    </component>
-    
 </composite>
diff --git a/sca-cpp/trunk/modules/edit/palettes/social/palette.composite b/sca-cpp/trunk/modules/edit/palettes/social/palette.composite
index 739b878025..09a4646d3d 100644
--- a/sca-cpp/trunk/modules/edit/palettes/social/palette.composite
+++ b/sca-cpp/trunk/modules/edit/palettes/social/palette.composite
@@ -22,60 +22,69 @@
   targetNamespace="http://social"
   name="palette">
         
-    <service name="JSONTwit" promote="JSONTwit"/>
-    <service name="XMLTwit" promote="XMLTwit"/>
-    <service name="RSSTwit" promote="RSSTwit"/>
-    <service name="HTML" promote="HTML"/>
-    <service name="JSONFB" promote="JSONFB"/>
+    <service name="fbprofile" promote="fbprofile"/>
+    <service name="fbalbum" promote="fbalbum"/>
+    <service name="fbfriends" promote="fbfriends"/>
+    <service name="fbgroup" promote="fbgroup"/>
+    <service name="twprofile" promote="twprofile"/>
+    <service name="twfriends" promote="twfriends"/>
+    <service name="twstatus" promote="twstatus"/>
+    <service name="twtimeline" promote="twtimeline"/>
 
-    <component name="JSONTwit" t:color="blue1">
-        <t:implementation.python script="relay.py"/>
-        <service name="Relay">
-            <t:binding.http uri="jsontwit"/>
-        </service>        
-        <reference name="target">
-            <t:binding.http uri="http://api.twitter.com/1/statuses/user_timeline.json?screen_name=jsdelfino"/>
-        </reference>
+    <component name="fbprofile" t:color="blue1">
+        <documentation>facebook profile</documentation>
+        <t:implementation.python script="fbprofile.py"/>
+        <service name="fbprofile"/>
+        <reference name="id"/>
     </component>
     
-    <component name="XMLTwit" t:color="blue1">
-        <t:implementation.python script="relay.py"/>
-        <service name="Relay">
-            <t:binding.http uri="xmltwit"/>
-        </service>        
-        <reference name="target">
-            <t:binding.http uri="http://api.twitter.com/1/statuses/user_timeline.xml?screen_name=jsdelfino"/>
-        </reference>
+    <component name="fbalbum" t:color="blue1">
+        <documentation>facebook album</documentation>
+        <t:implementation.python script="fbalbum.py"/>
+        <service name="fbalbum"/>
+        <reference name="id"/>
     </component>
     
-    <component name="RSSTwit" t:color="blue1">
-        <t:implementation.python script="relay.py"/>
-        <service name="Relay">
-            <t:binding.http uri="rsstwit"/>
-        </service>        
-        <reference name="target">
-            <t:binding.http uri="http://api.twitter.com/1/statuses/user_timeline.rss?screen_name=jsdelfino"/>
-        </reference>
+    <component name="fbfriends" t:color="blue1">
+        <documentation>facebook friends</documentation>
+        <t:implementation.python script="fbfriends.py"/>
+        <service name="fbfriends"/>
+        <reference name="id"/>
     </component>
     
-    <component name="HTML" t:color="blue1">
-        <t:implementation.python script="relay.py"/>
-        <service name="Relay">
-            <t:binding.http uri="html"/>
-        </service>        
-        <reference name="target">
-            <t:binding.http uri="http://people.apache.org/~jsdelfino/"/>
-        </reference>
+    <component name="fbgroup" t:color="blue1">
+        <documentation>facebook group</documentation>
+        <t:implementation.python script="fbgroup.py"/>
+        <service name="fbgroup"/>
+        <reference name="id"/>
     </component>
     
-    <component name="JSONFB" t:color="blue1">
-        <t:implementation.python script="relay.py"/>
-        <service name="Relay">
-            <t:binding.http uri="jsonfb"/>
-        </service>        
-        <reference name="target">
-            <t:binding.http uri="https://graph.facebook.com/100001053301307"/>
-        </reference>
+    <component name="twprofile" t:color="blue1">
+        <documentation>twitter profile</documentation>
+        <t:implementation.python script="twprofile.py"/>
+        <service name="twprofile"/>
+        <reference name="id"/>
+    </component>
+    
+    <component name="twfriends" t:color="blue1">
+        <documentation>twitter friends</documentation>
+        <t:implementation.python script="twfriends.py"/>
+        <service name="twfriends"/>
+        <reference name="id"/>
+    </component>
+    
+    <component name="twstatus" t:color="blue1">
+        <documentation>twitter status</documentation>
+        <t:implementation.python script="twstatus.py"/>
+        <service name="twstatus"/>
+        <reference name="id"/>
+    </component>
+    
+    <component name="twtimeline" t:color="blue1">
+        <documentation>twitter timeline</documentation>
+        <t:implementation.python script="twtimeline.py"/>
+        <service name="twtimeline"/>
+        <reference name="id"/>
     </component>
     
 </composite>
diff --git a/sca-cpp/trunk/modules/edit/palettes/url/palette.composite b/sca-cpp/trunk/modules/edit/palettes/url/palette.composite
new file mode 100644
index 0000000000..8325a905e6
--- /dev/null
+++ b/sca-cpp/trunk/modules/edit/palettes/url/palette.composite
@@ -0,0 +1,74 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ * 
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.    
+-->
+<composite xmlns="http://docs.oasis-open.org/ns/opencsa/sca/200912"
+  xmlns:t="http://tuscany.apache.org/xmlns/sca/1.1"
+  targetNamespace="http://url"
+  name="palette">
+        
+    <service name="host" promote="host"/>
+    <service name="path" promote="path"/>
+    <service name="params" promote="params"/>
+    <service name="user" promote="user"/>
+    <service name="realm" promote="realm"/>
+    <service name="email" promote="email"/>
+
+    <component name="host" t:color="orange1">
+        <documentation>host</documentation>
+        <t:implementation.python script="host.py"/>
+        <service name="host"/>
+        <property name="host" t:visible="false"></property>
+    </component>
+    
+    <component name="path" t:color="orange1">
+        <documentation>path</documentation>
+        <t:implementation.python script="path.py"/>
+        <service name="path"/>
+        <property name="path" t:visible="false"></property>
+    </component>
+    
+    <component name="params" t:color="orange1">
+        <documentation>?params</documentation>
+        <t:implementation.python script="params.py"/>
+        <service name="params"/>
+        <property name="params" t:visible="false"></property>
+    </component>
+    
+    <component name="user" t:color="orange1">
+        <documentation>user</documentation>
+        <t:implementation.python script="user.py"/>
+        <service name="user"/>
+        <property name="user" t:visible="false"></property>
+    </component>
+    
+    <component name="realm" t:color="orange1">
+        <documentation>realm</documentation>
+        <t:implementation.python script="realm.py"/>
+        <service name="realm"/>
+        <property name="realm" t:visible="false"></property>
+    </component>
+    
+    <component name="email" t:color="orange1">
+        <documentation>email</documentation>
+        <t:implementation.python script="email.py"/>
+        <service name="email"/>
+        <property name="email" t:visible="false"></property>
+    </component>
+    
+</composite>
diff --git a/sca-cpp/trunk/modules/edit/palettes/values/palette.composite b/sca-cpp/trunk/modules/edit/palettes/values/palette.composite
index 9a9ed0f087..7f8b81b5cb 100644
--- a/sca-cpp/trunk/modules/edit/palettes/values/palette.composite
+++ b/sca-cpp/trunk/modules/edit/palettes/values/palette.composite
@@ -25,10 +25,8 @@
     <service name="number" promote="number"/>
     <service name="text" promote="text"/>
     <service name="nothing" promote="nothing"/>
-    <service name="list" promote="list"/>
-    <service name="first" promote="first"/>
-    <service name="rest" promote="rest"/>
-    <service name="append" promote="append"/>
+    <service name="true" promote="true"/>
+    <service name="false" promote="false"/>
 
     <component name="number" t:color="orange1">
         <t:implementation.python script="number.py"/>
@@ -47,34 +45,14 @@
         <service name="nothing"/>
     </component>
     
-    <component name="list" t:color="orange1">
-        <documentation>list</documentation>
-        <t:implementation.python script="list_.py"/>
-        <service name="list"/>
-        <reference name="rest"/>
-        <property name="property">abc</property>
-    </component>
-    
-    <component name="first" t:color="orange1">
-        <documentation>first of list</documentation>
-        <t:implementation.python script="first.py"/>
-        <service name="first"/>
-        <reference name="value"/>
-    </component>
-    
-    <component name="rest" t:color="orange1">
-        <documentation>rest of list</documentation>
-        <t:implementation.python script="rest.py"/>
-        <service name="rest"/>
-        <reference name="value"/>
+    <component name="true" t:color="orange1">
+        <t:implementation.python script="true_.py"/>
+        <service name="true"/>
     </component>
     
-    <component name="append" t:color="orange1">
-        <documentation>append lists</documentation>
-        <t:implementation.python script="list_.py"/>
-        <service name="append"/>
-        <reference name="first"/>
-        <reference name="second"/>
+    <component name="false" t:color="orange1">
+        <t:implementation.python script="false_.py"/>
+        <service name="false"/>
     </component>
     
 </composite>