thomascube
2011-04-20 a9251be2f09fb5f18a85d201c67668c70980efe3
commit | author | age
d9344f 1 tinyMCEPopup.requireLangPack();
S 2
3 var action, orgTableWidth, orgTableHeight, dom = tinyMCEPopup.editor.dom;
a0109c 4
S 5 function insertTable() {
6     var formObj = document.forms[0];
d9344f 7     var inst = tinyMCEPopup.editor, dom = inst.dom;
S 8     var cols = 2, rows = 2, border = 0, cellpadding = -1, cellspacing = -1, align, width, height, className, caption, frame, rules;
9     var html = '', capEl, elm;
a0109c 10     var cellLimit, rowLimit, colLimit;
S 11
d9344f 12     tinyMCEPopup.restoreSelection();
S 13
f0ea59 14     if (!AutoValidator.validate(formObj)) {
a9251b 15         tinyMCEPopup.alert(AutoValidator.getErrorMessages(formObj).join('. ') + '.');
f0ea59 16         return false;
S 17     }
18
d9344f 19     elm = dom.getParent(inst.selection.getNode(), 'table');
a0109c 20
S 21     // Get form data
22     cols = formObj.elements['cols'].value;
23     rows = formObj.elements['rows'].value;
a9251b 24     border = formObj.elements['border'].value != "" ? formObj.elements['border'].value : 0;
a0109c 25     cellpadding = formObj.elements['cellpadding'].value != "" ? formObj.elements['cellpadding'].value : "";
S 26     cellspacing = formObj.elements['cellspacing'].value != "" ? formObj.elements['cellspacing'].value : "";
58fb65 27     align = getSelectValue(formObj, "align");
A 28     frame = getSelectValue(formObj, "tframe");
29     rules = getSelectValue(formObj, "rules");
a0109c 30     width = formObj.elements['width'].value;
S 31     height = formObj.elements['height'].value;
32     bordercolor = formObj.elements['bordercolor'].value;
33     bgcolor = formObj.elements['bgcolor'].value;
58fb65 34     className = getSelectValue(formObj, "class");
a0109c 35     id = formObj.elements['id'].value;
S 36     summary = formObj.elements['summary'].value;
37     style = formObj.elements['style'].value;
38     dir = formObj.elements['dir'].value;
39     lang = formObj.elements['lang'].value;
40     background = formObj.elements['backgroundimage'].value;
87e2fd 41     caption = formObj.elements['caption'].checked;
a0109c 42
d9344f 43     cellLimit = tinyMCEPopup.getParam('table_cell_limit', false);
S 44     rowLimit = tinyMCEPopup.getParam('table_row_limit', false);
45     colLimit = tinyMCEPopup.getParam('table_col_limit', false);
a0109c 46
S 47     // Validate table size
48     if (colLimit && cols > colLimit) {
29da64 49         tinyMCEPopup.alert(inst.getLang('table_dlg.col_limit').replace(/\{\$cols\}/g, colLimit));
a0109c 50         return false;
S 51     } else if (rowLimit && rows > rowLimit) {
29da64 52         tinyMCEPopup.alert(inst.getLang('table_dlg.row_limit').replace(/\{\$rows\}/g, rowLimit));
a0109c 53         return false;
S 54     } else if (cellLimit && cols * rows > cellLimit) {
29da64 55         tinyMCEPopup.alert(inst.getLang('table_dlg.cell_limit').replace(/\{\$cells\}/g, cellLimit));
a0109c 56         return false;
S 57     }
58
59     // Update table
60     if (action == "update") {
d9344f 61         dom.setAttrib(elm, 'cellPadding', cellpadding, true);
S 62         dom.setAttrib(elm, 'cellSpacing', cellspacing, true);
63         dom.setAttrib(elm, 'border', border);
64         dom.setAttrib(elm, 'align', align);
65         dom.setAttrib(elm, 'frame', frame);
66         dom.setAttrib(elm, 'rules', rules);
67         dom.setAttrib(elm, 'class', className);
68         dom.setAttrib(elm, 'style', style);
69         dom.setAttrib(elm, 'id', id);
70         dom.setAttrib(elm, 'summary', summary);
71         dom.setAttrib(elm, 'dir', dir);
72         dom.setAttrib(elm, 'lang', lang);
87e2fd 73
d9344f 74         capEl = inst.dom.select('caption', elm)[0];
87e2fd 75
S 76         if (capEl && !caption)
77             capEl.parentNode.removeChild(capEl);
78
79         if (!capEl && caption) {
80             capEl = elm.ownerDocument.createElement('caption');
d9344f 81
S 82             if (!tinymce.isIE)
a9251b 83                 capEl.innerHTML = '<br data-mce-bogus="1"/>';
d9344f 84
87e2fd 85             elm.insertBefore(capEl, elm.firstChild);
S 86         }
a0109c 87
29da64 88         if (width && inst.settings.inline_styles) {
d9344f 89             dom.setStyle(elm, 'width', width);
S 90             dom.setAttrib(elm, 'width', '');
91         } else {
92             dom.setAttrib(elm, 'width', width, true);
93             dom.setStyle(elm, 'width', '');
94         }
a0109c 95
S 96         // Remove these since they are not valid XHTML
d9344f 97         dom.setAttrib(elm, 'borderColor', '');
S 98         dom.setAttrib(elm, 'bgColor', '');
99         dom.setAttrib(elm, 'background', '');
100
29da64 101         if (height && inst.settings.inline_styles) {
d9344f 102             dom.setStyle(elm, 'height', height);
S 103             dom.setAttrib(elm, 'height', '');
29da64 104         } else {
A 105             dom.setAttrib(elm, 'height', height, true);
106             dom.setStyle(elm, 'height', '');
107          }
a0109c 108
S 109         if (background != '')
110             elm.style.backgroundImage = "url('" + background + "')";
111         else
112             elm.style.backgroundImage = '';
113
d9344f 114 /*        if (tinyMCEPopup.getParam("inline_styles")) {
a0109c 115             if (width != '')
S 116                 elm.style.width = getCSSSize(width);
d9344f 117         }*/
a0109c 118
S 119         if (bordercolor != "") {
120             elm.style.borderColor = bordercolor;
121             elm.style.borderStyle = elm.style.borderStyle == "" ? "solid" : elm.style.borderStyle;
122             elm.style.borderWidth = border == "" ? "1px" : border;
123         } else
124             elm.style.borderColor = '';
125
126         elm.style.backgroundColor = bgcolor;
127         elm.style.height = getCSSSize(height);
128
d9344f 129         inst.addVisual();
a0109c 130
S 131         // Fix for stange MSIE align bug
d9344f 132         //elm.outerHTML = elm.outerHTML;
a0109c 133
d9344f 134         inst.nodeChanged();
a0109c 135         inst.execCommand('mceEndUndoLevel');
S 136
137         // Repaint if dimensions changed
138         if (formObj.width.value != orgTableWidth || formObj.height.value != orgTableHeight)
d9344f 139             inst.execCommand('mceRepaint');
a0109c 140
S 141         tinyMCEPopup.close();
142         return true;
143     }
144
145     // Create new table
146     html += '<table';
147
148     html += makeAttrib('id', id);
149     html += makeAttrib('border', border);
150     html += makeAttrib('cellpadding', cellpadding);
151     html += makeAttrib('cellspacing', cellspacing);
a9251b 152     html += makeAttrib('data-mce-new', '1');
d9344f 153
29da64 154     if (width && inst.settings.inline_styles) {
d9344f 155         if (style)
S 156             style += '; ';
29da64 157
A 158         // Force px
58fb65 159         if (/^[0-9\.]+$/.test(width))
29da64 160             width += 'px';
d9344f 161
S 162         style += 'width: ' + width;
163     } else
164         html += makeAttrib('width', width);
165
166 /*    if (height) {
167         if (style)
168             style += '; ';
169
170         style += 'height: ' + height;
171     }*/
172
a0109c 173     //html += makeAttrib('height', height);
S 174     //html += makeAttrib('bordercolor', bordercolor);
175     //html += makeAttrib('bgcolor', bgcolor);
176     html += makeAttrib('align', align);
d9344f 177     html += makeAttrib('frame', frame);
S 178     html += makeAttrib('rules', rules);
179     html += makeAttrib('class', className);
a0109c 180     html += makeAttrib('style', style);
S 181     html += makeAttrib('summary', summary);
182     html += makeAttrib('dir', dir);
183     html += makeAttrib('lang', lang);
184     html += '>';
87e2fd 185
d9344f 186     if (caption) {
S 187         if (!tinymce.isIE)
a9251b 188             html += '<caption><br data-mce-bogus="1"/></caption>';
d9344f 189         else
S 190             html += '<caption></caption>';
191     }
a0109c 192
S 193     for (var y=0; y<rows; y++) {
194         html += "<tr>";
195
d9344f 196         for (var x=0; x<cols; x++) {
S 197             if (!tinymce.isIE)
a9251b 198                 html += '<td><br data-mce-bogus="1"/></td>';
d9344f 199             else
S 200                 html += '<td></td>';
201         }
a0109c 202
S 203         html += "</tr>";
204     }
205
206     html += "</table>";
29da64 207
A 208     // Move table
209     if (inst.settings.fix_table_elements) {
69d05c 210         var patt = '';
29da64 211
69d05c 212         inst.focus();
A 213         inst.selection.setContent('<br class="_mce_marker" />');
29da64 214
A 215         tinymce.each('h1,h2,h3,h4,h5,h6,p'.split(','), function(n) {
216             if (patt)
217                 patt += ',';
218
219             patt += n + ' ._mce_marker';
220         });
221
222         tinymce.each(inst.dom.select(patt), function(n) {
223             inst.dom.split(inst.dom.getParent(n, 'h1,h2,h3,h4,h5,h6,p'), n);
224         });
225
69d05c 226         dom.setOuterHTML(dom.select('br._mce_marker')[0], html);
29da64 227     } else
A 228         inst.execCommand('mceInsertContent', false, html);
229
a9251b 230     tinymce.each(dom.select('table[data-mce-new]'), function(node) {
69d05c 231         var td = dom.select('td', node);
A 232
a9251b 233         try {
T 234             // IE9 might fail to do this selection
235             inst.selection.select(td[0], true);
236             inst.selection.collapse();
237         } catch (ex) {
238             // Ignore
239         }
69d05c 240
a9251b 241         dom.setAttrib(node, 'data-mce-new', '');
69d05c 242     });
A 243
d9344f 244     inst.addVisual();
a0109c 245     inst.execCommand('mceEndUndoLevel');
S 246
247     tinyMCEPopup.close();
248 }
249
250 function makeAttrib(attrib, value) {
251     var formObj = document.forms[0];
252     var valueElm = formObj.elements[attrib];
253
254     if (typeof(value) == "undefined" || value == null) {
255         value = "";
256
257         if (valueElm)
258             value = valueElm.value;
259     }
260
261     if (value == "")
262         return "";
263
264     // XML encode it
265     value = value.replace(/&/g, '&amp;');
266     value = value.replace(/\"/g, '&quot;');
267     value = value.replace(/</g, '&lt;');
268     value = value.replace(/>/g, '&gt;');
269
270     return ' ' + attrib + '="' + value + '"';
271 }
272
273 function init() {
274     tinyMCEPopup.resizeToInnerSize();
275
276     document.getElementById('backgroundimagebrowsercontainer').innerHTML = getBrowserHTML('backgroundimagebrowser','backgroundimage','image','table');
277     document.getElementById('backgroundimagebrowsercontainer').innerHTML = getBrowserHTML('backgroundimagebrowser','backgroundimage','image','table');
278     document.getElementById('bordercolor_pickcontainer').innerHTML = getColorPickerHTML('bordercolor_pick','bordercolor');
279     document.getElementById('bgcolor_pickcontainer').innerHTML = getColorPickerHTML('bgcolor_pick','bgcolor');
280
d9344f 281     var cols = 2, rows = 2, border = tinyMCEPopup.getParam('table_default_border', '0'), cellpadding = tinyMCEPopup.getParam('table_default_cellpadding', ''), cellspacing = tinyMCEPopup.getParam('table_default_cellspacing', '');
a0109c 282     var align = "", width = "", height = "", bordercolor = "", bgcolor = "", className = "";
a9251b 283     var id = "", summary = "", style = "", dir = "", lang = "", background = "", bgcolor = "", bordercolor = "", rules = "", frame = "";
d9344f 284     var inst = tinyMCEPopup.editor, dom = inst.dom;
a0109c 285     var formObj = document.forms[0];
d9344f 286     var elm = dom.getParent(inst.selection.getNode(), "table");
a0109c 287
d9344f 288     action = tinyMCEPopup.getWindowArg('action');
a0109c 289
d9344f 290     if (!action)
S 291         action = elm ? "update" : "insert";
292
293     if (elm && action != "insert") {
294         var rowsAr = elm.rows;
a0109c 295         var cols = 0;
S 296         for (var i=0; i<rowsAr.length; i++)
297             if (rowsAr[i].cells.length > cols)
298                 cols = rowsAr[i].cells.length;
299
300         cols = cols;
301         rows = rowsAr.length;
302
d9344f 303         st = dom.parseStyle(dom.getAttrib(elm, "style"));
a0109c 304         border = trimSize(getStyle(elm, 'border', 'borderWidth'));
d9344f 305         cellpadding = dom.getAttrib(elm, 'cellpadding', "");
S 306         cellspacing = dom.getAttrib(elm, 'cellspacing', "");
a0109c 307         width = trimSize(getStyle(elm, 'width', 'width'));
S 308         height = trimSize(getStyle(elm, 'height', 'height'));
309         bordercolor = convertRGBToHex(getStyle(elm, 'bordercolor', 'borderLeftColor'));
310         bgcolor = convertRGBToHex(getStyle(elm, 'bgcolor', 'backgroundColor'));
d9344f 311         align = dom.getAttrib(elm, 'align', align);
S 312         frame = dom.getAttrib(elm, 'frame');
313         rules = dom.getAttrib(elm, 'rules');
314         className = tinymce.trim(dom.getAttrib(elm, 'class').replace(/mceItem.+/g, ''));
315         id = dom.getAttrib(elm, 'id');
316         summary = dom.getAttrib(elm, 'summary');
317         style = dom.serializeStyle(st);
318         dir = dom.getAttrib(elm, 'dir');
319         lang = dom.getAttrib(elm, 'lang');
2011be 320         background = getStyle(elm, 'background', 'backgroundImage').replace(new RegExp("url\\(['\"]?([^'\"]*)['\"]?\\)", 'gi'), "$1");
d9344f 321         formObj.caption.checked = elm.getElementsByTagName('caption').length > 0;
a0109c 322
S 323         orgTableWidth = width;
324         orgTableHeight = height;
325
326         action = "update";
d9344f 327         formObj.insert.value = inst.getLang('update');
a0109c 328     }
S 329
330     addClassesToList('class', "table_styles");
d9344f 331     TinyMCE_EditableSelects.init();
a0109c 332
S 333     // Update form
334     selectByValue(formObj, 'align', align);
58fb65 335     selectByValue(formObj, 'tframe', frame);
d9344f 336     selectByValue(formObj, 'rules', rules);
S 337     selectByValue(formObj, 'class', className, true, true);
a0109c 338     formObj.cols.value = cols;
S 339     formObj.rows.value = rows;
340     formObj.border.value = border;
341     formObj.cellpadding.value = cellpadding;
342     formObj.cellspacing.value = cellspacing;
343     formObj.width.value = width;
344     formObj.height.value = height;
345     formObj.bordercolor.value = bordercolor;
346     formObj.bgcolor.value = bgcolor;
347     formObj.id.value = id;
348     formObj.summary.value = summary;
349     formObj.style.value = style;
350     formObj.dir.value = dir;
351     formObj.lang.value = lang;
352     formObj.backgroundimage.value = background;
353
354     updateColor('bordercolor_pick', 'bordercolor');
355     updateColor('bgcolor_pick', 'bgcolor');
356
357     // Resize some elements
358     if (isVisible('backgroundimagebrowser'))
359         document.getElementById('backgroundimage').style.width = '180px';
360
361     // Disable some fields in update mode
362     if (action == "update") {
363         formObj.cols.disabled = true;
364         formObj.rows.disabled = true;
365     }
366 }
367
368 function changedSize() {
369     var formObj = document.forms[0];
d9344f 370     var st = dom.parseStyle(formObj.style.value);
a0109c 371
d9344f 372 /*    var width = formObj.width.value;
a0109c 373     if (width != "")
d9344f 374         st['width'] = tinyMCEPopup.getParam("inline_styles") ? getCSSSize(width) : "";
a0109c 375     else
d9344f 376         st['width'] = "";*/
a0109c 377
S 378     var height = formObj.height.value;
379     if (height != "")
380         st['height'] = getCSSSize(height);
381     else
382         st['height'] = "";
383
d9344f 384     formObj.style.value = dom.serializeStyle(st);
a0109c 385 }
S 386
387 function changedBackgroundImage() {
388     var formObj = document.forms[0];
d9344f 389     var st = dom.parseStyle(formObj.style.value);
a0109c 390
S 391     st['background-image'] = "url('" + formObj.backgroundimage.value + "')";
392
d9344f 393     formObj.style.value = dom.serializeStyle(st);
a0109c 394 }
S 395
396 function changedBorder() {
397     var formObj = document.forms[0];
d9344f 398     var st = dom.parseStyle(formObj.style.value);
a0109c 399
S 400     // Update border width if the element has a color
401     if (formObj.border.value != "" && formObj.bordercolor.value != "")
402         st['border-width'] = formObj.border.value + "px";
403
d9344f 404     formObj.style.value = dom.serializeStyle(st);
a0109c 405 }
S 406
407 function changedColor() {
408     var formObj = document.forms[0];
d9344f 409     var st = dom.parseStyle(formObj.style.value);
a0109c 410
S 411     st['background-color'] = formObj.bgcolor.value;
412
413     if (formObj.bordercolor.value != "") {
414         st['border-color'] = formObj.bordercolor.value;
415
416         // Add border-width if it's missing
417         if (!st['border-width'])
418             st['border-width'] = formObj.border.value == "" ? "1px" : formObj.border.value + "px";
419     }
420
d9344f 421     formObj.style.value = dom.serializeStyle(st);
a0109c 422 }
S 423
424 function changedStyle() {
425     var formObj = document.forms[0];
d9344f 426     var st = dom.parseStyle(formObj.style.value);
a0109c 427
S 428     if (st['background-image'])
2011be 429         formObj.backgroundimage.value = st['background-image'].replace(new RegExp("url\\(['\"]?([^'\"]*)['\"]?\\)", 'gi'), "$1");
a0109c 430     else
S 431         formObj.backgroundimage.value = '';
432
433     if (st['width'])
434         formObj.width.value = trimSize(st['width']);
435
436     if (st['height'])
437         formObj.height.value = trimSize(st['height']);
438
439     if (st['background-color']) {
440         formObj.bgcolor.value = st['background-color'];
441         updateColor('bgcolor_pick','bgcolor');
442     }
443
444     if (st['border-color']) {
445         formObj.bordercolor.value = st['border-color'];
446         updateColor('bordercolor_pick','bordercolor');
447     }
448 }
d9344f 449
S 450 tinyMCEPopup.onInit.add(init);