Started to refactor the domain manager UI into smaller independently reusable widgets. Tested OK with Firefox 2 and 3 and Safari 3, still debugging a javascript error with IE 7. Changed the HTTP binding to implement OptimizableBinding as was done for the Atom Binding, to allow Widgets to get the correct reference binding URIs from the target services. This is temporary until the domain manager app is migrated from SCADomain to NodeFactory.

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

14 files changed, 1228 insertions, 809 deletions

diff --git a/java/sca/modules/domain-manager/src/main/resources/DomainManager.composite b/java/sca/modules/domain-manager/src/main/resources/DomainManager.composite
index 8744223b41..8ab19462c9 100644
--- a/java/sca/modules/domain-manager/src/main/resources/DomainManager.composite
+++ b/java/sca/modules/domain-manager/src/main/resources/DomainManager.composite
@@ -22,38 +22,97 @@
 	targetNamespace="http://tuscany.apache.org/xmlns/sca/1.0"
     name="DomainManager">
 
-    <component name="HomeUI">
+    <component name="HomePage">
         <t:implementation.widget location="home.html"/>
         <service name="Widget">
         	<t:binding.http uri="http://localhost:9990/ui/home"/>
         </service>
+        <reference name="toolbarGadget" target="ToolbarGadget">
+        	<t:binding.http/>
+        </reference>
+        <reference name="homeGadget" target="HomeGadget">
+        	<t:binding.http/>
+        </reference>
     </component>
     
-    <component name="ContributionUI">
+    <component name="ToolbarGadget">
+        <t:implementation.widget location="toolbar-gadget.html"/>
+        <service name="Widget">
+        	<t:binding.http uri="http://localhost:9990/ui/toolbar-gadget"/>
+        </service>
+    </component>
+    
+    <component name="HomeGadget">
+        <t:implementation.widget location="home-gadget.html"/>
+        <service name="Widget">
+        	<t:binding.http uri="http://localhost:9990/ui/home-gadget"/>
+        </service>
+    </component>
+    
+    <component name="WorkspacePage">
         <t:implementation.widget location="workspace.html"/>
         <service name="Widget">
         	<t:binding.http uri="http://localhost:9990/ui/workspace"/>
         </service>
+        <reference name="toolbarGadget" target="ToolbarGadget">
+        	<t:binding.http/>
+        </reference>
+        <reference name="workspaceGadget" target="WorkspaceGadget">
+        	<t:binding.http/>
+        </reference>
+    </component>
+    
+    <component name="WorkspaceGadget">
+        <t:implementation.widget location="workspace-gadget.html"/>
+        <service name="Widget">
+        	<t:binding.http uri="http://localhost:9990/ui/workspace-gadget"/>
+        </service>
 		 <reference name="workspace" target="ContributionCollectionComponent/ItemCollection">
 		 	<t:binding.atom/>
 		 </reference>
     </component>
     
-    <component name="FilesUI">
+    <component name="FilesPage">
         <t:implementation.widget location="files.html"/>
         <service name="Widget">
         	<t:binding.http uri="http://localhost:9990/ui/files"/>
         </service>
+        <reference name="toolbarGadget" target="ToolbarGadget">
+        	<t:binding.http/>
+        </reference>
+        <reference name="filesGadget" target="FilesGadget">
+        	<t:binding.http/>
+        </reference>
+    </component>
+    
+    <component name="FilesGadget">
+        <t:implementation.widget location="files-gadget.html"/>
+        <service name="Widget">
+        	<t:binding.http uri="http://localhost:9990/ui/files-gadget"/>
+        </service>
 		 <reference name="files" target="FileCollectionComponent">
 		 	<t:binding.atom/>
 		 </reference>
     </component>
     
-    <component name="DomainCompositeUI">
+    <component name="DomainCompositePage">
         <t:implementation.widget location="composite.html"/>
         <service name="Widget">
         	<t:binding.http uri="http://localhost:9990/ui/composite"/>
         </service>
+        <reference name="toolbarGadget" target="ToolbarGadget">
+        	<t:binding.http/>
+        </reference>
+        <reference name="compositeGadget" target="DomainCompositeGadget">
+        	<t:binding.http/>
+        </reference>
+    </component>
+    
+    <component name="DomainCompositeGadget">
+        <t:implementation.widget location="composite-gadget.html"/>
+        <service name="Widget">
+        	<t:binding.http uri="http://localhost:9990/ui/composite-gadget"/>
+        </service>
 		 <reference name="domainComposite" target="DomainCompositeCollectionComponent/ItemCollection">
 		 	<t:binding.atom/>
 		 </reference>
@@ -62,11 +121,24 @@
 		 </reference>
     </component>
 
-    <component name="CloudUI">
+    <component name="CloudPage">
         <t:implementation.widget location="cloud.html"/>
         <service name="Widget">
         	<t:binding.http uri="http://localhost:9990/ui/cloud"/>
         </service>
+        <reference name="toolbarGadget" target="ToolbarGadget">
+        	<t:binding.http/>
+        </reference>
+        <reference name="cloudGadget" target="CloudGadget">
+        	<t:binding.http/>
+        </reference>
+    </component>
+    
+    <component name="CloudGadget">
+        <t:implementation.widget location="cloud-gadget.html"/>
+        <service name="Widget">
+        	<t:binding.http uri="http://localhost:9990/ui/cloud-gadget"/>
+        </service>
 		 <reference name="cloudComposite" target="CloudCollectionComponent/ItemCollection">
 		 	<t:binding.atom/>
 		 </reference>
diff --git a/java/sca/modules/domain-manager/src/main/resources/cloud-gadget.html b/java/sca/modules/domain-manager/src/main/resources/cloud-gadget.html
new file mode 100644
index 0000000000..c3be5e08eb
--- /dev/null
+++ b/java/sca/modules/domain-manager/src/main/resources/cloud-gadget.html
@@ -0,0 +1,359 @@
+<!--
+    * 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.    
+-->
+<html>
+<head>
+<title>SCA Domain - Cloud</title>
+
+<script type="text/javascript" src="../cloud-gadget/cloud-gadget.js"></script>
+<script type="text/javascript" src="utils.js"></script>
+
+<script language="JavaScript">
+
+	//@Reference
+	var cloudComposite = new Reference("cloudComposite");
+	
+	//@Reference
+	var domainComposite = new Reference("domainComposite");
+	
+	//@Reference
+	var processCollection = new Reference("processCollection");
+	
+	function getNodes() {
+		cloudComposite.get("", getNodesResponse);
+	}
+	
+	function contributionURI(id) {
+       var i = id.indexOf(';');
+       return id.substring(10, i);
+	}
+	
+	function compositeName(id) {
+       var i = id.indexOf(';');
+       return id.substring(i + 1);
+	}
+	
+	function compositeLocalName(id) {
+		name = compositeName(id); 
+    	var i = name.indexOf(';');
+    	return name.substring(i + 1);
+	}
+	
+	var nodeNames;
+	
+	function getNodesResponse(feed) {
+		nodeNames = new Array();      
+		if (feed != null) {
+			var entries = feed.getElementsByTagName("entry");
+			var composites = "";
+			composites += '<table width="100%">';
+			composites += '<tr><th>Node</th><th>Status</th><th>Composite</th>' +
+			'<th>Contribution</th><th>Node Config</th></tr>';
+			
+			for (var i=0; i<entries.length; i++) {
+				var nodeId = entries[i].getElementsByTagName("id")[0].firstChild.nodeValue;
+				var links = entries[i].getElementsByTagName("link");
+				var nodeLink = undefined;
+				var compositeLink = undefined;
+				var compositeId = "composite:undefined;undefined;undefined";
+				var uri = '<span style="color: red">unknown</span>';
+				var qname = undefined;
+				for (var l = 0; l < links.length; l++) {
+					var a = links[l].getAttribute('rel');
+					if (a == undefined) {
+					  nodeLink = links[l].getAttribute('href');
+					} else if (a == 'related') {
+					  compositeLink = links[l].getAttribute('href');
+					  var c = compositeLink.indexOf('composite:');
+					  compositeId = compositeLink.substring(c);
+					  uri = contributionURI(compositeId);
+					  qname = compositeName(compositeId);
+					}
+				}
+
+				var nodeName = compositeLocalName(nodeId);
+				nodeNames[i] = nodeName;
+				
+				var content = "";
+				if (entries[i].getElementsByTagName("content")[0].firstChild != null) {
+					content = entries[i].getElementsByTagName("content")[0].firstChild.nodeValue;
+				}
+
+				composites += '<tr>'
+				if (content.indexOf('<span id="problem"') != -1) {
+					composites += '<td><input name="composites" type="checkbox" value="' + nodeId + '">' +
+											'<a href=\"' + nodeLink + '\">' + nodeName + '</a></td>';
+					composites += '<td><span id="status_' + nodeName + '">unknown</span></td>';
+					composites += '<td>' + content + '</td>';
+					composites += '<td>' + uri + '</td>';
+				} else {
+					composites += '<td><input name="composites" type="checkbox" value="' + nodeId + '">' +
+											'<a href=\"' + nodeLink + '\">' + nodeName + '</a></td>';
+					composites += '<td><span id="status_' + nodeName + '">unknown</span></td>';
+					composites += '<td><a href=\"' + compositeLink + '\">' + qname + '</a></td>';
+					composites += '<td><a href="/contribution/' + uri + '">' + uri + '</a></td>';
+				}
+				composites += '<td><a href="/node-config/' + nodeName + '"><img src="icons/feed-icon.png" border="0"></a></td>';
+				composites += '</tr>';
+			}
+			composites += '</table>';
+			document.getElementById("composites").innerHTML = composites;
+
+			processCollection.get("", getProcessesResponse);
+		}
+	}
+	
+	function getProcessesResponse(feed) {
+		if (feed != null) {
+			var nodeStatus = new Array();
+			
+			var entries = feed.getElementsByTagName("entry");
+			for (var i=0; i<entries.length; i++) {
+				var nodeName = entries[i].getElementsByTagName("id")[0].firstChild.nodeValue;
+				nodeStatus[nodeName] = 'started';
+			}
+
+			for (var i = 0; i < nodeNames.length; i++) {
+				var element = document.getElementById('status_' + nodeNames[i]);
+				var nodeName = nodeNames[i];
+				if (nodeStatus[nodeName] == null) {
+					element.innerHTML = '<span>stopped</span>';
+				} else {
+					element.innerHTML = '<span><a style="color: green" href="/processes/?node=' + nodeName + '">started</a></span>';
+				}
+			}
+		}
+	}
+
+	function deleteNode() {
+		var composites  = array(document.cloudCompositeForm.composites);
+		for (var i = 0; i < composites.length; i++) {
+			if (composites[i].checked) {
+			    var id = composites[i].value;
+				cloudComposite.del(id, deleteNodeResponse);
+			}
+		}
+	}
+
+	function deleteNodeResponse() {
+	    getNodes();
+	}	
+
+	function addNode() {
+		var nodeName = document.newNodeForm.nodeName.value;
+		var nodeURI = document.newNodeForm.nodeURI.value;			
+		var compositeNamespace = document.newNodeForm.compositeNamespace.value;
+		var compositeName = document.newNodeForm.compositeName.value;
+		var contributionURI = document.newNodeForm.contributionURI.value;
+		var id  = 'composite:' +
+			'http://tuscany.apache.org/cloud' + ';' +
+			'http://tuscany.apache.org/cloud' + ';' +
+			nodeName;
+			
+		var entry = '<entry xmlns="http://www.w3.org/2005/Atom">\n' +
+              	'<id>' + id + '</id>\n' +
+              	'<content type="text/xml">\n' + 
+  				'<composite	xmlns="http://www.osoa.org/xmlns/sca/1.0"\n' +
+				'	xmlns:t="http://tuscany.apache.org/xmlns/sca/1.0"\n' +
+				'	targetNamespace="http://tuscany.apache.org/cloud"\n' +
+				'	xmlns:c="' + compositeNamespace + '"\n' +
+				'	name="' + nodeName + '">\n' +
+				'\n' +
+				'	<component name="' + nodeName + '">\n' +
+				'		<t:implementation.node uri="' + contributionURI + '" composite="c:' + compositeName + '"/>\n' +
+				'		<service name="Node">\n' +
+				'			<binding.ws uri="' + nodeURI + '"/>\n' +
+				'			<t:binding.http uri="' + nodeURI + '"/>\n' +
+				'			<t:binding.jsonrpc uri="' + nodeURI + '"/>\n' +
+				'			<t:binding.atom uri="' + nodeURI + '"/>\n' +
+				'		</service>\n' +
+				'	</component>\n' + 
+				'</composite>' +
+              	'</content>' +
+               	'</entry>';
+		cloudComposite.post(entry, addNodeResponse);
+	}
+
+	function addNodeResponse() {
+		document.newNodeForm.nodeName.value = "";
+		document.newNodeForm.nodeURI.value = "";
+		document.newNodeForm.compositeNamespace.value = "";
+		document.newNodeForm.compositeName.value = "";
+		document.newNodeForm.contributionURI.value = "";
+	    getNodes();
+	}	
+
+	function startNode() {
+		var composites  = array(document.cloudCompositeForm.composites);
+		for (var i = 0; i < composites.length; i++) {
+			if (composites[i].checked) {
+			    var id = nodeNames[i];
+			    
+				var entry = '<entry xmlns="http://www.w3.org/2005/Atom">' +
+              	'<id>' + id + '</id>' +
+               	'</entry>';
+				processCollection.post(entry, startNodeResponse);
+			}
+		}
+	}
+
+	function startNodeResponse() {
+		processCollection.get("", getProcessesResponse);
+		
+		var composites  = array(document.cloudCompositeForm.composites);
+		for (var i = 0; i < composites.length; i++) {
+			if (composites[i].checked) {
+			  composites[i].checked = false;
+			}
+		}
+	}	
+
+	function stopNode() {
+		var composites  = array(document.cloudCompositeForm.composites);
+		for (var i = 0; i < composites.length; i++) {
+			if (composites[i].checked) {
+			    var id = nodeNames[i];
+				processCollection.del(id, stopNodeResponse);
+			}
+		}
+	}
+
+	function stopNodeResponse() {
+		processCollection.get("", getProcessesResponse);
+		
+		var composites  = array(document.cloudCompositeForm.composites);
+		for (var i = 0; i < composites.length; i++) {
+			if (composites[i].checked) {
+			  composites[i].checked = false;
+			}
+		}
+	}	
+
+	var deployedComposites = new Array();
+	
+	function getComposites() {
+		domainComposite.get("", getCompositesResponse);
+	}
+	
+	function getCompositesResponse(feed) {
+		if (feed != null) {
+			var entries = feed.getElementsByTagName("entry");              
+			for (var i=0; i<entries.length; i++) {
+				var id = entries[i].getElementsByTagName("id")[0].firstChild.nodeValue;
+				deployedComposites[id] = id;
+			}
+		}
+	}
+
+	function suggestCompositeNamespaces() {
+		var namespaces = new Array();
+		for (var uri in deployedComposites) {
+			var qname = compositeName(uri);
+			var ns = qname.substring(0, qname.indexOf(';'));
+			namespaces[ns] = ns;
+		}
+		return array(namespaces);
+	}	
+
+	function suggestCompositeNames() {
+		var inputns = document.newNodeForm.compositeNamespace.value;
+		var names = new Array();
+		for (var uri in deployedComposites) {
+			var qname = compositeName(uri);
+			var sc = qname.indexOf(';');
+			var ns = qname.substring(0, sc);
+			var name = qname.substring(sc + 1);
+			if (ns == inputns || inputns == "") {
+				names[name] = name;
+			}
+		}
+		return array(names);
+	}	
+
+	function suggestContributionURIs() {
+		var inputns = document.newNodeForm.compositeNamespace.value;
+		var inputname = document.newNodeForm.compositeName.value;
+		var uris = new Array();
+		for (var uri in deployedComposites) {
+			var qname = compositeName(uri);
+			var sc = qname.indexOf(';');
+			var ns = qname.substring(0, sc);
+			var name = qname.substring(sc + 1);
+			if ((ns == inputns || inputns == "") && (name == inputname || inputname == "")) {
+				var curi = contributionURI(uri);
+				uris[curi] = curi;
+			}
+		}
+		return array(uris);
+	}
+
+	function init() {
+		getNodes();
+		getComposites();
+		suggest(document.newNodeForm.compositeNamespace, suggestCompositeNamespaces);
+		suggest(document.newNodeForm.compositeName, suggestCompositeNames);
+		suggest(document.newNodeForm.contributionURI, suggestContributionURIs);
+	}
+
+</script>
+
+<link rel="stylesheet" type="text/css" href="manager.css">
+</head>
+
+<body onload="init()">
+  <div id="cloudComposite">
+  
+  <span class=hd1>
+  SCA Domain<br><br>
+  Cloud</b>&nbsp;<a href="/cloud/"><img src="icons/feed-icon.png" border="0"></a>
+  </span>
+  <br><br>
+  Here is the list of SCA nodes configured in your SCA domain cloud.
+  <br><br>
+
+  <form name="cloudCompositeForm">
+    <div id="composites" ></div>
+    <br>
+    <input type="button" onClick="startNode()"  value="Start" />
+    <input type="button" onClick="stopNode()"  value="Stop" />
+    &nbsp;&nbsp;
+    <input type="button" onClick="deleteNode()"  value="Delete" />
+  </form>
+
+  <br><br>
+  
+  <form name="newNodeForm">
+    <table width="100%">
+    <tr><th>Add a Node</th></tr>
+    <tr><td>Add a node to the cloud. The node will run the SCA components declared in the specified composite.</td></tr>
+    </table>
+    <br>
+    <table>
+    <tr><td>Node name:</td><td><input type="text" name="nodeName" size="50"/></td><td>e.g. YourNode</td></tr>
+    <tr><td>Node URI:</td><td><input type="text" name="nodeURI" size="50"/></td></td><td>e.g. http://yourhost:8080</td></tr>
+    <tr><td>Composite namespace:</td><td><input type="text" name="compositeNamespace" size="50"/></td></td><td>e.g. http://your/namespace</td></tr>
+    <tr><td>Composite name:</td><td><input type="text" name="compositeName" size="50"/></td></td><td>e.g. yourcomposite</td></tr>
+    <tr><td>Contribution URI:</td><td><input type="text" name="contributionURI" size="50"/></td></td><td>e.g. yourcontrib, http://yourcontrib</td></tr>
+    </table>
+    <input type="button" onClick="addNode()" value="Add" />
+  </form>
+  
+  </div>
+</body>
+
+</html>
diff --git a/java/sca/modules/domain-manager/src/main/resources/cloud.html b/java/sca/modules/domain-manager/src/main/resources/cloud.html
index 2564322ec9..20794e7b6d 100644
--- a/java/sca/modules/domain-manager/src/main/resources/cloud.html
+++ b/java/sca/modules/domain-manager/src/main/resources/cloud.html
@@ -20,295 +20,35 @@
 <head>
 <title>SCA Domain - Cloud</title>
 
-<script type="text/javascript" src="cloud.js"></script>
-<script type="text/javascript" src="utils.js"></script>
+<script type="text/javascript" src="../cloud/cloud.js"></script>
 
 <script language="JavaScript">
 
 	//@Reference
-	var cloudComposite = new Reference("cloudComposite");
-	
-	//@Reference
-	var domainComposite = new Reference("domainComposite");
-	
-	//@Reference
-	var processCollection = new Reference("processCollection");
-	
-	function getNodes() {
-		cloudComposite.get("", getNodesResponse);
-	}
-	
-	function contributionURI(id) {
-       var i = id.indexOf(';');
-       return id.substring(10, i);
-	}
-	
-	function compositeName(id) {
-       var i = id.indexOf(';');
-       return id.substring(i + 1);
-	}
-	
-	function compositeLocalName(id) {
-		name = compositeName(id); 
-    	var i = name.indexOf(';');
-    	return name.substring(i + 1);
-	}
-	
-	var nodeNames;
-	
-	function getNodesResponse(feed) {
-		nodeNames = new Array();      
-		if (feed != null) {
-			var entries = feed.getElementsByTagName("entry");
-			var composites = "";
-			composites += '<table width="100%">';
-			composites += '<tr><th>Node</th><th>Status</th><th>Composite</th>' +
-			'<th>Contribution</th><th>Node Config</th></tr>';
-			
-			for (var i=0; i<entries.length; i++) {
-				var nodeId = entries[i].getElementsByTagName("id")[0].firstChild.nodeValue;
-				var links = entries[i].getElementsByTagName("link");
-				var nodeLink = undefined;
-				var compositeLink = undefined;
-				var compositeId = "composite:undefined;undefined;undefined";
-				var uri = '<span style="color: red">unknown</span>';
-				var qname = undefined;
-				for (var l = 0; l < links.length; l++) {
-					var a = links[l].getAttribute('rel');
-					if (a == undefined) {
-					  nodeLink = links[l].getAttribute('href');
-					} else if (a == 'related') {
-					  compositeLink = links[l].getAttribute('href');
-					  var c = compositeLink.indexOf('composite:');
-					  compositeId = compositeLink.substring(c);
-					  uri = contributionURI(compositeId);
-					  qname = compositeName(compositeId);
-					}
-				}
-
-				var nodeName = compositeLocalName(nodeId);
-				nodeNames[i] = nodeName;
-				
-				var content = "";
-				if (entries[i].getElementsByTagName("content")[0].firstChild != null) {
-					content = entries[i].getElementsByTagName("content")[0].firstChild.nodeValue;
-				}
-
-				composites += '<tr>'
-				if (content.indexOf('<span id="problem"') != -1) {
-					composites += '<td><input name="composites" type="checkbox" value="' + nodeId + '">' +
-											'<a href=\"' + nodeLink + '\">' + nodeName + '</a></td>';
-					composites += '<td><span id="status_' + nodeName + '">unknown</span></td>';
-					composites += '<td>' + content + '</td>';
-					composites += '<td>' + uri + '</td>';
-				} else {
-					composites += '<td><input name="composites" type="checkbox" value="' + nodeId + '">' +
-											'<a href=\"' + nodeLink + '\">' + nodeName + '</a></td>';
-					composites += '<td><span id="status_' + nodeName + '">unknown</span></td>';
-					composites += '<td><a href=\"' + compositeLink + '\">' + qname + '</a></td>';
-					composites += '<td><a href="/contribution/' + uri + '">' + uri + '</a></td>';
-				}
-				composites += '<td><a href="/node-config/' + nodeName + '"><img src="icons/feed-icon.png" border="0"></a></td>';
-				composites += '</tr>';
-			}
-			composites += '</table>';
-			document.getElementById("composites").innerHTML = composites;
-
-			processCollection.get("", getProcessesResponse);
-		}
-	}
-	
-	function getProcessesResponse(feed) {
-		if (feed != null) {
-			var nodeStatus = new Array();
-			
-			var entries = feed.getElementsByTagName("entry");
-			for (var i=0; i<entries.length; i++) {
-				var nodeName = entries[i].getElementsByTagName("id")[0].firstChild.nodeValue;
-				nodeStatus[nodeName] = 'started';
-			}
-
-			for (var i = 0; i < nodeNames.length; i++) {
-				var element = document.getElementById('status_' + nodeNames[i]);
-				var nodeName = nodeNames[i];
-				if (nodeStatus[nodeName] == null) {
-					element.innerHTML = '<span>stopped</span>';
-				} else {
-					element.innerHTML = '<span><a style="color: green" href="/processes/?node=' + nodeName + '">started</a></span>';
-				}
-			}
-		}
-	}
-
-	function deleteNode() {
-		var composites  = array(document.cloudCompositeForm.composites);
-		for (var i = 0; i < composites.length; i++) {
-			if (composites[i].checked) {
-			    var id = composites[i].value;
-				cloudComposite.del(id, deleteNodeResponse);
-			}
-		}
-	}
-
-	function deleteNodeResponse() {
-	    getNodes();
-	}	
-
-	function addNode() {
-		var nodeName = document.newNodeForm.nodeName.value;
-		var nodeURI = document.newNodeForm.nodeURI.value;			
-		var compositeNamespace = document.newNodeForm.compositeNamespace.value;
-		var compositeName = document.newNodeForm.compositeName.value;
-		var contributionURI = document.newNodeForm.contributionURI.value;
-		var id  = 'composite:' +
-			'http://tuscany.apache.org/cloud' + ';' +
-			'http://tuscany.apache.org/cloud' + ';' +
-			nodeName;
-			
-		var entry = '<entry xmlns="http://www.w3.org/2005/Atom">\n' +
-              	'<id>' + id + '</id>\n' +
-              	'<content type="text/xml">\n' + 
-  				'<composite	xmlns="http://www.osoa.org/xmlns/sca/1.0"\n' +
-				'	xmlns:t="http://tuscany.apache.org/xmlns/sca/1.0"\n' +
-				'	targetNamespace="http://tuscany.apache.org/cloud"\n' +
-				'	xmlns:c="' + compositeNamespace + '"\n' +
-				'	name="' + nodeName + '">\n' +
-				'\n' +
-				'	<component name="' + nodeName + '">\n' +
-				'		<t:implementation.node uri="' + contributionURI + '" composite="c:' + compositeName + '"/>\n' +
-				'		<service name="Node">\n' +
-				'			<binding.ws uri="' + nodeURI + '"/>\n' +
-				'			<t:binding.http uri="' + nodeURI + '"/>\n' +
-				'			<t:binding.jsonrpc uri="' + nodeURI + '"/>\n' +
-				'			<t:binding.atom uri="' + nodeURI + '"/>\n' +
-				'		</service>\n' +
-				'	</component>\n' + 
-				'</composite>' +
-              	'</content>' +
-               	'</entry>';
-		cloudComposite.post(entry, addNodeResponse);
-	}
-
-	function addNodeResponse() {
-		document.newNodeForm.nodeName.value = "";
-		document.newNodeForm.nodeURI.value = "";
-		document.newNodeForm.compositeNamespace.value = "";
-		document.newNodeForm.compositeName.value = "";
-		document.newNodeForm.contributionURI.value = "";
-	    getNodes();
-	}	
-
-	function startNode() {
-		var composites  = array(document.cloudCompositeForm.composites);
-		for (var i = 0; i < composites.length; i++) {
-			if (composites[i].checked) {
-			    var id = nodeNames[i];
-			    
-				var entry = '<entry xmlns="http://www.w3.org/2005/Atom">' +
-              	'<id>' + id + '</id>' +
-               	'</entry>';
-				processCollection.post(entry, startNodeResponse);
-			}
-		}
-	}
-
-	function startNodeResponse() {
-		processCollection.get("", getProcessesResponse);
-		
-		var composites  = array(document.cloudCompositeForm.composites);
-		for (var i = 0; i < composites.length; i++) {
-			if (composites[i].checked) {
-			  composites[i].checked = false;
-			}
-		}
-	}	
-
-	function stopNode() {
-		var composites  = array(document.cloudCompositeForm.composites);
-		for (var i = 0; i < composites.length; i++) {
-			if (composites[i].checked) {
-			    var id = nodeNames[i];
-				processCollection.del(id, stopNodeResponse);
-			}
-		}
-	}
-
-	function stopNodeResponse() {
-		processCollection.get("", getProcessesResponse);
-		
-		var composites  = array(document.cloudCompositeForm.composites);
-		for (var i = 0; i < composites.length; i++) {
-			if (composites[i].checked) {
-			  composites[i].checked = false;
-			}
-		}
-	}	
+	var toolbarGadget = new Reference("toolbarGadget");
 
-	var deployedComposites = new Array();
-	
-	function getComposites() {
-		domainComposite.get("", getCompositesResponse);
-	}
-	
-	function getCompositesResponse(feed) {
-		if (feed != null) {
-			var entries = feed.getElementsByTagName("entry");              
-			for (var i=0; i<entries.length; i++) {
-				var id = entries[i].getElementsByTagName("id")[0].firstChild.nodeValue;
-				deployedComposites[id] = id;
-			}
-		}
+	//@Reference
+	var cloudGadget = new Reference("cloudGadget");
+
+	function toolbarGadget_getResponse(html) {
+		var gadget = document.getElementById('toolbarGadget');
+		var content = gadget.contentWindow.document;
+		content.open();
+		content.write(html);
+		content.close();
 	}
 
-	function suggestCompositeNamespaces() {
-		var namespaces = new Array();
-		for (var uri in deployedComposites) {
-			var qname = compositeName(uri);
-			var ns = qname.substring(0, qname.indexOf(';'));
-			namespaces[ns] = ns;
-		}
-		return array(namespaces);
-	}	
-
-	function suggestCompositeNames() {
-		var inputns = document.newNodeForm.compositeNamespace.value;
-		var names = new Array();
-		for (var uri in deployedComposites) {
-			var qname = compositeName(uri);
-			var sc = qname.indexOf(';');
-			var ns = qname.substring(0, sc);
-			var name = qname.substring(sc + 1);
-			if (ns == inputns || inputns == "") {
-				names[name] = name;
-			}
-		}
-		return array(names);
-	}	
-
-	function suggestContributionURIs() {
-		var inputns = document.newNodeForm.compositeNamespace.value;
-		var inputname = document.newNodeForm.compositeName.value;
-		var uris = new Array();
-		for (var uri in deployedComposites) {
-			var qname = compositeName(uri);
-			var sc = qname.indexOf(';');
-			var ns = qname.substring(0, sc);
-			var name = qname.substring(sc + 1);
-			if ((ns == inputns || inputns == "") && (name == inputname || inputname == "")) {
-				var curi = contributionURI(uri);
-				uris[curi] = curi;
-			}
-		}
-		return array(uris);
+	function cloudGadget_getResponse(html) {
+		var gadget = document.getElementById('cloudGadget');
+		var content = gadget.contentWindow.document;
+		content.open();
+		content.write(html);
+		content.close();
 	}
 
 	function init() {
-		toolbar();
-		getNodes();
-		getComposites();
-		suggest(document.newNodeForm.compositeNamespace, suggestCompositeNamespaces);
-		suggest(document.newNodeForm.compositeName, suggestCompositeNames);
-		suggest(document.newNodeForm.contributionURI, suggestContributionURIs);
+		toolbarGadget.get('', toolbarGadget_getResponse);
+		cloudGadget.get('', cloudGadget_getResponse);
 	}
 
 </script>
@@ -317,46 +57,8 @@
 </head>
 
 <body onload="init()">
-  <div id="toolbar"></div>
-
-  <div id="cloudComposite">
+  <iframe id="toolbarGadget" style="top: 0px; left: 0px; width: 100%;"></iframe>
   <br>
-  <span class=hd1>
-  SCA Domain<br><br>
-  Cloud</b>&nbsp;<a href="/cloud/"><img src="icons/feed-icon.png" border="0"></a>
-  </span>
-  <br><br>
-  Here is the list of SCA nodes configured in your SCA domain cloud.
-  <br><br>
-
-  <form name="cloudCompositeForm">
-    <div id="composites" ></div>
-    <br>
-    <input type="button" onClick="startNode()"  value="Start" />
-    <input type="button" onClick="stopNode()"  value="Stop" />
-    &nbsp;&nbsp;
-    <input type="button" onClick="deleteNode()"  value="Delete" />
-  </form>
-
-  <br><br>
-  
-  <form name="newNodeForm">
-    <table width="100%">
-    <tr><th>Add a Node</th></tr>
-    <tr><td>Add a node to the cloud. The node will run the SCA components declared in the specified composite.</td></tr>
-    </table>
-    <br>
-    <table>
-    <tr><td>Node name:</td><td><input type="text" name="nodeName" size="50"/></td><td>e.g. YourNode</td></tr>
-    <tr><td>Node URI:</td><td><input type="text" name="nodeURI" size="50"/></td></td><td>e.g. http://yourhost:8080</td></tr>
-    <tr><td>Composite namespace:</td><td><input type="text" name="compositeNamespace" size="50"/></td></td><td>e.g. http://your/namespace</td></tr>
-    <tr><td>Composite name:</td><td><input type="text" name="compositeName" size="50"/></td></td><td>e.g. yourcomposite</td></tr>
-    <tr><td>Contribution URI:</td><td><input type="text" name="contributionURI" size="50"/></td></td><td>e.g. yourcontrib, http://yourcontrib</td></tr>
-    </table>
-    <input type="button" onClick="addNode()" value="Add" />
-  </form>
-  
-  </div>
+  <iframe id="cloudGadget" style="left: 0px; width: 100%; height: 100%;"></iframe>
 </body>
-
 </html>
diff --git a/java/sca/modules/domain-manager/src/main/resources/composite-gadget.html b/java/sca/modules/domain-manager/src/main/resources/composite-gadget.html
new file mode 100644
index 0000000000..1c78db7597
--- /dev/null
+++ b/java/sca/modules/domain-manager/src/main/resources/composite-gadget.html
@@ -0,0 +1,254 @@
+<!--
+    * 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.    
+-->
+<html>
+<head>
+<title>SCA Domain - Domain Composite</title>
+
+<script type="text/javascript" src="../composite-gadget/composite-gadget.js"></script>
+<script type="text/javascript" src="utils.js"></script>
+
+<script language="JavaScript">
+
+	//@Reference
+	var domainComposite = new Reference("domainComposite");
+	
+	//@Reference
+	var workspace = new Reference("workspace");
+	
+	function getComposites() {
+		domainComposite.get("", getCompositesResponse);
+	}
+	
+	function contributionURI(id) {
+	       var i = id.indexOf(';');
+	       return id.substring(10, i);
+	}
+	
+	function compositeName(id) {
+	       var i = id.indexOf(';');
+	       return id.substring(i + 1);
+	}
+		
+	function getCompositesResponse(feed) {
+		if (feed != null) {
+			var entries = feed.getElementsByTagName("entry");              
+			var composites = "";
+			composites += '<table width="100%">';
+			composites += '<tr><th>Composite</th>' +
+			'<th>Contribution</th>' +
+			'<th>Components</th>' +
+			'</tr>';
+			//'<th>Composite Configuration</th>' +
+			
+			for (var i=0; i<entries.length; i++) {
+				var id = entries[i].getElementsByTagName("id")[0].firstChild.nodeValue;
+				var link = entries[i].getElementsByTagName("link")[0].getAttribute("href");
+				var uri = contributionURI(id);
+				var qname = compositeName(id);
+
+				var content = "";
+				if (entries[i].getElementsByTagName("content")[0].firstChild != null) {
+					content = entries[i].getElementsByTagName("content")[0].firstChild.nodeValue;
+				}
+				var components = '';
+				var bs = content.indexOf('<span id="components">');
+				if (bs != -1) {
+					var es = content.indexOf('</span>', bs); 
+					components = content.substring(bs, es + 7);
+				} else {
+					bs = content.indexOf('<span id="problem"');
+					if (bs != -1) {
+						var es = content.indexOf('</span>', bs); 
+						components = content.substring(bs, es + 7);
+					}
+				}
+				
+				composites += '<tr>'
+				composites += '<td><input name="composites" type="checkbox" value="' + id + '">';
+				composites += '<a href=\"' + link + '\">' + qname + '</a></td>';
+				composites += '<td><a href="/contribution/' + uri + '">' + uri + '</a></td>';
+				composites += '<td class=tdw>' + components + '</td>';
+				//composites += '<td><a href="/composite-config/?composite=' + id + '"><img src="icons/feed-icon.png" border="0"></a></td>';
+				composites += '</tr>';
+			}
+			composites += '</table>';
+			document.getElementById("composites").innerHTML = composites;
+		}
+	}
+
+	function deleteComposite() {
+		var composites  = array(document.domainCompositeForm.composites);
+		for (var i = 0; i < composites.length; i++) {
+			if (composites[i].checked) {
+			    var id = composites[i].value;
+				domainComposite.del(id, deleteCompositeResponse);
+			}
+		}
+	}
+
+	function deleteCompositeResponse() {
+	    getComposites();
+	}	
+
+	function addComposite() {
+		var id  = 'composite:' +
+			document.newCompositeForm.contributionURI.value + ';' +
+			document.newCompositeForm.compositeNamespace.value + ';' +
+			document.newCompositeForm.compositeName.value;
+		var entry = '<entry xmlns="http://www.w3.org/2005/Atom">' +
+				'<title>' + id +'</title>' +
+              	'<id>' + id + '</id>' +
+               	'</entry>';
+		domainComposite.post(entry, addCompositeResponse);
+	}
+
+	function addCompositeResponse() {
+		document.newCompositeForm.compositeNamespace.value = "";
+		document.newCompositeForm.compositeName.value = "";
+		document.newCompositeForm.contributionURI.value = "";
+	    getComposites();
+	}
+	
+	var contributedComposites = new Array();
+	
+	function getContributions() {
+		workspace.get("", getContributionsResponse);
+	}
+	
+	function getContributionsResponse(feed) {
+		if (feed != null) {
+			contributedComposites = new Array();
+			var entries = feed.getElementsByTagName("entry");              
+			for (var i=0; i<entries.length; i++) {
+				if (entries[i].getElementsByTagName("content")[0].firstChild != null) {
+					var content = entries[i].getElementsByTagName("content")[0].firstChild.nodeValue;
+					var bs = content.indexOf('<span id="deployables">');
+					if (bs != -1) {
+						var es = content.indexOf('</span>', bs); 
+						content = content.substring(bs, es + 7);
+						for (;;) {
+							var bc = content.indexOf('composite:');
+							if (bc == -1) {
+								break;
+							}
+							var ec = content.indexOf('">', bc);
+							if (ec == -1) {
+								break;
+							}
+							var uri = content.substring(bc, ec);
+							contributedComposites[uri] = uri;
+							content = content.substring(ec +1);
+						}
+					}
+				}
+			}
+		}
+	}
+	
+	function suggestCompositeNamespaces() {
+		var namespaces = new Array();
+		for (var uri in contributedComposites) {
+			var qname = compositeName(uri);
+			var ns = qname.substring(0, qname.indexOf(';'));
+			namespaces[ns] = ns;
+		}
+		return array(namespaces);
+	}	
+
+	function suggestCompositeNames() {
+		var inputns = document.newCompositeForm.compositeNamespace.value;
+		var names = new Array();
+		for (var uri in contributedComposites) {
+			var qname = compositeName(uri);
+			var sc = qname.indexOf(';');
+			var ns = qname.substring(0, sc);
+			var name = qname.substring(sc + 1);
+			if (ns == inputns || inputns == "") {
+				names[name] = name;
+			}
+		}
+		return array(names);
+	}	
+
+	function suggestContributionURIs() {
+		var inputns = document.newCompositeForm.compositeNamespace.value;
+		var inputname = document.newCompositeForm.compositeName.value;
+		var uris = new Array();
+		for (var uri in contributedComposites) {
+			var qname = compositeName(uri);
+			var sc = qname.indexOf(';');
+			var ns = qname.substring(0, sc);
+			var name = qname.substring(sc + 1);
+			if ((ns == inputns || inputns == "") && (name == inputname || inputname == "")) {
+				var curi = contributionURI(uri);
+				uris[curi] = curi;
+			}
+		}
+		return array(uris);
+	}
+
+	function init() {
+		getComposites();
+		getContributions();
+		suggest(document.newCompositeForm.compositeNamespace, suggestCompositeNamespaces);
+		suggest(document.newCompositeForm.compositeName, suggestCompositeNames);
+		suggest(document.newCompositeForm.contributionURI, suggestContributionURIs);
+	}
+		
+</script>
+
+<link rel="stylesheet" type="text/css" href="manager.css">
+</head>
+
+<body onload="init()">
+  <div id="domainComposite">
+  
+  <span class=hd1>
+  SCA Domain<br><br>
+  Domain Composite&nbsp;<a href="/composite/"><img src="icons/feed-icon.png" border="0"></a>
+  </span>
+  <br><br>
+  Here is the list of SCA composites currently included as top-level composites in your SCA domain.
+  <br><br>
+  
+  <form name="domainCompositeForm">
+    <div id="composites" ></div>
+    <br>
+    <input type="button" onClick="deleteComposite()"  value="Delete" />
+  </form>
+  
+  <br><br>
+  
+  <form name="newCompositeForm">
+    <table width="100%">
+    <tr><th>Add Composite</th></tr>
+    <tr><td>Add an SCA composite describing your SCA service components.</td></tr>
+    </table>
+    <br>
+	<table>    
+    <tr><td>Composite namespace:</td><td><input type="text" name="compositeNamespace" size="50"/></td><td>e.g. http://your/namespace</td></tr> 
+    <tr><td>Composite name:</td><td><input type="text" name="compositeName" size="50"/></td><td>e.g. yourcomposite</td></tr>
+    <tr><td>Contribution URI:</td><td><input type="text" name="contributionURI" size="50"/></td><td>e.g. yourcontrib, http://yourcontrib</td></tr>
+    </table>
+    <input type="button" onClick="addComposite()" value="Add" />
+  </form>
+  
+  </div>
+</body>
+</html>
diff --git a/java/sca/modules/domain-manager/src/main/resources/composite.html b/java/sca/modules/domain-manager/src/main/resources/composite.html
index 9a873d42d2..bbf2b172b6 100644
--- a/java/sca/modules/domain-manager/src/main/resources/composite.html
+++ b/java/sca/modules/domain-manager/src/main/resources/composite.html
@@ -20,238 +20,45 @@
 <head>
 <title>SCA Domain - Domain Composite</title>
 
-<script type="text/javascript" src="composite.js"></script>
-<script type="text/javascript" src="utils.js"></script>
+<script type="text/javascript" src="../composite/composite.js"></script>
 
 <script language="JavaScript">
 
 	//@Reference
-	var domainComposite = new Reference("domainComposite");
-	
-	//@Reference
-	var workspace = new Reference("workspace");
-	
-	function getComposites() {
-		domainComposite.get("", getCompositesResponse);
-	}
-	
-	function contributionURI(id) {
-	       var i = id.indexOf(';');
-	       return id.substring(10, i);
-	}
-	
-	function compositeName(id) {
-	       var i = id.indexOf(';');
-	       return id.substring(i + 1);
-	}
-		
-	function getCompositesResponse(feed) {
-		if (feed != null) {
-			var entries = feed.getElementsByTagName("entry");              
-			var composites = "";
-			composites += '<table width="100%">';
-			composites += '<tr><th>Composite</th>' +
-			'<th>Contribution</th>' +
-			'<th>Components</th>' +
-			'</tr>';
-			//'<th>Composite Configuration</th>' +
-			
-			for (var i=0; i<entries.length; i++) {
-				var id = entries[i].getElementsByTagName("id")[0].firstChild.nodeValue;
-				var link = entries[i].getElementsByTagName("link")[0].getAttribute("href");
-				var uri = contributionURI(id);
-				var qname = compositeName(id);
-
-				var content = "";
-				if (entries[i].getElementsByTagName("content")[0].firstChild != null) {
-					content = entries[i].getElementsByTagName("content")[0].firstChild.nodeValue;
-				}
-				var components = '';
-				var bs = content.indexOf('<span id="components">');
-				if (bs != -1) {
-					var es = content.indexOf('</span>', bs); 
-					components = content.substring(bs, es + 7);
-				} else {
-					bs = content.indexOf('<span id="problem"');
-					if (bs != -1) {
-						var es = content.indexOf('</span>', bs); 
-						components = content.substring(bs, es + 7);
-					}
-				}
-				
-				composites += '<tr>'
-				composites += '<td><input name="composites" type="checkbox" value="' + id + '">';
-				composites += '<a href=\"' + link + '\">' + qname + '</a></td>';
-				composites += '<td><a href="/contribution/' + uri + '">' + uri + '</a></td>';
-				composites += '<td class=tdw>' + components + '</td>';
-				//composites += '<td><a href="/composite-config/?composite=' + id + '"><img src="icons/feed-icon.png" border="0"></a></td>';
-				composites += '</tr>';
-			}
-			composites += '</table>';
-			document.getElementById("composites").innerHTML = composites;
-		}
-	}
-
-	function deleteComposite() {
-		var composites  = array(document.domainCompositeForm.composites);
-		for (var i = 0; i < composites.length; i++) {
-			if (composites[i].checked) {
-			    var id = composites[i].value;
-				domainComposite.del(id, deleteCompositeResponse);
-			}
-		}
-	}
+	var toolbarGadget = new Reference("toolbarGadget");
 
-	function deleteCompositeResponse() {
-	    getComposites();
-	}	
-
-	function addComposite() {
-		var id  = 'composite:' +
-			document.newCompositeForm.contributionURI.value + ';' +
-			document.newCompositeForm.compositeNamespace.value + ';' +
-			document.newCompositeForm.compositeName.value;
-		var entry = '<entry xmlns="http://www.w3.org/2005/Atom">' +
-				'<title>' + id +'</title>' +
-              	'<id>' + id + '</id>' +
-               	'</entry>';
-		domainComposite.post(entry, addCompositeResponse);
-	}
+	//@Reference
+	var compositeGadget = new Reference("compositeGadget");
 
-	function addCompositeResponse() {
-		document.newCompositeForm.compositeNamespace.value = "";
-		document.newCompositeForm.compositeName.value = "";
-		document.newCompositeForm.contributionURI.value = "";
-	    getComposites();
-	}
-	
-	var contributedComposites = new Array();
-	
-	function getContributions() {
-		workspace.get("", getContributionsResponse);
+	function toolbarGadget_getResponse(html) {
+		var gadget = document.getElementById('toolbarGadget');
+		var content = gadget.contentWindow.document;
+		content.open();
+		content.write(html);
+		content.close();
 	}
-	
-	function getContributionsResponse(feed) {
-		if (feed != null) {
-			contributedComposites = new Array();
-			var entries = feed.getElementsByTagName("entry");              
-			for (var i=0; i<entries.length; i++) {
-				if (entries[i].getElementsByTagName("content")[0].firstChild != null) {
-					var content = entries[i].getElementsByTagName("content")[0].firstChild.nodeValue;
-					var bs = content.indexOf('<span id="deployables">');
-					if (bs != -1) {
-						var es = content.indexOf('</span>', bs); 
-						content = content.substring(bs, es + 7);
-						for (;;) {
-							var bc = content.indexOf('composite:');
-							if (bc == -1) {
-								break;
-							}
-							var ec = content.indexOf('">', bc);
-							if (ec == -1) {
-								break;
-							}
-							var uri = content.substring(bc, ec);
-							contributedComposites[uri] = uri;
-							content = content.substring(ec +1);
-						}
-					}
-				}
-			}
-		}
-	}
-	
-	function suggestCompositeNamespaces() {
-		var namespaces = new Array();
-		for (var uri in contributedComposites) {
-			var qname = compositeName(uri);
-			var ns = qname.substring(0, qname.indexOf(';'));
-			namespaces[ns] = ns;
-		}
-		return array(namespaces);
-	}	
-
-	function suggestCompositeNames() {
-		var inputns = document.newCompositeForm.compositeNamespace.value;
-		var names = new Array();
-		for (var uri in contributedComposites) {
-			var qname = compositeName(uri);
-			var sc = qname.indexOf(';');
-			var ns = qname.substring(0, sc);
-			var name = qname.substring(sc + 1);
-			if (ns == inputns || inputns == "") {
-				names[name] = name;
-			}
-		}
-		return array(names);
-	}	
 
-	function suggestContributionURIs() {
-		var inputns = document.newCompositeForm.compositeNamespace.value;
-		var inputname = document.newCompositeForm.compositeName.value;
-		var uris = new Array();
-		for (var uri in contributedComposites) {
-			var qname = compositeName(uri);
-			var sc = qname.indexOf(';');
-			var ns = qname.substring(0, sc);
-			var name = qname.substring(sc + 1);
-			if ((ns == inputns || inputns == "") && (name == inputname || inputname == "")) {
-				var curi = contributionURI(uri);
-				uris[curi] = curi;
-			}
-		}
-		return array(uris);
+	function compositeGadget_getResponse(html) {
+		var gadget = document.getElementById('compositeGadget');
+		var content = gadget.contentWindow.document;
+		content.open();
+		content.write(html);
+		content.close();
 	}
 
 	function init() {
-		toolbar();
-		getComposites();
-		getContributions();
-		suggest(document.newCompositeForm.compositeNamespace, suggestCompositeNamespaces);
-		suggest(document.newCompositeForm.compositeName, suggestCompositeNames);
-		suggest(document.newCompositeForm.contributionURI, suggestContributionURIs);
+		toolbarGadget.get('', toolbarGadget_getResponse);
+		compositeGadget.get('', compositeGadget_getResponse);
 	}
-		
+
 </script>
 
 <link rel="stylesheet" type="text/css" href="manager.css">
 </head>
 
 <body onload="init()">
-  <div id="toolbar"></div>
-
-  <div id="domainComposite">
+  <iframe id="toolbarGadget" style="top: 0px; left: 0px; width: 100%;"></iframe>
   <br>
-  <span class=hd1>
-  SCA Domain<br><br>
-  Domain Composite&nbsp;<a href="/composite/"><img src="icons/feed-icon.png" border="0"></a>
-  </span>
-  <br><br>
-  Here is the list of SCA composites currently included as top-level composites in your SCA domain.
-  <br><br>
-  
-  <form name="domainCompositeForm">
-    <div id="composites" ></div>
-    <br>
-    <input type="button" onClick="deleteComposite()"  value="Delete" />
-  </form>
-  
-  <br><br>
-  
-  <form name="newCompositeForm">
-    <table width="100%">
-    <tr><th>Add Composite</th></tr>
-    <tr><td>Add an SCA composite describing your SCA service components.</td></tr>
-    </table>
-    <br>
-	<table>    
-    <tr><td>Composite namespace:</td><td><input type="text" name="compositeNamespace" size="50"/></td><td>e.g. http://your/namespace</td></tr> 
-    <tr><td>Composite name:</td><td><input type="text" name="compositeName" size="50"/></td><td>e.g. yourcomposite</td></tr>
-    <tr><td>Contribution URI:</td><td><input type="text" name="contributionURI" size="50"/></td><td>e.g. yourcontrib, http://yourcontrib</td></tr>
-    </table>
-    <input type="button" onClick="addComposite()" value="Add" />
-  </form>
-  
-  </div>
+  <iframe id="compositeGadget" style="left: 0px; width: 100%; height: 100%;"></iframe>
 </body>
 </html>
diff --git a/java/sca/modules/domain-manager/src/main/resources/files-gadget.html b/java/sca/modules/domain-manager/src/main/resources/files-gadget.html
new file mode 100644
index 0000000000..d4231ee21a
--- /dev/null
+++ b/java/sca/modules/domain-manager/src/main/resources/files-gadget.html
@@ -0,0 +1,111 @@
+<!--
+    * 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.    
+-->
+<html>
+<head>
+<title>SCA Domain - Contribution File Server</title>
+
+<script type="text/javascript" src="../files-gadget/files-gadget.js"></script>
+<script type="text/javascript" src="utils.js"></script>
+
+<script language="JavaScript">
+
+	//@Reference
+	var files = new Reference("files");
+	
+	function getFiles() {
+		files.get("", getFilesResponse);
+	}
+	
+	function getFilesResponse(feed) {
+		if (feed != null) {
+			var entries = feed.getElementsByTagName("entry");              
+			var list = '<table width="100%"><tr><th>Files</th></tr>';
+			for (var i=0; i<entries.length; i++) {
+				var id = entries[i].getElementsByTagName("id")[0].firstChild.nodeValue;
+				var location = entries[i].getElementsByTagName("link")[0].getAttribute("href");
+				list += '<tr><td><input name="files" type="checkbox" value="' + id + '">' +
+											'<a href=\"' + location + '\">' + id + '</a></td></tr>';
+			}
+			list += "</table>";
+			document.getElementById("files").innerHTML = list;
+		}
+	}				
+
+	function deleteFile() {
+		var list = array(document.filesForm.files);
+		for (var i=0; i < list.length; i++) {
+			if (list[i].checked) {
+			    var id = list[i].value;
+				files.del(id, deleteFileResponse);
+			}
+		}
+	}
+
+	function deleteFileResponse() {
+	    getFiles();
+	}
+
+	function uploadFile() {
+		document.uploadFileForm.submit();
+	}
+
+	function init() {
+		getFiles();
+	}
+
+</script>
+
+<link rel="stylesheet" type="text/css" href="manager.css">
+</head>
+
+<body onload="init()">
+  <div id="fileServer">
+  
+  <span class=hd1>
+  SCA Domain<br><br>
+  File Server&nbsp;<a href="/feed/files/"><img src="icons/feed-icon.png" border="0"></a>
+  </span>
+  <br><br>
+  This is a simple ATOM-based file server useful to share files if you don't have an FTP, SVN or Maven repository.
+  <br><br>
+  
+  <form name="filesForm">
+    <div id="files" ></div>
+    <br/>
+    <input type="button" onClick="deleteFile()"  value="Delete" />
+  </form>
+
+  <br><br>
+  
+  <form method="post" name="uploadFileForm" enctype='multipart/form-data' action='/files'>
+    <table width="100%">
+    <tr><th>Upload File</th></tr>
+    <tr><td>Upload a file to the server.</td></tr>
+    </table>
+    <br>
+    <table border="0">
+    <tr><td>File:</td><td><input type="file" name="file" size="50"/></td></tr>
+    </table>
+    <br/>
+    <input type="button" onClick="uploadFile()" value="Upload" />
+  </form>    
+      
+  </div>
+</body>
+</html>
diff --git a/java/sca/modules/domain-manager/src/main/resources/files.html b/java/sca/modules/domain-manager/src/main/resources/files.html
index 1a7460df11..71b543477a 100644
--- a/java/sca/modules/domain-manager/src/main/resources/files.html
+++ b/java/sca/modules/domain-manager/src/main/resources/files.html
@@ -20,54 +20,35 @@
 <head>
 <title>SCA Domain - Contribution File Server</title>
 
-<script type="text/javascript" src="files.js"></script>
-<script type="text/javascript" src="utils.js"></script>
+<script type="text/javascript" src="../files/files.js"></script>
 
 <script language="JavaScript">
 
 	//@Reference
-	var files = new Reference("files");
-	
-	function getFiles() {
-		files.get("", getFilesResponse);
-	}
-	
-	function getFilesResponse(feed) {
-		if (feed != null) {
-			var entries = feed.getElementsByTagName("entry");              
-			var list = '<table width="100%"><tr><th>Files</th></tr>';
-			for (var i=0; i<entries.length; i++) {
-				var id = entries[i].getElementsByTagName("id")[0].firstChild.nodeValue;
-				var location = entries[i].getElementsByTagName("link")[0].getAttribute("href");
-				list += '<tr><td><input name="files" type="checkbox" value="' + id + '">' +
-											'<a href=\"' + location + '\">' + id + '</a></td></tr>';
-			}
-			list += "</table>";
-			document.getElementById("files").innerHTML = list;
-		}
-	}				
+	var toolbarGadget = new Reference("toolbarGadget");
 
-	function deleteFile() {
-		var list = array(document.filesForm.files);
-		for (var i=0; i < list.length; i++) {
-			if (list[i].checked) {
-			    var id = list[i].value;
-				files.del(id, deleteFileResponse);
-			}
-		}
-	}
+	//@Reference
+	var filesGadget = new Reference("filesGadget");
 
-	function deleteFileResponse() {
-	    getFiles();
+	function toolbarGadget_getResponse(html) {
+		var gadget = document.getElementById('toolbarGadget');
+		var content = gadget.contentWindow.document;
+		content.open();
+		content.write(html);
+		content.close();
 	}
 
-	function uploadFile() {
-		document.uploadFileForm.submit();
+	function filesGadget_getResponse(html) {
+		var gadget = document.getElementById('filesGadget');
+		var content = gadget.contentWindow.document;
+		content.open();
+		content.write(html);
+		content.close();
 	}
 
 	function init() {
-		toolbar();	
-		getFiles();
+		toolbarGadget.get('', toolbarGadget_getResponse);
+		filesGadget.get('', filesGadget_getResponse);
 	}
 
 </script>
@@ -76,39 +57,8 @@
 </head>
 
 <body onload="init()">
-  <div id="toolbar"></div>
-
-  <div id="fileServer">
+  <iframe id="toolbarGadget" style="top: 0px; left: 0px; width: 100%;"></iframe>
   <br>
-  <span class=hd1>
-  SCA Domain<br><br>
-  File Server&nbsp;<a href="/feed/files/"><img src="icons/feed-icon.png" border="0"></a>
-  </span>
-  <br><br>
-  This is a simple ATOM-based file server useful to share files if you don't have an FTP, SVN or Maven repository.
-  <br><br>
-  
-  <form name="filesForm">
-    <div id="files" ></div>
-    <br/>
-    <input type="button" onClick="deleteFile()"  value="Delete" />
-  </form>
-
-  <br><br>
-  
-  <form method="post" name="uploadFileForm" enctype='multipart/form-data' action='/files'>
-    <table width="100%">
-    <tr><th>Upload File</th></tr>
-    <tr><td>Upload a file to the server.</td></tr>
-    </table>
-    <br>
-    <table border="0">
-    <tr><td>File:</td><td><input type="file" name="file" size="50"/></td></tr>
-    </table>
-    <br/>
-    <input type="button" onClick="uploadFile()" value="Upload" />
-  </form>    
-      
-  </div>
+  <iframe id="filesGadget" style="left: 0px; width: 100%; height: 100%;"></iframe>
 </body>
 </html>
diff --git a/java/sca/modules/domain-manager/src/main/resources/home-gadget.html b/java/sca/modules/domain-manager/src/main/resources/home-gadget.html
new file mode 100644
index 0000000000..ce7cd08fdf
--- /dev/null
+++ b/java/sca/modules/domain-manager/src/main/resources/home-gadget.html
@@ -0,0 +1,57 @@
+<!--
+    * 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.    
+-->
+<html>
+<head>
+<title>SCA Domain - Home</title>
+
+<script type="text/javascript" src="../home-gadget/home-gadget.js"></script>
+<script type="text/javascript" src="utils.js"></script>
+
+<script language="JavaScript">
+
+	function init() {
+	}
+
+</script>
+
+<link rel="stylesheet" type="text/css" href="manager.css">
+</head>
+
+<body onload="init()">
+  <div id="home">
+  
+  <span class=hd1>
+  SCA Domain
+  </span>
+  
+  <br><br><br><br><br>
+  
+  <form>
+  <table border="0" align="center">
+  <tr><td valign="top"><span style="font-size:150%; color: blue">Search:</span></td><td><input type="text" name="search" size="50"/></td></tr>
+  <tr><td></td><td align="center"><input type="button" name="search" value="Search" /></td></tr>
+  </table>
+  </form>
+
+  <br><br><br><br><br><br><br>
+  <center>This page is under construction, searching the domain is not implemented yet.</center>
+  
+  </div>
+</body>
+</html>
diff --git a/java/sca/modules/domain-manager/src/main/resources/home.html b/java/sca/modules/domain-manager/src/main/resources/home.html
index 88f190336d..0adf5cbcb7 100644
--- a/java/sca/modules/domain-manager/src/main/resources/home.html
+++ b/java/sca/modules/domain-manager/src/main/resources/home.html
@@ -20,15 +20,36 @@
 <head>
 <title>SCA Domain - Home</title>
 
-<script type="text/javascript" src="home.js"></script>
-<script type="text/javascript" src="utils.js"></script>
+<script type="text/javascript" src="../home/home.js"></script>
 
 <script language="JavaScript">
 
-	function init() {
-		toolbar();
+	//@Reference
+	var toolbarGadget = new Reference("toolbarGadget");
+
+	//@Reference
+	var homeGadget = new Reference("homeGadget");
+
+	function toolbarGadget_getResponse(html) {
+		var gadget = document.getElementById('toolbarGadget');
+		var content = gadget.contentWindow.document;
+		content.open();
+		content.write(html);
+		content.close();
 	}
 
+	function homeGadget_getResponse(html) {
+		var gadget = document.getElementById('homeGadget');
+		var content = gadget.contentWindow.document;
+		content.open();
+		content.write(html);
+		content.close();
+	}
+
+	function init() {
+		toolbarGadget.get('', toolbarGadget_getResponse);
+		homeGadget.get('', homeGadget_getResponse);
+	}
 
 </script>
 
@@ -36,24 +57,8 @@
 </head>
 
 <body onload="init()">
-  <div id="toolbar"></div>
-  
+  <iframe id="toolbarGadget" style="top: 0px; left: 0px; width: 100%;"></iframe>
   <br>
-  <span class=hd1>
-  SCA Domain
-  </span>
-  
-  <br><br><br><br><br>
-  
-  <form>
-  <table border="0" align="center">
-  <tr><td valign="top"><span style="font-size:150%; color: blue">Search:</span></td><td><input type="text" name="search" size="50"/></td></tr>
-  <tr><td></td><td align="center"><input type="button" name="search" value="Search" /></td></tr>
-  </table>
-  </form>
-
-  <br><br><br><br><br><br><br>
-  <center>This page is under construction, searching the domain is not implemented yet.</center>
-  
+  <iframe id="homeGadget" style="left: 0px; width: 100%; height: 100%;"></iframe>
 </body>
 </html>
diff --git a/java/sca/modules/domain-manager/src/main/resources/manager.css b/java/sca/modules/domain-manager/src/main/resources/manager.css
index 5f4166876d..7eb10ee318 100644
--- a/java/sca/modules/domain-manager/src/main/resources/manager.css
+++ b/java/sca/modules/domain-manager/src/main/resources/manager.css
@@ -18,7 +18,7 @@
  */
 
 body {
-	white-space: nowrap
+	white-space: nowrap; overflow: hidden;
 }
 
 table {
@@ -36,6 +36,10 @@ td {
 	padding-left: 2px; padding-top: 2px; padding-right: 20px; white-space: nowrap; vertical-align: text-top
 }
 
+iframe {
+	border: 0px; margin: 0px; padding: 0px; position: absolute; overflow: hidden;
+}
+
 input {
 	vertical-align: middle
 }
@@ -97,3 +101,4 @@ suggestTable {
 	padding-left: 2px; padding-top: 0px; padding-bottom: 0px; padding-right: 2px; white-space: nowrap; vertical-align: text-top;
 	background-color: #598edd; color: #e5ecf9;
 }
+
diff --git a/java/sca/modules/domain-manager/src/main/resources/toolbar-gadget.html b/java/sca/modules/domain-manager/src/main/resources/toolbar-gadget.html
new file mode 100644
index 0000000000..1ea1e1f8fd
--- /dev/null
+++ b/java/sca/modules/domain-manager/src/main/resources/toolbar-gadget.html
@@ -0,0 +1,47 @@
+<!--
+    * 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.    
+-->
+<html>
+<head>
+<title>SCA Domain - Toolbar</title>
+
+<script type="text/javascript" src="utils.js"></script>
+
+<script language="JavaScript">
+
+	function init() {
+		var tools = new Array();
+		tools[0] = new Tool("Contributions", "../workspace");
+		tools[1] = new Tool("Composites", "../composite");
+		tools[2] = new Tool("Cloud", "../cloud");
+		tools[3] = new Tool("Files", "../files");
+		
+		var home = new Tool("Home", "../home");
+			
+		document.getElementById('toolbar').innerHTML = toolbar(home, tools);
+	}
+
+</script>
+
+<link rel="stylesheet" type="text/css" href="manager.css">
+</head>
+
+<body onload="init()">
+  <div id="toolbar"></div>
+</body>
+</html>
diff --git a/java/sca/modules/domain-manager/src/main/resources/utils.js b/java/sca/modules/domain-manager/src/main/resources/utils.js
index a75bc45a13..c382ab9e5a 100644
--- a/java/sca/modules/domain-manager/src/main/resources/utils.js
+++ b/java/sca/modules/domain-manager/src/main/resources/utils.js
@@ -141,7 +141,7 @@ function Tool(name, href) {
 Tool.prototype.print = function() {
     var loc = '' + location;
 	if (loc.match(this.href) == null) {
-		return '<a href="' + this.href + '">' + this.name + '</a>';
+		return '<a href="' + this.href + '" target="_parent">' + this.name + '</a>';
 	} else {
 		return '<span>' + this.name + '</span>';
 	}
@@ -150,7 +150,7 @@ Tool.prototype.print = function() {
 /**
  * Initialize the toolbar
  */
-function toolbar() {
+function toolbar(home, tools) {
 	var toolbar = '<table width="100%" cellpadding="0" cellspacing="0" class=tbar><tr>' +
 	'<td class=ltbar><table border="0" cellspacing="0" cellpadding="0"><tr>';
    
@@ -163,7 +163,7 @@ function toolbar() {
    	'<td class=rtbar>' + home.print() + '</td></tr></table></td>' +
    	'</tr></table>';
 
-	document.getElementById('toolbar').innerHTML = toolbar;
+   	return toolbar;
 }
 
 /**
@@ -184,14 +184,3 @@ function array(obj) {
   		return a;
   	}
 }
-
-/**
- * Populate the default toolbar
- */
-var tools = new Array();
-tools[0] = new Tool("Contributions", "/ui/workspace");
-tools[1] = new Tool("Composites", "/ui/composite");
-tools[2] = new Tool("Cloud", "/ui/cloud");
-tools[3] = new Tool("Files", "/ui/files");
-
-var home = new Tool("Home", "/ui/home");
diff --git a/java/sca/modules/domain-manager/src/main/resources/workspace-gadget.html b/java/sca/modules/domain-manager/src/main/resources/workspace-gadget.html
new file mode 100644
index 0000000000..41e5d6b475
--- /dev/null
+++ b/java/sca/modules/domain-manager/src/main/resources/workspace-gadget.html
@@ -0,0 +1,203 @@
+<!--
+    * 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.    
+-->
+<html>
+<head>
+<title>SCA Domain - Contributions</title>
+
+<script type="text/javascript" src="../workspace-gadget/workspace-gadget.js"></script>
+<script type="text/javascript" src="utils.js"></script>
+
+<script language="JavaScript">
+
+	//@Reference
+	var workspace = new Reference("workspace");
+	
+	function getContributions() {
+		workspace.get("", getContributionsResponse);
+	}
+	
+	function getContributionsResponse(feed) {
+		if (feed != null) {
+			var entries = feed.getElementsByTagName("entry");              
+			var contributions = "";
+			contributions += '<table width="100%">';
+			contributions += '<tr><th>Contribution</th><th>Dependencies</td><th>Deployable Composites</th></tr>';
+			for (var i=0; i<entries.length; i++) {
+				var id = entries[i].getElementsByTagName("id")[0].firstChild.nodeValue;
+				var location = entries[i].getElementsByTagName("link")[0].getAttribute("href");
+				var content = '';
+				if (entries[i].getElementsByTagName("content")[0].firstChild != null) {
+					content = entries[i].getElementsByTagName("content")[0].firstChild.nodeValue;
+				}
+				
+				contributions += '<tr>';
+				contributions += '<td><input name="contributions" type="checkbox" value="' + id + '">' +
+											'<a href=\"' + location + '\">' + id + '</a></td>';
+
+				var dependencies = '';
+				var bs = content.indexOf('<span id="dependencies">');
+				if (bs != -1) {
+					var es = content.indexOf('</span>', bs); 
+					dependencies = content.substring(bs, es + 7);
+				}
+											
+				var deployables = '';
+				var bs = content.indexOf('<span id="deployables">');
+				if (bs != -1) {
+					var es = content.indexOf('</span>', bs); 
+					deployables = content.substring(bs, es + 7);
+				}
+				
+				var problems = "";
+				var bs = content.indexOf('<span id="problems" ');
+				if (bs != -1) {
+					var es = content.indexOf('</span>', bs);
+					if (dependencies.length != 0) {
+					  problems = '<br>';
+					} 
+					problems += content.substring(bs, es + 7);
+				}
+											
+				contributions += '<td class=tdw>' + dependencies + problems + ' </td>';
+				contributions += '<td class=tdw>' + deployables + '</td>';
+				contributions += '</tr>';
+			}
+			contributions += '</table>';
+			document.getElementById("contributions").innerHTML = contributions;
+		}
+	}				
+
+	var suggestedContributions = new Array();
+	
+	function getSuggestedContributions() {
+		workspace.get("?suggestions=true", getSuggestedContributionsResponse);
+	}
+	
+	function getSuggestedContributionsResponse(feed) {
+		suggestedContributions = new Array();
+		if (feed != null) {
+			var entries = feed.getElementsByTagName("entry");              
+			for (var i=0; i<entries.length; i++) {
+				var id = entries[i].getElementsByTagName("id")[0].firstChild.nodeValue;
+				var location = entries[i].getElementsByTagName("link")[1].getAttribute("href");
+				suggestedContributions[i] = id + ':' + location;	
+			}
+		}
+	}				
+
+	function deleteContribution() {
+		var contributions  = array(document.workspaceForm.contributions);
+		for (var i=0; i < contributions.length; i++) {
+			if (contributions[i].checked) {
+			    var id = contributions[i].value;
+				workspace.del(id, deleteContributionResponse);
+			}
+		}
+	}
+
+	function deleteContributionResponse() {
+	    getContributions();
+	}	
+
+	function addContribution() {
+		var id  = document.newContributionForm.contributionID.value;
+		var location  = document.newContributionForm.contributionLocation.value;
+		var entry = '<entry xmlns="http://www.w3.org/2005/Atom">' +
+				'<title>Contribution - ' + id +'</title>' +
+              	'<id>' + id + '</id>' +
+              	'<link href="' + location + '" />' +
+               	'</entry>';
+		workspace.post(entry, addContributionResponse);
+	}
+
+	function addContributionResponse() {
+		document.newContributionForm.contributionID.value = "";
+		document.newContributionForm.contributionLocation.value = "";
+	    getContributions();
+	}
+
+	function suggestContributionIDs() {
+		var ids = new Array();
+		for (var i=0; i<suggestedContributions.length; i++) {
+			var uri = suggestedContributions[i];
+			var id = uri.substring(0, uri.indexOf(':'));
+			ids[id] = id;
+		}
+		return array(ids);
+	}
+
+	function suggestContributionLocations() {
+		var locations = new Array();
+		for (var i=0; i<suggestedContributions.length; i++) {
+			var uri = suggestedContributions[i];
+			var id = uri.substring(0, uri.indexOf(':'));
+			if (id == document.newContributionForm.contributionID.value) {
+				var location = uri.substring(uri.indexOf(':') +1);
+				locations[location] = location;
+			}
+		}
+		return array(locations);
+	}
+
+	function init() {
+		getContributions();
+		getSuggestedContributions();
+		suggest(document.newContributionForm.contributionID, suggestContributionIDs);
+		suggest(document.newContributionForm.contributionLocation, suggestContributionLocations);
+	}
+	
+</script>
+
+<link rel="stylesheet" type="text/css" href="manager.css">
+</head>
+
+<body onload="init()">
+  <div id="workspace">
+  
+  <span class=hd1>
+  SCA Domain<br><br>
+  Contributions</b>&nbsp;<a href="/workspace/"><img src="icons/feed-icon.png" border="0"></a>  </span>
+  <br><br>
+  Here is the list of SCA contributions currently available in your SCA domain.
+  <br><br>
+
+  <form name="workspaceForm">
+    <div id="contributions" ></div>
+    <br>
+    <input type="button" onClick="deleteContribution()"  value="Delete" />
+  </form>
+
+  <br><br>
+  
+  <form name="newContributionForm">
+    <table width="100%">
+    <tr><th>Add Contribution</th></tr>
+    <tr><td>Add an SCA contribution containing your application artifacts to the SCA domain.</td></tr>
+    </table>
+    <br>
+    <table>
+    <tr><td>Contribution URI:</td><td><input type="text" name="contributionID" size="50"/></td></td><td>e.g. yourcontrib, http://yourcontrib</td></tr> 
+    <tr><td>Location:</td><td><input type="text" name="contributionLocation" size="50"/></td></td><td>e.g. http://host/yourjar.jar, file:/yourdir, file:/yourjar.jar</td></tr>
+    </table>
+    <input type="button" onClick="addContribution()" value="Add" />
+  </form>
+  
+  </div>
+</body>
+</html>
diff --git a/java/sca/modules/domain-manager/src/main/resources/workspace.html b/java/sca/modules/domain-manager/src/main/resources/workspace.html
index db3b4ac560..9c9a1dc005 100644
--- a/java/sca/modules/domain-manager/src/main/resources/workspace.html
+++ b/java/sca/modules/domain-manager/src/main/resources/workspace.html
@@ -20,187 +20,45 @@
 <head>
 <title>SCA Domain - Contributions</title>
 
-<script type="text/javascript" src="workspace.js"></script>
-<script type="text/javascript" src="utils.js"></script>
+<script type="text/javascript" src="../workspace/workspace.js"></script>
 
 <script language="JavaScript">
 
 	//@Reference
-	var workspace = new Reference("workspace");
-	
-	function getContributions() {
-		workspace.get("", getContributionsResponse);
-	}
-	
-	function getContributionsResponse(feed) {
-		if (feed != null) {
-			var entries = feed.getElementsByTagName("entry");              
-			var contributions = "";
-			contributions += '<table width="100%">';
-			contributions += '<tr><th>Contribution</th><th>Dependencies</td><th>Deployable Composites</th></tr>';
-			for (var i=0; i<entries.length; i++) {
-				var id = entries[i].getElementsByTagName("id")[0].firstChild.nodeValue;
-				var location = entries[i].getElementsByTagName("link")[0].getAttribute("href");
-				var content = '';
-				if (entries[i].getElementsByTagName("content")[0].firstChild != null) {
-					content = entries[i].getElementsByTagName("content")[0].firstChild.nodeValue;
-				}
-				
-				contributions += '<tr>';
-				contributions += '<td><input name="contributions" type="checkbox" value="' + id + '">' +
-											'<a href=\"' + location + '\">' + id + '</a></td>';
-
-				var dependencies = '';
-				var bs = content.indexOf('<span id="dependencies">');
-				if (bs != -1) {
-					var es = content.indexOf('</span>', bs); 
-					dependencies = content.substring(bs, es + 7);
-				}
-											
-				var deployables = '';
-				var bs = content.indexOf('<span id="deployables">');
-				if (bs != -1) {
-					var es = content.indexOf('</span>', bs); 
-					deployables = content.substring(bs, es + 7);
-				}
-				
-				var problems = "";
-				var bs = content.indexOf('<span id="problems" ');
-				if (bs != -1) {
-					var es = content.indexOf('</span>', bs);
-					if (dependencies.length != 0) {
-					  problems = '<br>';
-					} 
-					problems += content.substring(bs, es + 7);
-				}
-											
-				contributions += '<td class=tdw>' + dependencies + problems + ' </td>';
-				contributions += '<td class=tdw>' + deployables + '</td>';
-				contributions += '</tr>';
-			}
-			contributions += '</table>';
-			document.getElementById("contributions").innerHTML = contributions;
-		}
-	}				
-
-	var suggestedContributions = new Array();
-	
-	function getSuggestedContributions() {
-		workspace.get("?suggestions=true", getSuggestedContributionsResponse);
-	}
-	
-	function getSuggestedContributionsResponse(feed) {
-		suggestedContributions = new Array();
-		if (feed != null) {
-			var entries = feed.getElementsByTagName("entry");              
-			for (var i=0; i<entries.length; i++) {
-				var id = entries[i].getElementsByTagName("id")[0].firstChild.nodeValue;
-				var location = entries[i].getElementsByTagName("link")[1].getAttribute("href");
-				suggestedContributions[i] = id + ':' + location;	
-			}
-		}
-	}				
-
-	function deleteContribution() {
-		var contributions  = array(document.workspaceForm.contributions);
-		for (var i=0; i < contributions.length; i++) {
-			if (contributions[i].checked) {
-			    var id = contributions[i].value;
-				workspace.del(id, deleteContributionResponse);
-			}
-		}
-	}
-
-	function deleteContributionResponse() {
-	    getContributions();
-	}	
-
-	function addContribution() {
-		var id  = document.newContributionForm.contributionID.value;
-		var location  = document.newContributionForm.contributionLocation.value;
-		var entry = '<entry xmlns="http://www.w3.org/2005/Atom">' +
-				'<title>Contribution - ' + id +'</title>' +
-              	'<id>' + id + '</id>' +
-              	'<link href="' + location + '" />' +
-               	'</entry>';
-		workspace.post(entry, addContributionResponse);
-	}
-
-	function addContributionResponse() {
-		document.newContributionForm.contributionID.value = "";
-		document.newContributionForm.contributionLocation.value = "";
-	    getContributions();
-	}
+	var toolbarGadget = new Reference("toolbarGadget");
 
-	function suggestContributionIDs() {
-		var ids = new Array();
-		for (var i=0; i<suggestedContributions.length; i++) {
-			var uri = suggestedContributions[i];
-			var id = uri.substring(0, uri.indexOf(':'));
-			ids[id] = id;
-		}
-		return array(ids);
+	//@Reference
+	var workspaceGadget = new Reference("workspaceGadget");
+
+	function toolbarGadget_getResponse(html) {
+		var gadget = document.getElementById('toolbarGadget');
+		var content = gadget.contentWindow.document;
+		content.open();
+		content.write(html);
+		content.close();
 	}
 
-	function suggestContributionLocations() {
-		var locations = new Array();
-		for (var i=0; i<suggestedContributions.length; i++) {
-			var uri = suggestedContributions[i];
-			var id = uri.substring(0, uri.indexOf(':'));
-			if (id == document.newContributionForm.contributionID.value) {
-				var location = uri.substring(uri.indexOf(':') +1);
-				locations[location] = location;
-			}
-		}
-		return array(locations);
+	function workspaceGadget_getResponse(html) {
+		var gadget = document.getElementById('workspaceGadget');
+		var content = gadget.contentWindow.document;
+		content.open();
+		content.write(html);
+		content.close();
 	}
 
 	function init() {
-		toolbar();
-		getContributions();
-		getSuggestedContributions();
-		suggest(document.newContributionForm.contributionID, suggestContributionIDs);
-		suggest(document.newContributionForm.contributionLocation, suggestContributionLocations);
+		toolbarGadget.get('', toolbarGadget_getResponse);
+		workspaceGadget.get('', workspaceGadget_getResponse);
 	}
-	
+
 </script>
 
 <link rel="stylesheet" type="text/css" href="manager.css">
 </head>
 
 <body onload="init()">
-  <div id="toolbar"></div>
-
-  <div id="workspace">
+  <iframe id="toolbarGadget" style="top: 0px; left: 0px; width: 100%;"></iframe>
   <br>
-  <span class=hd1>
-  SCA Domain<br><br>
-  Contributions</b>&nbsp;<a href="/workspace/"><img src="icons/feed-icon.png" border="0"></a>  </span>
-  <br><br>
-  Here is the list of SCA contributions currently available in your SCA domain.
-  <br><br>
-
-  <form name="workspaceForm">
-    <div id="contributions" ></div>
-    <br>
-    <input type="button" onClick="deleteContribution()"  value="Delete" />
-  </form>
-
-  <br><br>
-  
-  <form name="newContributionForm">
-    <table width="100%">
-    <tr><th>Add Contribution</th></tr>
-    <tr><td>Add an SCA contribution containing your application artifacts to the SCA domain.</td></tr>
-    </table>
-    <br>
-    <table>
-    <tr><td>Contribution URI:</td><td><input type="text" name="contributionID" size="50"/></td></td><td>e.g. yourcontrib, http://yourcontrib</td></tr> 
-    <tr><td>Location:</td><td><input type="text" name="contributionLocation" size="50"/></td></td><td>e.g. http://host/yourjar.jar, file:/yourdir, file:/yourjar.jar</td></tr>
-    </table>
-    <input type="button" onClick="addContribution()" value="Add" />
-  </form>
-  
-  </div>
+  <iframe id="workspaceGadget" style="left: 0px; width: 100%; height: 100%;"></iframe>
 </body>
 </html>