thomascube
2011-04-20 a9251be2f09fb5f18a85d201c67668c70980efe3
commit | author | age
d9344f 1 var ImageDialog = {
S 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         tinyMCEPopup.restoreSelection();
58
59         if (f.src.value === '') {
60             if (ed.selection.getNode().nodeName == 'IMG') {
61                 ed.dom.remove(ed.selection.getNode());
62                 ed.execCommand('mceRepaint');
63             }
64
65             tinyMCEPopup.close();
66             return;
67         }
68
69         if (!ed.settings.inline_styles) {
70             args = tinymce.extend(args, {
71                 vspace : nl.vspace.value,
72                 hspace : nl.hspace.value,
73                 border : nl.border.value,
74                 align : getSelectValue(f, 'align')
75             });
76         } else
77             args.style = this.styleVal;
78
79         tinymce.extend(args, {
a9251b 80             src : f.src.value.replace(/ /g, '%20'),
d9344f 81             alt : f.alt.value,
S 82             width : f.width.value,
83             height : f.height.value
84         });
85
86         el = ed.selection.getNode();
87
88         if (el && el.nodeName == 'IMG') {
89             ed.dom.setAttribs(el, args);
a9251b 90             tinyMCEPopup.editor.execCommand('mceRepaint');
T 91             tinyMCEPopup.editor.focus();
d9344f 92         } else {
18240a 93             ed.execCommand('mceInsertContent', false, '<img id="__mce_tmp" />', {skip_undo : 1});
d9344f 94             ed.dom.setAttribs('__mce_tmp', args);
S 95             ed.dom.setAttrib('__mce_tmp', 'id', '');
96             ed.undoManager.add();
97         }
98
99         tinyMCEPopup.close();
100     },
101
102     updateStyle : function() {
103         var dom = tinyMCEPopup.dom, st, v, f = document.forms[0];
104
105         if (tinyMCEPopup.editor.settings.inline_styles) {
106             st = tinyMCEPopup.dom.parseStyle(this.styleVal);
107
108             // Handle align
109             v = getSelectValue(f, 'align');
110             if (v) {
111                 if (v == 'left' || v == 'right') {
112                     st['float'] = v;
113                     delete st['vertical-align'];
114                 } else {
115                     st['vertical-align'] = v;
116                     delete st['float'];
117                 }
118             } else {
119                 delete st['float'];
120                 delete st['vertical-align'];
121             }
122
123             // Handle border
124             v = f.border.value;
125             if (v || v == '0') {
126                 if (v == '0')
127                     st['border'] = '0';
128                 else
129                     st['border'] = v + 'px solid black';
130             } else
131                 delete st['border'];
132
133             // Handle hspace
134             v = f.hspace.value;
135             if (v) {
136                 delete st['margin'];
137                 st['margin-left'] = v + 'px';
138                 st['margin-right'] = v + 'px';
139             } else {
140                 delete st['margin-left'];
141                 delete st['margin-right'];
142             }
143
144             // Handle vspace
145             v = f.vspace.value;
146             if (v) {
147                 delete st['margin'];
148                 st['margin-top'] = v + 'px';
149                 st['margin-bottom'] = v + 'px';
150             } else {
151                 delete st['margin-top'];
152                 delete st['margin-bottom'];
153             }
154
155             // Merge
69d05c 156             st = tinyMCEPopup.dom.parseStyle(dom.serializeStyle(st), 'img');
A 157             this.styleVal = dom.serializeStyle(st, 'img');
d9344f 158         }
S 159     },
160
161     getAttrib : function(e, at) {
162         var ed = tinyMCEPopup.editor, dom = ed.dom, v, v2;
163
164         if (ed.settings.inline_styles) {
165             switch (at) {
166                 case 'align':
167                     if (v = dom.getStyle(e, 'float'))
168                         return v;
169
170                     if (v = dom.getStyle(e, 'vertical-align'))
171                         return v;
172
173                     break;
174
175                 case 'hspace':
176                     v = dom.getStyle(e, 'margin-left')
177                     v2 = dom.getStyle(e, 'margin-right');
178                     if (v && v == v2)
179                         return parseInt(v.replace(/[^0-9]/g, ''));
180
181                     break;
182
183                 case 'vspace':
184                     v = dom.getStyle(e, 'margin-top')
185                     v2 = dom.getStyle(e, 'margin-bottom');
186                     if (v && v == v2)
187                         return parseInt(v.replace(/[^0-9]/g, ''));
188
189                     break;
190
191                 case 'border':
192                     v = 0;
193
194                     tinymce.each(['top', 'right', 'bottom', 'left'], function(sv) {
195                         sv = dom.getStyle(e, 'border-' + sv + '-width');
196
197                         // False or not the same as prev
198                         if (!sv || (sv != v && v !== 0)) {
199                             v = 0;
200                             return false;
201                         }
202
203                         if (sv)
204                             v = sv;
205                     });
206
207                     if (v)
208                         return parseInt(v.replace(/[^0-9]/g, ''));
209
210                     break;
211             }
212         }
213
214         if (v = dom.getAttrib(e, at))
215             return v;
216
217         return '';
218     },
219
220     resetImageData : function() {
221         var f = document.forms[0];
222
223         f.width.value = f.height.value = "";    
224     },
225
226     updateImageData : function() {
227         var f = document.forms[0], t = ImageDialog;
228
229         if (f.width.value == "")
230             f.width.value = t.preloadImg.width;
231
232         if (f.height.value == "")
233             f.height.value = t.preloadImg.height;
234     },
235
236     getImageData : function() {
237         var f = document.forms[0];
238
239         this.preloadImg = new Image();
240         this.preloadImg.onload = this.updateImageData;
241         this.preloadImg.onerror = this.resetImageData;
242         this.preloadImg.src = tinyMCEPopup.editor.documentBaseURI.toAbsolute(f.src.value);
243     }
244 };
245
246 ImageDialog.preInit();
247 tinyMCEPopup.onInit.add(ImageDialog.init, ImageDialog);