Changeset 1065


Ignore:
Timestamp:
10/06/08 16:13:33 (11 years ago)
Author:
nicholasbs
Message:

Fix formatting and tabs

File:
1 edited

Legend:

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

    r1044 r1065  
    11Xinha.InlineStyler = function(element, editor, doc) 
    22{ 
    3         this.element = element; 
    4         this.editor = editor; 
    5         this.doc = doc ? doc : document; 
    6         this.inputs = { 
    7                 styles : {}, 
    8                 aux : {} 
    9         } 
    10         this.styles = {}; 
    11         this.auxData = {}; //units and such 
     3  this.element = element; 
     4  this.editor = editor; 
     5  this.doc = doc ? doc : document; 
     6  this.inputs = { 
     7    styles : {}, 
     8    aux : {} 
     9  } 
     10  this.styles = {}; 
     11  this.auxData = {}; //units and such 
    1212} 
    1313 
    1414Xinha.InlineStyler.getLength = function(value) 
    1515{ 
    16         var len = parseInt(value); 
    17         if (isNaN(len))  
    18         { 
    19                 len = ""; 
    20         } 
    21         return len; 
     16  var len = parseInt(value); 
     17  if (isNaN(len))  
     18  { 
     19    len = ""; 
     20  } 
     21  return len; 
    2222}; 
    2323 
     
    2525Xinha.InlineStyler.prototype.applyStyle = function(params) 
    2626{ 
    27         var element = this.element; 
    28         var style = element.style; 
    29  
    30         for (var i in params)  
    31         { 
    32                 if (typeof params[i] == 'function')  
    33                         continue; 
    34                 var val = params[i].value; 
    35                 switch (i) 
    36                 { 
    37                         case "backgroundImage": 
    38                                 if (/\S/.test(val))  
    39                                 { 
    40                                         style.backgroundImage = "url(" + val + ")"; 
    41                                 } 
    42                                 else  
    43                                 { 
    44                                         style.backgroundImage = "none"; 
    45                                 } 
    46                         break; 
    47                         case "borderCollapse": 
    48                                 style.borderCollapse =  params[i].checked ? "collapse" : ""; 
    49                         break; 
    50                         case "width": 
    51                                 if (/\S/.test(val))  
    52                                 { 
    53                                         style.width = val + this.inputs.aux["widthUnit"].value; 
    54                                 } 
    55                                 else  
    56                                 { 
    57                                         style.width = ""; 
    58                                 } 
    59                         break; 
    60                         case "height": 
    61                                 if (/\S/.test(val))  
    62                                 { 
    63                                         style.height = val + this.inputs.aux["heightUnit"].value; 
    64                                 } 
    65                                 else  
    66                                 { 
    67                                         style.height = ""; 
    68                                 } 
    69                         break; 
    70                         case "textAlign": 
    71                                 if (val == "char")  
    72                                 { 
    73                                         var ch = this.inputs.aux["textAlignChar"].value; 
    74                                         if (ch == '"')  
    75                                         { 
    76                                                 ch = '\\"'; 
    77                                         } 
    78                                         style.textAlign = '"' + ch + '"'; 
    79                                 } 
    80                                 else  
    81                                         if (val == "-")  
    82                                         { 
    83                                                 style.textAlign = ""; 
    84                                         } 
    85                                         else  
    86                                         { 
    87                                                 style.textAlign = val; 
    88                                         } 
    89                         break; 
    90                         case "verticalAlign": 
    91                                 element.vAlign = ""; 
    92                                 if (val == "-")  
    93                                 { 
    94                                         style.verticalAlign = ""; 
    95                                          
    96                                 } 
    97                                 else  
    98                                 { 
    99                                         style.verticalAlign = val; 
    100                                 } 
    101                         break; 
    102                         case "float": 
    103                                 if (Xinha.is_ie) { 
    104                                         style.styleFloat = val; 
    105                                 } 
    106                                 else { 
    107                                         style.cssFloat = val; 
    108                                 } 
    109                         break; 
    110                         case "borderWidth": 
    111                                 var borderWidthUnit = this.inputs.aux["heightUnit"].value; 
    112                                 style[i] = val + (borderWidthUnit) ? borderWidthUnit : 'px'; 
    113                         break; 
    114                         default: 
    115                                 style[i] = val; 
    116                         break; 
    117                         //                  case "f_st_margin": 
    118                         //                      style.margin = val + "px"; 
    119                         //                      break; 
    120                         //                  case "f_st_padding": 
    121                         //                      style.padding = val + "px"; 
    122                         //                      break; 
    123                 } 
    124         } 
     27  var element = this.element; 
     28  var style = element.style; 
     29 
     30  for (var i in params)  
     31  { 
     32    if (typeof params[i] == 'function')  
     33      continue; 
     34    var val = params[i].value; 
     35    switch (i) 
     36    { 
     37    case "backgroundImage": 
     38      if (/\S/.test(val))  
     39      { 
     40        style.backgroundImage = "url(" + val + ")"; 
     41      } 
     42      else  
     43      { 
     44        style.backgroundImage = "none"; 
     45      } 
     46      break; 
     47    case "borderCollapse": 
     48      style.borderCollapse =  params[i].checked ? "collapse" : ""; 
     49      break; 
     50    case "width": 
     51      if (/\S/.test(val))  
     52      { 
     53        style.width = val + this.inputs.aux["widthUnit"].value; 
     54      } 
     55      else  
     56      { 
     57        style.width = ""; 
     58      } 
     59      break; 
     60    case "height": 
     61      if (/\S/.test(val))  
     62      { 
     63        style.height = val + this.inputs.aux["heightUnit"].value; 
     64      } 
     65      else  
     66      { 
     67        style.height = ""; 
     68      } 
     69      break; 
     70    case "textAlign": 
     71      if (val == "char")  
     72      { 
     73        var ch = this.inputs.aux["textAlignChar"].value; 
     74        if (ch == '"')  
     75        { 
     76          ch = '\\"'; 
     77        } 
     78        style.textAlign = '"' + ch + '"'; 
     79      } 
     80      else  
     81        if (val == "-")  
     82      { 
     83        style.textAlign = ""; 
     84      } 
     85      else  
     86      { 
     87        style.textAlign = val; 
     88      } 
     89      break; 
     90    case "verticalAlign": 
     91      element.vAlign = ""; 
     92      if (val == "-")  
     93      { 
     94        style.verticalAlign = ""; 
     95         
     96      } 
     97      else  
     98      { 
     99        style.verticalAlign = val; 
     100      } 
     101      break; 
     102    case "float": 
     103      if (Xinha.is_ie) { 
     104        style.styleFloat = val; 
     105      } 
     106      else { 
     107        style.cssFloat = val; 
     108      } 
     109      break; 
     110    case "borderWidth": 
     111      var borderWidthUnit = this.inputs.aux["heightUnit"].value; 
     112      style[i] = val + (borderWidthUnit) ? borderWidthUnit : 'px'; 
     113      break; 
     114    default: 
     115      style[i] = val; 
     116      break; 
     117      //                    case "f_st_margin": 
     118      //                        style.margin = val + "px"; 
     119      //                        break; 
     120      //                    case "f_st_padding": 
     121      //                        style.padding = val + "px"; 
     122      //                        break; 
     123    } 
     124  } 
    125125}; 
    126126 
    127127Xinha.InlineStyler.prototype.createStyleLayoutFieldset = function() 
    128128{ 
    129         var self = this; 
    130         var editor = this.editor; 
    131         var doc = this.doc; 
    132         var el = this.element; 
    133         var fieldset = doc.createElement("fieldset"); 
    134         var legend = doc.createElement("legend"); 
    135         fieldset.appendChild(legend); 
    136         legend.innerHTML = Xinha._lc("Layout", "TableOperations"); 
    137         var table = doc.createElement("table"); 
    138         fieldset.appendChild(table); 
    139         table.style.width = "100%"; 
    140         var tbody = doc.createElement("tbody"); 
    141         table.appendChild(tbody); 
    142          
    143         var tagname = el.tagName.toLowerCase(); 
    144         var tr, td, input, select, option, options, i; 
    145          
    146         if (tagname != "td" && tagname != "tr" && tagname != "th")  
    147         { 
    148                 tr = doc.createElement("tr"); 
    149                 tbody.appendChild(tr); 
    150                 td = doc.createElement("td"); 
    151                 td.className = "label"; 
    152                 tr.appendChild(td); 
    153                 td.innerHTML = Xinha._lc("Float", "TableOperations") + ":"; 
    154                 td = doc.createElement("td"); 
    155                 tr.appendChild(td); 
    156                 select = doc.createElement("select"); 
    157                 td.appendChild(select); 
    158                 this.inputs.styles['float'] = select; 
    159                  
    160                 options = ["None", "Left", "Right"]; 
    161                 for (var i = 0; i < options.length; ++i)  
    162                 { 
    163                         var Val = options[i]; 
    164                         var val = options[i].toLowerCase(); 
    165                         option = doc.createElement("option"); 
    166                         option.innerHTML = Xinha._lc(Val, "TableOperations"); 
    167                         option.value = val; 
    168                         if (Xinha.is_ie) { 
    169                                 option.selected = (("" + el.style.styleFloat).toLowerCase() == val); 
    170                         } 
    171                         else { 
    172                                 option.selected = (("" + el.style.cssFloat).toLowerCase() == val); 
    173                         } 
    174                         select.appendChild(option); 
    175                 } 
    176         } 
    177          
    178         tr = doc.createElement("tr"); 
    179         tbody.appendChild(tr); 
    180         td = doc.createElement("td"); 
    181         td.className = "label"; 
    182         tr.appendChild(td); 
    183         td.innerHTML = Xinha._lc("Width", "TableOperations") + ":"; 
    184         td = doc.createElement("td"); 
    185         tr.appendChild(td); 
    186         input = doc.createElement("input"); 
    187         input.type = "text"; 
    188         input.value = Xinha.InlineStyler.getLength(el.style.width); 
    189         input.size = "5"; 
    190         this.inputs.styles['width'] = input; 
    191         input.style.marginRight = "0.5em"; 
    192         td.appendChild(input); 
    193         select = doc.createElement("select"); 
    194         this.inputs.aux['widthUnit'] = select; 
    195         option = doc.createElement("option"); 
    196         option.innerHTML = Xinha._lc("percent", "TableOperations"); 
    197         option.value = "%"; 
    198         option.selected = /%/.test(el.style.width); 
    199         select.appendChild(option); 
    200         option = doc.createElement("option"); 
    201         option.innerHTML = Xinha._lc("pixels", "TableOperations"); 
    202         option.value = "px"; 
    203         option.selected = /px/.test(el.style.width); 
    204         select.appendChild(option); 
    205         td.appendChild(select); 
    206          
    207         select.style.marginRight = "0.5em"; 
    208         td.appendChild(doc.createTextNode(Xinha._lc("Text align", "TableOperations") + ":")); 
    209         select = doc.createElement("select"); 
    210         select.style.marginLeft = select.style.marginRight = "0.5em"; 
    211         td.appendChild(select); 
    212         this.inputs.styles['textAlign'] = select; 
    213         options = ["Left", "Center", "Right", "Justify", "-"]; 
    214         if (tagname == "td")  
    215         { 
    216                 options.push("Char"); 
    217         } 
    218         input = doc.createElement("input"); 
    219         this.inputs.aux['textAlignChar'] = input; 
    220         input.name= 'fuck'; 
    221         input.size = "1"; 
    222         input.style.fontFamily = "monospace"; 
    223         td.appendChild(input); 
    224          
    225         for (var i = 0; i < options.length; ++i)  
    226         { 
    227                 var Val = options[i]; 
    228                 var val = Val.toLowerCase(); 
    229                 option = doc.createElement("option"); 
    230                 option.value = val; 
    231                 option.innerHTML = Xinha._lc(Val, "TableOperations"); 
    232                 option.selected = ((el.style.textAlign.toLowerCase() == val) || (el.style.textAlign == "" && Val == "-")); 
    233                 select.appendChild(option); 
    234         } 
    235         var textAlignCharInput = input; 
    236         function setCharVisibility(value) 
    237         { 
    238                 textAlignCharInput.style.visibility = value ? "visible" : "hidden"; 
    239                 if (value)  
    240                 { 
    241                         textAlignCharInput.focus(); 
    242                         textAlignCharInput.select(); 
    243                 } 
    244         } 
    245         select.onchange = function() 
    246         { 
    247                 setCharVisibility(this.value == "char"); 
    248         }; 
    249         setCharVisibility(select.value == "char"); 
    250          
    251         tr = doc.createElement("tr"); 
    252         tbody.appendChild(tr); 
    253         td = doc.createElement("td"); 
    254         td.className = "label"; 
    255         tr.appendChild(td); 
    256         td.innerHTML = Xinha._lc("Height", "TableOperations") + ":"; 
    257         td = doc.createElement("td"); 
    258         tr.appendChild(td); 
    259         input = doc.createElement("input"); 
    260         input.type = "text"; 
    261         input.value = Xinha.InlineStyler.getLength(el.style.height); 
    262         input.size = "5"; 
    263         this.inputs.styles['height'] = input; 
    264         input.style.marginRight = "0.5em"; 
    265         td.appendChild(input); 
    266         select = doc.createElement("select"); 
    267         this.inputs.aux['heightUnit'] = select; 
    268         option = doc.createElement("option"); 
    269         option.innerHTML = Xinha._lc("percent", "TableOperations"); 
    270         option.value = "%"; 
    271         option.selected = /%/.test(el.style.height); 
    272         select.appendChild(option); 
    273         option = doc.createElement("option"); 
    274         option.innerHTML = Xinha._lc("pixels", "TableOperations"); 
    275         option.value = "px"; 
    276         option.selected = /px/.test(el.style.height); 
    277         select.appendChild(option); 
    278         td.appendChild(select); 
    279          
    280         select.style.marginRight = "0.5em"; 
    281         td.appendChild(doc.createTextNode(Xinha._lc("Vertical align", "TableOperations") + ":")); 
    282         select = doc.createElement("select"); 
    283         this.inputs.styles['verticalAlign'] = select; 
    284         select.style.marginLeft = "0.5em"; 
    285         td.appendChild(select); 
    286         options = ["Top", "Middle", "Bottom", "Baseline", "-"]; 
    287         for (var i = 0; i < options.length; ++i)  
    288         { 
    289                 var Val = options[i]; 
    290                 var val = Val.toLowerCase(); 
    291                 option = doc.createElement("option"); 
    292                 option.value = val; 
    293                 option.innerHTML = Xinha._lc(Val, "TableOperations"); 
    294                 option.selected = ((el.style.verticalAlign.toLowerCase() == val) || (el.style.verticalAlign == "" && Val == "-")); 
    295                 select.appendChild(option); 
    296         } 
    297          
    298         return fieldset; 
     129  var self = this; 
     130  var editor = this.editor; 
     131  var doc = this.doc; 
     132  var el = this.element; 
     133  var fieldset = doc.createElement("fieldset"); 
     134  var legend = doc.createElement("legend"); 
     135  fieldset.appendChild(legend); 
     136  legend.innerHTML = Xinha._lc("Layout", "TableOperations"); 
     137  var table = doc.createElement("table"); 
     138  fieldset.appendChild(table); 
     139  table.style.width = "100%"; 
     140  var tbody = doc.createElement("tbody"); 
     141  table.appendChild(tbody); 
     142   
     143  var tagname = el.tagName.toLowerCase(); 
     144  var tr, td, input, select, option, options, i; 
     145   
     146  if (tagname != "td" && tagname != "tr" && tagname != "th")  
     147  { 
     148    tr = doc.createElement("tr"); 
     149    tbody.appendChild(tr); 
     150    td = doc.createElement("td"); 
     151    td.className = "label"; 
     152    tr.appendChild(td); 
     153    td.innerHTML = Xinha._lc("Float", "TableOperations") + ":"; 
     154    td = doc.createElement("td"); 
     155    tr.appendChild(td); 
     156    select = doc.createElement("select"); 
     157    td.appendChild(select); 
     158    this.inputs.styles['float'] = select; 
     159     
     160    options = ["None", "Left", "Right"]; 
     161    for (var i = 0; i < options.length; ++i)  
     162    { 
     163      var Val = options[i]; 
     164      var val = options[i].toLowerCase(); 
     165      option = doc.createElement("option"); 
     166      option.innerHTML = Xinha._lc(Val, "TableOperations"); 
     167      option.value = val; 
     168      if (Xinha.is_ie) { 
     169        option.selected = (("" + el.style.styleFloat).toLowerCase() == val); 
     170      } 
     171      else { 
     172        option.selected = (("" + el.style.cssFloat).toLowerCase() == val); 
     173      } 
     174      select.appendChild(option); 
     175    } 
     176  } 
     177   
     178  tr = doc.createElement("tr"); 
     179  tbody.appendChild(tr); 
     180  td = doc.createElement("td"); 
     181  td.className = "label"; 
     182  tr.appendChild(td); 
     183  td.innerHTML = Xinha._lc("Width", "TableOperations") + ":"; 
     184  td = doc.createElement("td"); 
     185  tr.appendChild(td); 
     186  input = doc.createElement("input"); 
     187  input.type = "text"; 
     188  input.value = Xinha.InlineStyler.getLength(el.style.width); 
     189  input.size = "5"; 
     190  this.inputs.styles['width'] = input; 
     191  input.style.marginRight = "0.5em"; 
     192  td.appendChild(input); 
     193  select = doc.createElement("select"); 
     194  this.inputs.aux['widthUnit'] = select; 
     195  option = doc.createElement("option"); 
     196  option.innerHTML = Xinha._lc("percent", "TableOperations"); 
     197  option.value = "%"; 
     198  option.selected = /%/.test(el.style.width); 
     199  select.appendChild(option); 
     200  option = doc.createElement("option"); 
     201  option.innerHTML = Xinha._lc("pixels", "TableOperations"); 
     202  option.value = "px"; 
     203  option.selected = /px/.test(el.style.width); 
     204  select.appendChild(option); 
     205  td.appendChild(select); 
     206   
     207  select.style.marginRight = "0.5em"; 
     208  td.appendChild(doc.createTextNode(Xinha._lc("Text align", "TableOperations") + ":")); 
     209  select = doc.createElement("select"); 
     210  select.style.marginLeft = select.style.marginRight = "0.5em"; 
     211  td.appendChild(select); 
     212  this.inputs.styles['textAlign'] = select; 
     213  options = ["Left", "Center", "Right", "Justify", "-"]; 
     214  if (tagname == "td")  
     215  { 
     216    options.push("Char"); 
     217  } 
     218  input = doc.createElement("input"); 
     219  this.inputs.aux['textAlignChar'] = input; 
     220  input.name= 'fuck'; 
     221  input.size = "1"; 
     222  input.style.fontFamily = "monospace"; 
     223  td.appendChild(input); 
     224   
     225  for (var i = 0; i < options.length; ++i)  
     226  { 
     227    var Val = options[i]; 
     228    var val = Val.toLowerCase(); 
     229    option = doc.createElement("option"); 
     230    option.value = val; 
     231    option.innerHTML = Xinha._lc(Val, "TableOperations"); 
     232    option.selected = ((el.style.textAlign.toLowerCase() == val) || (el.style.textAlign == "" && Val == "-")); 
     233    select.appendChild(option); 
     234  } 
     235  var textAlignCharInput = input; 
     236  function setCharVisibility(value) 
     237  { 
     238    textAlignCharInput.style.visibility = value ? "visible" : "hidden"; 
     239    if (value)  
     240    { 
     241      textAlignCharInput.focus(); 
     242      textAlignCharInput.select(); 
     243    } 
     244  } 
     245  select.onchange = function() 
     246  { 
     247    setCharVisibility(this.value == "char"); 
     248  }; 
     249  setCharVisibility(select.value == "char"); 
     250   
     251  tr = doc.createElement("tr"); 
     252  tbody.appendChild(tr); 
     253  td = doc.createElement("td"); 
     254  td.className = "label"; 
     255  tr.appendChild(td); 
     256  td.innerHTML = Xinha._lc("Height", "TableOperations") + ":"; 
     257  td = doc.createElement("td"); 
     258  tr.appendChild(td); 
     259  input = doc.createElement("input"); 
     260  input.type = "text"; 
     261  input.value = Xinha.InlineStyler.getLength(el.style.height); 
     262  input.size = "5"; 
     263  this.inputs.styles['height'] = input; 
     264  input.style.marginRight = "0.5em"; 
     265  td.appendChild(input); 
     266  select = doc.createElement("select"); 
     267  this.inputs.aux['heightUnit'] = select; 
     268  option = doc.createElement("option"); 
     269  option.innerHTML = Xinha._lc("percent", "TableOperations"); 
     270  option.value = "%"; 
     271  option.selected = /%/.test(el.style.height); 
     272  select.appendChild(option); 
     273  option = doc.createElement("option"); 
     274  option.innerHTML = Xinha._lc("pixels", "TableOperations"); 
     275  option.value = "px"; 
     276  option.selected = /px/.test(el.style.height); 
     277  select.appendChild(option); 
     278  td.appendChild(select); 
     279   
     280  select.style.marginRight = "0.5em"; 
     281  td.appendChild(doc.createTextNode(Xinha._lc("Vertical align", "TableOperations") + ":")); 
     282  select = doc.createElement("select"); 
     283  this.inputs.styles['verticalAlign'] = select; 
     284  select.style.marginLeft = "0.5em"; 
     285  td.appendChild(select); 
     286  options = ["Top", "Middle", "Bottom", "Baseline", "-"]; 
     287  for (var i = 0; i < options.length; ++i)  
     288  { 
     289    var Val = options[i]; 
     290    var val = Val.toLowerCase(); 
     291    option = doc.createElement("option"); 
     292    option.value = val; 
     293    option.innerHTML = Xinha._lc(Val, "TableOperations"); 
     294    option.selected = ((el.style.verticalAlign.toLowerCase() == val) || (el.style.verticalAlign == "" && Val == "-")); 
     295    select.appendChild(option); 
     296  } 
     297   
     298  return fieldset; 
    299299}; 
    300300 
     
    304304Xinha.InlineStyler.prototype.createStyleFieldset = function() 
    305305{ 
    306         var editor = this.editor; 
    307         var doc = this.doc; 
    308         var el = this.element; 
    309          
    310         var fieldset = doc.createElement("fieldset"); 
    311         var legend = doc.createElement("legend"); 
    312         fieldset.appendChild(legend); 
    313         legend.innerHTML = Xinha._lc("CSS Style", "TableOperations"); 
    314         var table = doc.createElement("table"); 
    315         fieldset.appendChild(table); 
    316         table.style.width = "100%"; 
    317         var tbody = doc.createElement("tbody"); 
    318         table.appendChild(tbody); 
    319          
    320         var tr, td, input, select, option, options, i; 
    321          
    322         tr = doc.createElement("tr"); 
    323         tbody.appendChild(tr); 
    324         td = doc.createElement("td"); 
    325         tr.appendChild(td); 
    326         td.className = "label"; 
    327         td.innerHTML = Xinha._lc("Background", "TableOperations") + ":"; 
    328         td = doc.createElement("td"); 
    329         tr.appendChild(td); 
    330  
    331         input = doc.createElement("input"); 
    332         input.value = Xinha._colorToRgb( el.style.backgroundColor ); 
    333         input.type = "hidden"; 
    334         this.inputs.styles['backgroundColor'] = input; 
    335         input.style.marginRight = "0.5em"; 
    336         td.appendChild(input); 
    337         new Xinha.colorPicker.InputBinding(input) 
    338          
    339         td.appendChild(doc.createTextNode(Xinha._lc("Image URL", "TableOperations") + ": ")); 
    340         input = doc.createElement("input"); 
    341         input.type = "text"; 
    342         this.inputs.styles['backgroundImage'] = input; 
    343         if (el.style.backgroundImage.match(/url\(\s*(.*?)\s*\)/))  
    344         { 
    345                 input.value = RegExp.$1; 
    346         } 
    347         // input.style.width = "100%"; 
    348         td.appendChild(input); 
    349          
    350         tr = doc.createElement("tr"); 
    351         tbody.appendChild(tr); 
    352         td = doc.createElement("td"); 
    353         tr.appendChild(td); 
    354         td.className = "label"; 
    355         td.innerHTML = Xinha._lc("FG Color", "TableOperations") + ":"; 
    356         td = doc.createElement("td"); 
    357         tr.appendChild(td); 
    358         input = doc.createElement("input"); 
    359         input.value = Xinha._colorToRgb( el.style.color ); 
    360         input.type = "hidden"; 
    361         this.inputs.styles['color'] = input; 
    362         input.style.marginRight = "0.5em"; 
    363         td.appendChild(input); 
    364         new Xinha.colorPicker.InputBinding(input) 
    365          
    366         // for better alignment we include an invisible field. 
    367         input = doc.createElement("input"); 
    368         input.style.visibility = "hidden"; 
    369         input.type = "text"; 
    370         td.appendChild(input); 
    371          
    372         tr = doc.createElement("tr"); 
    373         tbody.appendChild(tr); 
    374         td = doc.createElement("td"); 
    375         tr.appendChild(td); 
    376         td.className = "label"; 
    377         td.innerHTML = Xinha._lc("Border", "TableOperations") + ":"; 
    378         td = doc.createElement("td"); 
    379         tr.appendChild(td); 
    380         input = doc.createElement("input"); 
    381         input.value = Xinha._colorToRgb( el.style.borderColor ); 
    382         input.type = "hidden"; 
    383         this.inputs.styles['borderColor'] = input; 
    384         input.style.marginRight = "0.5em"; 
    385         td.appendChild(input); 
    386         new Xinha.colorPicker.InputBinding(input) 
    387          
    388         select = doc.createElement("select"); 
    389         var borderFields = []; 
    390         td.appendChild(select); 
    391         this.inputs.styles['borderStyle'] = select; 
    392         options = ["none", "dotted", "dashed", "solid", "double", "groove", "ridge", "inset", "outset"]; 
    393         var currentBorderStyle = el.style.borderStyle; 
    394         // Gecko reports "solid solid solid solid" for "border-style: solid". 
    395         // That is, "top right bottom left" -- we only consider the first 
    396         // value. 
    397         if (currentBorderStyle.match(/([^\s]*)\s/)) currentBorderStyle = RegExp.$1; 
    398         for (var i=0;i<options.length;i++) { 
    399                 var val = options[i]; 
    400                 option = doc.createElement("option"); 
    401                 option.value = val; 
    402                 option.innerHTML = val; 
    403                 if (val == currentBorderStyle) option.selected = true; 
    404                 select.appendChild(option); 
    405         } 
    406         select.style.marginRight = "0.5em"; 
    407         function setBorderFieldsStatus(value) 
    408         { 
    409                 for (var i = 0; i < borderFields.length; ++i)  
    410                 { 
    411                         var el = borderFields[i]; 
    412                         el.style.visibility = value ? "hidden" : "visible"; 
    413                         if (!value && (el.tagName.toLowerCase() == "input"))  
    414                         { 
    415                                 el.focus(); 
    416                                 el.select(); 
    417                         } 
    418                 } 
    419         } 
    420         select.onchange = function() 
    421         { 
    422                 setBorderFieldsStatus(this.value == "none"); 
    423         }; 
    424          
    425         input = doc.createElement("input"); 
    426         borderFields.push(input); 
    427         input.type = "text"; 
    428         this.inputs.styles['borderWidth'] = input; 
    429         input.value = Xinha.InlineStyler.getLength(el.style.borderWidth); 
    430         input.size = "5"; 
    431         td.appendChild(input); 
    432         input.style.marginRight = "0.5em"; 
    433         var span = doc.createElement("span"); 
    434         span.innerHTML = Xinha._lc("pixels", "TableOperations"); 
    435         td.appendChild(span); 
    436         borderFields.push(span); 
    437          
    438         setBorderFieldsStatus(select.value == "none"); 
    439          
    440         if (el.tagName.toLowerCase() == "table")  
    441         { 
    442                 // the border-collapse style is only for tables 
    443                 tr = doc.createElement("tr"); 
    444                 tbody.appendChild(tr); 
    445                 td = doc.createElement("td"); 
    446                 td.className = "label"; 
    447                 tr.appendChild(td); 
    448                 input = doc.createElement("input"); 
    449                 input.type = "checkbox"; 
    450                 this.inputs.styles['borderCollapse'] = input; 
    451                 input.id = "f_st_borderCollapse"; 
    452                 var val = (/collapse/i.test(el.style.borderCollapse)); 
    453                 input.checked = val ? 1 : 0; 
    454                 td.appendChild(input); 
    455                  
    456                 td = doc.createElement("td"); 
    457                 tr.appendChild(td); 
    458                 var label = doc.createElement("label"); 
    459                 label.htmlFor = "f_st_borderCollapse"; 
    460                 label.innerHTML = Xinha._lc("Collapsed borders", "TableOperations"); 
    461                 td.appendChild(label); 
    462         } 
    463          
    464         //      tr = doc.createElement("tr"); 
    465         //      tbody.appendChild(tr); 
    466         //      td = doc.createElement("td"); 
    467         //      td.className = "label"; 
    468         //      tr.appendChild(td); 
    469         //      td.innerHTML = Xinha._lc("Margin", "TableOperations") + ":"; 
    470         //      td = doc.createElement("td"); 
    471         //      tr.appendChild(td); 
    472         //      input = doc.createElement("input"); 
    473         //      input.type = "text"; 
    474         //      input.size = "5"; 
    475         //      input.name = "f_st_margin"; 
    476         //      td.appendChild(input); 
    477         //      input.style.marginRight = "0.5em"; 
    478         //      td.appendChild(doc.createTextNode(Xinha._lc("Padding", "TableOperations") + ":")); 
    479          
    480         //      input = doc.createElement("input"); 
    481         //      input.type = "text"; 
    482         //      input.size = "5"; 
    483         //      input.name = "f_st_padding"; 
    484         //      td.appendChild(input); 
    485         //      input.style.marginLeft = "0.5em"; 
    486         //      input.style.marginRight = "0.5em"; 
    487         //      td.appendChild(doc.createTextNode(Xinha._lc("pixels", "TableOperations"))); 
    488          
    489         return fieldset; 
     306  var editor = this.editor; 
     307  var doc = this.doc; 
     308  var el = this.element; 
     309   
     310  var fieldset = doc.createElement("fieldset"); 
     311  var legend = doc.createElement("legend"); 
     312  fieldset.appendChild(legend); 
     313  legend.innerHTML = Xinha._lc("CSS Style", "TableOperations"); 
     314  var table = doc.createElement("table"); 
     315  fieldset.appendChild(table); 
     316  table.style.width = "100%"; 
     317  var tbody = doc.createElement("tbody"); 
     318  table.appendChild(tbody); 
     319   
     320  var tr, td, input, select, option, options, i; 
     321   
     322  tr = doc.createElement("tr"); 
     323  tbody.appendChild(tr); 
     324  td = doc.createElement("td"); 
     325  tr.appendChild(td); 
     326  td.className = "label"; 
     327  td.innerHTML = Xinha._lc("Background", "TableOperations") + ":"; 
     328  td = doc.createElement("td"); 
     329  tr.appendChild(td); 
     330 
     331  input = doc.createElement("input"); 
     332  input.value = Xinha._colorToRgb( el.style.backgroundColor ); 
     333  input.type = "hidden"; 
     334  this.inputs.styles['backgroundColor'] = input; 
     335  input.style.marginRight = "0.5em"; 
     336  td.appendChild(input); 
     337  new Xinha.colorPicker.InputBinding(input) 
     338   
     339  td.appendChild(doc.createTextNode(Xinha._lc("Image URL", "TableOperations") + ": ")); 
     340  input = doc.createElement("input"); 
     341  input.type = "text"; 
     342  this.inputs.styles['backgroundImage'] = input; 
     343  if (el.style.backgroundImage.match(/url\(\s*(.*?)\s*\)/))  
     344  { 
     345    input.value = RegExp.$1; 
     346  } 
     347  // input.style.width = "100%"; 
     348  td.appendChild(input); 
     349   
     350  tr = doc.createElement("tr"); 
     351  tbody.appendChild(tr); 
     352  td = doc.createElement("td"); 
     353  tr.appendChild(td); 
     354  td.className = "label"; 
     355  td.innerHTML = Xinha._lc("FG Color", "TableOperations") + ":"; 
     356  td = doc.createElement("td"); 
     357  tr.appendChild(td); 
     358  input = doc.createElement("input"); 
     359  input.value = Xinha._colorToRgb( el.style.color ); 
     360  input.type = "hidden"; 
     361  this.inputs.styles['color'] = input; 
     362  input.style.marginRight = "0.5em"; 
     363  td.appendChild(input); 
     364  new Xinha.colorPicker.InputBinding(input) 
     365   
     366  // for better alignment we include an invisible field. 
     367  input = doc.createElement("input"); 
     368  input.style.visibility = "hidden"; 
     369  input.type = "text"; 
     370  td.appendChild(input); 
     371   
     372  tr = doc.createElement("tr"); 
     373  tbody.appendChild(tr); 
     374  td = doc.createElement("td"); 
     375  tr.appendChild(td); 
     376  td.className = "label"; 
     377  td.innerHTML = Xinha._lc("Border", "TableOperations") + ":"; 
     378  td = doc.createElement("td"); 
     379  tr.appendChild(td); 
     380  input = doc.createElement("input"); 
     381  input.value = Xinha._colorToRgb( el.style.borderColor ); 
     382  input.type = "hidden"; 
     383  this.inputs.styles['borderColor'] = input; 
     384  input.style.marginRight = "0.5em"; 
     385  td.appendChild(input); 
     386  new Xinha.colorPicker.InputBinding(input) 
     387   
     388  select = doc.createElement("select"); 
     389  var borderFields = []; 
     390  td.appendChild(select); 
     391  this.inputs.styles['borderStyle'] = select; 
     392  options = ["none", "dotted", "dashed", "solid", "double", "groove", "ridge", "inset", "outset"]; 
     393  var currentBorderStyle = el.style.borderStyle; 
     394  // Gecko reports "solid solid solid solid" for "border-style: solid". 
     395  // That is, "top right bottom left" -- we only consider the first 
     396  // value. 
     397  if (currentBorderStyle.match(/([^\s]*)\s/)) currentBorderStyle = RegExp.$1; 
     398  for (var i=0;i<options.length;i++) { 
     399    var val = options[i]; 
     400    option = doc.createElement("option"); 
     401    option.value = val; 
     402    option.innerHTML = val; 
     403    if (val == currentBorderStyle) option.selected = true; 
     404    select.appendChild(option); 
     405  } 
     406  select.style.marginRight = "0.5em"; 
     407  function setBorderFieldsStatus(value) 
     408  { 
     409    for (var i = 0; i < borderFields.length; ++i)  
     410    { 
     411      var el = borderFields[i]; 
     412      el.style.visibility = value ? "hidden" : "visible"; 
     413      if (!value && (el.tagName.toLowerCase() == "input"))  
     414      { 
     415        el.focus(); 
     416        el.select(); 
     417      } 
     418    } 
     419  } 
     420  select.onchange = function() 
     421  { 
     422    setBorderFieldsStatus(this.value == "none"); 
     423  }; 
     424   
     425  input = doc.createElement("input"); 
     426  borderFields.push(input); 
     427  input.type = "text"; 
     428  this.inputs.styles['borderWidth'] = input; 
     429  input.value = Xinha.InlineStyler.getLength(el.style.borderWidth); 
     430  input.size = "5"; 
     431  td.appendChild(input); 
     432  input.style.marginRight = "0.5em"; 
     433  var span = doc.createElement("span"); 
     434  span.innerHTML = Xinha._lc("pixels", "TableOperations"); 
     435  td.appendChild(span); 
     436  borderFields.push(span); 
     437   
     438  setBorderFieldsStatus(select.value == "none"); 
     439   
     440  if (el.tagName.toLowerCase() == "table")  
     441  { 
     442    // the border-collapse style is only for tables 
     443    tr = doc.createElement("tr"); 
     444    tbody.appendChild(tr); 
     445    td = doc.createElement("td"); 
     446    td.className = "label"; 
     447    tr.appendChild(td); 
     448    input = doc.createElement("input"); 
     449    input.type = "checkbox"; 
     450    this.inputs.styles['borderCollapse'] = input; 
     451    input.id = "f_st_borderCollapse"; 
     452    var val = (/collapse/i.test(el.style.borderCollapse)); 
     453    input.checked = val ? 1 : 0; 
     454    td.appendChild(input); 
     455     
     456    td = doc.createElement("td"); 
     457    tr.appendChild(td); 
     458    var label = doc.createElement("label"); 
     459    label.htmlFor = "f_st_borderCollapse"; 
     460    label.innerHTML = Xinha._lc("Collapsed borders", "TableOperations"); 
     461    td.appendChild(label); 
     462  } 
     463   
     464  //    tr = doc.createElement("tr"); 
     465  //    tbody.appendChild(tr); 
     466  //    td = doc.createElement("td"); 
     467  //    td.className = "label"; 
     468  //    tr.appendChild(td); 
     469  //    td.innerHTML = Xinha._lc("Margin", "TableOperations") + ":"; 
     470  //    td = doc.createElement("td"); 
     471  //    tr.appendChild(td); 
     472  //    input = doc.createElement("input"); 
     473  //    input.type = "text"; 
     474  //    input.size = "5"; 
     475  //    input.name = "f_st_margin"; 
     476  //    td.appendChild(input); 
     477  //    input.style.marginRight = "0.5em"; 
     478  //    td.appendChild(doc.createTextNode(Xinha._lc("Padding", "TableOperations") + ":")); 
     479   
     480  //    input = doc.createElement("input"); 
     481  //    input.type = "text"; 
     482  //    input.size = "5"; 
     483  //    input.name = "f_st_padding"; 
     484  //    td.appendChild(input); 
     485  //    input.style.marginLeft = "0.5em"; 
     486  //    input.style.marginRight = "0.5em"; 
     487  //    td.appendChild(doc.createTextNode(Xinha._lc("pixels", "TableOperations"))); 
     488   
     489  return fieldset; 
    490490}; 
Note: See TracChangeset for help on using the changeset viewer.