Fixing the massively tall TinyMCE editor window in Chrome when the editor has some content on load.

--HG--
branch : dev
This commit is contained in:
Nathan Heskew
2010-12-06 12:49:57 -08:00
parent 374020b3ed
commit 948f0a26d0
2 changed files with 114 additions and 109 deletions
@@ -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)})(); (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)})()
@@ -8,112 +8,117 @@
* Contributing: http://tinymce.moxiecode.com/contributing * Contributing: http://tinymce.moxiecode.com/contributing
*/ */
(function() { (function () {
/** /**
* Auto Resize * Auto Resize
* *
* This plugin automatically resizes the content area to fit its content height. * 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 will retain a minimum height, which is the height of the content area when
* it's initialized. * it's initialized.
*/ */
tinymce.create('tinymce.plugins.AutoResizePlugin', { tinymce.create('tinymce.plugins.AutoResizePlugin', {
/** /**
* Initializes the plugin, this will be executed after the plugin has been created. * 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 * 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. * of the editor instance to intercept that event.
* *
* @param {tinymce.Editor} ed Editor instance that the plugin is initialized in. * @param {tinymce.Editor} ed Editor instance that the plugin is initialized in.
* @param {string} url Absolute URL to where the plugin is located. * @param {string} url Absolute URL to where the plugin is located.
*/ */
init : function(ed, url) { init: function (ed, url) {
var t = this; var t = this;
if (ed.getParam('fullscreen_is_enabled')) if (ed.getParam('fullscreen_is_enabled'))
return; return;
/** /**
* This method gets executed each time the editor needs to resize. * This method gets executed each time the editor needs to resize.
*/ */
function resize() { function resize() {
var d = ed.getDoc(), b = d.body, de = d.documentElement, DOM = tinymce.DOM, resizeHeight = t.autoresize_min_height, myHeight; 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 // Don't resize if we have no width - a fix for http://orchard.codeplex.com/workitem/16853
myHeight = tinymce.isIE ? b.scrollHeight : de.offsetHeight; if ((tinymce.isIE ? b.scrollWidth : de.offsetWidth) == 0) {
return;
// Don't make it smaller than the minimum height }
if (myHeight > t.autoresize_min_height)
resizeHeight = myHeight; // Get height differently depending on the browser used
myHeight = tinymce.isIE ? b.scrollHeight : de.offsetHeight;
// Resize content element
DOM.setStyle(DOM.get(ed.id + '_ifr'), 'height', resizeHeight + 'px'); // Don't make it smaller than the minimum height
if (myHeight > t.autoresize_min_height)
// if we're throbbing, we'll re-throb to match the new size resizeHeight = myHeight;
if (t.throbbing) {
ed.setProgressState(false); // Resize content element
ed.setProgressState(true); 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) {
t.editor = ed; ed.setProgressState(false);
ed.setProgressState(true);
// Define minimum height }
t.autoresize_min_height = ed.getElement().offsetHeight; };
// Add appropriate listeners for resizing content area t.editor = ed;
ed.onChange.add(resize);
ed.onSetContent.add(resize); // Define minimum height
ed.onPaste.add(resize); t.autoresize_min_height = ed.getElement().offsetHeight;
ed.onKeyUp.add(resize);
ed.onPostRender.add(resize); // Add appropriate listeners for resizing content area
ed.onChange.add(resize);
if (ed.getParam('autoresize_on_init', true)) { ed.onSetContent.add(resize);
// Things to do when the editor is ready ed.onPaste.add(resize);
ed.onInit.add(function(ed, l) { ed.onKeyUp.add(resize);
// Show throbber until content area is resized properly ed.onPostRender.add(resize);
ed.setProgressState(true);
t.throbbing = true; if (ed.getParam('autoresize_on_init', true)) {
// Things to do when the editor is ready
// Hide scrollbars ed.onInit.add(function (ed, l) {
ed.getBody().style.overflowY = "hidden"; // Show throbber until content area is resized properly
}); ed.setProgressState(true);
t.throbbing = true;
ed.onLoadContent.add(function(ed, l) {
resize(); // Hide scrollbars
ed.getBody().style.overflowY = "hidden";
// 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 ed.onLoadContent.add(function (ed, l) {
setTimeout(function() { resize();
resize();
// Because the content area resizes when its content CSS loads,
// Disable throbber // and we can't easily add a listener to its onload event,
ed.setProgressState(false); // we'll just trigger a resize after a short loading period
t.throbbing = false; setTimeout(function () {
}, 1250); resize();
});
} // Disable throbber
ed.setProgressState(false);
// Register the command so that it can be invoked by using tinyMCE.activeEditor.execCommand('mceExample'); t.throbbing = false;
ed.addCommand('mceAutoResize', resize); }, 1250);
}, });
}
/**
* Returns information about the plugin as a name/value array. // Register the command so that it can be invoked by using tinyMCE.activeEditor.execCommand('mceExample');
* The current keys are longname, author, authorurl, infourl and version. ed.addCommand('mceAutoResize', resize);
* },
* @return {Object} Name/value array containing information about the plugin.
*/ /**
getInfo : function() { * Returns information about the plugin as a name/value array.
return { * The current keys are longname, author, authorurl, infourl and version.
longname : 'Auto Resize', *
author : 'Moxiecode Systems AB', * @return {Object} Name/value array containing information about the plugin.
authorurl : 'http://tinymce.moxiecode.com', */
infourl : 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/autoresize', getInfo: function () {
version : tinymce.majorVersion + "." + tinymce.minorVersion return {
}; longname: 'Auto Resize',
} author: 'Moxiecode Systems AB',
}); authorurl: 'http://tinymce.moxiecode.com',
infourl: 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/autoresize',
// Register plugin version: tinymce.majorVersion + "." + tinymce.minorVersion
tinymce.PluginManager.add('autoresize', tinymce.plugins.AutoResizePlugin); };
}
});
// Register plugin
tinymce.PluginManager.add('autoresize', tinymce.plugins.AutoResizePlugin);
})(); })();