/pigeoncms/Plugins/tiny_mce/themes/advanced/js/image.js

http://pigeoncms.googlecode.com/ · JavaScript · 245 lines · 187 code · 51 blank · 7 comment · 52 complexity · 6b84a9a6983d2960c389176f77dfae78 MD5 · raw file

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