bgneal@312: /** bgneal@312: * editor_plugin_src.js bgneal@312: * bgneal@312: * Copyright 2009, Moxiecode Systems AB bgneal@312: * Released under LGPL License. bgneal@312: * bgneal@312: * License: http://tinymce.moxiecode.com/license bgneal@312: * Contributing: http://tinymce.moxiecode.com/contributing bgneal@312: */ bgneal@312: bgneal@312: (function() { bgneal@312: tinymce.create('tinymce.plugins.Layer', { bgneal@312: init : function(ed, url) { bgneal@312: var t = this; bgneal@312: bgneal@312: t.editor = ed; bgneal@312: bgneal@312: // Register commands bgneal@312: ed.addCommand('mceInsertLayer', t._insertLayer, t); bgneal@312: bgneal@312: ed.addCommand('mceMoveForward', function() { bgneal@312: t._move(1); bgneal@312: }); bgneal@312: bgneal@312: ed.addCommand('mceMoveBackward', function() { bgneal@312: t._move(-1); bgneal@312: }); bgneal@312: bgneal@312: ed.addCommand('mceMakeAbsolute', function() { bgneal@312: t._toggleAbsolute(); bgneal@312: }); bgneal@312: bgneal@312: // Register buttons bgneal@312: ed.addButton('moveforward', {title : 'layer.forward_desc', cmd : 'mceMoveForward'}); bgneal@312: ed.addButton('movebackward', {title : 'layer.backward_desc', cmd : 'mceMoveBackward'}); bgneal@312: ed.addButton('absolute', {title : 'layer.absolute_desc', cmd : 'mceMakeAbsolute'}); bgneal@312: ed.addButton('insertlayer', {title : 'layer.insertlayer_desc', cmd : 'mceInsertLayer'}); bgneal@312: bgneal@312: ed.onInit.add(function() { bgneal@312: if (tinymce.isIE) bgneal@312: ed.getDoc().execCommand('2D-Position', false, true); bgneal@312: }); bgneal@312: bgneal@312: ed.onNodeChange.add(t._nodeChange, t); bgneal@312: ed.onVisualAid.add(t._visualAid, t); bgneal@312: }, bgneal@312: bgneal@312: getInfo : function() { bgneal@312: return { bgneal@312: longname : 'Layer', bgneal@312: author : 'Moxiecode Systems AB', bgneal@312: authorurl : 'http://tinymce.moxiecode.com', bgneal@312: infourl : 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/layer', bgneal@312: version : tinymce.majorVersion + "." + tinymce.minorVersion bgneal@312: }; bgneal@312: }, bgneal@312: bgneal@312: // Private methods bgneal@312: bgneal@312: _nodeChange : function(ed, cm, n) { bgneal@312: var le, p; bgneal@312: bgneal@312: le = this._getParentLayer(n); bgneal@312: p = ed.dom.getParent(n, 'DIV,P,IMG'); bgneal@312: bgneal@312: if (!p) { bgneal@312: cm.setDisabled('absolute', 1); bgneal@312: cm.setDisabled('moveforward', 1); bgneal@312: cm.setDisabled('movebackward', 1); bgneal@312: } else { bgneal@312: cm.setDisabled('absolute', 0); bgneal@312: cm.setDisabled('moveforward', !le); bgneal@312: cm.setDisabled('movebackward', !le); bgneal@312: cm.setActive('absolute', le && le.style.position.toLowerCase() == "absolute"); bgneal@312: } bgneal@312: }, bgneal@312: bgneal@312: // Private methods bgneal@312: bgneal@312: _visualAid : function(ed, e, s) { bgneal@312: var dom = ed.dom; bgneal@312: bgneal@312: tinymce.each(dom.select('div,p', e), function(e) { bgneal@312: if (/^(absolute|relative|static)$/i.test(e.style.position)) { bgneal@312: if (s) bgneal@312: dom.addClass(e, 'mceItemVisualAid'); bgneal@312: else bgneal@312: dom.removeClass(e, 'mceItemVisualAid'); bgneal@312: } bgneal@312: }); bgneal@312: }, bgneal@312: bgneal@312: _move : function(d) { bgneal@312: var ed = this.editor, i, z = [], le = this._getParentLayer(ed.selection.getNode()), ci = -1, fi = -1, nl; bgneal@312: bgneal@312: nl = []; bgneal@312: tinymce.walk(ed.getBody(), function(n) { bgneal@312: if (n.nodeType == 1 && /^(absolute|relative|static)$/i.test(n.style.position)) bgneal@312: nl.push(n); bgneal@312: }, 'childNodes'); bgneal@312: bgneal@312: // Find z-indexes bgneal@312: for (i=0; i -1) { bgneal@312: nl[ci].style.zIndex = z[fi]; bgneal@312: nl[fi].style.zIndex = z[ci]; bgneal@312: } else { bgneal@312: if (z[ci] > 0) bgneal@312: nl[ci].style.zIndex = z[ci] - 1; bgneal@312: } bgneal@312: } else { bgneal@312: // Move forward bgneal@312: bgneal@312: // Try find a higher one bgneal@312: for (i=0; i z[ci]) { bgneal@312: fi = i; bgneal@312: break; bgneal@312: } bgneal@312: } bgneal@312: bgneal@312: if (fi > -1) { bgneal@312: nl[ci].style.zIndex = z[fi]; bgneal@312: nl[fi].style.zIndex = z[ci]; bgneal@312: } else bgneal@312: nl[ci].style.zIndex = z[ci] + 1; bgneal@312: } bgneal@312: bgneal@312: ed.execCommand('mceRepaint'); bgneal@312: }, bgneal@312: bgneal@312: _getParentLayer : function(n) { bgneal@312: return this.editor.dom.getParent(n, function(n) { bgneal@312: return n.nodeType == 1 && /^(absolute|relative|static)$/i.test(n.style.position); bgneal@312: }); bgneal@312: }, bgneal@312: bgneal@312: _insertLayer : function() { bgneal@312: var ed = this.editor, p = ed.dom.getPos(ed.dom.getParent(ed.selection.getNode(), '*')); bgneal@312: bgneal@312: ed.dom.add(ed.getBody(), 'div', { bgneal@312: style : { bgneal@312: position : 'absolute', bgneal@312: left : p.x, bgneal@312: top : (p.y > 20 ? p.y : 20), bgneal@312: width : 100, bgneal@312: height : 100 bgneal@312: }, bgneal@312: 'class' : 'mceItemVisualAid' bgneal@312: }, ed.selection.getContent() || ed.getLang('layer.content')); bgneal@312: }, bgneal@312: bgneal@312: _toggleAbsolute : function() { bgneal@312: var ed = this.editor, le = this._getParentLayer(ed.selection.getNode()); bgneal@312: bgneal@312: if (!le) bgneal@312: le = ed.dom.getParent(ed.selection.getNode(), 'DIV,P,IMG'); bgneal@312: bgneal@312: if (le) { bgneal@312: if (le.style.position.toLowerCase() == "absolute") { bgneal@312: ed.dom.setStyles(le, { bgneal@312: position : '', bgneal@312: left : '', bgneal@312: top : '', bgneal@312: width : '', bgneal@312: height : '' bgneal@312: }); bgneal@312: bgneal@312: ed.dom.removeClass(le, 'mceItemVisualAid'); bgneal@312: } else { bgneal@312: if (le.style.left == "") bgneal@312: le.style.left = 20 + 'px'; bgneal@312: bgneal@312: if (le.style.top == "") bgneal@312: le.style.top = 20 + 'px'; bgneal@312: bgneal@312: if (le.style.width == "") bgneal@312: le.style.width = le.width ? (le.width + 'px') : '100px'; bgneal@312: bgneal@312: if (le.style.height == "") bgneal@312: le.style.height = le.height ? (le.height + 'px') : '100px'; bgneal@312: bgneal@312: le.style.position = "absolute"; bgneal@442: bgneal@442: ed.dom.setAttrib(le, 'data-mce-style', ''); bgneal@312: ed.addVisual(ed.getBody()); bgneal@312: } bgneal@312: bgneal@312: ed.execCommand('mceRepaint'); bgneal@312: ed.nodeChanged(); bgneal@312: } bgneal@312: } bgneal@312: }); bgneal@312: bgneal@312: // Register plugin bgneal@312: tinymce.PluginManager.add('layer', tinymce.plugins.Layer); bgneal@312: })();