Changeset 1391


Ignore:
Timestamp:
02/08/18 23:51:08 (16 months ago)
Author:
gogo
Message:

Improve TableOperations? Table Properties border functionality. Remove the old "frames" and "rules" stuff, set all cells of the table to have the table properties border if you set it, automatically set a 1px solid border if you set a table border colour and hadn't set the style or width.

Location:
trunk
Files:
4 edited

Legend:

Unmodified
Added
Removed
  • trunk/modules/ColorPicker/ColorPicker.js

    r1370 r1391  
    924924 
    925925  pickerConfig = (pickerConfig) ? Xinha.cloneObject(pickerConfig) : { cellsize:'5px' }; 
    926   pickerConfig.callback = (pickerConfig.callback) ? pickerConfig.callback : function(color) {chooser.style.backgroundColor = color;input.value=color}; 
     926  pickerConfig.callback = (pickerConfig.callback) ? pickerConfig.callback : function(color) {chooser.style.backgroundColor = color;input.value=color;if(typeof input.oncolorpicked == 'function') input.oncolorpicked();}; 
    927927 
    928928  chooser.onclick = function()  
  • trunk/modules/InlineStyler/InlineStyler.js

    r1260 r1391  
    2424 
    2525// Applies the style found in "params" to the given element. 
    26 Xinha.InlineStyler.prototype.applyStyle = function(params) 
     26Xinha.InlineStyler.prototype.applyStyle = function(params, _ifMatchRe, _exceptMatchRe) 
    2727{ 
    2828  var element = this.element; 
     
    3535    if (params[i] != null) 
    3636      var val = params[i].value || params[i]; 
    37  
     37     
     38    if(_ifMatchRe && !i.match(_ifMatchRe))        continue; 
     39    if(_exceptMatchRe && i.match(_exceptMatchRe)) continue; 
     40     
    3841    switch (i) 
    3942    { 
     
    125128    } 
    126129  } 
     130}; 
     131 
     132Xinha.InlineStyler.prototype.applyStyleExceptMatch = function(params, exceptMatchRe) 
     133{ 
     134  return this.applyStyle(params, null, exceptMatchRe); 
     135}; 
     136 
     137Xinha.InlineStyler.prototype.applyStyleIfMatch    = function(params, ifMatchRe) 
     138{ 
     139  return this.applyStyle(params, ifMatchRe); 
    127140}; 
    128141 
     
    389402  tr.appendChild(td); 
    390403  input = doc.createElement("input"); 
     404  var borderColourInput = input; 
    391405  input.name = this.dialog.createId("borderColor"); 
    392406  input.value = Xinha._colorToRgb( el.style.borderColor ); 
     
    398412   
    399413  select = doc.createElement("select"); 
     414  var borderSelect = select;   
    400415  select.name = this.dialog.createId("borderStyle"); 
    401416  var borderFields = []; 
     
    435450  }; 
    436451   
    437   input = doc.createElement("input"); 
     452 
     453   
     454  input = doc.createElement("input"); 
     455  var borderWidthInput = input 
    438456  input.name = this.dialog.createId("borderWidth"); 
    439457  borderFields.push(input); 
     
    450468   
    451469  setBorderFieldsStatus(select.value == "none"); 
     470   
     471  // if somebody changes the border colour, and the border Style is not set, set it 
     472  // because otherwise they might not do that and get confused 
     473  borderColourInput.oncolorpicked = function(){ 
     474    if(borderSelect.selectedIndex == 0) 
     475    { 
     476      borderSelect.selectedIndex = 3; 
     477      borderSelect.onchange(); 
     478    }  
     479     
     480    if(!borderWidthInput.value.length)  
     481    { 
     482      borderWidthInput.value = 1; 
     483    } 
     484  }; 
    452485   
    453486  if (el.tagName.toLowerCase() == "table")  
  • trunk/plugins/TableOperations/TableOperations.js

    r1390 r1391  
    2323  'toolbarLayout': 'compact', // 'compact' or anything else will give you full 
    2424  'renameSplitCellButton': 'Unmerge Cells', // Split cell isn't a very obvious term, it implies being able to make new cells, really it is unmerging merged cells and can only be used in that context 
     25  'noFrameRulesOptions': true, // Disable "Frame and Border" options in the table properties, these are confusing (and not very good) 
    2526  'addToolbarLineBreak': true // By default TableOperations adds a 'linebreak' in the toolbar. 
    2627  // Set to false to prevent this and instead just append the buttons without a 'linebreak'. 
     
    678679        break; 
    679680      case "borders": 
    680         table.border = val; 
     681        if(!editor.config.TableOperations.noFrameRulesOptions) table.border = val; 
    681682        break; 
    682683      case "frames": 
    683         table.frame = val; 
     684        if(!editor.config.TableOperations.noFrameRulesOptions) table.frame = val; 
    684685        break; 
    685686      case "rules": 
    686         table.rules = val; 
     687        if(!editor.config.TableOperations.noFrameRulesOptions) table.rules = val; 
    687688        break; 
    688689      } 
    689690    } 
    690691 
     692    // Without frame and rules options, apply the border style 
     693    // also to the cells in the table, this is what the user  
     694    // will probably want (they can change it later per-cell) 
     695    if(editor.config.TableOperations.noFrameRulesOptions) 
     696    { 
     697      var applyTo = [ ]; 
     698      function findCells(inThis) 
     699      { 
     700        for(var i = 0; i < inThis.childNodes.length; i++) 
     701        { 
     702          if(inThis.childNodes[i].nodeType == 1 && inThis.childNodes[i].tagName.toLowerCase().match(/tbody|thead|tr/)) 
     703          { 
     704            findCells(inThis.childNodes[i]); 
     705          } 
     706          else if(inThis.childNodes[i].nodeType == 1 && inThis.childNodes[i].tagName.toLowerCase().match(/td|th/)) 
     707          { 
     708            applyTo.push(inThis.childNodes[i]); 
     709          } 
     710        } 
     711      } 
     712      findCells(table); 
     713      console.log(applyTo); 
     714      for(var i = 0; i < applyTo.length; i++) 
     715      { 
     716        Styler.element = applyTo[i]; 
     717        Styler.applyStyleIfMatch(params, /border/); 
     718      } 
     719    } 
     720     
    691721    // various workarounds to refresh the table display (Gecko, 
    692722    // what's going on?! do not disappoint me!) 
     
    708738  p.replaceChild(st_prop,p.firstChild); 
    709739 
     740  if(editor.config.TableOperations.noFrameRulesOptions) 
     741  { 
     742    dialog.getElementById('TO_frameRules').style.display = 'none'; 
     743  } 
     744   
    710745  this.dialogTable.getElementById('ok').onclick = apply; 
    711746 
  • trunk/plugins/TableOperations/popups/dialogTable.html

    r1044 r1391  
    5757          </tr> 
    5858          <tr> 
    59               <td> 
     59              <td id="[TO_frameRules]"> 
    6060                  <fieldset> 
    6161                      <legend> 
Note: See TracChangeset for help on using the changeset viewer.