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