crm.fsf.org/20131203/files/sites/all/modules-old/civicrm/packages/tinymce/jscripts/tiny_mce/plugins/layer/editor_plugin_src.js

   1 /**
   2  * editor_plugin_src.js
   3  *
   4  * Copyright 2009, Moxiecode Systems AB
   5  * Released under LGPL License.
   6  *
   7  * License: http://tinymce.moxiecode.com/license
   8  * Contributing: http://tinymce.moxiecode.com/contributing
   9  */
  10
  11 (function() {
  12         function findParentLayer(node) {
  13                 do {
  14                         if (node.className && node.className.indexOf('mceItemLayer') != -1) {
  15                                 return node;
  16                         }
  17                 } while (node = node.parentNode);
  18         };
  19
  20         tinymce.create('tinymce.plugins.Layer', {
  21                 init : function(ed, url) {
  22                         var t = this;
  23
  24                         t.editor = ed;
  25
  26                         // Register commands
  27                         ed.addCommand('mceInsertLayer', t._insertLayer, t);
  28
  29                         ed.addCommand('mceMoveForward', function() {
  30                                 t._move(1);
  31                         });
  32
  33                         ed.addCommand('mceMoveBackward', function() {
  34                                 t._move(-1);
  35                         });
  36
  37                         ed.addCommand('mceMakeAbsolute', function() {
  38                                 t._toggleAbsolute();
  39                         });
  40
  41                         // Register buttons
  42                         ed.addButton('moveforward', {title : 'layer.forward_desc', cmd : 'mceMoveForward'});
  43                         ed.addButton('movebackward', {title : 'layer.backward_desc', cmd : 'mceMoveBackward'});
  44                         ed.addButton('absolute', {title : 'layer.absolute_desc', cmd : 'mceMakeAbsolute'});
  45                         ed.addButton('insertlayer', {title : 'layer.insertlayer_desc', cmd : 'mceInsertLayer'});
  46
  47                         ed.onInit.add(function() {
  48                                 var dom = ed.dom;
  49
  50                                 if (tinymce.isIE)
  51                                         ed.getDoc().execCommand('2D-Position', false, true);
  52                         });
  53
  54                         // Remove serialized styles when selecting a layer since it might be changed by a drag operation
  55                         ed.onMouseUp.add(function(ed, e) {
  56                                 var layer = findParentLayer(e.target);
  57
  58                                 if (layer) {
  59                                         ed.dom.setAttrib(layer, 'data-mce-style', '');
  60                                 }
  61                         });
  62
  63                         // Fixes edit focus issues with layers on Gecko
  64                         // This will enable designMode while inside a layer and disable it when outside
  65                         ed.onMouseDown.add(function(ed, e) {
  66                                 var node = e.target, doc = ed.getDoc(), parent;
  67
  68                                 if (tinymce.isGecko) {
  69                                         if (findParentLayer(node)) {
  70                                                 if (doc.designMode !== 'on') {
  71                                                         doc.designMode = 'on';
  72
  73                                                         // Repaint caret
  74                                                         node = doc.body;
  75                                                         parent = node.parentNode;
  76                                                         parent.removeChild(node);
  77                                                         parent.appendChild(node);
  78                                                 }
  79                                         } else if (doc.designMode == 'on') {
  80                                                 doc.designMode = 'off';
  81                                         }
  82                                 }
  83                         });
  84
  85                         ed.onNodeChange.add(t._nodeChange, t);
  86                         ed.onVisualAid.add(t._visualAid, t);
  87                 },
  88
  89                 getInfo : function() {
  90                         return {
  91                                 longname : 'Layer',
  92                                 author : 'Moxiecode Systems AB',
  93                                 authorurl : 'http://tinymce.moxiecode.com',
  94                                 infourl : 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/layer',
  95                                 version : tinymce.majorVersion + "." + tinymce.minorVersion
  96                         };
  97                 },
  98
  99                 // Private methods
 100
 101                 _nodeChange : function(ed, cm, n) {
 102                         var le, p;
 103
 104                         le = this._getParentLayer(n);
 105                         p = ed.dom.getParent(n, 'DIV,P,IMG');
 106
 107                         if (!p) {
 108                                 cm.setDisabled('absolute', 1);
 109                                 cm.setDisabled('moveforward', 1);
 110                                 cm.setDisabled('movebackward', 1);
 111                         } else {
 112                                 cm.setDisabled('absolute', 0);
 113                                 cm.setDisabled('moveforward', !le);
 114                                 cm.setDisabled('movebackward', !le);
 115                                 cm.setActive('absolute', le && le.style.position.toLowerCase() == "absolute");
 116                         }
 117                 },
 118
 119                 // Private methods
 120
 121                 _visualAid : function(ed, e, s) {
 122                         var dom = ed.dom;
 123
 124                         tinymce.each(dom.select('div,p', e), function(e) {
 125                                 if (/^(absolute|relative|fixed)$/i.test(e.style.position)) {
 126                                         if (s)
 127                                                 dom.addClass(e, 'mceItemVisualAid');
 128                                         else
 129                                                 dom.removeClass(e, 'mceItemVisualAid');
 130
 131                                         dom.addClass(e, 'mceItemLayer');
 132                                 }
 133                         });
 134                 },
 135
 136                 _move : function(d) {
 137                         var ed = this.editor, i, z = [], le = this._getParentLayer(ed.selection.getNode()), ci = -1, fi = -1, nl;
 138
 139                         nl = [];
 140                         tinymce.walk(ed.getBody(), function(n) {
 141                                 if (n.nodeType == 1 && /^(absolute|relative|static)$/i.test(n.style.position))
 142                                         nl.push(n);
 143                         }, 'childNodes');
 144
 145                         // Find z-indexes
 146                         for (i=0; i<nl.length; i++) {
 147                                 z[i] = nl[i].style.zIndex ? parseInt(nl[i].style.zIndex) : 0;
 148
 149                                 if (ci < 0 && nl[i] == le)
 150                                         ci = i;
 151                         }
 152
 153                         if (d < 0) {
 154                                 // Move back
 155
 156                                 // Try find a lower one
 157                                 for (i=0; i<z.length; i++) {
 158                                         if (z[i] < z[ci]) {
 159                                                 fi = i;
 160                                                 break;
 161                                         }
 162                                 }
 163
 164                                 if (fi > -1) {
 165                                         nl[ci].style.zIndex = z[fi];
 166                                         nl[fi].style.zIndex = z[ci];
 167                                 } else {
 168                                         if (z[ci] > 0)
 169                                                 nl[ci].style.zIndex = z[ci] - 1;
 170                                 }
 171                         } else {
 172                                 // Move forward
 173
 174                                 // Try find a higher one
 175                                 for (i=0; i<z.length; i++) {
 176                                         if (z[i] > z[ci]) {
 177                                                 fi = i;
 178                                                 break;
 179                                         }
 180                                 }
 181
 182                                 if (fi > -1) {
 183                                         nl[ci].style.zIndex = z[fi];
 184                                         nl[fi].style.zIndex = z[ci];
 185                                 } else
 186                                         nl[ci].style.zIndex = z[ci] + 1;
 187                         }
 188
 189                         ed.execCommand('mceRepaint');
 190                 },
 191
 192                 _getParentLayer : function(n) {
 193                         return this.editor.dom.getParent(n, function(n) {
 194                                 return n.nodeType == 1 && /^(absolute|relative|static)$/i.test(n.style.position);
 195                         });
 196                 },
 197
 198                 _insertLayer : function() {
 199                         var ed = this.editor, dom = ed.dom, p = dom.getPos(dom.getParent(ed.selection.getNode(), '*')), body = ed.getBody();
 200
 201                         ed.dom.add(body, 'div', {
 202                                 style : {
 203                                         position : 'absolute',
 204                                         left : p.x,
 205                                         top : (p.y > 20 ? p.y : 20),
 206                                         width : 100,
 207                                         height : 100
 208                                 },
 209                                 'class' : 'mceItemVisualAid mceItemLayer'
 210                         }, ed.selection.getContent() || ed.getLang('layer.content'));
 211
 212                         // Workaround for IE where it messes up the JS engine if you insert a layer on IE 6,7
 213                         if (tinymce.isIE)
 214                                 dom.setHTML(body, body.innerHTML);
 215                 },
 216
 217                 _toggleAbsolute : function() {
 218                         var ed = this.editor, le = this._getParentLayer(ed.selection.getNode());
 219
 220                         if (!le)
 221                                 le = ed.dom.getParent(ed.selection.getNode(), 'DIV,P,IMG');
 222
 223                         if (le) {
 224                                 if (le.style.position.toLowerCase() == "absolute") {
 225                                         ed.dom.setStyles(le, {
 226                                                 position : '',
 227                                                 left : '',
 228                                                 top : '',
 229                                                 width : '',
 230                                                 height : ''
 231                                         });
 232
 233                                         ed.dom.removeClass(le, 'mceItemVisualAid');
 234                                         ed.dom.removeClass(le, 'mceItemLayer');
 235                                 } else {
 236                                         if (le.style.left == "")
 237                                                 le.style.left = 20 + 'px';
 238
 239                                         if (le.style.top == "")
 240                                                 le.style.top = 20 + 'px';
 241
 242                                         if (le.style.width == "")
 243                                                 le.style.width = le.width ? (le.width + 'px') : '100px';
 244
 245                                         if (le.style.height == "")
 246                                                 le.style.height = le.height ? (le.height + 'px') : '100px';
 247
 248                                         le.style.position = "absolute";
 249
 250                                         ed.dom.setAttrib(le, 'data-mce-style', '');
 251                                         ed.addVisual(ed.getBody());
 252                                 }
 253
 254                                 ed.execCommand('mceRepaint');
 255                                 ed.nodeChanged();
 256                         }
 257                 }
 258         });
 259
 260         // Register plugin
 261         tinymce.PluginManager.add('layer', tinymce.plugins.Layer);
 262 })();