2 * WP Fullscreen TinyMCE plugin
4 * Contains code from Moxiecode Systems AB released under LGPL http://tinymce.moxiecode.com/license
8 tinymce.create('tinymce.plugins.wpFullscreenPlugin', {
11 init : function(ed, url) {
12 var t = this, oldHeight = 0, s = {}, DOM = tinymce.DOM;
15 ed.addCommand('wpFullScreenClose', function() {
16 // this removes the editor, content has to be saved first with tinyMCE.execCommand('wpFullScreenSave');
17 if ( ed.getParam('wp_fullscreen_is_enabled') ) {
18 DOM.win.setTimeout(function() {
20 DOM.remove('wp_mce_fullscreen_parent');
21 tinyMCE.settings = tinyMCE.oldSettings; // Restore old settings
26 ed.addCommand('wpFullScreenSave', function() {
27 var ed = tinyMCE.get('wp_mce_fullscreen'), edd;
30 edd = tinyMCE.get( ed.getParam('wp_fullscreen_editor_id') );
32 edd.setContent( ed.getContent({format : 'raw'}), {format : 'raw'} );
35 ed.addCommand('wpFullScreenInit', function() {
38 ed = tinyMCE.activeEditor;
42 tinyMCE.oldSettings = tinyMCE.settings; // Store old settings
44 tinymce.each(ed.settings, function(v, n) {
48 s.id = 'wp_mce_fullscreen';
49 s.wp_fullscreen_is_enabled = true;
50 s.wp_fullscreen_editor_id = ed.id;
51 s.theme_advanced_resizing = false;
52 s.theme_advanced_statusbar_location = 'none';
53 s.content_css = s.content_css ? s.content_css + ',' + s.wp_fullscreen_content_css : s.wp_fullscreen_content_css;
54 s.height = tinymce.isIE ? b.scrollHeight : b.offsetHeight;
56 tinymce.each(ed.getParam('wp_fullscreen_settings'), function(v, k) {
60 fsed = new tinymce.Editor('wp_mce_fullscreen', s);
61 fsed.onInit.add(function(edd) {
62 var DOM = tinymce.DOM, buttons = DOM.select('a.mceButton', DOM.get('wp-fullscreen-buttons'));
65 edd.setContent( ed.getContent() );
67 edd.setContent( switchEditors.wpautop( edd.getElement().value ) );
69 setTimeout(function(){ // add last
70 edd.onNodeChange.add(function(ed, cm, e){
71 tinymce.each(buttons, function(c) {
74 if ( btn = DOM.get( 'wp_mce_fullscreen_' + c.id.substr(6) ) ) {
84 edd.dom.addClass(edd.getBody(), 'wp-fullscreen-editor');
90 if ( 'undefined' != fullscreen ) {
91 fsed.dom.bind( fsed.dom.doc, 'mousemove', function(e){
92 fullscreen.bounder( 'showToolbar', 'hideToolbar', 2000, e );
97 ed.addCommand('wpFullScreen', function() {
98 if ( typeof(fullscreen) == 'undefined' )
101 if ( 'wp_mce_fullscreen' == ed.id )
108 ed.addButton('wp_fullscreen', {
109 title : 'wordpress.wp_fullscreen_desc',
114 //----------------------------------------------------------------
117 if ( ed.getParam('fullscreen_is_enabled') || !ed.getParam('wp_fullscreen_is_enabled') )
121 * This method gets executed each time the editor needs to resize.
123 function resize(editor, e) {
124 var DOM = tinymce.DOM, body = ed.getBody(), ifr = DOM.get(ed.id + '_ifr'), height, y = ed.dom.win.scrollY;
126 if ( t.resize_timeout )
129 // sometimes several events are fired few ms apart, trottle down resizing a little
130 t.resize_timeout = true;
131 setTimeout(function(){
132 t.resize_timeout = false;
135 height = body.scrollHeight > 300 ? body.scrollHeight : 300;
137 if ( height != ifr.scrollHeight ) {
138 DOM.setStyle(ifr, 'height', height + 'px');
139 ed.getWin().scrollTo(0, 0); // iframe window object, make sure there's no scrolling
142 // WebKit scrolls to top on paste...
143 if ( e && e.type == 'paste' && tinymce.isWebKit ) {
144 setTimeout(function(){
145 ed.dom.win.scrollTo(0, y);
150 // Add appropriate listeners for resizing content area
151 ed.onInit.add(function(ed, l) {
152 ed.onChange.add(resize);
153 ed.onSetContent.add(resize);
154 ed.onPaste.add(resize);
155 ed.onKeyUp.add(resize);
156 ed.onPostRender.add(resize);
158 ed.getBody().style.overflowY = "hidden";
161 if ( ed.getParam('autoresize_on_init', true) ) {
162 ed.onLoadContent.add(function(ed, l) {
163 // Because the content area resizes when its content CSS loads,
164 // and we can't easily add a listener to its onload event,
165 // we'll just trigger a resize after a short loading period
166 setTimeout(function() {
172 // Register the command so that it can be invoked by using tinyMCE.activeEditor.execCommand('mceExample');
173 ed.addCommand('wpAutoResize', resize);
176 getInfo : function() {
178 longname : 'WP Fullscreen',
179 author : 'WordPress',
180 authorurl : 'http://wordpress.org',
188 tinymce.PluginManager.add('wpfullscreen', tinymce.plugins.wpFullscreenPlugin);