diff options
| author | hukl <contact@smyck.org> | 2009-02-17 21:54:39 +0100 |
|---|---|---|
| committer | hukl <contact@smyck.org> | 2009-02-17 21:54:39 +0100 |
| commit | f61b5b0597e0c25f084ee67d402f12a43a7a9947 (patch) | |
| tree | 3b4c3f9f38637f1a7ecf703ece4fd3bc4c6e2934 /public/javascripts/tiny_mce/plugins/advimage/js | |
| parent | 3d3b786cc43266f6292f5edd25733dbb9bd6ed06 (diff) | |
added tinymce editor for body area of pages
Diffstat (limited to 'public/javascripts/tiny_mce/plugins/advimage/js')
| -rwxr-xr-x | public/javascripts/tiny_mce/plugins/advimage/js/image.js | 441 |
1 files changed, 441 insertions, 0 deletions
diff --git a/public/javascripts/tiny_mce/plugins/advimage/js/image.js b/public/javascripts/tiny_mce/plugins/advimage/js/image.js new file mode 100755 index 0000000..64fc6f6 --- /dev/null +++ b/public/javascripts/tiny_mce/plugins/advimage/js/image.js | |||
| @@ -0,0 +1,441 @@ | |||
| 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(ed) { | ||
| 12 | var f = document.forms[0], nl = f.elements, ed = tinyMCEPopup.editor, dom = ed.dom, n = ed.selection.getNode(); | ||
| 13 | |||
| 14 | tinyMCEPopup.resizeToInnerSize(); | ||
| 15 | this.fillClassList('class_list'); | ||
| 16 | this.fillFileList('src_list', 'tinyMCEImageList'); | ||
| 17 | this.fillFileList('over_list', 'tinyMCEImageList'); | ||
| 18 | this.fillFileList('out_list', 'tinyMCEImageList'); | ||
| 19 | TinyMCE_EditableSelects.init(); | ||
| 20 | |||
| 21 | if (n.nodeName == 'IMG') { | ||
| 22 | nl.src.value = dom.getAttrib(n, 'src'); | ||
| 23 | nl.width.value = dom.getAttrib(n, 'width'); | ||
| 24 | nl.height.value = dom.getAttrib(n, 'height'); | ||
| 25 | nl.alt.value = dom.getAttrib(n, 'alt'); | ||
| 26 | nl.title.value = dom.getAttrib(n, 'title'); | ||
| 27 | nl.vspace.value = this.getAttrib(n, 'vspace'); | ||
| 28 | nl.hspace.value = this.getAttrib(n, 'hspace'); | ||
| 29 | nl.border.value = this.getAttrib(n, 'border'); | ||
| 30 | selectByValue(f, 'align', this.getAttrib(n, 'align')); | ||
| 31 | selectByValue(f, 'class_list', dom.getAttrib(n, 'class'), true, true); | ||
| 32 | nl.style.value = dom.getAttrib(n, 'style'); | ||
| 33 | nl.id.value = dom.getAttrib(n, 'id'); | ||
| 34 | nl.dir.value = dom.getAttrib(n, 'dir'); | ||
| 35 | nl.lang.value = dom.getAttrib(n, 'lang'); | ||
| 36 | nl.usemap.value = dom.getAttrib(n, 'usemap'); | ||
| 37 | nl.longdesc.value = dom.getAttrib(n, 'longdesc'); | ||
| 38 | nl.insert.value = ed.getLang('update'); | ||
| 39 | |||
| 40 | if (/^\s*this.src\s*=\s*\'([^\']+)\';?\s*$/.test(dom.getAttrib(n, 'onmouseover'))) | ||
| 41 | nl.onmouseoversrc.value = dom.getAttrib(n, 'onmouseover').replace(/^\s*this.src\s*=\s*\'([^\']+)\';?\s*$/, '$1'); | ||
| 42 | |||
| 43 | if (/^\s*this.src\s*=\s*\'([^\']+)\';?\s*$/.test(dom.getAttrib(n, 'onmouseout'))) | ||
| 44 | nl.onmouseoutsrc.value = dom.getAttrib(n, 'onmouseout').replace(/^\s*this.src\s*=\s*\'([^\']+)\';?\s*$/, '$1'); | ||
| 45 | |||
| 46 | if (ed.settings.inline_styles) { | ||
| 47 | // Move attribs to styles | ||
| 48 | if (dom.getAttrib(n, 'align')) | ||
| 49 | this.updateStyle('align'); | ||
| 50 | |||
| 51 | if (dom.getAttrib(n, 'hspace')) | ||
| 52 | this.updateStyle('hspace'); | ||
| 53 | |||
| 54 | if (dom.getAttrib(n, 'border')) | ||
| 55 | this.updateStyle('border'); | ||
| 56 | |||
| 57 | if (dom.getAttrib(n, 'vspace')) | ||
| 58 | this.updateStyle('vspace'); | ||
| 59 | } | ||
| 60 | } | ||
| 61 | |||
| 62 | // Setup browse button | ||
| 63 | document.getElementById('srcbrowsercontainer').innerHTML = getBrowserHTML('srcbrowser','src','image','theme_advanced_image'); | ||
| 64 | if (isVisible('srcbrowser')) | ||
| 65 | document.getElementById('src').style.width = '260px'; | ||
| 66 | |||
| 67 | // Setup browse button | ||
| 68 | document.getElementById('onmouseoversrccontainer').innerHTML = getBrowserHTML('overbrowser','onmouseoversrc','image','theme_advanced_image'); | ||
| 69 | if (isVisible('overbrowser')) | ||
| 70 | document.getElementById('onmouseoversrc').style.width = '260px'; | ||
| 71 | |||
| 72 | // Setup browse button | ||
| 73 | document.getElementById('onmouseoutsrccontainer').innerHTML = getBrowserHTML('outbrowser','onmouseoutsrc','image','theme_advanced_image'); | ||
| 74 | if (isVisible('outbrowser')) | ||
| 75 | document.getElementById('onmouseoutsrc').style.width = '260px'; | ||
| 76 | |||
| 77 | // If option enabled default contrain proportions to checked | ||
| 78 | if (ed.getParam("advimage_constrain_proportions", true)) | ||
| 79 | f.constrain.checked = true; | ||
| 80 | |||
| 81 | // Check swap image if valid data | ||
| 82 | if (nl.onmouseoversrc.value || nl.onmouseoutsrc.value) | ||
| 83 | this.setSwapImage(true); | ||
| 84 | else | ||
| 85 | this.setSwapImage(false); | ||
| 86 | |||
| 87 | this.changeAppearance(); | ||
| 88 | this.showPreviewImage(nl.src.value, 1); | ||
| 89 | }, | ||
| 90 | |||
| 91 | insert : function(file, title) { | ||
| 92 | var ed = tinyMCEPopup.editor, t = this, f = document.forms[0]; | ||
| 93 | |||
| 94 | if (f.src.value === '') { | ||
| 95 | if (ed.selection.getNode().nodeName == 'IMG') { | ||
| 96 | ed.dom.remove(ed.selection.getNode()); | ||
| 97 | ed.execCommand('mceRepaint'); | ||
| 98 | } | ||
| 99 | |||
| 100 | tinyMCEPopup.close(); | ||
| 101 | return; | ||
| 102 | } | ||
| 103 | |||
| 104 | if (tinyMCEPopup.getParam("accessibility_warnings", 1)) { | ||
| 105 | if (!f.alt.value) { | ||
| 106 | tinyMCEPopup.confirm(tinyMCEPopup.getLang('advimage_dlg.missing_alt'), function(s) { | ||
| 107 | if (s) | ||
| 108 | t.insertAndClose(); | ||
| 109 | }); | ||
| 110 | |||
| 111 | return; | ||
| 112 | } | ||
| 113 | } | ||
| 114 | |||
| 115 | t.insertAndClose(); | ||
| 116 | }, | ||
| 117 | |||
| 118 | insertAndClose : function() { | ||
| 119 | var ed = tinyMCEPopup.editor, f = document.forms[0], nl = f.elements, v, args = {}, el; | ||
| 120 | |||
| 121 | tinyMCEPopup.restoreSelection(); | ||
| 122 | |||
| 123 | // Fixes crash in Safari | ||
| 124 | if (tinymce.isWebKit) | ||
| 125 | ed.getWin().focus(); | ||
| 126 | |||
| 127 | if (!ed.settings.inline_styles) { | ||
| 128 | args = { | ||
| 129 | vspace : nl.vspace.value, | ||
| 130 | hspace : nl.hspace.value, | ||
| 131 | border : nl.border.value, | ||
| 132 | align : getSelectValue(f, 'align') | ||
| 133 | }; | ||
| 134 | } else { | ||
| 135 | // Remove deprecated values | ||
| 136 | args = { | ||
| 137 | vspace : '', | ||
| 138 | hspace : '', | ||
| 139 | border : '', | ||
| 140 | align : '' | ||
| 141 | }; | ||
| 142 | } | ||
| 143 | |||
| 144 | tinymce.extend(args, { | ||
| 145 | src : nl.src.value, | ||
| 146 | width : nl.width.value, | ||
| 147 | height : nl.height.value, | ||
| 148 | alt : nl.alt.value, | ||
| 149 | title : nl.title.value, | ||
| 150 | 'class' : getSelectValue(f, 'class_list'), | ||
| 151 | style : nl.style.value, | ||
| 152 | id : nl.id.value, | ||
| 153 | dir : nl.dir.value, | ||
| 154 | lang : nl.lang.value, | ||
| 155 | usemap : nl.usemap.value, | ||
| 156 | longdesc : nl.longdesc.value | ||
| 157 | }); | ||
| 158 | |||
| 159 | args.onmouseover = args.onmouseout = ''; | ||
| 160 | |||
| 161 | if (f.onmousemovecheck.checked) { | ||
| 162 | if (nl.onmouseoversrc.value) | ||
| 163 | args.onmouseover = "this.src='" + nl.onmouseoversrc.value + "';"; | ||
| 164 | |||
| 165 | if (nl.onmouseoutsrc.value) | ||
| 166 | args.onmouseout = "this.src='" + nl.onmouseoutsrc.value + "';"; | ||
| 167 | } | ||
| 168 | |||
| 169 | el = ed.selection.getNode(); | ||
| 170 | |||
| 171 | if (el && el.nodeName == 'IMG') { | ||
| 172 | ed.dom.setAttribs(el, args); | ||
| 173 | } else { | ||
| 174 | ed.execCommand('mceInsertContent', false, '<img id="__mce_tmp" />', {skip_undo : 1}); | ||
| 175 | ed.dom.setAttribs('__mce_tmp', args); | ||
| 176 | ed.dom.setAttrib('__mce_tmp', 'id', ''); | ||
| 177 | ed.undoManager.add(); | ||
| 178 | } | ||
| 179 | |||
| 180 | tinyMCEPopup.close(); | ||
| 181 | }, | ||
| 182 | |||
| 183 | getAttrib : function(e, at) { | ||
| 184 | var ed = tinyMCEPopup.editor, dom = ed.dom, v, v2; | ||
| 185 | |||
| 186 | if (ed.settings.inline_styles) { | ||
| 187 | switch (at) { | ||
| 188 | case 'align': | ||
| 189 | if (v = dom.getStyle(e, 'float')) | ||
| 190 | return v; | ||
| 191 | |||
| 192 | if (v = dom.getStyle(e, 'vertical-align')) | ||
| 193 | return v; | ||
| 194 | |||
| 195 | break; | ||
| 196 | |||
| 197 | case 'hspace': | ||
| 198 | v = dom.getStyle(e, 'margin-left') | ||
| 199 | v2 = dom.getStyle(e, 'margin-right'); | ||
| 200 | |||
| 201 | if (v && v == v2) | ||
| 202 | return parseInt(v.replace(/[^0-9]/g, '')); | ||
| 203 | |||
| 204 | break; | ||
| 205 | |||
| 206 | case 'vspace': | ||
| 207 | v = dom.getStyle(e, 'margin-top') | ||
| 208 | v2 = dom.getStyle(e, 'margin-bottom'); | ||
| 209 | if (v && v == v2) | ||
| 210 | return parseInt(v.replace(/[^0-9]/g, '')); | ||
| 211 | |||
| 212 | break; | ||
| 213 | |||
| 214 | case 'border': | ||
| 215 | v = 0; | ||
| 216 | |||
| 217 | tinymce.each(['top', 'right', 'bottom', 'left'], function(sv) { | ||
| 218 | sv = dom.getStyle(e, 'border-' + sv + '-width'); | ||
| 219 | |||
| 220 | // False or not the same as prev | ||
| 221 | if (!sv || (sv != v && v !== 0)) { | ||
| 222 | v = 0; | ||
| 223 | return false; | ||
| 224 | } | ||
| 225 | |||
| 226 | if (sv) | ||
| 227 | v = sv; | ||
| 228 | }); | ||
| 229 | |||
| 230 | if (v) | ||
| 231 | return parseInt(v.replace(/[^0-9]/g, '')); | ||
| 232 | |||
| 233 | break; | ||
| 234 | } | ||
| 235 | } | ||
| 236 | |||
| 237 | if (v = dom.getAttrib(e, at)) | ||
| 238 | return v; | ||
| 239 | |||
| 240 | return ''; | ||
| 241 | }, | ||
| 242 | |||
| 243 | setSwapImage : function(st) { | ||
| 244 | var f = document.forms[0]; | ||
| 245 | |||
| 246 | f.onmousemovecheck.checked = st; | ||
| 247 | setBrowserDisabled('overbrowser', !st); | ||
| 248 | setBrowserDisabled('outbrowser', !st); | ||
| 249 | |||
| 250 | if (f.over_list) | ||
| 251 | f.over_list.disabled = !st; | ||
| 252 | |||
| 253 | if (f.out_list) | ||
| 254 | f.out_list.disabled = !st; | ||
| 255 | |||
| 256 | f.onmouseoversrc.disabled = !st; | ||
| 257 | f.onmouseoutsrc.disabled = !st; | ||
| 258 | }, | ||
| 259 | |||
| 260 | fillClassList : function(id) { | ||
| 261 | var dom = tinyMCEPopup.dom, lst = dom.get(id), v, cl; | ||
| 262 | |||
| 263 | if (v = tinyMCEPopup.getParam('theme_advanced_styles')) { | ||
| 264 | cl = []; | ||
| 265 | |||
| 266 | tinymce.each(v.split(';'), function(v) { | ||
| 267 | var p = v.split('='); | ||
| 268 | |||
| 269 | cl.push({'title' : p[0], 'class' : p[1]}); | ||
| 270 | }); | ||
| 271 | } else | ||
| 272 | cl = tinyMCEPopup.editor.dom.getClasses(); | ||
| 273 | |||
| 274 | if (cl.length > 0) { | ||
| 275 | lst.options[lst.options.length] = new Option(tinyMCEPopup.getLang('not_set'), ''); | ||
| 276 | |||
| 277 | tinymce.each(cl, function(o) { | ||
| 278 | lst.options[lst.options.length] = new Option(o.title || o['class'], o['class']); | ||
| 279 | }); | ||
| 280 | } else | ||
| 281 | dom.remove(dom.getParent(id, 'tr')); | ||
| 282 | }, | ||
| 283 | |||
| 284 | fillFileList : function(id, l) { | ||
| 285 | var dom = tinyMCEPopup.dom, lst = dom.get(id), v, cl; | ||
| 286 | |||
| 287 | l = window[l]; | ||
| 288 | |||
| 289 | if (l && l.length > 0) { | ||
| 290 | lst.options[lst.options.length] = new Option('', ''); | ||
| 291 | |||
| 292 | tinymce.each(l, function(o) { | ||
| 293 | lst.options[lst.options.length] = new Option(o[0], o[1]); | ||
| 294 | }); | ||
| 295 | } else | ||
| 296 | dom.remove(dom.getParent(id, 'tr')); | ||
| 297 | }, | ||
| 298 | |||
| 299 | resetImageData : function() { | ||
| 300 | var f = document.forms[0]; | ||
| 301 | |||
| 302 | f.elements.width.value = f.elements.height.value = ''; | ||
| 303 | }, | ||
| 304 | |||
| 305 | updateImageData : function(img, st) { | ||
| 306 | var f = document.forms[0]; | ||
| 307 | |||
| 308 | if (!st) { | ||
| 309 | f.elements.width.value = img.width; | ||
| 310 | f.elements.height.value = img.height; | ||
| 311 | } | ||
| 312 | |||
| 313 | this.preloadImg = img; | ||
| 314 | }, | ||
| 315 | |||
| 316 | changeAppearance : function() { | ||
| 317 | var ed = tinyMCEPopup.editor, f = document.forms[0], img = document.getElementById('alignSampleImg'); | ||
| 318 | |||
| 319 | if (img) { | ||
| 320 | if (ed.getParam('inline_styles')) { | ||
| 321 | ed.dom.setAttrib(img, 'style', f.style.value); | ||
| 322 | } else { | ||
| 323 | img.align = f.align.value; | ||
| 324 | img.border = f.border.value; | ||
| 325 | img.hspace = f.hspace.value; | ||
| 326 | img.vspace = f.vspace.value; | ||
| 327 | } | ||
| 328 | } | ||
| 329 | }, | ||
| 330 | |||
| 331 | changeHeight : function() { | ||
| 332 | var f = document.forms[0], tp, t = this; | ||
| 333 | |||
| 334 | if (!f.constrain.checked || !t.preloadImg) { | ||
| 335 | return; | ||
| 336 | } | ||
| 337 | |||
| 338 | if (f.width.value == "" || f.height.value == "") | ||
| 339 | return; | ||
| 340 | |||
| 341 | tp = (parseInt(f.width.value) / parseInt(t.preloadImg.width)) * t.preloadImg.height; | ||
| 342 | f.height.value = tp.toFixed(0); | ||
| 343 | }, | ||
| 344 | |||
| 345 | changeWidth : function() { | ||
| 346 | var f = document.forms[0], tp, t = this; | ||
| 347 | |||
| 348 | if (!f.constrain.checked || !t.preloadImg) { | ||
| 349 | return; | ||
| 350 | } | ||
| 351 | |||
| 352 | if (f.width.value == "" || f.height.value == "") | ||
| 353 | return; | ||
| 354 | |||
| 355 | tp = (parseInt(f.height.value) / parseInt(t.preloadImg.height)) * t.preloadImg.width; | ||
| 356 | f.width.value = tp.toFixed(0); | ||
| 357 | }, | ||
| 358 | |||
| 359 | updateStyle : function(ty) { | ||
| 360 | var dom = tinyMCEPopup.dom, st, v, f = document.forms[0], img = dom.create('img', {style : dom.get('style').value}); | ||
| 361 | |||
| 362 | if (tinyMCEPopup.editor.settings.inline_styles) { | ||
| 363 | // Handle align | ||
| 364 | if (ty == 'align') { | ||
| 365 | dom.setStyle(img, 'float', ''); | ||
| 366 | dom.setStyle(img, 'vertical-align', ''); | ||
| 367 | |||
| 368 | v = getSelectValue(f, 'align'); | ||
| 369 | if (v) { | ||
| 370 | if (v == 'left' || v == 'right') | ||
| 371 | dom.setStyle(img, 'float', v); | ||
| 372 | else | ||
| 373 | img.style.verticalAlign = v; | ||
| 374 | } | ||
| 375 | } | ||
| 376 | |||
| 377 | // Handle border | ||
| 378 | if (ty == 'border') { | ||
| 379 | dom.setStyle(img, 'border', ''); | ||
| 380 | |||
| 381 | v = f.border.value; | ||
| 382 | if (v || v == '0') { | ||
| 383 | if (v == '0') | ||
| 384 | img.style.border = '0'; | ||
| 385 | else | ||
| 386 | img.style.border = v + 'px solid black'; | ||
| 387 | } | ||
| 388 | } | ||
| 389 | |||
| 390 | // Handle hspace | ||
| 391 | if (ty == 'hspace') { | ||
| 392 | dom.setStyle(img, 'marginLeft', ''); | ||
| 393 | dom.setStyle(img, 'marginRight', ''); | ||
| 394 | |||
| 395 | v = f.hspace.value; | ||
| 396 | if (v) { | ||
| 397 | img.style.marginLeft = v + 'px'; | ||
| 398 | img.style.marginRight = v + 'px'; | ||
| 399 | } | ||
| 400 | } | ||
| 401 | |||
| 402 | // Handle vspace | ||
| 403 | if (ty == 'vspace') { | ||
| 404 | dom.setStyle(img, 'marginTop', ''); | ||
| 405 | dom.setStyle(img, 'marginBottom', ''); | ||
| 406 | |||
| 407 | v = f.vspace.value; | ||
| 408 | if (v) { | ||
| 409 | img.style.marginTop = v + 'px'; | ||
| 410 | img.style.marginBottom = v + 'px'; | ||
| 411 | } | ||
| 412 | } | ||
| 413 | |||
| 414 | // Merge | ||
| 415 | dom.get('style').value = dom.serializeStyle(dom.parseStyle(img.style.cssText)); | ||
| 416 | } | ||
| 417 | }, | ||
| 418 | |||
| 419 | changeMouseMove : function() { | ||
| 420 | }, | ||
| 421 | |||
| 422 | showPreviewImage : function(u, st) { | ||
| 423 | if (!u) { | ||
| 424 | tinyMCEPopup.dom.setHTML('prev', ''); | ||
| 425 | return; | ||
| 426 | } | ||
| 427 | |||
| 428 | if (!st && tinyMCEPopup.getParam("advimage_update_dimensions_onchange", true)) | ||
| 429 | this.resetImageData(); | ||
| 430 | |||
| 431 | u = tinyMCEPopup.editor.documentBaseURI.toAbsolute(u); | ||
| 432 | |||
| 433 | if (!st) | ||
| 434 | tinyMCEPopup.dom.setHTML('prev', '<img id="previewImg" src="' + u + '" border="0" onload="ImageDialog.updateImageData(this);" onerror="ImageDialog.resetImageData();" />'); | ||
| 435 | else | ||
| 436 | tinyMCEPopup.dom.setHTML('prev', '<img id="previewImg" src="' + u + '" border="0" onload="ImageDialog.updateImageData(this, 1);" />'); | ||
| 437 | } | ||
| 438 | }; | ||
| 439 | |||
| 440 | ImageDialog.preInit(); | ||
| 441 | tinyMCEPopup.onInit.add(ImageDialog.init, ImageDialog); | ||
