/static/scripts/tiny_mce/plugins/table/js/row.js
JavaScript | 212 lines | 153 code | 47 blank | 12 comment | 32 complexity | 2693fc4c10154d8bfcc577c799e3b7d5 MD5 | raw file
1tinyMCEPopup.requireLangPack(); 2 3function init() { 4 tinyMCEPopup.resizeToInnerSize(); 5 6 document.getElementById('backgroundimagebrowsercontainer').innerHTML = getBrowserHTML('backgroundimagebrowser','backgroundimage','image','table'); 7 document.getElementById('bgcolor_pickcontainer').innerHTML = getColorPickerHTML('bgcolor_pick','bgcolor'); 8 9 var inst = tinyMCEPopup.editor; 10 var dom = inst.dom; 11 var trElm = dom.getParent(inst.selection.getNode(), "tr"); 12 var formObj = document.forms[0]; 13 var st = dom.parseStyle(dom.getAttrib(trElm, "style")); 14 15 // Get table row data 16 var rowtype = trElm.parentNode.nodeName.toLowerCase(); 17 var align = dom.getAttrib(trElm, 'align'); 18 var valign = dom.getAttrib(trElm, 'valign'); 19 var height = trimSize(getStyle(trElm, 'height', 'height')); 20 var className = dom.getAttrib(trElm, 'class'); 21 var bgcolor = convertRGBToHex(getStyle(trElm, 'bgcolor', 'backgroundColor')); 22 var backgroundimage = getStyle(trElm, 'background', 'backgroundImage').replace(new RegExp("url\\('?([^']*)'?\\)", 'gi'), "$1");; 23 var id = dom.getAttrib(trElm, 'id'); 24 var lang = dom.getAttrib(trElm, 'lang'); 25 var dir = dom.getAttrib(trElm, 'dir'); 26 27 // Setup form 28 addClassesToList('class', 'table_row_styles'); 29 TinyMCE_EditableSelects.init(); 30 31 formObj.bgcolor.value = bgcolor; 32 formObj.backgroundimage.value = backgroundimage; 33 formObj.height.value = height; 34 formObj.id.value = id; 35 formObj.lang.value = lang; 36 formObj.style.value = dom.serializeStyle(st); 37 selectByValue(formObj, 'align', align); 38 selectByValue(formObj, 'valign', valign); 39 selectByValue(formObj, 'class', className, true, true); 40 selectByValue(formObj, 'rowtype', rowtype); 41 selectByValue(formObj, 'dir', dir); 42 43 // Resize some elements 44 if (isVisible('backgroundimagebrowser')) 45 document.getElementById('backgroundimage').style.width = '180px'; 46 47 updateColor('bgcolor_pick', 'bgcolor'); 48} 49 50function updateAction() { 51 var inst = tinyMCEPopup.editor, dom = inst.dom, trElm, tableElm, formObj = document.forms[0]; 52 var action = getSelectValue(formObj, 'action'); 53 54 tinyMCEPopup.restoreSelection(); 55 trElm = dom.getParent(inst.selection.getNode(), "tr"); 56 tableElm = dom.getParent(inst.selection.getNode(), "table"); 57 58 inst.execCommand('mceBeginUndoLevel'); 59 60 switch (action) { 61 case "row": 62 updateRow(trElm); 63 break; 64 65 case "all": 66 var rows = tableElm.getElementsByTagName("tr"); 67 68 for (var i=0; i<rows.length; i++) 69 updateRow(rows[i], true); 70 71 break; 72 73 case "odd": 74 case "even": 75 var rows = tableElm.getElementsByTagName("tr"); 76 77 for (var i=0; i<rows.length; i++) { 78 if ((i % 2 == 0 && action == "odd") || (i % 2 != 0 && action == "even")) 79 updateRow(rows[i], true, true); 80 } 81 82 break; 83 } 84 85 inst.addVisual(); 86 inst.nodeChanged(); 87 inst.execCommand('mceEndUndoLevel'); 88 tinyMCEPopup.close(); 89} 90 91function updateRow(tr_elm, skip_id, skip_parent) { 92 var inst = tinyMCEPopup.editor; 93 var formObj = document.forms[0]; 94 var dom = inst.dom; 95 var curRowType = tr_elm.parentNode.nodeName.toLowerCase(); 96 var rowtype = getSelectValue(formObj, 'rowtype'); 97 var doc = inst.getDoc(); 98 99 // Update row element 100 if (!skip_id) 101 tr_elm.setAttribute('id', formObj.id.value); 102 103 tr_elm.setAttribute('align', getSelectValue(formObj, 'align')); 104 tr_elm.setAttribute('vAlign', getSelectValue(formObj, 'valign')); 105 tr_elm.setAttribute('lang', formObj.lang.value); 106 tr_elm.setAttribute('dir', getSelectValue(formObj, 'dir')); 107 tr_elm.setAttribute('style', dom.serializeStyle(dom.parseStyle(formObj.style.value))); 108 dom.setAttrib(tr_elm, 'class', getSelectValue(formObj, 'class')); 109 110 // Clear deprecated attributes 111 tr_elm.setAttribute('background', ''); 112 tr_elm.setAttribute('bgColor', ''); 113 tr_elm.setAttribute('height', ''); 114 115 // Set styles 116 tr_elm.style.height = getCSSSize(formObj.height.value); 117 tr_elm.style.backgroundColor = formObj.bgcolor.value; 118 119 if (formObj.backgroundimage.value != "") 120 tr_elm.style.backgroundImage = "url('" + formObj.backgroundimage.value + "')"; 121 else 122 tr_elm.style.backgroundImage = ''; 123 124 // Setup new rowtype 125 if (curRowType != rowtype && !skip_parent) { 126 // first, clone the node we are working on 127 var newRow = tr_elm.cloneNode(1); 128 129 // next, find the parent of its new destination (creating it if necessary) 130 var theTable = dom.getParent(tr_elm, "table"); 131 var dest = rowtype; 132 var newParent = null; 133 for (var i = 0; i < theTable.childNodes.length; i++) { 134 if (theTable.childNodes[i].nodeName.toLowerCase() == dest) 135 newParent = theTable.childNodes[i]; 136 } 137 138 if (newParent == null) { 139 newParent = doc.createElement(dest); 140 141 if (dest == "thead") { 142 if (theTable.firstChild.nodeName == 'CAPTION') 143 inst.dom.insertAfter(newParent, theTable.firstChild); 144 else 145 theTable.insertBefore(newParent, theTable.firstChild); 146 } else 147 theTable.appendChild(newParent); 148 } 149 150 // append the row to the new parent 151 newParent.appendChild(newRow); 152 153 // remove the original 154 tr_elm.parentNode.removeChild(tr_elm); 155 156 // set tr_elm to the new node 157 tr_elm = newRow; 158 } 159 160 dom.setAttrib(tr_elm, 'style', dom.serializeStyle(dom.parseStyle(tr_elm.style.cssText))); 161} 162 163function changedBackgroundImage() { 164 var formObj = document.forms[0], dom = tinyMCEPopup.editor.dom; 165 var st = dom.parseStyle(formObj.style.value); 166 167 st['background-image'] = "url('" + formObj.backgroundimage.value + "')"; 168 169 formObj.style.value = dom.serializeStyle(st); 170} 171 172function changedStyle() { 173 var formObj = document.forms[0], dom = tinyMCEPopup.editor.dom; 174 var st = dom.parseStyle(formObj.style.value); 175 176 if (st['background-image']) 177 formObj.backgroundimage.value = st['background-image'].replace(new RegExp("url\\('?([^']*)'?\\)", 'gi'), "$1"); 178 else 179 formObj.backgroundimage.value = ''; 180 181 if (st['height']) 182 formObj.height.value = trimSize(st['height']); 183 184 if (st['background-color']) { 185 formObj.bgcolor.value = st['background-color']; 186 updateColor('bgcolor_pick','bgcolor'); 187 } 188} 189 190function changedSize() { 191 var formObj = document.forms[0], dom = tinyMCEPopup.editor.dom; 192 var st = dom.parseStyle(formObj.style.value); 193 194 var height = formObj.height.value; 195 if (height != "") 196 st['height'] = getCSSSize(height); 197 else 198 st['height'] = ""; 199 200 formObj.style.value = dom.serializeStyle(st); 201} 202 203function changedColor() { 204 var formObj = document.forms[0], dom = tinyMCEPopup.editor.dom; 205 var st = dom.parseStyle(formObj.style.value); 206 207 st['background-color'] = formObj.bgcolor.value; 208 209 formObj.style.value = dom.serializeStyle(st); 210} 211 212tinyMCEPopup.onInit.add(init);