Upgrade to ExtJS 3.1.1 - Released 02/08/2010

[extjs.git] / docs / source / HtmlEditor.html

diff --git a/docs/source/HtmlEditor.html b/docs/source/HtmlEditor.html
index 963b9d2..04d0c95 100644 (file)
--- a/docs/source/HtmlEditor.html
+++ b/docs/source/HtmlEditor.html
@@ -203,7 +203,7 @@ Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
     createToolbar : function(editor){
         var items = [];
         var tipsEnabled = Ext.QuickTips && Ext.QuickTips.isEnabled();\r
     createToolbar : function(editor){
         var items = [];
         var tipsEnabled = Ext.QuickTips && Ext.QuickTips.isEnabled();\r

-        
+

 
         function btn(id, toggle, handler){
             return {
 
         function btn(id, toggle, handler){
             return {


@@ -229,7 +229,7 @@ Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
                     html: this.createFontOptions()\r
                }\r
             });
                     html: this.createFontOptions()\r
                }\r
             });

-            
+

             items.push(
                 fontSelectItem,
                 '-'
             items.push(
                 fontSelectItem,
                 '-'


@@ -340,16 +340,16 @@ Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
                 );
             }
         }\r
                 );
             }
         }\r

- \r
+\r

         // build the toolbar\r
         var tb = new Ext.Toolbar({\r
             renderTo: this.wrap.dom.firstChild,\r
             items: items\r
         });\r
         // build the toolbar\r
         var tb = new Ext.Toolbar({\r
             renderTo: this.wrap.dom.firstChild,\r
             items: items\r
         });\r

-        \r
+\r

         if (fontSelectItem) {\r
             this.fontSelect = fontSelectItem.el;\r
         if (fontSelectItem) {\r
             this.fontSelect = fontSelectItem.el;\r

-            \r
+\r

             this.mon(this.fontSelect, 'change', function(){\r
                 var font = this.fontSelect.dom.value;\r
                 this.relayCmd('fontname', font);\r
             this.mon(this.fontSelect, 'change', function(){\r
                 var font = this.fontSelect.dom.value;\r
                 this.relayCmd('fontname', font);\r


@@ -362,9 +362,7 @@ Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
         this.mon(tb.el, 'click', function(e){\r
             e.preventDefault();\r
         });\r
         this.mon(tb.el, 'click', function(e){\r
             e.preventDefault();\r
         });\r

-       \r
-        \r
-        
+

         this.tb = tb;
     },
 
         this.tb = tb;
     },
 


@@ -379,24 +377,27 @@ Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
     },
 
     setReadOnly: function(readOnly){
     },
 
     setReadOnly: function(readOnly){

-        if(this.initialized){
-            var newDM = readOnly ? 'off' : 'on',
-                doc = this.getDoc();
-            if(String(doc.designMode).toLowerCase() != newDM){
-                doc.designMode = newDM;
-            }
-            this.disableItems(!readOnly);
-        }
+

         Ext.form.HtmlEditor.superclass.setReadOnly.call(this, readOnly);
         Ext.form.HtmlEditor.superclass.setReadOnly.call(this, readOnly);

+        if(this.initialized){\r
+            this.setDesignMode(!readOnly);\r
+            var bd = this.getEditorBody();\r
+            if(bd){\r
+                bd.style.cursor = this.readOnly ? 'default' : 'text';\r
+            }\r
+            this.disableItems(readOnly);\r
+        }\r

     },
 
     <div id="method-Ext.form.HtmlEditor-getDocMarkup"></div>/**
      * Protected method that will not generally be called directly. It
      * is called when the editor initializes the iframe with HTML contents. Override this method if you
      * want to change the initialization markup of the iframe (e.g. to add stylesheets).
     },
 
     <div id="method-Ext.form.HtmlEditor-getDocMarkup"></div>/**
      * Protected method that will not generally be called directly. It
      * is called when the editor initializes the iframe with HTML contents. Override this method if you
      * want to change the initialization markup of the iframe (e.g. to add stylesheets).

+     *\r
+     * Note: IE8-Standards has unwanted scroller behavior, so the default meta tag forces IE7 compatibility\r

      */
     getDocMarkup : function(){
      */
     getDocMarkup : function(){

-        return '<html><head><style type="text/css">body{border:0;margin:0;padding:3px;height:98%;cursor:text;}</style></head><body></body></html>';
+        return '<html><head><meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /><style type="text/css">body{border:0;margin:0;padding:3px;height:98%;cursor:text;}</style></head><body></body></html>';

     },
 
     // private
     },
 
     // private


@@ -431,8 +432,8 @@ Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
         this.createToolbar(this);
 
         this.disableItems(true);
         this.createToolbar(this);
 
         this.disableItems(true);

-        // is this needed?
-        // this.tb.doLayout();
+
+        this.tb.doLayout();

 
         this.createIFrame();
 
 
         this.createIFrame();
 


@@ -447,9 +448,9 @@ Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
         var iframe = document.createElement('iframe');
         iframe.name = Ext.id();
         iframe.frameBorder = '0';
         var iframe = document.createElement('iframe');
         iframe.name = Ext.id();
         iframe.frameBorder = '0';

-        iframe.src = Ext.SSL_SECURE_URL;
-        this.wrap.dom.appendChild(iframe);
+        iframe.style.overflow = 'auto';\r

 
 

+        this.wrap.dom.appendChild(iframe);

         this.iframe = iframe;
 
         this.monitorTask = Ext.TaskMgr.start({
         this.iframe = iframe;
 
         this.monitorTask = Ext.TaskMgr.start({


@@ -473,7 +474,7 @@ Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
                 var doc = this.getDoc();
                 if(doc.body || doc.readyState == 'complete'){
                     Ext.TaskMgr.stop(task);
                 var doc = this.getDoc();
                 if(doc.body || doc.readyState == 'complete'){
                     Ext.TaskMgr.stop(task);

-                    doc.designMode="on";
+                    this.setDesignMode(true);

                     this.initEditor.defer(10, this);
                 }
             },
                     this.initEditor.defer(10, this);
                 }
             },


@@ -491,12 +492,34 @@ Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
             if(!doc){
                 return;
             }
             if(!doc){
                 return;
             }

-            if(!doc.editorInitialized || String(doc.designMode).toLowerCase() != 'on'){
+            if(!doc.editorInitialized || this.getDesignMode() != 'on'){

                 this.initFrame();
             }
         }
     },
                 this.initFrame();
             }
         }
     },

-
+\r
+    /* private\r
+     * set current design mode. To enable, mode can be true or 'on', off otherwise\r
+     */\r
+    setDesignMode : function(mode){\r
+        var doc ;\r
+        if(doc = this.getDoc()){\r
+            if(this.readOnly){\r
+                mode = false;\r
+            }\r
+            doc.designMode = (/on|true/i).test(String(mode).toLowerCase()) ?'on':'off';\r
+        }\r
+\r
+    },\r
+\r
+    // private\r
+    getDesignMode : function(){
+        var doc = this.getDoc();\r
+        if(!doc){ return ''; }\r
+        return String(doc.designMode).toLowerCase();\r
+\r
+    },\r
+\r

     disableItems: function(disabled){
         if(this.fontSelect){
             this.fontSelect.dom.disabled = disabled;
     disableItems: function(disabled){
         if(this.fontSelect){
             this.fontSelect.dom.disabled = disabled;


@@ -540,7 +563,7 @@ Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
         }
         this.sourceEditMode = sourceEditMode === true;
         var btn = this.tb.getComponent('sourceedit');
         }
         this.sourceEditMode = sourceEditMode === true;
         var btn = this.tb.getComponent('sourceedit');

-        
+

         if(btn.pressed !== this.sourceEditMode){
             btn.toggle(this.sourceEditMode);
             if(!btn.xtbHidden){
         if(btn.pressed !== this.sourceEditMode){
             btn.toggle(this.sourceEditMode);
             if(!btn.xtbHidden){


@@ -555,8 +578,8 @@ Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
             this.el.dom.removeAttribute('tabIndex');
             this.el.focus();
         }else{
             this.el.dom.removeAttribute('tabIndex');
             this.el.focus();
         }else{

-            if(this.initialized && !this.readOnly){
-                this.disableItems(false);
+            if(this.initialized){
+                this.disableItems(this.readOnly);

             }
             this.pushValue();
             this.iframe.className = '';
             }
             this.pushValue();
             this.iframe.className = '';


@@ -670,14 +693,13 @@ Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
                 this.getEditorBody().innerHTML = v;
                 if(Ext.isGecko){
                     // Gecko hack, see: https://bugzilla.mozilla.org/show_bug.cgi?id=232791#c8
                 this.getEditorBody().innerHTML = v;
                 if(Ext.isGecko){
                     // Gecko hack, see: https://bugzilla.mozilla.org/show_bug.cgi?id=232791#c8

-                    var d = this.getDoc(),
-                        mode = d.designMode.toLowerCase();
-
-                    d.designMode = mode.toggle('on', 'off');
-                    d.designMode = mode;
+                    this.setDesignMode(false);  //toggle off first\r
+\r

                 }
                 }

+                this.setDesignMode(true);\r

                 this.fireEvent('push', this, v);
             }
                 this.fireEvent('push', this, v);
             }

+\r

         }
     },
 
         }
     },
 


@@ -703,12 +725,12 @@ Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
                 ss = this.el.getStyles('font-size', 'font-family', 'background-image', 'background-repeat'),
                 doc,
                 fn;
                 ss = this.el.getStyles('font-size', 'font-family', 'background-image', 'background-repeat'),
                 doc,
                 fn;

-                
+

             ss['background-attachment'] = 'fixed'; // w3c
             dbody.bgProperties = 'fixed'; // ie
 
             Ext.DomHelper.applyStyles(dbody, ss);
             ss['background-attachment'] = 'fixed'; // w3c
             dbody.bgProperties = 'fixed'; // ie
 
             Ext.DomHelper.applyStyles(dbody, ss);

-            
+

             doc = this.getDoc();
 
             if(doc){
             doc = this.getDoc();
 
             if(doc){


@@ -767,7 +789,7 @@ Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
                 this.wrap.remove();
             }
         }
                 this.wrap.remove();
             }
         }

-        
+

         if(this.el){
             this.el.removeAllListeners();
             this.el.remove();
         if(this.el){
             this.el.removeAllListeners();
             this.el.remove();


@@ -778,7 +800,7 @@ Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
     // private
     onFirstFocus : function(){
         this.activated = true;
     // private
     onFirstFocus : function(){
         this.activated = true;

-        this.disableItems(false);
+        this.disableItems(this.readOnly);

         if(Ext.isGecko){ // prevent silly gecko errors
             this.win.focus();
             var s = this.win.getSelection();
         if(Ext.isGecko){ // prevent silly gecko errors
             this.win.focus();
             var s = this.win.getSelection();


@@ -848,7 +870,7 @@ Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
             return;
         }
 
             return;
         }
 

-        var btns = this.tb.items.map, 
+        var btns = this.tb.items.map,

             doc = this.getDoc();
 
         if(this.enableFont && !Ext.isSafari2){
             doc = this.getDoc();
 
         if(this.enableFont && !Ext.isSafari2){


@@ -965,7 +987,7 @@ Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {
     fixKeys : function(){ // load time branching for fastest keydown performance
         if(Ext.isIE){
             return function(e){
     fixKeys : function(){ // load time branching for fastest keydown performance
         if(Ext.isIE){
             return function(e){

-                var k = e.getKey(), 
+                var k = e.getKey(),

                     doc = this.getDoc(),
                         r;
                 if(k == e.TAB){
                     doc = this.getDoc(),
                         r;
                 if(k == e.TAB){