[Sommaire] [Imprimer]

   1  function init() {
   2      tinyMCEPopup.resizeToInnerSize();
   3  
   4      document.getElementById('backgroundimagebrowsercontainer').innerHTML = getBrowserHTML('backgroundimagebrowser','backgroundimage','image','table');
   5      document.getElementById('bordercolor_pickcontainer').innerHTML = getColorPickerHTML('bordercolor_pick','bordercolor');
   6      document.getElementById('bgcolor_pickcontainer').innerHTML = getColorPickerHTML('bgcolor_pick','bgcolor')
   7  
   8      var inst = tinyMCE.selectedInstance;
   9      var tdElm = tinyMCE.getParentElement(inst.getFocusElement(), "td,th");
  10      var formObj = document.forms[0];
  11      var st = tinyMCE.parseStyle(tinyMCE.getAttrib(tdElm, "style"));
  12  
  13      // Get table cell data

  14      var celltype = tdElm.nodeName.toLowerCase();
  15      var align = tinyMCE.getAttrib(tdElm, 'align');
  16      var valign = tinyMCE.getAttrib(tdElm, 'valign');
  17      var width = trimSize(getStyle(tdElm, 'width', 'width'));
  18      var height = trimSize(getStyle(tdElm, 'height', 'height'));
  19      var bordercolor = convertRGBToHex(getStyle(tdElm, 'bordercolor', 'borderLeftColor'));
  20      var bgcolor = convertRGBToHex(getStyle(tdElm, 'bgcolor', 'backgroundColor'));
  21      var className = tinyMCE.getVisualAidClass(tinyMCE.getAttrib(tdElm, 'class'), false);
  22      var backgroundimage = getStyle(tdElm, 'background', 'backgroundImage').replace(new RegExp("url\\('?([^']*)'?\\)", 'gi'), "$1");;
  23      var id = tinyMCE.getAttrib(tdElm, 'id');
  24      var lang = tinyMCE.getAttrib(tdElm, 'lang');
  25      var dir = tinyMCE.getAttrib(tdElm, 'dir');
  26      var scope = tinyMCE.getAttrib(tdElm, 'scope');
  27  
  28      // Setup form

  29      addClassesToList('class', 'table_cell_styles');
  30      formObj.bordercolor.value = bordercolor;
  31      formObj.bgcolor.value = bgcolor;
  32      formObj.backgroundimage.value = backgroundimage;
  33      formObj.width.value = width;
  34      formObj.height.value = height;
  35      formObj.id.value = id;
  36      formObj.lang.value = lang;
  37      formObj.style.value = tinyMCE.serializeStyle(st);
  38      selectByValue(formObj, 'align', align);
  39      selectByValue(formObj, 'valign', valign);
  40      selectByValue(formObj, 'class', className);
  41      selectByValue(formObj, 'celltype', celltype);
  42      selectByValue(formObj, 'dir', dir);
  43      selectByValue(formObj, 'scope', scope);
  44  
  45      // Resize some elements

  46      if (isVisible('backgroundimagebrowser'))
  47          document.getElementById('backgroundimage').style.width = '180px';
  48  
  49      updateColor('bordercolor_pick', 'bordercolor');
  50      updateColor('bgcolor_pick', 'bgcolor');
  51  }
  52  
  53  function updateAction() {
  54      tinyMCEPopup.restoreSelection();
  55  
  56      var inst = tinyMCE.selectedInstance;
  57      var tdElm = tinyMCE.getParentElement(inst.getFocusElement(), "td,th");
  58      var trElm = tinyMCE.getParentElement(inst.getFocusElement(), "tr");
  59      var tableElm = tinyMCE.getParentElement(inst.getFocusElement(), "table");
  60      var formObj = document.forms[0];
  61  
  62      inst.execCommand('mceBeginUndoLevel');
  63  
  64      switch (getSelectValue(formObj, 'action')) {
  65          case "cell":
  66              var celltype = getSelectValue(formObj, 'celltype');
  67              var scope = getSelectValue(formObj, 'scope');
  68  
  69              if (tinyMCE.getParam("accessibility_warnings")) {
  70                  if (celltype == "th" && scope == "")
  71                      var answer = confirm(tinyMCE.getLang('lang_table_missing_scope', '', true));
  72                  else
  73                      var answer = true;
  74  
  75                  if (!answer)
  76                      return;
  77              }
  78  
  79              updateCell(tdElm);
  80              break;
  81  
  82          case "row":
  83              var cell = trElm.firstChild;
  84  
  85              if (cell.nodeName != "TD" && cell.nodeName != "TH")
  86                  cell = nextCell(cell);
  87  
  88              do {
  89                  cell = updateCell(cell, true);
  90              } while ((cell = nextCell(cell)) != null);
  91  
  92              break;
  93  
  94          case "all":
  95              var rows = tableElm.getElementsByTagName("tr");
  96  
  97              for (var i=0; i<rows.length; i++) {
  98                  var cell = rows[i].firstChild;
  99  
 100                  if (cell.nodeName != "TD" && cell.nodeName != "TH")
 101                      cell = nextCell(cell);
 102  
 103                  do {
 104                      cell = updateCell(cell, true);
 105                  } while ((cell = nextCell(cell)) != null);
 106              }
 107  
 108              break;
 109      }
 110  
 111      tinyMCE.handleVisualAid(inst.getBody(), true, inst.visualAid, inst);
 112      tinyMCE.triggerNodeChange();
 113      inst.execCommand('mceEndUndoLevel');
 114      tinyMCEPopup.close();
 115  }
 116  
 117  function nextCell(elm) {
 118      while ((elm = elm.nextSibling) != null) {
 119          if (elm.nodeName == "TD" || elm.nodeName == "TH")
 120              return elm;
 121      }
 122  
 123      return null;
 124  }
 125  
 126  function updateCell(td, skip_id) {
 127      var inst = tinyMCE.selectedInstance;
 128      var formObj = document.forms[0];
 129      var curCellType = td.nodeName.toLowerCase();
 130      var celltype = getSelectValue(formObj, 'celltype');
 131      var doc = inst.getDoc();
 132  
 133      if (!skip_id)
 134          td.setAttribute('id', formObj.id.value);
 135  
 136      td.setAttribute('align', formObj.align.value);
 137      td.setAttribute('vAlign', formObj.valign.value);
 138      td.setAttribute('lang', formObj.lang.value);
 139      td.setAttribute('dir', getSelectValue(formObj, 'dir'));
 140      td.setAttribute('style', tinyMCE.serializeStyle(tinyMCE.parseStyle(formObj.style.value)));
 141      td.setAttribute('scope', formObj.scope.value);
 142      tinyMCE.setAttrib(td, 'class', getSelectValue(formObj, 'class'));
 143  
 144      // Clear deprecated attributes

 145      tinyMCE.setAttrib(td, 'width', '');
 146      tinyMCE.setAttrib(td, 'height', '');
 147      tinyMCE.setAttrib(td, 'bgColor', '');
 148      tinyMCE.setAttrib(td, 'borderColor', '');
 149      tinyMCE.setAttrib(td, 'background', '');
 150  
 151      // Set styles

 152      td.style.width = getCSSSize(formObj.width.value);
 153      td.style.height = getCSSSize(formObj.height.value);
 154      if (formObj.bordercolor.value != "") {
 155          td.style.borderColor = formObj.bordercolor.value;
 156          td.style.borderStyle = td.style.borderStyle == "" ? "solid" : td.style.borderStyle;
 157          td.style.borderWidth = td.style.borderWidth == "" ? "1px" : td.style.borderWidth;
 158      } else
 159          td.style.borderColor = '';
 160  
 161      td.style.backgroundColor = formObj.bgcolor.value;
 162  
 163      if (formObj.backgroundimage.value != "")
 164          td.style.backgroundImage = "url('" + formObj.backgroundimage.value + "')";
 165      else
 166          td.style.backgroundImage = '';
 167  
 168      if (curCellType != celltype) {
 169          // changing to a different node type

 170          var newCell = doc.createElement(celltype);
 171  
 172          for (var c=0; c<td.childNodes.length; c++)
 173              newCell.appendChild(td.childNodes[c].cloneNode(1));
 174  
 175          for (var a=0; a<td.attributes.length; a++) {
 176              var attr = td.attributes[a];
 177              newCell.setAttribute(attr.name, attr.value);
 178          }
 179  
 180          td.parentNode.replaceChild(newCell, td);
 181          td = newCell;
 182      }
 183  
 184      return td;
 185  }
 186  
 187  function changedBackgroundImage() {
 188      var formObj = document.forms[0];
 189      var st = tinyMCE.parseStyle(formObj.style.value);
 190  
 191      st['background-image'] = "url('" + formObj.backgroundimage.value + "')";
 192  
 193      formObj.style.value = tinyMCE.serializeStyle(st);
 194  }
 195  
 196  function changedSize() {
 197      var formObj = document.forms[0];
 198      var st = tinyMCE.parseStyle(formObj.style.value);
 199  
 200      var width = formObj.width.value;
 201      if (width != "")
 202          st['width'] = getCSSSize(width);
 203      else
 204          st['width'] = "";
 205  
 206      var height = formObj.height.value;
 207      if (height != "")
 208          st['height'] = getCSSSize(height);
 209      else
 210          st['height'] = "";
 211  
 212      formObj.style.value = tinyMCE.serializeStyle(st);
 213  }
 214  
 215  function changedColor() {
 216      var formObj = document.forms[0];
 217      var st = tinyMCE.parseStyle(formObj.style.value);
 218  
 219      st['background-color'] = formObj.bgcolor.value;
 220      st['border-color'] = formObj.bordercolor.value;
 221  
 222      formObj.style.value = tinyMCE.serializeStyle(st);
 223  }
 224  
 225  function changedStyle() {
 226      var formObj = document.forms[0];
 227      var st = tinyMCE.parseStyle(formObj.style.value);
 228  
 229      if (st['background-image'])
 230          formObj.backgroundimage.value = st['background-image'].replace(new RegExp("url\\('?([^']*)'?\\)", 'gi'), "$1");
 231      else
 232          formObj.backgroundimage.value = '';
 233  
 234      if (st['width'])
 235          formObj.width.value = trimSize(st['width']);
 236  
 237      if (st['height'])
 238          formObj.height.value = trimSize(st['height']);
 239  
 240      if (st['background-color']) {
 241          formObj.bgcolor.value = st['background-color'];
 242          updateColor('bgcolor_pick','bgcolor');
 243      }
 244  
 245      if (st['border-color']) {
 246          formObj.bordercolor.value = st['border-color'];
 247          updateColor('bordercolor_pick','bordercolor');
 248      }
 249  }