Changeset 5401

Timestamp:

08/27/06 12:36:34 (2 years ago)

Author:

liucougar

Message:

subwidgets support for widget
migrate editor2dialog to use subwidgets
(reviewed by Bill)

Location:

trunk/src/widget

Files:

• DomWidget.js (modified) (4 diffs)
• Editor2.js (modified) (6 diffs)
• templates/Editor2/Dialog/createlink.html (modified) (1 diff)
• templates/Editor2/Dialog/find.html (modified) (1 diff)
• templates/Editor2/Dialog/insertimage.html (modified) (1 diff)
• templates/Editor2/Dialog/inserttable.html (modified) (1 diff)
• templates/Editor2/Dialog/replace.html (modified) (1 diff)

trunk/src/widget/DomWidget.js

@@ -143 +143 @@
                 // FIXME: is this going to have capitalization problems?  Could use getAttribute(name, 0); to get attributes case-insensitve
                 var attachPoint = [];
-                for(var y=0; y<this.attachProperties.length; y++){
-                        var tmpAttachPoint = baseNode.getAttribute(this.attachProperties[y]);
-                        if(tmpAttachPoint){
-                                attachPoint = tmpAttachPoint.split(";");
-                                for(var z=0; z<attachPoint.length; z++){
-                                        if(dojo.lang.isArray(targetObj[attachPoint[z]])){
-                                                targetObj[attachPoint[z]].push(baseNode);
-                                        }else{
-                                                targetObj[attachPoint[z]]=baseNode;
-                                        }
-                                }
-                                break;
+                if(!targetObj.enableSubWidgets || !baseNode.getAttribute('dojoType')){
+                        for(var y=0; y<this.attachProperties.length; y++){
+                                var tmpAttachPoint = baseNode.getAttribute(this.attachProperties[y]);
+                                if(tmpAttachPoint){
+                                        attachPoint = tmpAttachPoint.split(";");
+                                        for(var z=0; z<attachPoint.length; z++){
+                                                if(dojo.lang.isArray(targetObj[attachPoint[z]])){
+                                                        targetObj[attachPoint[z]].push(baseNode);
+                                                }else{
+                                                        targetObj[attachPoint[z]]=baseNode;
+                                                }
+                                        }
+                                        break;
+                                }
+                        }
+
+                        var attachEvent = baseNode.getAttribute(this.eventAttachProperty);
+                        if(attachEvent){
+                                // NOTE: we want to support attributes that have the form
+                                // "domEvent: nativeEvent; ..."
+                                var evts = attachEvent.split(";");
+                                for(var y=0; y<evts.length; y++){
+                                        if((!evts[y])||(!evts[y].length)){ continue; }
+                                        var thisFunc = null;
+                                        var tevt = trim(evts[y]);
+                                        if(evts[y].indexOf(":") >= 0){
+                                                // oh, if only JS had tuple assignment
+                                                var funcNameArr = tevt.split(":");
+                                                tevt = trim(funcNameArr[0]);
+                                                thisFunc = trim(funcNameArr[1]);
+                                        }
+                                        if(!thisFunc){
+                                                thisFunc = tevt;
+                                        }
+        
+                                        var tf = function(){ 
+                                                var ntf = new String(thisFunc);
+                                                return function(evt){
+                                                        if(_this[ntf]){
+                                                                _this[ntf](dojo.event.browser.fixEvent(evt, this));
+                                                        }
+                                                };
+                                        }();
+                                        dojo.event.browser.addListener(baseNode, tevt, tf, false, true);
+                                        // dojo.event.browser.addListener(baseNode, tevt, dojo.lang.hitch(_this, thisFunc));
+                                }
+                        }
+        
+                        for(var y=0; y<events.length; y++){
+                                //alert(events[x]);
+                                var evtVal = baseNode.getAttribute(events[y]);
+                                if((evtVal)&&(evtVal.length)){
+                                        var thisFunc = null;
+                                        var domEvt = events[y].substr(4); // clober the "dojo" prefix
+                                        thisFunc = trim(evtVal);
+                                        var funcs = [thisFunc];
+                                        if(thisFunc.indexOf(";")>=0){
+                                                funcs = dojo.lang.map(thisFunc.split(";"), trim);
+                                        }
+                                        for(var z=0; z<funcs.length; z++){
+                                                if(!funcs[z].length){ continue; }
+                                                var tf = function(){ 
+                                                        var ntf = new String(funcs[z]);
+                                                        return function(evt){
+                                                                if(_this[ntf]){
+                                                                        _this[ntf](dojo.event.browser.fixEvent(evt, this));
+                                                                }
+                                                        }
+                                                }();
+                                                dojo.event.browser.addListener(baseNode, domEvt, tf, false, true);
+                                                // dojo.event.browser.addListener(baseNode, domEvt, dojo.lang.hitch(_this, funcs[z]));
+                                        }
+                                }
                         }
                 }
@@ -179 +240 @@
                         }
                 }, this);
-
-                var attachEvent = baseNode.getAttribute(this.eventAttachProperty);
-                if(attachEvent){
-                        // NOTE: we want to support attributes that have the form
-                        // "domEvent: nativeEvent; ..."
-                        var evts = attachEvent.split(";");
-                        for(var y=0; y<evts.length; y++){
-                                if((!evts[y])||(!evts[y].length)){ continue; }
-                                var thisFunc = null;
-                                var tevt = trim(evts[y]);
-                                if(evts[y].indexOf(":") >= 0){
-                                        // oh, if only JS had tuple assignment
-                                        var funcNameArr = tevt.split(":");
-                                        tevt = trim(funcNameArr[0]);
-                                        thisFunc = trim(funcNameArr[1]);
-                                }
-                                if(!thisFunc){
-                                        thisFunc = tevt;
-                                }
-
-                                var tf = function(){ 
-                                        var ntf = new String(thisFunc);
-                                        return function(evt){
-                                                if(_this[ntf]){
-                                                        _this[ntf](dojo.event.browser.fixEvent(evt, this));
-                                                }
-                                        };
-                                }();
-                                dojo.event.browser.addListener(baseNode, tevt, tf, false, true);
-                                // dojo.event.browser.addListener(baseNode, tevt, dojo.lang.hitch(_this, thisFunc));
-                        }
-                }
-
-                for(var y=0; y<events.length; y++){
-                        //alert(events[x]);
-                        var evtVal = baseNode.getAttribute(events[y]);
-                        if((evtVal)&&(evtVal.length)){
-                                var thisFunc = null;
-                                var domEvt = events[y].substr(4); // clober the "dojo" prefix
-                                thisFunc = trim(evtVal);
-                                var funcs = [thisFunc];
-                                if(thisFunc.indexOf(";")>=0){
-                                        funcs = dojo.lang.map(thisFunc.split(";"), trim);
-                                }
-                                for(var z=0; z<funcs.length; z++){
-                                        if(!funcs[z].length){ continue; }
-                                        var tf = function(){ 
-                                                var ntf = new String(funcs[z]);
-                                                return function(evt){
-                                                        if(_this[ntf]){
-                                                                _this[ntf](dojo.event.browser.fixEvent(evt, this));
-                                                        }
-                                                }
-                                        }();
-                                        dojo.event.browser.addListener(baseNode, domEvt, tf, false, true);
-                                        // dojo.event.browser.addListener(baseNode, domEvt, dojo.lang.hitch(_this, funcs[z]));
-                                }
-                        }
-                }
 
                 var onBuild = baseNode.getAttribute(this.onBuildProperty);
@@ -287 +289 @@
         domNode: null, // this is our visible representation of the widget!
         containerNode: null, // holds child elements
+
+        enableSubWidgets: false, //by default, widgets defined in templates are ignored
 
         // Process the given child widget, inserting it's dom node as a child of our dom node
@@ -488 +492 @@
                                                                                         // from properties, remote data
                                                                                         // sets, etc.
+
+                if(this.enableSubWidgets){
+                        var parser = new dojo.xml.Parse();
+        
+                        var frag = parser.parseElement(this.domNode, null, true);
+                        // createSubComponents not createComponents because frag has already been created
+                        dojo.widget.getParser().createSubComponents(frag, this);
+        
+                        //connect event to this widget/attach dom node
+                        for(var i = 0; i < this.children.length; i++){
+                                var widget = this.children[i];
+                                if(widget.extraArgs['dojoattachevent']){
+                                        var evts = widget.extraArgs['dojoattachevent'].split(";");
+                                        for(var j=0; j<evts.length; j++){
+                                                var thisFunc = null;
+                                                var tevt = dojo.string.trim(evts[j]);
+                                                if(tevt.indexOf(":") >= 0){
+                                                        // oh, if only JS had tuple assignment
+                                                        var funcNameArr = tevt.split(":");
+                                                        tevt = dojo.string.trim(funcNameArr[0]);
+                                                        thisFunc = dojo.string.trim(funcNameArr[1]);
+                                                }
+                                                if(!thisFunc){
+                                                        thisFunc = tevt;
+                                                }
+                                                if(dojo.lang.isFunction(widget[tevt])){
+                                                        dojo.event.connect(widget, tevt, this, thisFunc);
+                                                }else{
+                                                        alert(tevt+" is not a function in widget "+widget);
+                                                }
+                                        }
+                                }
+                                if(widget.extraArgs['dojoattachpoint']){
+                                        //don't attach widget.domNode here, as we do not know which
+                                        //dom node we should connect to (in checkbox widget case, 
+                                        //it is inputNode). So we make the widget itself available
+                                        this[widget.extraArgs['dojoattachpoint']] = widget;
+                                }
+                        }
+                }
         },
 

trunk/src/widget/Editor2.js

@@ -210 +210 @@
                                 dojo.require(this.contentFile);
                         }
-                        if(this.contentClass){
-                                this.contentWidget = dojo.widget.createWidget(this.contentClass, {parent: this});
-                                this.containerNode.appendChild(this.contentWidget.domNode);
-                                dojo.event.connect(this, "destroy", this.contentWidget, "destroy");
-                        }
                         if(this.modal){
                                 dojo.widget.ModalDialogBase.prototype.postCreate.call(this);
@@ -232 +227 @@
                         }
                 },
+                createContent: function(){
+                        if(!this.contentWidget && this.contentClass){
+                                this.contentWidget = dojo.widget.createWidget(this.contentClass, {parent: this});
+                                this.containerNode.appendChild(this.contentWidget.domNode);
+                                dojo.event.connect(this, "destroy", this.contentWidget, "destroy");
+                        }
+                },
                 show: function(){
+                        if(!this.contentWidget){
+                                //buggy IE: if the dialog is hidden, the button widgets
+                                //in the dialog can not be shown, so show it temporary (as the
+                                //dialog may decide not to show it in loadContent() later)
+                                dojo.widget.Editor2Dialog.superclass.show.apply(this, arguments);
+                                this.createContent();
+                                dojo.widget.Editor2Dialog.superclass.hide.call(this);
+                        }
+
+                        if(!this.contentWidget || !this.contentWidget.loadContent()){
+                                return;
+                        }
                         this.showFloatingPane();
                         dojo.widget.Editor2Dialog.superclass.show.apply(this, arguments);
@@ -265 +279 @@
         dojo.widget.HtmlWidget,
 {
-        buildRendering: function(args, frag){
-                dojo.widget.Editor2DialogContent.superclass.buildRendering.apply(this, arguments);
-                var parser = new dojo.xml.Parse();
-
-                var frag = parser.parseElement(this.domNode, null, true);
-                // createSubComponents not createComponents because frag has already been created
-                dojo.widget.getParser().createSubComponents(frag, this);
-
-                //connect event to this widget/attach dom node
-                for(var i = 0; i < this.children.length; i++){
-                        var widget = this.children[i];
-                        if(widget.extraArgs['dojoattachchildevent']){
-                                var evts = widget.extraArgs['dojoattachchildevent'].split(";");
-                                for(var j=0; j<evts.length; j++){
-                                        var thisFunc = null;
-                                        var tevt = dojo.string.trim(evts[j]);
-                                        if(tevt.indexOf(":") >= 0){
-                                                // oh, if only JS had tuple assignment
-                                                var funcNameArr = tevt.split(":");
-                                                tevt = dojo.string.trim(funcNameArr[0]);
-                                                thisFunc = dojo.string.trim(funcNameArr[1]);
-                                        }
-                                        if(!thisFunc){
-                                                thisFunc = tevt;
-                                        }
-                                        if(dojo.lang.isFunction(widget[tevt])){
-                                                dojo.event.connect(widget, tevt, this, thisFunc);
-                                        }else{
-                                                alert(tevt+" is not a function in widget "+widget);
-                                        }
-                                }
-                        }
-                        if(widget.extraArgs['dojoattachchildpoint']){
-                                //don't attach widget.domNode here, as we do not know which
-                                //dom node we should connect to (in checkbox widget case, 
-                                //it is inputNode). So we make the widget itself available
-                                this[widget.extraArgs['dojoattachchildpoint']] = widget;
-                        }
-                }
-        },
-        postCreate: function(){
-                dojo.event.connect("around", this.parent, "show", this, "initConent");
-                dojo.widget.Editor2DialogContent.superclass.postCreate.apply(this, arguments);
-        },
-        initConent: function(mi){
-                if(this.loadContent()){
-                        mi.proceed();
-                }
-        },
+        enableSubWidgets: true,
+
         loadContent:function(){
                 return true;
@@ -375 +342 @@
 
                 editorOnLoad: function(){
-                        dojo.profile.start("dojo.widget.Editor2::editorOnLoad");
+//                      dojo.profile.start("dojo.widget.Editor2::editorOnLoad");
 
                         dojo.event.topic.publish("dojo.widget.Editor2::preLoadingToolbar", this);
@@ -409 +376 @@
 
                         dojo.event.topic.publish("dojo.widget.Editor2::onLoad", this);
-                        dojo.profile.end("dojo.widget.Editor2::editorOnLoad");
+//                      dojo.profile.end("dojo.widget.Editor2::editorOnLoad");
                 },
 
@@ -578 +545 @@
                         }
                         this._htmlEditNode = null;
-                        this.document = null;
-                        this.window = null;
-                        this.object = null;
                         dojo.widget.Editor2.superclass.destroy.call(this);
                 },

trunk/src/widget/templates/Editor2/Dialog/createlink.html

@@ -9 +9 @@
 <tr><td colspan="2">
         <table><tr>
-        <td><button dojoType='Button' dojoAttachChildEvent='onClick:ok'>OK</button></td>
-        <td><button dojoType='Button' dojoAttachChildEvent='onClick:cancel'>Cancel</button></td>
+        <td><button dojoType='Button' dojoAttachEvent='onClick:ok'>OK</button></td>
+        <td><button dojoType='Button' dojoAttachEvent='onClick:cancel'>Cancel</button></td>
         </tr></table>
         </td></tr>

trunk/src/widget/templates/Editor2/Dialog/find.html

@@ -1 +1 @@
 <table style="white-space: nowrap;">
 <tr><td colspan='2'>Find: <input type="text" dojoAttachPoint="find_text" /></td></tr>
-<tr><td><input type="checkbox" dojoType="CheckBox" dojoAttachChildPoint="find_option_casesens" />
+<tr><td><input type="checkbox" dojoType="CheckBox" dojoAttachPoint="find_option_casesens" />
                 <label for="find_option_casesens">Case Sensitive</label></td>
-                        <td><input type="checkbox" dojoType="CheckBox" dojoAttachChildPoint="find_option_backwards" />
+                        <td><input type="checkbox" dojoType="CheckBox" dojoAttachPoint="find_option_backwards" />
                 <label for="find_option_backwards">Search Backwards</label></td></tr>
-<tr><td style="display: none;"><input type="checkbox" dojoType="CheckBox" dojoAttachChildPoint="find_option_wholeword" />
+<tr><td style="display: none;"><input type="checkbox" dojoType="CheckBox" dojoAttachPoint="find_option_wholeword" />
                 <label for="find_option_wholeword">Whole Word</label></td>
 <tr><td colspan="1">
         <table><tr>
-        <td><button dojoType='Button' dojoAttachChildEvent='onClick:find'>Find</button></td>
-        <td><button dojoType='Button' dojoAttachChildEvent='onClick:cancel'>Close</button></td>
+        <td><button dojoType='Button' dojoAttachEvent='onClick:find'>Find</button></td>
+        <td><button dojoType='Button' dojoAttachEvent='onClick:cancel'>Close</button></td>
         </tr></table>
         </td></tr>

trunk/src/widget/templates/Editor2/Dialog/insertimage.html

@@ -108 +108 @@
         <tr><td>
                 <table><tr>
-                <td><button dojoType='Button' dojoAttachChildEvent='onClick:ok'>OK</button></td>
-                <td><button dojoType='Button' dojoAttachChildEvent='onClick:cancel'>Cancel</button></td>
+                <td><button dojoType='Button' dojoAttachEvent='onClick:ok'>OK</button></td>
+                <td><button dojoType='Button' dojoAttachEvent='onClick:cancel'>Cancel</button></td>
                 </tr></table>
         </td></tr>

trunk/src/widget/templates/Editor2/Dialog/inserttable.html

@@ -86 +86 @@
 </table>
 <table><tr>
-<td><button dojoType='Button' dojoAttachChildEvent='onClick:ok'>Ok</button></td>
-<td><button dojoType='Button' dojoAttachChildEvent='onClick:cancel'>Cancel</button></td>
+<td><button dojoType='Button' dojoAttachEvent='onClick:ok'>Ok</button></td>
+<td><button dojoType='Button' dojoAttachEvent='onClick:cancel'>Cancel</button></td>
 </tr></table>
 </div>

trunk/src/widget/templates/Editor2/Dialog/replace.html

@@ -2 +2 @@
 <tr><td>Find: </td><td> <input type="text" dojoAttachPoint="replace_text" /></td></tr>
 <tr><td>Replace with: </td><td> <input type="text" dojoAttachPoint="replace_text" /></td></tr>
-<tr><td colspan='2'><table><tr><td><input type="checkbox" dojoType="CheckBox" dojoAttachChildPoint="replace_option_casesens" id="dojo_replace_option_casesens" />
+<tr><td colspan='2'><table><tr><td><input type="checkbox" dojoType="CheckBox" dojoAttachPoint="replace_option_casesens" id="dojo_replace_option_casesens" />
                 <label for="dojo_replace_option_casesens">Case Sensitive</label></td>
-                        <td><input type="checkbox" dojoType="CheckBox" dojoAttachChildPoint="replace_option_backwards" id="dojo_replace_option_backwards" />
+                        <td><input type="checkbox" dojoType="CheckBox" dojoAttachPoint="replace_option_backwards" id="dojo_replace_option_backwards" />
                 <label for="dojo_replace_option_backwards">Search Backwards</label></td></tr></table></td></tr>
 <tr><td colspan=2">
         <table><tr>
-        <td><button dojoType='Button' dojoAttachChildEvent='onClick:replace'>Replace</button></td>
-        <td><button dojoType='Button' dojoAttachChildEvent='onClick:replaceAll'>Replace All</button></td>
-        <td><button dojoType='Button' dojoAttachChildEvent='onClick:cancel'>Close</button></td>
+        <td><button dojoType='Button' dojoAttachEvent='onClick:replace'>Replace</button></td>
+        <td><button dojoType='Button' dojoAttachEvent='onClick:replaceAll'>Replace All</button></td>
+        <td><button dojoType='Button' dojoAttachEvent='onClick:cancel'>Close</button></td>
         </tr></table>
         </td></tr>