From 948f0a26d0fc83df8c44acbd0eb6d91191c25c4b Mon Sep 17 00:00:00 2001 From: Nathan Heskew Date: Mon, 6 Dec 2010 12:49:57 -0800 Subject: [PATCH] Fixing the massively tall TinyMCE editor window in Chrome when the editor has some content on load. --HG-- branch : dev --- .../plugins/autoresize/editor_plugin.js | 2 +- .../plugins/autoresize/editor_plugin_src.js | 221 +++++++++--------- 2 files changed, 114 insertions(+), 109 deletions(-) diff --git a/src/Orchard.Web/Modules/TinyMce/Scripts/plugins/autoresize/editor_plugin.js b/src/Orchard.Web/Modules/TinyMce/Scripts/plugins/autoresize/editor_plugin.js index 1676b154a..08bd75ffe 100644 --- a/src/Orchard.Web/Modules/TinyMce/Scripts/plugins/autoresize/editor_plugin.js +++ b/src/Orchard.Web/Modules/TinyMce/Scripts/plugins/autoresize/editor_plugin.js @@ -1 +1 @@ -(function(){tinymce.create("tinymce.plugins.AutoResizePlugin",{init:function(a,c){var d=this;if(a.getParam("fullscreen_is_enabled")){return}function b(){var h=a.getDoc(),e=h.body,j=h.documentElement,g=tinymce.DOM,i=d.autoresize_min_height,f;f=tinymce.isIE?e.scrollHeight:j.offsetHeight;if(f>d.autoresize_min_height){i=f}g.setStyle(g.get(a.id+"_ifr"),"height",i+"px");if(d.throbbing){a.setProgressState(false);a.setProgressState(true)}}d.editor=a;d.autoresize_min_height=a.getElement().offsetHeight;a.onChange.add(b);a.onSetContent.add(b);a.onPaste.add(b);a.onKeyUp.add(b);a.onPostRender.add(b);if(a.getParam("autoresize_on_init",true)){a.onInit.add(function(f,e){f.setProgressState(true);d.throbbing=true;f.getBody().style.overflowY="hidden"});a.onLoadContent.add(function(f,e){b();setTimeout(function(){b();f.setProgressState(false);d.throbbing=false},1250)})}a.addCommand("mceAutoResize",b)},getInfo:function(){return{longname:"Auto Resize",author:"Moxiecode Systems AB",authorurl:"http://tinymce.moxiecode.com",infourl:"http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/autoresize",version:tinymce.majorVersion+"."+tinymce.minorVersion}}});tinymce.PluginManager.add("autoresize",tinymce.plugins.AutoResizePlugin)})(); \ No newline at end of file +(function(){tinymce.create("tinymce.plugins.AutoResizePlugin",{init:function(a){var b=true,d=this;if(a.getParam("fullscreen_is_enabled"))return;function c(){var i=a.getDoc(),h=i.body,g=i.documentElement,f=tinymce.DOM,e=d.autoresize_min_height,c;if((tinymce.isIE?h.scrollWidth:g.offsetWidth)==0)return;c=tinymce.isIE?h.scrollHeight:g.offsetHeight;if(c>d.autoresize_min_height)e=c;f.setStyle(f.get(a.id+"_ifr"),"height",e+"px");if(d.throbbing){a.setProgressState(false);a.setProgressState(b)}}d.editor=a;d.autoresize_min_height=a.getElement().offsetHeight;a.onChange.add(c);a.onSetContent.add(c);a.onPaste.add(c);a.onKeyUp.add(c);a.onPostRender.add(c);if(a.getParam("autoresize_on_init",b)){a.onInit.add(function(a){a.setProgressState(b);d.throbbing=b;a.getBody().style.overflowY="hidden"});a.onLoadContent.add(function(a){c();setTimeout(function(){c();a.setProgressState(false);d.throbbing=false},1250)})}a.addCommand("mceAutoResize",c)},getInfo:function(){return{longname:"Auto Resize",author:"Moxiecode Systems AB",authorurl:"http://tinymce.moxiecode.com",infourl:"http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/autoresize",version:tinymce.majorVersion+"."+tinymce.minorVersion}}});tinymce.PluginManager.add("autoresize",tinymce.plugins.AutoResizePlugin)})() \ No newline at end of file diff --git a/src/Orchard.Web/Modules/TinyMce/Scripts/plugins/autoresize/editor_plugin_src.js b/src/Orchard.Web/Modules/TinyMce/Scripts/plugins/autoresize/editor_plugin_src.js index c260b7a24..abe5835ba 100644 --- a/src/Orchard.Web/Modules/TinyMce/Scripts/plugins/autoresize/editor_plugin_src.js +++ b/src/Orchard.Web/Modules/TinyMce/Scripts/plugins/autoresize/editor_plugin_src.js @@ -8,112 +8,117 @@ * Contributing: http://tinymce.moxiecode.com/contributing */ -(function() { - /** - * Auto Resize - * - * This plugin automatically resizes the content area to fit its content height. - * It will retain a minimum height, which is the height of the content area when - * it's initialized. - */ - tinymce.create('tinymce.plugins.AutoResizePlugin', { - /** - * Initializes the plugin, this will be executed after the plugin has been created. - * This call is done before the editor instance has finished it's initialization so use the onInit event - * of the editor instance to intercept that event. - * - * @param {tinymce.Editor} ed Editor instance that the plugin is initialized in. - * @param {string} url Absolute URL to where the plugin is located. - */ - init : function(ed, url) { - var t = this; - - if (ed.getParam('fullscreen_is_enabled')) - return; - - /** - * This method gets executed each time the editor needs to resize. - */ - function resize() { - var d = ed.getDoc(), b = d.body, de = d.documentElement, DOM = tinymce.DOM, resizeHeight = t.autoresize_min_height, myHeight; - - // Get height differently depending on the browser used - myHeight = tinymce.isIE ? b.scrollHeight : de.offsetHeight; - - // Don't make it smaller than the minimum height - if (myHeight > t.autoresize_min_height) - resizeHeight = myHeight; - - // Resize content element - DOM.setStyle(DOM.get(ed.id + '_ifr'), 'height', resizeHeight + 'px'); - - // if we're throbbing, we'll re-throb to match the new size - if (t.throbbing) { - ed.setProgressState(false); - ed.setProgressState(true); - } - }; - - t.editor = ed; - - // Define minimum height - t.autoresize_min_height = ed.getElement().offsetHeight; - - // Add appropriate listeners for resizing content area - ed.onChange.add(resize); - ed.onSetContent.add(resize); - ed.onPaste.add(resize); - ed.onKeyUp.add(resize); - ed.onPostRender.add(resize); - - if (ed.getParam('autoresize_on_init', true)) { - // Things to do when the editor is ready - ed.onInit.add(function(ed, l) { - // Show throbber until content area is resized properly - ed.setProgressState(true); - t.throbbing = true; - - // Hide scrollbars - ed.getBody().style.overflowY = "hidden"; - }); - - ed.onLoadContent.add(function(ed, l) { - resize(); - - // Because the content area resizes when its content CSS loads, - // and we can't easily add a listener to its onload event, - // we'll just trigger a resize after a short loading period - setTimeout(function() { - resize(); - - // Disable throbber - ed.setProgressState(false); - t.throbbing = false; - }, 1250); - }); - } - - // Register the command so that it can be invoked by using tinyMCE.activeEditor.execCommand('mceExample'); - ed.addCommand('mceAutoResize', resize); - }, - - /** - * Returns information about the plugin as a name/value array. - * The current keys are longname, author, authorurl, infourl and version. - * - * @return {Object} Name/value array containing information about the plugin. - */ - getInfo : function() { - return { - longname : 'Auto Resize', - author : 'Moxiecode Systems AB', - authorurl : 'http://tinymce.moxiecode.com', - infourl : 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/autoresize', - version : tinymce.majorVersion + "." + tinymce.minorVersion - }; - } - }); - - // Register plugin - tinymce.PluginManager.add('autoresize', tinymce.plugins.AutoResizePlugin); +(function () { + /** + * Auto Resize + * + * This plugin automatically resizes the content area to fit its content height. + * It will retain a minimum height, which is the height of the content area when + * it's initialized. + */ + tinymce.create('tinymce.plugins.AutoResizePlugin', { + /** + * Initializes the plugin, this will be executed after the plugin has been created. + * This call is done before the editor instance has finished it's initialization so use the onInit event + * of the editor instance to intercept that event. + * + * @param {tinymce.Editor} ed Editor instance that the plugin is initialized in. + * @param {string} url Absolute URL to where the plugin is located. + */ + init: function (ed, url) { + var t = this; + + if (ed.getParam('fullscreen_is_enabled')) + return; + + /** + * This method gets executed each time the editor needs to resize. + */ + function resize() { + var d = ed.getDoc(), b = d.body, de = d.documentElement, DOM = tinymce.DOM, resizeHeight = t.autoresize_min_height, myHeight; + + // Don't resize if we have no width - a fix for http://orchard.codeplex.com/workitem/16853 + if ((tinymce.isIE ? b.scrollWidth : de.offsetWidth) == 0) { + return; + } + + // Get height differently depending on the browser used + myHeight = tinymce.isIE ? b.scrollHeight : de.offsetHeight; + + // Don't make it smaller than the minimum height + if (myHeight > t.autoresize_min_height) + resizeHeight = myHeight; + + // Resize content element + DOM.setStyle(DOM.get(ed.id + '_ifr'), 'height', resizeHeight + 'px'); + + // if we're throbbing, we'll re-throb to match the new size + if (t.throbbing) { + ed.setProgressState(false); + ed.setProgressState(true); + } + }; + + t.editor = ed; + + // Define minimum height + t.autoresize_min_height = ed.getElement().offsetHeight; + + // Add appropriate listeners for resizing content area + ed.onChange.add(resize); + ed.onSetContent.add(resize); + ed.onPaste.add(resize); + ed.onKeyUp.add(resize); + ed.onPostRender.add(resize); + + if (ed.getParam('autoresize_on_init', true)) { + // Things to do when the editor is ready + ed.onInit.add(function (ed, l) { + // Show throbber until content area is resized properly + ed.setProgressState(true); + t.throbbing = true; + + // Hide scrollbars + ed.getBody().style.overflowY = "hidden"; + }); + + ed.onLoadContent.add(function (ed, l) { + resize(); + + // Because the content area resizes when its content CSS loads, + // and we can't easily add a listener to its onload event, + // we'll just trigger a resize after a short loading period + setTimeout(function () { + resize(); + + // Disable throbber + ed.setProgressState(false); + t.throbbing = false; + }, 1250); + }); + } + + // Register the command so that it can be invoked by using tinyMCE.activeEditor.execCommand('mceExample'); + ed.addCommand('mceAutoResize', resize); + }, + + /** + * Returns information about the plugin as a name/value array. + * The current keys are longname, author, authorurl, infourl and version. + * + * @return {Object} Name/value array containing information about the plugin. + */ + getInfo: function () { + return { + longname: 'Auto Resize', + author: 'Moxiecode Systems AB', + authorurl: 'http://tinymce.moxiecode.com', + infourl: 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/autoresize', + version: tinymce.majorVersion + "." + tinymce.minorVersion + }; + } + }); + + // Register plugin + tinymce.PluginManager.add('autoresize', tinymce.plugins.AutoResizePlugin); })(); \ No newline at end of file