1 | var ImageDialog = { |
---|
2 | preInit : function() { |
---|
3 | var url; |
---|
4 | |
---|
5 | tinyMCEPopup.requireLangPack(); |
---|
6 | |
---|
7 | if (url = tinyMCEPopup.getParam("external_image_list_url")) |
---|
8 | document.write('<script language="javascript" type="text/javascript" src="' + tinyMCEPopup.editor.documentBaseURI.toAbsolute(url) + '"></script>'); |
---|
9 | }, |
---|
10 | |
---|
11 | init : function() { |
---|
12 | var f = document.forms[0], ed = tinyMCEPopup.editor; |
---|
13 | |
---|
14 | // Setup browse button |
---|
15 | document.getElementById('srcbrowsercontainer').innerHTML = getBrowserHTML('srcbrowser','src','image','theme_advanced_image'); |
---|
16 | if (isVisible('srcbrowser')) |
---|
17 | document.getElementById('src').style.width = '180px'; |
---|
18 | |
---|
19 | e = ed.selection.getNode(); |
---|
20 | |
---|
21 | this.fillFileList('image_list', 'tinyMCEImageList'); |
---|
22 | |
---|
23 | if (e.nodeName == 'IMG') { |
---|
24 | f.src.value = ed.dom.getAttrib(e, 'src'); |
---|
25 | f.alt.value = ed.dom.getAttrib(e, 'alt'); |
---|
26 | f.border.value = this.getAttrib(e, 'border'); |
---|
27 | f.vspace.value = this.getAttrib(e, 'vspace'); |
---|
28 | f.hspace.value = this.getAttrib(e, 'hspace'); |
---|
29 | f.width.value = ed.dom.getAttrib(e, 'width'); |
---|
30 | f.height.value = ed.dom.getAttrib(e, 'height'); |
---|
31 | f.insert.value = ed.getLang('update'); |
---|
32 | this.styleVal = ed.dom.getAttrib(e, 'style'); |
---|
33 | selectByValue(f, 'image_list', f.src.value); |
---|
34 | selectByValue(f, 'align', this.getAttrib(e, 'align')); |
---|
35 | this.updateStyle(); |
---|
36 | } |
---|
37 | }, |
---|
38 | |
---|
39 | fillFileList : function(id, l) { |
---|
40 | var dom = tinyMCEPopup.dom, lst = dom.get(id), v, cl; |
---|
41 | |
---|
42 | l = window[l]; |
---|
43 | |
---|
44 | if (l && l.length > 0) { |
---|
45 | lst.options[lst.options.length] = new Option('', ''); |
---|
46 | |
---|
47 | tinymce.each(l, function(o) { |
---|
48 | lst.options[lst.options.length] = new Option(o[0], o[1]); |
---|
49 | }); |
---|
50 | } else |
---|
51 | dom.remove(dom.getParent(id, 'tr')); |
---|
52 | }, |
---|
53 | |
---|
54 | update : function() { |
---|
55 | var f = document.forms[0], nl = f.elements, ed = tinyMCEPopup.editor, args = {}, el; |
---|
56 | |
---|
57 | if (f.src.value === '') { |
---|
58 | ed.dom.remove(ed.selection.getNode()); |
---|
59 | ed.execCommand('mceRepaint'); |
---|
60 | tinyMCEPopup.close(); |
---|
61 | return; |
---|
62 | } |
---|
63 | |
---|
64 | if (!ed.settings.inline_styles) { |
---|
65 | args = tinymce.extend(args, { |
---|
66 | vspace : nl.vspace.value, |
---|
67 | hspace : nl.hspace.value, |
---|
68 | border : nl.border.value, |
---|
69 | align : getSelectValue(f, 'align') |
---|
70 | }); |
---|
71 | } else |
---|
72 | args.style = this.styleVal; |
---|
73 | |
---|
74 | tinymce.extend(args, { |
---|
75 | src : f.src.value, |
---|
76 | alt : f.alt.value, |
---|
77 | width : f.width.value, |
---|
78 | height : f.height.value |
---|
79 | }); |
---|
80 | |
---|
81 | el = ed.selection.getNode(); |
---|
82 | |
---|
83 | if (el && el.nodeName == 'IMG') { |
---|
84 | ed.dom.setAttribs(el, args); |
---|
85 | } else { |
---|
86 | ed.execCommand('mceInsertContent', false, '<img id="__mce_tmp" src="javascript:;" />'); |
---|
87 | ed.dom.setAttribs('__mce_tmp', args); |
---|
88 | ed.dom.setAttrib('__mce_tmp', 'id', ''); |
---|
89 | } |
---|
90 | |
---|
91 | tinyMCEPopup.close(); |
---|
92 | }, |
---|
93 | |
---|
94 | updateStyle : function() { |
---|
95 | var dom = tinyMCEPopup.dom, st, v, f = document.forms[0]; |
---|
96 | |
---|
97 | if (tinyMCEPopup.editor.settings.inline_styles) { |
---|
98 | st = tinyMCEPopup.dom.parseStyle(this.styleVal); |
---|
99 | |
---|
100 | // Handle align |
---|
101 | v = getSelectValue(f, 'align'); |
---|
102 | if (v) { |
---|
103 | if (v == 'left' || v == 'right') { |
---|
104 | st['float'] = v; |
---|
105 | delete st['vertical-align']; |
---|
106 | } else { |
---|
107 | st['vertical-align'] = v; |
---|
108 | delete st['float']; |
---|
109 | } |
---|
110 | } else { |
---|
111 | delete st['float']; |
---|
112 | delete st['vertical-align']; |
---|
113 | } |
---|
114 | |
---|
115 | // Handle border |
---|
116 | v = f.border.value; |
---|
117 | if (v || v == '0') { |
---|
118 | if (v == '0') |
---|
119 | st['border'] = '0'; |
---|
120 | else |
---|
121 | st['border'] = v + 'px solid black'; |
---|
122 | } else |
---|
123 | delete st['border']; |
---|
124 | |
---|
125 | // Handle hspace |
---|
126 | v = f.hspace.value; |
---|
127 | if (v) { |
---|
128 | delete st['margin']; |
---|
129 | st['margin-left'] = v + 'px'; |
---|
130 | st['margin-right'] = v + 'px'; |
---|
131 | } else { |
---|
132 | delete st['margin-left']; |
---|
133 | delete st['margin-right']; |
---|
134 | } |
---|
135 | |
---|
136 | // Handle vspace |
---|
137 | v = f.vspace.value; |
---|
138 | if (v) { |
---|
139 | delete st['margin']; |
---|
140 | st['margin-top'] = v + 'px'; |
---|
141 | st['margin-bottom'] = v + 'px'; |
---|
142 | } else { |
---|
143 | delete st['margin-top']; |
---|
144 | delete st['margin-bottom']; |
---|
145 | } |
---|
146 | |
---|
147 | // Merge |
---|
148 | st = tinyMCEPopup.dom.parseStyle(dom.serializeStyle(st)); |
---|
149 | this.styleVal = dom.serializeStyle(st); |
---|
150 | } |
---|
151 | }, |
---|
152 | |
---|
153 | getAttrib : function(e, at) { |
---|
154 | var ed = tinyMCEPopup.editor, dom = ed.dom, v, v2; |
---|
155 | |
---|
156 | if (ed.settings.inline_styles) { |
---|
157 | switch (at) { |
---|
158 | case 'align': |
---|
159 | if (v = dom.getStyle(e, 'float')) |
---|
160 | return v; |
---|
161 | |
---|
162 | if (v = dom.getStyle(e, 'vertical-align')) |
---|
163 | return v; |
---|
164 | |
---|
165 | break; |
---|
166 | |
---|
167 | case 'hspace': |
---|
168 | v = dom.getStyle(e, 'margin-left') |
---|
169 | v2 = dom.getStyle(e, 'margin-right'); |
---|
170 | if (v && v == v2) |
---|
171 | return parseInt(v.replace(/[^0-9]/g, '')); |
---|
172 | |
---|
173 | break; |
---|
174 | |
---|
175 | case 'vspace': |
---|
176 | v = dom.getStyle(e, 'margin-top') |
---|
177 | v2 = dom.getStyle(e, 'margin-bottom'); |
---|
178 | if (v && v == v2) |
---|
179 | return parseInt(v.replace(/[^0-9]/g, '')); |
---|
180 | |
---|
181 | break; |
---|
182 | |
---|
183 | case 'border': |
---|
184 | v = 0; |
---|
185 | |
---|
186 | tinymce.each(['top', 'right', 'bottom', 'left'], function(sv) { |
---|
187 | sv = dom.getStyle(e, 'border-' + sv + '-width'); |
---|
188 | |
---|
189 | // False or not the same as prev |
---|
190 | if (!sv || (sv != v && v !== 0)) { |
---|
191 | v = 0; |
---|
192 | return false; |
---|
193 | } |
---|
194 | |
---|
195 | if (sv) |
---|
196 | v = sv; |
---|
197 | }); |
---|
198 | |
---|
199 | if (v) |
---|
200 | return parseInt(v.replace(/[^0-9]/g, '')); |
---|
201 | |
---|
202 | break; |
---|
203 | } |
---|
204 | } |
---|
205 | |
---|
206 | if (v = dom.getAttrib(e, at)) |
---|
207 | return v; |
---|
208 | |
---|
209 | return ''; |
---|
210 | }, |
---|
211 | |
---|
212 | resetImageData : function() { |
---|
213 | var f = document.forms[0]; |
---|
214 | |
---|
215 | f.width.value = f.height.value = ""; |
---|
216 | }, |
---|
217 | |
---|
218 | updateImageData : function() { |
---|
219 | var f = document.forms[0], t = ImageDialog; |
---|
220 | |
---|
221 | if (f.width.value == "") |
---|
222 | f.width.value = t.preloadImg.width; |
---|
223 | |
---|
224 | if (f.height.value == "") |
---|
225 | f.height.value = t.preloadImg.height; |
---|
226 | }, |
---|
227 | |
---|
228 | getImageData : function() { |
---|
229 | var f = document.forms[0]; |
---|
230 | |
---|
231 | this.preloadImg = new Image(); |
---|
232 | this.preloadImg.onload = this.updateImageData; |
---|
233 | this.preloadImg.onerror = this.resetImageData; |
---|
234 | this.preloadImg.src = tinyMCEPopup.editor.documentBaseURI.toAbsolute(f.src.value); |
---|
235 | } |
---|
236 | }; |
---|
237 | |
---|
238 | ImageDialog.preInit(); |
---|
239 | tinyMCEPopup.onInit.add(ImageDialog.init, ImageDialog); |
---|