1 |
8 |
ahitrov@rambler.ru |
/** |
2 |
|
|
* $Id: editor_plugin_src.js 652 2008-02-29 13:09:46Z spocke $ |
3 |
|
|
* |
4 |
|
|
* @author Moxiecode |
5 |
|
|
* @copyright Copyright � 2004-2008, Moxiecode Systems AB, All rights reserved. |
6 |
|
|
*/ |
7 |
|
|
|
8 |
|
|
(function() { |
9 |
|
|
tinymce.create('tinymce.plugins.Layer', { |
10 |
|
|
init : function(ed, url) { |
11 |
|
|
var t = this; |
12 |
|
|
|
13 |
|
|
t.editor = ed; |
14 |
|
|
|
15 |
|
|
// Register commands |
16 |
|
|
ed.addCommand('mceInsertLayer', t._insertLayer, t); |
17 |
|
|
|
18 |
|
|
ed.addCommand('mceMoveForward', function() { |
19 |
|
|
t._move(1); |
20 |
|
|
}); |
21 |
|
|
|
22 |
|
|
ed.addCommand('mceMoveBackward', function() { |
23 |
|
|
t._move(-1); |
24 |
|
|
}); |
25 |
|
|
|
26 |
|
|
ed.addCommand('mceMakeAbsolute', function() { |
27 |
|
|
t._toggleAbsolute(); |
28 |
|
|
}); |
29 |
|
|
|
30 |
|
|
// Register buttons |
31 |
|
|
ed.addButton('moveforward', {title : 'layer.forward_desc', cmd : 'mceMoveForward'}); |
32 |
|
|
ed.addButton('movebackward', {title : 'layer.backward_desc', cmd : 'mceMoveBackward'}); |
33 |
|
|
ed.addButton('absolute', {title : 'layer.absolute_desc', cmd : 'mceMakeAbsolute'}); |
34 |
|
|
ed.addButton('insertlayer', {title : 'layer.insertlayer_desc', cmd : 'mceInsertLayer'}); |
35 |
|
|
|
36 |
|
|
ed.onInit.add(function() { |
37 |
|
|
if (tinymce.isIE) |
38 |
|
|
ed.getDoc().execCommand('2D-Position', false, true); |
39 |
|
|
}); |
40 |
|
|
|
41 |
|
|
ed.onNodeChange.add(t._nodeChange, t); |
42 |
|
|
ed.onVisualAid.add(t._visualAid, t); |
43 |
|
|
}, |
44 |
|
|
|
45 |
|
|
getInfo : function() { |
46 |
|
|
return { |
47 |
|
|
longname : 'Layer', |
48 |
|
|
author : 'Moxiecode Systems AB', |
49 |
|
|
authorurl : 'http://tinymce.moxiecode.com', |
50 |
|
|
infourl : 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/layer', |
51 |
|
|
version : tinymce.majorVersion + "." + tinymce.minorVersion |
52 |
|
|
}; |
53 |
|
|
}, |
54 |
|
|
|
55 |
|
|
// Private methods |
56 |
|
|
|
57 |
|
|
_nodeChange : function(ed, cm, n) { |
58 |
|
|
var le, p; |
59 |
|
|
|
60 |
|
|
le = this._getParentLayer(n); |
61 |
|
|
p = ed.dom.getParent(n, 'DIV,P,IMG'); |
62 |
|
|
|
63 |
|
|
if (!p) { |
64 |
|
|
cm.setDisabled('absolute', 1); |
65 |
|
|
cm.setDisabled('moveforward', 1); |
66 |
|
|
cm.setDisabled('movebackward', 1); |
67 |
|
|
} else { |
68 |
|
|
cm.setDisabled('absolute', 0); |
69 |
|
|
cm.setDisabled('moveforward', !le); |
70 |
|
|
cm.setDisabled('movebackward', !le); |
71 |
|
|
cm.setActive('absolute', le && le.style.position.toLowerCase() == "absolute"); |
72 |
|
|
} |
73 |
|
|
}, |
74 |
|
|
|
75 |
|
|
// Private methods |
76 |
|
|
|
77 |
|
|
_visualAid : function(ed, e, s) { |
78 |
|
|
var dom = ed.dom; |
79 |
|
|
|
80 |
|
|
tinymce.each(dom.select('div,p', e), function(e) { |
81 |
|
|
if (/^(absolute|relative|static)$/i.test(e.style.position)) { |
82 |
|
|
if (s) |
83 |
|
|
dom.addClass(e, 'mceItemVisualAid'); |
84 |
|
|
else |
85 |
|
|
dom.removeClass(e, 'mceItemVisualAid'); |
86 |
|
|
} |
87 |
|
|
}); |
88 |
|
|
}, |
89 |
|
|
|
90 |
|
|
_move : function(d) { |
91 |
|
|
var ed = this.editor, i, z = [], le = this._getParentLayer(ed.selection.getNode()), ci = -1, fi = -1, nl; |
92 |
|
|
|
93 |
|
|
nl = []; |
94 |
|
|
tinymce.walk(ed.getBody(), function(n) { |
95 |
|
|
if (n.nodeType == 1 && /^(absolute|relative|static)$/i.test(n.style.position)) |
96 |
|
|
nl.push(n); |
97 |
|
|
}, 'childNodes'); |
98 |
|
|
|
99 |
|
|
// Find z-indexes |
100 |
|
|
for (i=0; i<nl.length; i++) { |
101 |
|
|
z[i] = nl[i].style.zIndex ? parseInt(nl[i].style.zIndex) : 0; |
102 |
|
|
|
103 |
|
|
if (ci < 0 && nl[i] == le) |
104 |
|
|
ci = i; |
105 |
|
|
} |
106 |
|
|
|
107 |
|
|
if (d < 0) { |
108 |
|
|
// Move back |
109 |
|
|
|
110 |
|
|
// Try find a lower one |
111 |
|
|
for (i=0; i<z.length; i++) { |
112 |
|
|
if (z[i] < z[ci]) { |
113 |
|
|
fi = i; |
114 |
|
|
break; |
115 |
|
|
} |
116 |
|
|
} |
117 |
|
|
|
118 |
|
|
if (fi > -1) { |
119 |
|
|
nl[ci].style.zIndex = z[fi]; |
120 |
|
|
nl[fi].style.zIndex = z[ci]; |
121 |
|
|
} else { |
122 |
|
|
if (z[ci] > 0) |
123 |
|
|
nl[ci].style.zIndex = z[ci] - 1; |
124 |
|
|
} |
125 |
|
|
} else { |
126 |
|
|
// Move forward |
127 |
|
|
|
128 |
|
|
// Try find a higher one |
129 |
|
|
for (i=0; i<z.length; i++) { |
130 |
|
|
if (z[i] > z[ci]) { |
131 |
|
|
fi = i; |
132 |
|
|
break; |
133 |
|
|
} |
134 |
|
|
} |
135 |
|
|
|
136 |
|
|
if (fi > -1) { |
137 |
|
|
nl[ci].style.zIndex = z[fi]; |
138 |
|
|
nl[fi].style.zIndex = z[ci]; |
139 |
|
|
} else |
140 |
|
|
nl[ci].style.zIndex = z[ci] + 1; |
141 |
|
|
} |
142 |
|
|
|
143 |
|
|
ed.execCommand('mceRepaint'); |
144 |
|
|
}, |
145 |
|
|
|
146 |
|
|
_getParentLayer : function(n) { |
147 |
|
|
return this.editor.dom.getParent(n, function(n) { |
148 |
|
|
return n.nodeType == 1 && /^(absolute|relative|static)$/i.test(n.style.position); |
149 |
|
|
}); |
150 |
|
|
}, |
151 |
|
|
|
152 |
|
|
_insertLayer : function() { |
153 |
|
|
var ed = this.editor, p = ed.dom.getPos(ed.dom.getParent(ed.selection.getNode(), '*')); |
154 |
|
|
|
155 |
|
|
ed.dom.add(ed.getBody(), 'div', { |
156 |
|
|
style : { |
157 |
|
|
position : 'absolute', |
158 |
|
|
left : p.x, |
159 |
|
|
top : (p.y > 20 ? p.y : 20), |
160 |
|
|
width : 100, |
161 |
|
|
height : 100 |
162 |
|
|
}, |
163 |
|
|
'class' : 'mceItemVisualAid' |
164 |
|
|
}, ed.selection.getContent() || ed.getLang('layer.content')); |
165 |
|
|
}, |
166 |
|
|
|
167 |
|
|
_toggleAbsolute : function() { |
168 |
|
|
var ed = this.editor, le = this._getParentLayer(ed.selection.getNode()); |
169 |
|
|
|
170 |
|
|
if (!le) |
171 |
|
|
le = ed.dom.getParent(ed.selection.getNode(), 'DIV,P,IMG'); |
172 |
|
|
|
173 |
|
|
if (le) { |
174 |
|
|
if (le.style.position.toLowerCase() == "absolute") { |
175 |
|
|
ed.dom.setStyles(le, { |
176 |
|
|
position : '', |
177 |
|
|
left : '', |
178 |
|
|
top : '', |
179 |
|
|
width : '', |
180 |
|
|
height : '' |
181 |
|
|
}); |
182 |
|
|
|
183 |
|
|
ed.dom.removeClass(le, 'mceItemVisualAid'); |
184 |
|
|
} else { |
185 |
|
|
if (le.style.left == "") |
186 |
|
|
le.style.left = 20 + 'px'; |
187 |
|
|
|
188 |
|
|
if (le.style.top == "") |
189 |
|
|
le.style.top = 20 + 'px'; |
190 |
|
|
|
191 |
|
|
if (le.style.width == "") |
192 |
|
|
le.style.width = le.width ? (le.width + 'px') : '100px'; |
193 |
|
|
|
194 |
|
|
if (le.style.height == "") |
195 |
|
|
le.style.height = le.height ? (le.height + 'px') : '100px'; |
196 |
|
|
|
197 |
|
|
le.style.position = "absolute"; |
198 |
|
|
ed.addVisual(ed.getBody()); |
199 |
|
|
} |
200 |
|
|
|
201 |
|
|
ed.execCommand('mceRepaint'); |
202 |
|
|
ed.nodeChanged(); |
203 |
|
|
} |
204 |
|
|
} |
205 |
|
|
}); |
206 |
|
|
|
207 |
|
|
// Register plugin |
208 |
|
|
tinymce.PluginManager.add('layer', tinymce.plugins.Layer); |
209 |
|
|
})(); |