Minimal collapse/grouping finished, started work on group options widget

ericabouaf · Aug 18, 2009 · adf167e · adf167e
1 parent ab26089
commit adf167e
Show file tree

Hide file tree

Showing 4 changed files with 403 additions and 16 deletions.
diff --git a/examples/WiringEditor/embedded.html b/examples/WiringEditor/embedded.html
@@ -108,6 +108,7 @@
 <script type="text/javascript" src="../../js/adapters/json-rpc.js"></script>
 
 <script type="text/javascript" src="../../js/GroupFormContainer.js"></script>
+<script type="text/javascript" src="../../js/Group.js"></script>
 
 <script type="text/javascript" src="embedded.js"></script>
 
@@ -193,7 +194,12 @@ <h2>Infos</h2>
 				</div>
 			</div>
 		</li>
-
+		<li>
+			<h2>Grouping</h2>
+			<div>
+				<div id="groupConfig"></div>
+			</div>
+		</li>		
 	  </ul>
 	</div>
 

diff --git a/js/Container.js b/js/Container.js
@@ -67,6 +67,10 @@ WireIt.Container = function(options, layer) {
     */
    this.eventRemoveWire = new util.CustomEvent("eventRemoveWire");
 
+   this.eventFocus = new util.CustomEvent("eventFocus");
+
+   this.eventBlur = new util.CustomEvent("eventBlur");
+
    // Render the div object
    this.render();
 
@@ -256,7 +260,7 @@ WireIt.Container.prototype = {
     * Called when the user made a mouse down on the container and sets the focus to this container (only if within a Layer)
     * @method onMouseDown
     */
-   onMouseDown: function() {
+   onMouseDown: function(event) {
       if(this.layer) {
          if(this.layer.focusedContainer && this.layer.focusedContainer != this) {
             this.layer.focusedContainer.removeFocus();
@@ -272,6 +276,8 @@ WireIt.Container.prototype = {
     */
    setFocus: function() {
       Dom.addClass(this.el, CSS_PREFIX+"Container-focused");
+
+      this.eventFocus.fire(this);
    },
 
    /**
@@ -280,6 +286,8 @@ WireIt.Container.prototype = {
     */
    removeFocus: function() {
       Dom.removeClass(this.el, CSS_PREFIX+"Container-focused");
+
+      this.eventBlur.fire(this);
    },
 
    /**

diff --git a/js/GroupFormContainer.js b/js/GroupFormContainer.js
@@ -61,15 +61,17 @@ YAHOO.lang.extend(WireIt.GroupFormContainer, WireIt.FormContainer, {
 
 	var expandedContainers = [];
 
-	for (var mI in this.group.modules)
+	for (var mI in this.group.internalConfig.modules)
 	{
-	    var m = this.group.modules[mI]
+	    var m = this.group.internalConfig.modules[mI];
+
 	    var baseContainerConfig = this.getBaseConfig(m.name);
-	    YAHOO.lang.augmentObject(m.config, baseContainerConfig); //TODO: Might not want to modify the module config here (in case the group can be reshrunk and old vars are used)
-	    m.config.title = m.name;
-	    var newPos = this.translatePosition(m.config.position, position);
-	    m.config.position = newPos;
-	    var container = this.layer.addContainer(m.config);
+	    var newConfig = YAHOO.lang.JSON.parse( YAHOO.lang.JSON.stringify( m.config ) ) //TODO: nasty deep clone, probably breaks if you have DOM elements in your config or something
+	    YAHOO.lang.augmentObject(newConfig , baseContainerConfig);
+	    newConfig.title = m.name;
+	    var newPos = this.translatePosition(newConfig.position, position);
+	    newConfig.position = newPos;
+	    var container = this.layer.addContainer(newConfig);
 	    //Dom.addClass(container.el, "WiringEditor-module-"+m.name);
 	    container.setValue(m.value);
 
@@ -79,16 +81,16 @@ YAHOO.lang.extend(WireIt.GroupFormContainer, WireIt.FormContainer, {
 	for (var fI in this.form.inputsNames)
 	{
 	    var f = this.form.inputsNames[fI];
-	    var internal = this.group.externalToInternalFieldMap[fI];
+	    var internal = this.group.externalToInternalMap.fields[fI];
 
 	    var container = expandedContainers[internal.moduleId];
 
 	    container.form.inputsNames[internal.name].setValue(f.getValue());
 	}
 
-	for (var wI in this.group.wires)
+	for (var wI in this.group.internalConfig.wires)
 	{
-	    var w = this.group.wires[wI]
+	    var w = this.group.internalConfig.wires[wI]
 
 	    this.layer.addWire(
 		{
@@ -113,7 +115,7 @@ YAHOO.lang.extend(WireIt.GroupFormContainer, WireIt.FormContainer, {
 	    {
 		var w = t.wires[wI]
 
-		var internal = this.group.externalToInternalTerminalMap[t.options.name];
+		var internal = this.group.externalToInternalMap.terminals[t.options.name];
 
 		var wire = {}