source: trunk/www.guidonia.net/wp/wp-includes/js/tinymce/plugins/wpeditimage/js/editimage.js@ 44

Last change on this file since 44 was 44, checked in by luciano, 14 years ago
File size: 16.4 KB
Line 
1
2var tinymce = null, tinyMCEPopup, tinyMCE;
3
4tinyMCEPopup = {
5 init: function() {
6 var t = this, w, ti, li, q, i, it;
7
8 li = ('' + document.location.search).replace(/^\?/, '').split('&');
9 q = {};
10 for (i=0; i<li.length; i++) {
11 it = li[i].split('=');
12 q[unescape(it[0])] = unescape(it[1]);
13 }
14
15 if (q.mce_rdomain)
16 document.domain = q.mce_rdomain;
17
18 // Find window & API
19 w = t.getWin();
20 tinymce = w.tinymce;
21 tinyMCE = w.tinyMCE;
22 t.editor = tinymce.EditorManager.activeEditor;
23 t.params = t.editor.windowManager.params;
24
25 // Setup local DOM
26 t.dom = t.editor.windowManager.createInstance('tinymce.dom.DOMUtils', document);
27 t.editor.windowManager.onOpen.dispatch(t.editor.windowManager, window);
28 },
29
30 getWin : function() {
31 return window.dialogArguments || opener || parent || top;
32 },
33
34 getParam : function(n, dv) {
35 return this.editor.getParam(n, dv);
36 },
37
38 close : function() {
39 var t = this, win = t.getWin();
40
41 // To avoid domain relaxing issue in Opera
42 function close() {
43 win.tb_remove();
44 tinymce = tinyMCE = t.editor = t.dom = t.dom.doc = null; // Cleanup
45 };
46
47 if (tinymce.isOpera)
48 win.setTimeout(close, 0);
49 else
50 close();
51 },
52
53 execCommand : function(cmd, ui, val, a) {
54 a = a || {};
55 a.skip_focus = 1;
56
57 this.restoreSelection();
58 return this.editor.execCommand(cmd, ui, val, a);
59 },
60
61 storeSelection : function() {
62 this.editor.windowManager.bookmark = tinyMCEPopup.editor.selection.getBookmark('simple');
63 },
64
65 restoreSelection : function() {
66 var t = tinyMCEPopup;
67
68 if (tinymce.isIE)
69 t.editor.selection.moveToBookmark(t.editor.windowManager.bookmark);
70 }
71}
72tinyMCEPopup.init();
73
74var wpImage = {
75 preInit : function() {
76 // import colors stylesheet from parent
77 var win = tinyMCEPopup.getWin();
78 var styles = win.document.styleSheets;
79
80 for ( i = 0; i < styles.length; i++ ) {
81 var url = styles.item(i).href;
82 if ( url && url.indexOf('colors') != -1 )
83 document.write( '<link rel="stylesheet" href="'+url+'" type="text/css" media="all" />' );
84 }
85 },
86
87 I : function(e) {
88 return document.getElementById(e);
89 },
90
91 current : '',
92 link : '',
93 link_rel : '',
94 target_value : '',
95 current_size_sel : 's100',
96 width : '',
97 height : '',
98 align : '',
99 img_alt : '',
100
101 setTabs : function(tab) {
102 var t = this;
103
104 if ( 'current' == tab.className ) return false;
105 t.I('div_advanced').style.display = ( 'tab_advanced' == tab.id ) ? 'block' : 'none';
106 t.I('div_basic').style.display = ( 'tab_basic' == tab.id ) ? 'block' : 'none';
107 t.I('tab_basic').className = t.I('tab_advanced').className = '';
108 tab.className = 'current';
109 return false;
110 },
111
112 img_seturl : function(u) {
113 var t = this, rel = t.I('link_rel').value;
114
115 if ( 'current' == u ) {
116 t.I('link_href').value = t.current;
117 t.I('link_rel').value = t.link_rel;
118 } else {
119 t.I('link_href').value = t.link;
120 if ( rel ) {
121 rel = rel.replace( /attachment|wp-att-[0-9]+/gi, '' );
122 t.I('link_rel').value = tinymce.trim(rel);
123 }
124 }
125 },
126
127 imgAlignCls : function(v) {
128 var t = this, cls = t.I('img_classes').value;
129
130 t.I('img_demo').className = t.align = v;
131
132 cls = cls.replace( /align[^ "']+/gi, '' );
133 cls += (' ' + v);
134 cls = cls.replace( /\s+/g, ' ' ).replace( /^\s/, '' );
135
136 if ( 'aligncenter' == v ) {
137 t.I('hspace').value = '';
138 t.updateStyle('hspace');
139 }
140
141 t.I('img_classes').value = cls;
142 },
143
144 showSize : function(el) {
145 var t = this, demo = t.I('img_demo'), w = t.width, h = t.height, id = el.id || 's100', size;
146
147 size = parseInt(id.substring(1)) / 200;
148 demo.width = Math.round(w * size);
149 demo.height = Math.round(h * size);
150
151 t.showSizeClear();
152 el.style.borderColor = '#A3A3A3';
153 el.style.backgroundColor = '#E5E5E5';
154 },
155
156 showSizeSet : function() {
157 var t = this;
158
159 if ( (t.width * 1.3) > parseInt(t.preloadImg.width) ) {
160 var s130 = t.I('s130'), s120 = t.I('s120'), s110 = t.I('s110');
161
162 s130.onclick = s120.onclick = s110.onclick = null;
163 s130.onmouseover = s120.onmouseover = s110.onmouseover = null;
164 s130.style.color = s120.style.color = s110.style.color = '#aaa';
165 }
166 },
167
168 showSizeRem : function() {
169 var t = this, demo = t.I('img_demo'), f = document.forms[0];
170
171 demo.width = Math.round(f.width.value * 0.5);
172 demo.height = Math.round(f.height.value * 0.5);
173 t.showSizeClear();
174 t.I(t.current_size_sel).style.borderColor = '#A3A3A3';
175 t.I(t.current_size_sel).style.backgroundColor = '#E5E5E5';
176
177 return false;
178 },
179
180 showSizeClear : function() {
181 var divs = this.I('img_size').getElementsByTagName('div');
182
183 for ( i = 0; i < divs.length; i++ ) {
184 divs[i].style.borderColor = '#f1f1f1';
185 divs[i].style.backgroundColor = '#f1f1f1';
186 }
187 },
188
189 imgEditSize : function(el) {
190 var t = this, f = document.forms[0];
191
192 if ( ! t.preloadImg || ! t.preloadImg.width || ! t.preloadImg.height ) return;
193 var W = parseInt(t.preloadImg.width), H = parseInt(t.preloadImg.height), w = t.width || W, h = t.height || H, id = el.id || 's100';
194
195 size = parseInt(id.substring(1)) / 100;
196
197 w = Math.round(w * size);
198 h = Math.round(h * size);
199
200 f.width.value = Math.min(W, w);
201 f.height.value = Math.min(H, h);
202
203 t.current_size_sel = id;
204 t.demoSetSize();
205 },
206
207 demoSetSize : function(img) {
208 var demo = this.I('img_demo'), f = document.forms[0];
209
210 demo.width = f.width.value ? Math.round(f.width.value * 0.5) : '';
211 demo.height = f.height.value ? Math.round(f.height.value * 0.5) : '';
212 },
213
214 demoSetStyle : function() {
215 var f = document.forms[0], demo = this.I('img_demo'), dom = tinyMCEPopup.editor.dom;
216
217 if (demo) {
218 dom.setAttrib(demo, 'style', f.img_style.value);
219 dom.setStyle(demo, 'width', '');
220 dom.setStyle(demo, 'height', '');
221 }
222 },
223
224 origSize : function() {
225 var t = this, f = document.forms[0], el = t.I('s100');
226
227 f.width.value = t.width = t.preloadImg.width;
228 f.height.value = t.height = t.preloadImg.height;
229 t.showSizeSet();
230 t.demoSetSize();
231 t.showSize(el);
232 },
233
234 init : function() {
235 var ed = tinyMCEPopup.editor, h;
236
237 h = document.body.innerHTML;
238
239 // Replace a=x with a="x" in IE
240 if (tinymce.isIE)
241 h = h.replace(/ (value|title|alt)=([^"][^\s>]+)/gi, ' $1="$2"')
242
243 document.body.innerHTML = ed.translate(h);
244 window.setTimeout( function(){wpImage.setup();}, 100 );
245 },
246
247 setup : function() {
248 var t = this, h, c, el, id, link, fname, f = document.forms[0], ed = tinyMCEPopup.editor, d = t.I('img_demo'), dom = tinyMCEPopup.dom, DL, caption = '';
249 document.dir = tinyMCEPopup.editor.getParam('directionality','');
250
251 if ( tinyMCEPopup.editor.getParam('wpeditimage_disable_captions', false) )
252 t.I('cap_field').style.display = 'none';
253
254 tinyMCEPopup.restoreSelection();
255 el = ed.selection.getNode();
256 if (el.nodeName != 'IMG') return;
257
258 f.img_src.value = d.src = link = ed.dom.getAttrib(el, 'src');
259 ed.dom.setStyle(el, 'float', '');
260 t.getImageData();
261 c = ed.dom.getAttrib(el, 'class');
262
263 if ( DL = dom.getParent(el, 'dl') ) {
264 var dlc = ed.dom.getAttrib(DL, 'class');
265 dlc = dlc.match(/align[^ "']+/i);
266 if ( dlc && ! dom.hasClass(el, dlc) ) {
267 c += ' '+dlc;
268 tinymce.trim(c);
269 }
270
271 tinymce.each(DL.childNodes, function(e) {
272 if ( e.nodeName == 'DD' && dom.hasClass(e, 'wp-caption-dd') ) {
273 caption = e.innerHTML;
274 return;
275 }
276 });
277 }
278
279 f.img_cap.value = caption;
280 f.img_title.value = ed.dom.getAttrib(el, 'title');
281 f.img_alt.value = ed.dom.getAttrib(el, 'alt');
282 f.border.value = ed.dom.getAttrib(el, 'border');
283 f.vspace.value = ed.dom.getAttrib(el, 'vspace');
284 f.hspace.value = ed.dom.getAttrib(el, 'hspace');
285 f.align.value = ed.dom.getAttrib(el, 'align');
286 f.width.value = t.width = ed.dom.getAttrib(el, 'width');
287 f.height.value = t.height = ed.dom.getAttrib(el, 'height');
288 f.img_classes.value = c;
289 f.img_style.value = ed.dom.getAttrib(el, 'style');
290
291 // Move attribs to styles
292 if (dom.getAttrib(el, 'hspace'))
293 t.updateStyle('hspace');
294
295 if (dom.getAttrib(el, 'border'))
296 t.updateStyle('border');
297
298 if (dom.getAttrib(el, 'vspace'))
299 t.updateStyle('vspace');
300
301 if (pa = ed.dom.getParent(el, 'A')) {
302 f.link_href.value = t.current = ed.dom.getAttrib(pa, 'href');
303 f.link_title.value = ed.dom.getAttrib(pa, 'title');
304 f.link_rel.value = t.link_rel = ed.dom.getAttrib(pa, 'rel');
305 f.link_style.value = ed.dom.getAttrib(pa, 'style');
306 t.target_value = ed.dom.getAttrib(pa, 'target');
307 f.link_classes.value = ed.dom.getAttrib(pa, 'class');
308 }
309
310 f.link_target.checked = ( t.target_value && t.target_value == '_blank' ) ? 'checked' : '';
311
312 fname = link.substring( link.lastIndexOf('/') );
313 fname = fname.replace(/-[0-9]{2,4}x[0-9]{2,4}/, '' );
314 t.link = link.substring( 0, link.lastIndexOf('/') ) + fname;
315
316 if ( c.indexOf('alignleft') != -1 ) {
317 t.I('alignleft').checked = "checked";
318 d.className = t.align = "alignleft";
319 } else if ( c.indexOf('aligncenter') != -1 ) {
320 t.I('aligncenter').checked = "checked";
321 d.className = t.align = "aligncenter";
322 } else if ( c.indexOf('alignright') != -1 ) {
323 t.I('alignright').checked = "checked";
324 d.className = t.align = "alignright";
325 } else if ( c.indexOf('alignnone') != -1 ) {
326 t.I('alignnone').checked = "checked";
327 d.className = t.align = "alignnone";
328 }
329
330 if ( t.width && t.preloadImg.width ) t.showSizeSet();
331 document.body.style.display = '';
332 },
333
334 remove : function() {
335 var ed = tinyMCEPopup.editor, p, el;
336
337 tinyMCEPopup.restoreSelection();
338 el = ed.selection.getNode();
339 if (el.nodeName != 'IMG') return;
340
341 if ( (p = ed.dom.getParent(el, 'div')) && ed.dom.hasClass(p, 'mceTemp') )
342 ed.dom.remove(p);
343 else if ( (p = ed.dom.getParent(el, 'A')) && p.childNodes.length == 1 )
344 ed.dom.remove(p);
345 else ed.dom.remove(el);
346
347 ed.execCommand('mceRepaint');
348 tinyMCEPopup.close();
349 return;
350 },
351
352 update : function() {
353 var t = this, f = document.forms[0], ed = tinyMCEPopup.editor, el, b, fixSafari = null, DL, P, A, DIV, do_caption = null, img_class = f.img_classes.value, html;
354
355 tinyMCEPopup.restoreSelection();
356 el = ed.selection.getNode();
357
358 if (el.nodeName != 'IMG') return;
359 if (f.img_src.value === '') {
360 t.remove();
361 return;
362 }
363
364 if ( f.img_cap.value != '' && f.width.value != '' ) {
365 do_caption = 1;
366 img_class = img_class.replace( /align[^ "']+\s?/gi, '' );
367 }
368
369 A = ed.dom.getParent(el, 'a');
370 P = ed.dom.getParent(el, 'p');
371 DL = ed.dom.getParent(el, 'dl');
372 DIV = ed.dom.getParent(el, 'div');
373
374 tinyMCEPopup.execCommand("mceBeginUndoLevel");
375
376 ed.dom.setAttribs(el, {
377 src : f.img_src.value,
378 title : f.img_title.value,
379 alt : f.img_alt.value,
380 width : f.width.value,
381 height : f.height.value,
382 style : f.img_style.value,
383 'class' : img_class
384 });
385
386 if ( f.link_href.value ) {
387 // Create new anchor elements
388 if ( A == null ) {
389 if ( ! f.link_href.value.match(/https?:\/\//i) )
390 f.link_href.value = tinyMCEPopup.editor.documentBaseURI.toAbsolute(f.link_href.value);
391
392 if ( tinymce.isWebKit && ed.dom.hasClass(el, 'aligncenter') ) {
393 ed.dom.removeClass(el, 'aligncenter');
394 fixSafari = 1;
395 }
396
397 tinyMCEPopup.execCommand("CreateLink", false, "#mce_temp_url#", {skip_undo : 1});
398 if ( fixSafari ) ed.dom.addClass(el, 'aligncenter');
399
400 tinymce.each(ed.dom.select("a"), function(n) {
401 if (ed.dom.getAttrib(n, 'href') == '#mce_temp_url#') {
402
403 ed.dom.setAttribs(n, {
404 href : f.link_href.value,
405 title : f.link_title.value,
406 rel : f.link_rel.value,
407 target : (f.link_target.checked == true) ? '_blank' : '',
408 'class' : f.link_classes.value,
409 style : f.link_style.value
410 });
411 }
412 });
413 } else {
414 ed.dom.setAttribs(A, {
415 href : f.link_href.value,
416 title : f.link_title.value,
417 rel : f.link_rel.value,
418 target : (f.link_target.checked == true) ? '_blank' : '',
419 'class' : f.link_classes.value,
420 style : f.link_style.value
421 });
422 }
423 }
424
425 if ( do_caption ) {
426 var id, cap_id = '', cap, DT, DD, cap_width = 10 + parseInt(f.width.value), align = t.align.substring(5), div_cls = (t.align == 'aligncenter') ? 'mceTemp mceIEcenter' : 'mceTemp';
427
428 if ( DL ) {
429 ed.dom.setAttribs(DL, {
430 'class' : 'wp-caption '+t.align,
431 style : 'width: '+cap_width+'px;'
432 });
433
434 if ( DIV )
435 ed.dom.setAttrib(DIV, 'class', div_cls);
436
437 if ( (DT = ed.dom.getParent(el, 'dt')) && (DD = DT.nextSibling) && ed.dom.hasClass(DD, 'wp-caption-dd') )
438 ed.dom.setHTML(DD, f.img_cap.value);
439
440 } else {
441 var lnk = '', pa;
442 if ( (id = f.img_classes.value.match( /wp-image-([0-9]{1,6})/ )) && id[1] )
443 cap_id = 'attachment_'+id[1];
444
445 if ( f.link_href.value && (lnk = ed.dom.getParent(el, 'a')) ) {
446 if ( lnk.childNodes.length == 1 )
447 html = ed.dom.getOuterHTML(lnk);
448 else {
449 html = ed.dom.getOuterHTML(lnk);
450 html = html.match(/<a[^>]+>/i);
451 html = html+ed.dom.getOuterHTML(el)+'</a>';
452 }
453 } else html = ed.dom.getOuterHTML(el);
454
455 html = '<dl id="'+cap_id+'" class="wp-caption '+t.align+'" style="width: '+cap_width+
456 'px"><dt class="wp-caption-dt">'+html+'</dt><dd class="wp-caption-dd">'+f.img_cap.value+'</dd></dl>';
457
458 cap = ed.dom.create('div', {'class': div_cls}, html);
459
460 if ( P ) {
461 P.parentNode.insertBefore(cap, P);
462 if ( P.childNodes.length == 1 )
463 ed.dom.remove(P);
464 else if ( lnk && lnk.childNodes.length == 1 )
465 ed.dom.remove(lnk);
466 else ed.dom.remove(el);
467 } else if ( pa = ed.dom.getParent(el, 'TD,TH,LI') ) {
468 pa.appendChild(cap);
469 if ( lnk && lnk.childNodes.length == 1 )
470 ed.dom.remove(lnk);
471 else ed.dom.remove(el);
472 }
473 }
474
475 } else {
476 if ( DL && DIV ) {
477 var aa;
478 if ( f.link_href.value && (aa = ed.dom.getParent(el, 'a')) ) html = ed.dom.getOuterHTML(aa);
479 else html = ed.dom.getOuterHTML(el);
480
481 P = ed.dom.create('p', {}, html);
482 DIV.parentNode.insertBefore(P, DIV);
483 ed.dom.remove(DIV);
484 }
485 }
486
487 if ( f.img_classes.value.indexOf('aligncenter') != -1 ) {
488 if ( P && ( ! P.style || P.style.textAlign != 'center' ) )
489 ed.dom.setStyle(P, 'textAlign', 'center');
490 } else {
491 if ( P && P.style && P.style.textAlign == 'center' )
492 ed.dom.setStyle(P, 'textAlign', '');
493 }
494
495 if ( ! f.link_href.value && A ) {
496 b = ed.selection.getBookmark();
497 ed.dom.remove(A, 1);
498 ed.selection.moveToBookmark(b);
499 }
500
501 tinyMCEPopup.execCommand("mceEndUndoLevel");
502 ed.execCommand('mceRepaint');
503 tinyMCEPopup.close();
504 },
505
506 updateStyle : function(ty) {
507 var dom = tinyMCEPopup.dom, st, v, f = document.forms[0], img = dom.create('img', {style : f.img_style.value});
508
509 if (tinyMCEPopup.editor.settings.inline_styles) {
510 // Handle align
511 if (ty == 'align') {
512 dom.setStyle(img, 'float', '');
513 dom.setStyle(img, 'vertical-align', '');
514
515 v = f.align.value;
516 if (v) {
517 if (v == 'left' || v == 'right')
518 dom.setStyle(img, 'float', v);
519 else
520 img.style.verticalAlign = v;
521 }
522 }
523
524 // Handle border
525 if (ty == 'border') {
526 dom.setStyle(img, 'border', '');
527
528 v = f.border.value;
529 if (v || v == '0') {
530 if (v == '0')
531 img.style.border = '0';
532 else
533 img.style.border = v + 'px solid black';
534 }
535 }
536
537 // Handle hspace
538 if (ty == 'hspace') {
539 dom.setStyle(img, 'marginLeft', '');
540 dom.setStyle(img, 'marginRight', '');
541
542 v = f.hspace.value;
543 if (v) {
544 img.style.marginLeft = v + 'px';
545 img.style.marginRight = v + 'px';
546 }
547 }
548
549 // Handle vspace
550 if (ty == 'vspace') {
551 dom.setStyle(img, 'marginTop', '');
552 dom.setStyle(img, 'marginBottom', '');
553
554 v = f.vspace.value;
555 if (v) {
556 img.style.marginTop = v + 'px';
557 img.style.marginBottom = v + 'px';
558 }
559 }
560
561 // Merge
562 f.img_style.value = dom.serializeStyle(dom.parseStyle(img.style.cssText));
563 this.demoSetStyle();
564 }
565 },
566
567 checkVal : function(f) {
568
569 if ( f.value == '' ) {
570 // if ( f.id == 'width' ) f.value = this.width || this.preloadImg.width;
571 // if ( f.id == 'height' ) f.value = this.height || this.preloadImg.height;
572 if ( f.id == 'img_src' ) f.value = this.I('img_demo').src || this.preloadImg.src;
573 }
574 },
575
576 resetImageData : function() {
577 var f = document.forms[0];
578
579 f.width.value = f.height.value = '';
580 },
581
582 updateImageData : function() {
583 var f = document.forms[0], t = wpImage;
584
585 if ( f.width.value == '' || f.height.value == '' ) {
586 f.width.value = t.width = t.preloadImg.width;
587 f.height.value = t.height = t.preloadImg.height;
588 }
589
590 t.showSizeSet();
591 t.demoSetSize();
592 if ( f.img_style.value )
593 t.demoSetStyle();
594 },
595
596 getImageData : function() {
597 var t = wpImage, f = document.forms[0];
598
599 t.preloadImg = new Image();
600 t.preloadImg.onload = t.updateImageData;
601 t.preloadImg.onerror = t.resetImageData;
602 t.preloadImg.src = tinyMCEPopup.editor.documentBaseURI.toAbsolute(f.img_src.value);
603 }
604};
605
606window.onload = function(){wpImage.init();}
607wpImage.preInit();
Note: See TracBrowser for help on using the repository browser.