includes/clientside/tinymce/plugins/fullscreen/editor_plugin_src.js
changeset 335 67bd3121a12e
parent 1 fe660c52c48f
child 395 fa4c5ecb7c9a
equal deleted inserted replaced
334:c72b545f1304 335:67bd3121a12e
     1 /**
     1 /**
     2  * $Id: editor_plugin_src.js 201 2007-02-12 15:56:56Z spocke $
     2  * $Id: editor_plugin_src.js 453 2007-11-27 17:36:55Z spocke $
     3  *
     3  *
     4  * @author Moxiecode
     4  * @author Moxiecode
     5  * @copyright Copyright © 2004-2007, Moxiecode Systems AB, All rights reserved.
     5  * @copyright Copyright © 2004-2007, Moxiecode Systems AB, All rights reserved.
     6  */
     6  */
     7 
     7 
     8 /* Import plugin specific language pack */
     8 (function() {
     9 tinyMCE.importPluginLanguagePack('fullscreen');
     9 	var DOM = tinymce.DOM;
    10 
    10 
    11 var TinyMCE_FullScreenPlugin = {
    11 	tinymce.create('tinymce.plugins.FullScreenPlugin', {
    12 	getInfo : function() {
    12 		init : function(ed, url) {
    13 		return {
    13 			var t = this, s = {}, vp;
    14 			longname : 'Fullscreen',
       
    15 			author : 'Moxiecode Systems AB',
       
    16 			authorurl : 'http://tinymce.moxiecode.com',
       
    17 			infourl : 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/fullscreen',
       
    18 			version : tinyMCE.majorVersion + "." + tinyMCE.minorVersion
       
    19 		};
       
    20 	},
       
    21 
    14 
    22 	initInstance : function(inst) {
    15 			t.editor = ed;
    23 		if (!tinyMCE.settings['fullscreen_skip_plugin_css'])
       
    24 			tinyMCE.importCSS(inst.getContainerWin().document, tinyMCE.baseURL + "/plugins/fullscreen/css/page.css");
       
    25 	},
       
    26 
    16 
    27 	getControlHTML : function(cn) {
    17 			// Register commands
    28 		switch (cn) {
    18 			ed.addCommand('mceFullScreen', function() {
    29 			case "fullscreen":
    19 				var win;
    30 				return tinyMCE.getButtonHTML(cn, 'lang_fullscreen_desc', '{$pluginurl}/images/fullscreen.gif', 'mceFullScreen');
       
    31 		}
       
    32 
    20 
    33 		return "";
    21 				if (ed.getParam('fullscreen_is_enabled')) {
    34 	},
    22 					if (ed.getParam('fullscreen_new_window'))
       
    23 						closeFullscreen(); // Call to close in new window
       
    24 					else {
       
    25 						window.setTimeout(function() {
       
    26 							tinyMCE.get(ed.getParam('fullscreen_editor_id')).setContent(ed.getContent({format : 'raw'}), {format : 'raw'});
       
    27 							tinyMCE.remove(ed);
       
    28 							DOM.remove('mce_fullscreen_container');
       
    29 							DOM.setStyle(document.body, 'overflow', ed.getParam('fullscreen_overflow'));
       
    30 						}, 10);
       
    31 					}
       
    32 					return;
       
    33 				}
    35 
    34 
    36 	execCommand : function(editor_id, element, command, user_interface, value) {
    35 				if (ed.getParam('fullscreen_new_window')) {
    37 		var inst;
    36 					win = window.open(url + "/fullscreen.htm", "mceFullScreenPopup", "fullscreen=yes,menubar=no,toolbar=no,scrollbars=no,resizable=no,left=0,top=0,width=" + screen.availWidth + ",height=" + screen.availHeight);
       
    37 					try {
       
    38 						win.resizeTo(screen.availWidth, screen.availHeight);
       
    39 					} catch (e) {
       
    40 						// Ignore
       
    41 					}
       
    42 				} else {
       
    43 					s.fullscreen_overflow = DOM.getStyle(document.body, 'overflow', 1) || 'auto';
       
    44 					DOM.setStyle(document.body, 'overflow', 'hidden');
       
    45 					vp = DOM.getViewPort();
    38 
    46 
    39 		// Handle commands
    47 					if (tinymce.isIE)
    40 		switch (command) {
    48 						vp.h -= 1;
    41 			case "mceFullScreen":
       
    42 				inst = tinyMCE.getInstanceById(editor_id);
       
    43 
    49 
    44 				if (tinyMCE.getParam('fullscreen_new_window'))
    50 					n = DOM.add(document.body, 'div', {id : 'mce_fullscreen_container', style : 'position:absolute;top:0;left:0;width:' + vp.w + 'px;height:' + vp.h + 'px;z-index:150;'});
    45 					this._toggleFullscreenWin(inst);
    51 					DOM.add(n, 'div', {id : 'mce_fullscreen'});
    46 				else
       
    47 					this._toggleFullscreen(inst);
       
    48 
    52 
    49 				return true;
    53 					tinymce.each(ed.settings, function(v, n) {
    50 		}
    54 						s[n] = v;
       
    55 					});
    51 
    56 
    52 		// Pass to next handler in chain
    57 					s.id = 'mce_fullscreen';
    53 		return false;
    58 					s.width = n.clientWidth;
    54 	},
    59 					s.height = n.clientHeight - 15;
       
    60 					s.fullscreen_is_enabled = true;
       
    61 					s.fullscreen_editor_id = ed.id;
       
    62 					s.theme_advanced_resizing = false;
    55 
    63 
    56 	_toggleFullscreenWin : function(inst) {
    64 					tinymce.each(ed.getParam('fullscreen_settings'), function(v, k) {
    57 		if (tinyMCE.getParam('fullscreen_is_enabled')) {
    65 						s[k] = v;
    58 			// In fullscreen mode
    66 					});
    59 			window.opener.tinyMCE.execInstanceCommand(tinyMCE.getParam('fullscreen_editor_id'), 'mceSetContent', false, tinyMCE.getContent(inst.editorId));
       
    60 			top.close();
       
    61 		} else {
       
    62 			tinyMCE.setWindowArg('editor_id', inst.editorId);
       
    63 
    67 
    64 			var win = window.open(tinyMCE.baseURL + "/plugins/fullscreen/fullscreen.htm", "mceFullScreenPopup", "fullscreen=yes,menubar=no,toolbar=no,scrollbars=no,resizable=yes,left=0,top=0,width=" + screen.availWidth + ",height=" + screen.availHeight);
    68 					if (s.theme_advanced_toolbar_location === 'external')
    65 			try { win.resizeTo(screen.availWidth, screen.availHeight); } catch (e) {}
    69 						s.theme_advanced_toolbar_location = 'top';
    66 		}
       
    67 	},
       
    68 
    70 
    69 	_toggleFullscreen : function(inst) {
    71 					t.fullscreenEditor = new tinymce.Editor('mce_fullscreen', s);
    70 		var ds = inst.getData('fullscreen'), editorContainer, tableElm, iframe, vp, cw, cd, re, w, h, si, blo, delta = 0, cell, row, fcml, bcml;
    72 					t.fullscreenEditor.onInit.add(function() {
       
    73 						t.fullscreenEditor.setContent(ed.getContent({format : 'raw', no_events : 1}), {format : 'raw', no_events : 1});
       
    74 					});
    71 
    75 
    72 		cw = inst.getContainerWin();
    76 					t.fullscreenEditor.render();
    73 		cd = cw.document;
    77 					tinyMCE.add(t.fullscreenEditor);
    74 		editorContainer = cd.getElementById(inst.editorId + '_parent');
       
    75 		tableElm = editorContainer.firstChild;
       
    76 		iframe = inst.iframeElement;
       
    77 		re = cd.getElementById(inst.editorId + '_resize');
       
    78 		blo = document.getElementById('mce_fullscreen_blocker');
       
    79 		fcm = new TinyMCE_Layer(inst.editorId + '_fcMenu');
       
    80 		fcml = new TinyMCE_Layer(inst.editorId + '_fcMenu');
       
    81 		bcml = new TinyMCE_Layer(inst.editorId + '_bcMenu');
       
    82 
    78 
    83 		if (fcml.exists() && fcml.isVisible()) {
    79 					t.fullscreenElement = new tinymce.dom.Element('mce_fullscreen_container');
    84 			tinyMCE.switchClass(inst.editorId + '_forecolor', 'mceMenuButton');
    80 					t.fullscreenElement.update();
    85 			fcml.hide();
    81 					//document.body.overflow = 'hidden';
    86 		}
    82 				}
    87 
       
    88 		if (bcml.exists() && bcml.isVisible()) {
       
    89 			tinyMCE.switchClass(inst.editorId + '_backcolor', 'mceMenuButton');
       
    90 			bcml.hide();
       
    91 		}
       
    92 
       
    93 		if (!ds.enabled) {
       
    94 			// Handle External Toolbar
       
    95 			if (inst.toolbarElement) {
       
    96 				delta += inst.toolbarElement.offsetHeight;
       
    97 
       
    98 				cell = tableElm.tBodies[0].insertRow(0).insertCell(-1);
       
    99 				cell.className = 'mceToolbarTop';
       
   100 				cell.nowrap = true;
       
   101 
       
   102 				ds.oldToolbarParent = inst.toolbarElement.parentNode;
       
   103 				ds.toolbarHolder = document.createTextNode('...');
       
   104 
       
   105 				cell.appendChild(ds.oldToolbarParent.replaceChild(ds.toolbarHolder, inst.toolbarElement));
       
   106 			}
       
   107 
       
   108 			ds.parents = [];
       
   109 
       
   110 			vp = tinyMCE.getViewPort(cw);
       
   111 			ds.scrollX = vp.left;
       
   112 			ds.scrollY = vp.top;
       
   113 
       
   114 			// Opera has a bug restoring scrollbars
       
   115 			if (!tinyMCE.isOpera)
       
   116 				tinyMCE.addCSSClass(cd.body, 'mceFullscreen');
       
   117 
       
   118 			tinyMCE.getParentNode(tableElm.parentNode, function (n) {
       
   119 				if (n.nodeName == 'BODY')
       
   120 					return true;
       
   121 
       
   122 				if (n.nodeType == 1)
       
   123 					tinyMCE.addCSSClass(n, 'mceFullscreenPos');
       
   124 
       
   125 				return false;
       
   126 			});
    83 			});
   127 
    84 
   128 			if (re)
    85 			// Register buttons
   129 				re.style.display = 'none';
    86 			ed.addButton('fullscreen', {title : 'fullscreen.desc', cmd : 'mceFullScreen'});
   130 
    87 
   131 			vp = tinyMCE.getViewPort(cw);
    88 			ed.onNodeChange.add(function(ed, cm) {
       
    89 				cm.setActive('fullscreen', ed.getParam('fullscreen_is_enabled'));
       
    90 			});
       
    91 		},
   132 
    92 
   133 			ds.oldWidth = iframe.style.width ? iframe.style.width : iframe.offsetWidth;
    93 		getInfo : function() {
   134 			ds.oldHeight = iframe.style.height ? iframe.style.height : iframe.offsetHeight;
    94 			return {
   135 			ds.oldTWidth = tableElm.style.width ? tableElm.style.width : tableElm.offsetWidth;
    95 				longname : 'Fullscreen',
   136 			ds.oldTHeight = tableElm.style.height ? tableElm.style.height : tableElm.offsetHeight;
    96 				author : 'Moxiecode Systems AB',
       
    97 				authorurl : 'http://tinymce.moxiecode.com',
       
    98 				infourl : 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/fullscreen',
       
    99 				version : tinymce.majorVersion + "." + tinymce.minorVersion
       
   100 			};
       
   101 		}
       
   102 	});
   137 
   103 
   138 			// Handle % width
   104 	// Register plugin
   139 			if (ds.oldWidth && ds.oldWidth.indexOf)
   105 	tinymce.PluginManager.add('fullscreen', tinymce.plugins.FullScreenPlugin);
   140 				ds.oldTWidth = ds.oldWidth.indexOf('%') != -1 ? ds.oldWidth : ds.oldTWidth;
   106 })();
   141 
       
   142 			if (!blo && tinyMCE.isRealIE) {
       
   143 				blo = tinyMCE.createTag(document, 'iframe', {id : 'mce_fullscreen_blocker', src : 'about:blank', frameBorder : 0, width : vp.width, height : vp.height, style : 'display: block; position: absolute; left: 0; top: 0; z-index: 999; margin: 0; padding: 0;'});
       
   144 				document.body.appendChild(blo);
       
   145 			}
       
   146 
       
   147 			tableElm.style.position = 'absolute';
       
   148 			tableElm.style.zIndex = 1000;
       
   149 			tableElm.style.left = tableElm.style.top = '0';
       
   150 
       
   151 			tableElm.style.width = vp.width + 'px';
       
   152 			tableElm.style.height = vp.height + 'px';
       
   153 
       
   154 			if (tinyMCE.isRealIE) {
       
   155 				iframe.style.width = vp.width + 'px';
       
   156 				iframe.style.height = vp.height + 'px';
       
   157 
       
   158 				// Calc new width/height based on overflow
       
   159 				w = iframe.parentNode.clientWidth - (tableElm.offsetWidth - vp.width);
       
   160 				h = iframe.parentNode.clientHeight - (tableElm.offsetHeight - vp.height);
       
   161 			} else {
       
   162 				w = iframe.parentNode.clientWidth;
       
   163 				h = iframe.parentNode.clientHeight;
       
   164 			}
       
   165 
       
   166 			iframe.style.width = w + "px";
       
   167 			iframe.style.height = (h+delta) + "px";
       
   168 
       
   169 			tinyMCE.switchClass(inst.editorId + '_fullscreen', 'mceButtonSelected');
       
   170 			ds.enabled = true;
       
   171 
       
   172 			inst.useCSS = false;
       
   173 		} else {
       
   174 			// Handle External Toolbar
       
   175 			if (inst.toolbarElement) {
       
   176 				row = inst.toolbarElement.parentNode.parentNode;
       
   177 
       
   178 				row.parentNode.removeChild(row);
       
   179 
       
   180 				ds.oldToolbarParent.replaceChild(inst.toolbarElement, ds.toolbarHolder);
       
   181 
       
   182 				ds.oldToolbarParent = null;
       
   183 				ds.toolbarHolder = null;
       
   184 			}
       
   185 
       
   186 			if (blo)
       
   187 				blo.parentNode.removeChild(blo);
       
   188 
       
   189 			si = 0;
       
   190 			tinyMCE.getParentNode(tableElm.parentNode, function (n) {
       
   191 				if (n.nodeName == 'BODY')
       
   192 					return true;
       
   193 
       
   194 				if (n.nodeType == 1)
       
   195 					tinyMCE.removeCSSClass(n, 'mceFullscreenPos');
       
   196 			});
       
   197 
       
   198 			if (re && tinyMCE.getParam("theme_advanced_resizing", false))
       
   199 				re.style.display = 'block';
       
   200 
       
   201 			tableElm.style.position = 'static';
       
   202 			tableElm.style.zIndex = '';
       
   203 			tableElm.style.width = '';
       
   204 			tableElm.style.height = '';
       
   205 
       
   206 			tableElm.style.width = ds.oldTWidth ? ds.oldTWidth : '';
       
   207 			tableElm.style.height = ds.oldTHeight ? ds.oldTHeight : '';
       
   208 
       
   209 			iframe.style.width = ds.oldWidth ? ds.oldWidth : '';
       
   210 			iframe.style.height = ds.oldHeight ? ds.oldHeight : '';
       
   211 
       
   212 			tinyMCE.switchClass(inst.editorId + '_fullscreen', 'mceButtonNormal');
       
   213 			ds.enabled = false;
       
   214 
       
   215 			tinyMCE.removeCSSClass(cd.body, 'mceFullscreen');
       
   216 			cw.scrollTo(ds.scrollX, ds.scrollY);
       
   217 
       
   218 			inst.useCSS = false;
       
   219 		}
       
   220 	},
       
   221 
       
   222 	handleNodeChange : function(editor_id, node, undo_index, undo_levels, visual_aid, any_selection) {
       
   223 		if (tinyMCE.getParam('fullscreen_is_enabled'))
       
   224 			tinyMCE.switchClass(editor_id + '_fullscreen', 'mceButtonSelected');
       
   225 
       
   226 		return true;
       
   227 	}
       
   228 };
       
   229 
       
   230 tinyMCE.addPlugin("fullscreen", TinyMCE_FullScreenPlugin);