Squiz Matrix  4.12.2
 All Data Structures Namespaces Functions Variables Pages
edit_table.php
1 <?php
25 require_once dirname(__FILE__).'/../../wysiwyg_plugin.inc';
26 $wysiwyg = null;
27 $plugin = new wysiwyg_plugin($wysiwyg);
28 ?>
29 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
30 <html xmlns="http://www.w3.org/1999/xhtml">
31 <head>
32  <title>Tables</title>
33  <style type="text/css">
34  html, body {
35  height: 700px;
36  width: 850px;
37  overflow: hidden;
38  font: 11px Tahoma,Verdana,sans-serif;
39  }
40 
41  body {
42  overflow: hidden;
43  }
44 
45  .colors td {
46  border: solid 1px #000
47  }
48 
49  label,input,select,textarea {
50  display: block;
51  width: 150px;
52  float: left;
53  margin-bottom: 10px;
54  }
55 
56  label {
57  text-align: right;
58  font: 10pt "Lucida Grande", Tahoma, Arial, Helvetica;
59  width: 75px;
60  padding-right: 20px;
61  font: 11px Tahoma,Verdana,sans-serif;
62  }
63 
64  legend {
65  font: 11px Tahoma,Verdana,sans-serif;
66  font-weight: bold;
67  }
68 
69  br {
70  clear: left;
71  }
72 
73  button {
74  width: 70px;
75  font: 11px Tahoma,Verdana,sans-serif;
76  }
77 
78  form { padding: 0px; margin: 0px; }
79 
80  .title {
81  position: absolute;
82  width: 800px;
83  top: 2px;
84  left: 1px;
85  height: 16px;
86  margin: 10px;
87  background: #402F48;
88  color: #FFFFFF;
89  font-weight: bold;
90  font-size: 120%;
91  padding: 3px 10px;
92  border-bottom: 1px solid black;
93  letter-spacing: 2px;
94  }
95 
96  #panels {
97  position: absolute;
98  width: 300px;
99  top: 26px;
100  left: 510px;
101  height: 650px;
102  margin: 10px;
103  border: solid 0px #CCC;
104  padding: 1px;
105  overflow: auto;
106  background: #FFF;
107  }
108 
109  #table_container {
110  position: absolute;
111  top: 50px;
112  left: 10px;
113  width: 500px;
114  height: 500px;
115  overflow: auto;
116  background: url(images/grid.gif)
117  }
118 
119  fieldset {
120  padding: 0px 10px 5px 5px;
121  border: solid 1px #725B7D;
122  }
123  </style>
124  <script type="text/javascript" src="../../core/popup.js"></script>
125  <script type="text/javascript" src="../../core/dialog.js"></script>
126  <script type="text/javascript">
127  //<![CDATA[
128 
129  var testtable = '<table id="test2" border="1" cellpadding="0" cellspacing="1" style="width:400px;background:#CCC;background-color:#CCC; background-image:url(images/i.gif)" summary="test2" onclick="if (this.id=\'test4\') {alert(\'s\');}">' +
130  '<caption>Caption</caption>'+
131  '<tr>'+
132  '<td id="test_td0_0" colspan="3" align="center" style="border-color:#000;border-style:solid;border-width:1px;background-color:#6CF;">&nbsp;</td>'+
133  '</tr>'+
134  '<tr>'+
135  '<td id="test_td1_0" rowspan="2" align="center" style="border-color:#000;border-style:solid;border-width:1px;background-color:#30F;">&nbsp;</td>'+
136  '<td id="test_td1_1" headers="test_td1_0 test_td0_0 ">test</td>'+
137  '<td id="test_td1_2" headers="test_td0_0 test_td1_0 ">&nbsp;</td>'+
138  '</tr>'+
139  '<tr>'+
140  '<td id="test_td2_1" headers="test_td0_0 test_td1_0 ">&nbsp;</td>'+
141  '<td id="test_td2_2" headers="test_td0_0 test_td1_0 ">&nbsp;</td>'+
142  '</tr>'+
143  '</table>';
144 
145  var table;
146  var init_finished = false;
147 
148  function Init() {
149  __dlg_init("editTableProperties");
150  table = new TTable("table");
151  table.Import(window.dialogArguments.table_structure);
152 
153  // initialise the drop down for css/html table width
154  if (table.width != "") {
155  switchWidthView('css');
156  } else if (table.htmlwidth != "") {
157  switchWidthView('html');
158  }
159  //alert("style="+table.borderStyle+"\nborder="+ table.border+"\nhtmlborder="+table.htmlborder);
160  // initialise the drop down for css/html table border
161  if (table.border != null && table.border != "") {
162  switchBorderView('css');
163  } else {
164  switchBorderView('html');
165  }
166 
167  window.focus();
168  init_finished = true;
169  };
170 
171  function onOK() {
172  var message = "";
173  var obj = "";
174  if (document.getElementById("tid").value == "") {
175  message = "Table ID is blank. Continue?";
176  obj = document.getElementById("tid");
177  }
178  if (message == "" || (message != "" && confirm(message) == true)) {
179  __dlg_close("editTableProperties", table.Export());
180  } else {
181  switchPanels('table');
182  obj.select();
183  }
184  return false;
185 
186  };
187 
188  function onCancel() {
189  __dlg_close("editTableProperties", null);
190  return false;
191 
192  };
193 
194  // Called to avoid the mouse move event being called prematurely
195  function onMove(event) {
196  if ((init_finished == false) || (table.selector == 'table')) return false;
197  table.mouse.Move(event);
198  return false;
199 
200  };
201 
202  //Function to switch between the UI elements for each selector
203  function switchPanels(_selector) {
204  table.selector = _selector;
205  var panels = new Array('cell', 'row', 'table', 'col');
206  var i = 0;
207  while (i < panels.length) {
208  var panel = document.getElementById(panels[i] + '_panel');
209  var button = document.getElementById('button_' + panels[i]);
210  if (table.selector == panels[i]) {
211  panel.style.display = "";
212  button.style.border = "2px solid #FF8040";
213  if (table.r != null) {
214  if (table.c == null) {
215  table.select(document.getElementById("td" + table.r + "_0"));
216  } else {
217  table.select(document.getElementById("td" + table.r + "_" + table.c));
218  }
219  }
220  } else {
221  panel.style.display = "none";
222  button.style.border = "0";
223  }
224  i++;
225  }
226  return false;
227 
228  };
229 
230  function switchWidthView(value) {
231  document.getElementById("widthView").value = value;
232  if (value == 'css') {
233  document.getElementById('width').style['display'] = '';
234  document.getElementById('widthtype').style['display'] = '';
235  document.getElementById('htmlwidth').style['display'] = 'none';
236  document.getElementById('htmlwidthtype').style['display'] = 'none';
237  table.setHTMLWidth("");
238  table.setWidth(parseInt(document.getElementById('width').value) + document.getElementById('widthtype').value);
239  } else if (value == 'html') {
240  document.getElementById('width').style['display'] = 'none';
241  document.getElementById('widthtype').style['display'] = 'none';
242  document.getElementById('htmlwidth').style['display'] = '';
243  document.getElementById('htmlwidthtype').style['display'] = '';
244  table.setHTMLWidth(parseInt(document.getElementById('htmlwidth').value) + document.getElementById('htmlwidthtype').value);
245  table.setWidth("");
246  }
247 
248  }
249 
250  function switchBorderView(value) {
251  document.getElementById("borderView").value = value;
252  if (value == 'css') {
253  document.getElementById('table_border').style['display'] = '';
254  document.getElementById('table_bordertype').style['display'] = '';
255  document.getElementById('html_table_border').style['display'] = 'none';
256  table.setTableHtmlBorder("");
257  table.setElementBorder(document.getElementById('table_border').value, document.getElementById('table_bordertype').value);
258  } else if (value == 'html') {
259  document.getElementById('table_border').style['display'] = 'none';
260  document.getElementById('table_bordertype').style['display'] = 'none';
261  document.getElementById('html_table_border').style['display'] = '';
262  table.setTableHtmlBorder(document.getElementById('html_table_border').value);
263  table.setElementBorder("", "");
264  }
265 
266  }
267 
268  //]]>
269  </script>
270  <script type="text/javascript" src="table-editor.js"></script>
271 </head>
272 <body onload="Init();">
273 
274  <span class="title">Table Properties</span>
275 
276  <div id="table_container" onmousemove="onMove(event)" onmouseout="if(init_finished) table.mouse.Out();"></div>
277 
278  <div id="mouse_pointers">
279  <img alt="" src="images/mousec.gif" id="mtable" style="position:absolute;display:none" />
280  <img alt="" src="images/mousec.gif" id="mcell" style="position:absolute;display:none" />
281  <img alt="" src="images/mouser.gif" id="mrow" style="position:absolute;display:none" />
282  <img alt="" src="images/mouseh.gif" id="mhead" style="position:absolute;display:none" />
283  <img alt="" src="images/mousecol.gif" id="mcol" style="position:absolute;display:none" />
284  </div>
285 
286  <div id="panels">
287  <fieldset id="global_panel">
288  <legend><?php echo translate('selectors'); ?></legend>
289  <div>
290  <img id ="button_table" style="border: 2px solid #FF8040;" alt="" src="images/mtable.gif" onclick="switchPanels('table');" />
291  <img id ="button_cell" style="border: 0px solid #FF8040;" alt="" src="images/mc.gif" onclick="switchPanels('cell');" />
292  <img id ="button_row" style="border: 0px solid #FF8040;" alt="" src="images/mr.gif" onclick="switchPanels('row');" />
293  <img id ="button_col" style="border: 0px solid #FF8040;" alt="" src="images/mcol.gif" onclick="switchPanels('col');" />
294  </div>
295  </fieldset>
296 
297  <!-- Properties for the table selector -->
298  <fieldset id="table_panel">
299  <legend><?php echo translate('table'); ?></legend>
300  <label for="tid"><?php echo translate('id'); ?></label>
301  <input id="tid" name="tid" onkeyup="table.setID(this.value)" /><br />
302  <label for="caption"><?php echo translate('caption'); ?>:</label>
303  <input id="caption" name="caption" onkeyup="table.setCaption(this.value)"/><br />
304  <hr />
305  <label for="class">Class Name:</label>
306  <input id="class" name="class" onkeyup="table.setClass(this.value)" /><br />
307 
308  <!-- table html/css width -->
309  <label for="width"><?php echo translate('width'); ?>:</label>
310  <select id="widthView" onChange="switchWidthView(this.value)" style="width:65px">
311  <option value="html">HTML</option>
312  <option value="css" selected="1">CSS</option>
313  </select>
314  <input id="width" name="width" onkeyup="table.setWidth(parseInt(document.getElementById('width').value) + document.getElementById('widthtype').value)" style="width:50px" />
315  <select id="widthtype" name="widthtype" style="width:45px" onchange="table.setWidth(parseInt(document.getElementById('width').value) + document.getElementById('widthtype').value)">
316  <option value="px">px</option>
317  <option value="%" selected="selected">%</option>
318  <option value="pt">pt</option>
319  <option value="em">em</option>
320  <option value="ex">ex</option>
321  </select>
322  <input id="htmlwidth" name="htmlwidth" onkeyup="table.setHTMLWidth(parseInt(document.getElementById('htmlwidth').value) + document.getElementById('htmlwidthtype').value)" style="width:50px" />
323  <select id="htmlwidthtype" name="htmlwidthtype" style="width:45px" onchange="table.setHTMLWidth(parseInt(document.getElementById('htmlwidth').value) + document.getElementById('htmlwidthtype').value)">
324  <option value="">px</option>
325  <option value="%" selected="selected">%</option>
326  </select>
327 
328  <!-- table html/css border -->
329  <label for="table_border"><?php echo translate('border'); ?>:</label>
330  <select id="borderView" onChange="switchBorderView(this.value)" style="width:65px">
331  <option value="html">HTML</option>
332  <option value="css" selected="1">CSS</option>
333  </select>
334  <input id="table_border" name="table_border" style="width: 40px" onkeyup="table.setElementBorder((parseInt(document.getElementById('table_border').value)), document.getElementById('table_bordertype').value);" value="0" />
335  <select id="table_bordertype" name="table_bordertype" style="width:70px" onchange="table.setElementBorder((parseInt(document.getElementById('table_border').value)), document.getElementById('table_bordertype').value);" >
336  <option value="solid" selected="selected">solid</option>
337  <option value="dotted">dotted</option>
338  <option value="dashed">dashed</option>
339  <option value="double">double</option>
340  <option value="groove">groove</option>
341  <option value="ridge">ridge</option>
342  <option value="inset">inset</option>
343  <option value="outset">outset</option>
344  <option value="none">none</option>
345  <option value="hidden">hidden</option>
346  </select>
347  <input id="html_table_border" name="html_table_border" style="width: 50px" onkeyup="table.setTableHtmlBorder(parseInt(document.getElementById('html_table_border').value));" value="0" /><br />
348 
349  <label for="cellspacing"><?php echo translate('cell_spacing'); ?>:</label>
350  <input id="cellspacing" name="cellspacing" onkeyup="table.setCellSpacing(parseInt(this.value))" value=""/><br />
351  <label for="cellpadding"><?php echo translate('cell_padding'); ?>:</label>
352  <input id="cellpadding" name="cellpadding" onkeyup="table.setCellPadding(parseInt(this.value))" value=""/><br />
353  <hr />
354  <label for="summary"><?php echo translate('summary'); ?>:</label>
355  <textarea id="summary" cols="10" rows="3" onkeyup="table.setSummary(this.value)"></textarea>
356  <label for="frame"><?php echo translate('frame'); ?>:</label>
357  <select id="frame" name="frame" onchange="table.setFrame(this.value)">
358  <option value=""><?php echo strtolower(translate('empty')); ?></option>
359  <option value="void"><?php echo translate('no_sides'); ?></option>
360  <option value="above"><?php echo translate('the_top_side_only'); ?></option>
361  <option value="below"><?php echo translate('the_bottom_side_only'); ?></option>
362  <option value="hsides"><?php echo translate('the_top_and_bottom_sides_only'); ?></option>
363  <option value="vsides"><?php echo translate('the_right_and_left_sides_only'); ?></option>
364  <option value="lhs"><?php echo translate('the_left-hand_side_only'); ?></option>
365  <option value="rhs"><?php echo translate('the_right-hand_side_only'); ?></option>
366  <option value="box"><?php echo translate('all_four_sides'); ?></option>
367  </select><br />
368  <label for="rules"><?php echo translate('rules'); ?>:</label>
369  <select id="rules" name="rules" onchange="table.setRules(this.value)">
370  <option value=""><?php echo strtolower(translate('empty')); ?></option>
371  <option value="none"><?php echo translate('no_rules'); ?></option>
372  <option value="rows"><?php echo translate('rules_will_appear_between_rows_only'); ?></option>
373  <option value="cols"><?php echo translate('rules_will_appear_between_columns_only'); ?></option>
374  <option value="all"><?php echo translate('rules_will_appear_between_all_rows_and_columns'); ?></option>
375  </select><br />
376  </fieldset>
377 
378  <!-- Properties for the row selector -->
379  <fieldset id="row_panel" style="display:none">
380  <legend><?php echo translate('row_properties') ?></legend>
381  <label for="row_class">Class Name:</label>
382  <input id="row_class" name="row_class" onkeyup="table.setRowClass(document.getElementById('row_class').value)" disabled="disabled"/><br />
383  <label for="row_width"><?php echo 'Height' ?></label>
384  <input id="row_width" name="row_width" onkeyup="table.setRowHeight(parseInt(document.getElementById('row_width').value) + document.getElementById('row_widthtype').value)" style="width:100px" value="100" disabled="disabled"/>
385  <select id="row_widthtype" name="row_widthtype" style="width:50px" onchange="table.setRowHeight(parseInt(document.getElementById('row_width').value) + document.getElementById('row_widthtype').value)" disabled="disabled">
386  <option value="px">px</option>
387  <option value="%" selected="selected">%</option>
388  <option value="pt">pt</option>
389  <option value="em">em</option>
390  <option value="ex">ex</option>
391  </select><br />
392  <label for="row_border"><?php echo translate('border'); ?></label>
393  <input id="row_border" name="row_border" style="width:50px" onkeyup="table.setElementBorder((parseInt(document.getElementById('row_border').value)), document.getElementById('row_bordertype').value);" value="0" disabled="disabled" />
394  <select id="row_bordertype" name="row_bordertype" style="width:80px" onchange="table.setElementBorder((parseInt(document.getElementById('row_border').value)), document.getElementById('row_bordertype').value);" disabled="disabled">
395  <option value="solid" selected="selected">solid</option>
396  <option value="dotted">dotted</option>
397  <option value="dashed">dashed</option>
398  <option value="double">double</option>
399  <option value="groove">groove</option>
400  <option value="ridge">ridge</option>
401  <option value="inset">inset</option>
402  <option value="outset">outset</option>
403  <option value="none">none</option>
404  <option value="hidden">hidden</option>
405  </select>
406  <br />
407  <hr />
408  <label><?php echo 'Modify'; ?></label>
409  <img id="row_add" alt="Add Row" title="Add Row" src="images/addrow.gif" onclick="if (table.lastSelect == 'row') table.addrow();" />
410  <img id="row_delete" alt="Delete Row" title="Delete Row" src="images/delrow.gif" onclick="if (table.lastSelect == 'row') table.delrow();" />
411  <img alt="divider" src="images/div.gif" />
412  <img id="row_THead" alt="Head Cells" title="Head Cell" src="images/th.gif" onclick="if (table.lastSelect == 'row') table.th();"/><br />
413  <label><?php echo 'Horizontal'; ?></label>
414  <img id="row_aleft" title="Align Left" alt="Align Left" src="images/al.gif" onclick="if (table.lastSelect == 'row') table.setAlign('left');" />
415  <img id="row_acenter" title="Align Center" alt="Align Center" src="images/ac.gif" onclick="if (table.lastSelect == 'row') table.setAlign('center');" />
416  <img id="row_aright" title="Align Right" alt="Align Right" src="images/ar.gif" onclick="if (table.lastSelect == 'row') table.setAlign('right');" /><br />
417  <label><?php echo 'Vertical'; ?></label>
418  <img id="row_atop" title="Align Top" alt="Align Top" src="images/at.gif" onclick="if (table.lastSelect == 'row') table.setVAlign('top');" />
419  <img id="row_amiddle" title="Align Middle" alt="Align Middle" src="images/am.gif" onclick="if (table.lastSelect == 'row') table.setVAlign('middle');" />
420  <img id="row_abottom" title="Align Bottom" alt="Align Bottom" src="images/ab.gif" onclick="if (table.lastSelect == 'row') table.setVAlign('bottom');" /><br />
421  </fieldset>
422 
423  <!-- Properties for the column selector -->
424  <fieldset id="col_panel" style="display:none;">
425  <legend>Column Properties</legend>
426  <label for="col_class">Class Name:</label>
427  <input id="col_class" name="col_class" onkeyup="table.setColClass(document.getElementById('col_class').value)" disabled="disabled"/><br />
428  <label for="col_width"><?php echo translate('width'); ?></label>
429  <input id="col_width" name="col_width" onkeyup="table.setColumnWidth(parseInt(document.getElementById('col_width').value) + document.getElementById('col_widthtype').value)" style="width:100px" value="100" disabled="disabled" />
430  <select id="col_widthtype" name="col_widthtype" style="width:50px" onchange="table.setColumnWidth(parseInt(document.getElementById('col_width').value) + document.getElementById('col_widthtype').value)" disabled="disabled">
431  <option value="px">px</option>
432  <option value="%" selected="selected">%</option>
433  <option value="pt">pt</option>
434  <option value="em">em</option>
435  <option value="ex">ex</option>
436  </select>
437  <label for="col_border"><?php echo 'Border'; ?></label>
438  <input id="col_border" name="col_border" style="width: 50px" onkeyup="table.setElementBorder((parseInt(document.getElementById('col_border').value)), document.getElementById('col_bordertype').value);" value="0" disabled="disabled" />
439  <select id="col_bordertype" name="col_bordertype" style="width:80px" onchange="table.setElementBorder((parseInt(document.getElementById('col_border').value)), document.getElementById('col_bordertype').value);" disabled="disabled">
440  <option value="solid" selected="selected">solid</option>
441  <option value="dotted">dotted</option>
442  <option value="dashed">dashed</option>
443  <option value="double">double</option>
444  <option value="groove">groove</option>
445  <option value="ridge">ridge</option>
446  <option value="inset">inset</option>
447  <option value="outset">outset</option>
448  <option value="none">none</option>
449  <option value="hidden">hidden</option>
450  </select>
451  <br />
452  <hr />
453  <label><?php echo translate('table_modify'); ?></label>
454  <img id="col_add" alt="Add Column" title="Add Column" src="images/addcol.gif" onclick="if (table.lastSelect == 'col') table.addcol(); return false;" />
455  <img id="col_delete" alt="Delete Column" title="Delete Column" src="images/delcol.gif" onclick="if (table.lastSelect == 'col') table.delcol();" />
456  <img alt="divider" src="images/div.gif" />
457  <img id="col_THead" alt="Head Cells" title="Head Cell" src="images/th.gif" onclick="if (table.lastSelect == 'col') table.th();"/><br />
458  <label><?php echo translate('horizontal'); ?></label>
459  <img id="col_aleft" title="Align Left" alt="Align Left" src="images/al.gif" onclick="if (table.lastSelect == 'col') table.setAlign('left');" />
460  <img id="col_acenter" title="Align Center" alt="Align Center" src="images/ac.gif" onclick="if (table.lastSelect == 'col') table.setAlign('center');" />
461  <img id="col_aright" title="Align Right" alt="Align Right" src="images/ar.gif" onclick="if (table.lastSelect == 'col') table.setAlign('right');" /><br />
462  <label><?php echo 'Vertical'; ?></label>
463  <img id="col_atop" title="Align Top" alt="Align Top" src="images/at.gif" onclick="if (table.lastSelect == 'col') table.setVAlign('top');" />
464  <img id="col_amiddle" title="Align Middle" alt="Align Middle" src="images/am.gif" onclick="if (table.lastSelect == 'col') table.setVAlign('middle');" />
465  <img id="col_abottom" title="Align Bottom" alt="Align Bottom" src="images/ab.gif" onclick="if (table.lastSelect == 'col') table.setVAlign('bottom');" /><br />
466  </fieldset>
467 
468  <!-- Properties for the cell selector -->
469  <fieldset id="cell_panel" style="display:none">
470  <legend><?php echo translate('cell_properties'); ?></legend>
471  <label for="cell_class">Class Name:</label>
472  <input id="cell_class" name="cell_class" onkeyup="table.setCellClass(document.getElementById('cell_class').value)" disabled="disabled"/><br />
473  <label for="cell_width"><?php echo translate('width'); ?></label>
474  <input id="cell_width" name="cell_width" onkeyup="table.setCellWidth(parseInt(document.getElementById('cell_width').value) + document.getElementById('cell_widthtype').value)" style="width:100px" value="100" disabled="disabled" />
475  <select id="cell_widthtype" name="cell_widthtype" style="width:50px" onchange="table.setCellWidth(parseInt(document.getElementById('cell_width').value) + document.getElementById('cell_widthtype').value)" disabled="disabled">
476  <option value="px">px</option>
477  <option value="%" selected="selected">%</option>
478  <option value="pt">pt</option>
479  <option value="em">em</option>
480  <option value="ex">ex</option>
481  </select>
482  <label for="cell_height"><?php echo translate('height'); ?></label>
483  <input id="cell_height" name="cell_height" onkeyup="table.setCellHeight(parseInt(document.getElementById('cell_height').value) + document.getElementById('cell_heighttype').value)" style="width:100px" value="100" disabled="disabled" />
484  <select id="cell_heighttype" name="cell_heighttype" style="width:50px" onchange="table.setCellHeight(parseInt(document.getElementById('cell_height').value) + document.getElementById('cell_heighttype').value)" disabled="disabled">
485  <option value="px">px</option>
486  <option value="%" selected="selected">%</option>
487  <option value="pt">pt</option>
488  <option value="em">em</option>
489  <option value="ex">ex</option>
490  </select>
491  <label for="cell_border"><?php echo translate('border'); ?></label>
492  <input id="cell_border" name="cell_border" style="width:50px" onkeyup="table.setElementBorder((parseInt(document.getElementById('cell_border').value)), document.getElementById('cell_bordertype').value);" value="0" disabled="disabled" />
493  <select id="cell_bordertype" name="cell_bordertype" style="width:80px" onchange="table.setElementBorder((parseInt(document.getElementById('cell_border').value)), document.getElementById('cell_bordertype').value);" disabled="disabled">
494  <option value="solid" selected="selected">solid</option>
495  <option value="dotted">dotted</option>
496  <option value="dashed">dashed</option>
497  <option value="double">double</option>
498  <option value="groove">groove</option>
499  <option value="ridge">ridge</option>
500  <option value="inset">inset</option>
501  <option value="outset">outset</option>
502  <option value="none">none</option>
503  <option value="hidden">hidden</option>
504  </select>
505  <br />
506  <hr />
507  <label><?php echo translate('table_modify'); ?></label>
508  <img id="addcolspan" title="Add ColSpan" alt="Add ColSpan" src="images/thr.gif" onclick="if (table.lastSelect == 'cell') table.addColSpan();" />
509  <img id="delcolspan" alt="Delete ColSpan" title="Delete ColSpan" src="images/thl.gif" onclick="if (table.lastSelect == 'cell') table.delColSpan();" />
510  <img id="addrowspan" alt="Add RowSpan" title="Add RowSpan" src="images/tvd.gif" onclick="if (table.lastSelect == 'cell') table.addRowSpan();" />
511  <img id="delrowspan" alt="Delete RowSpan" title="Delete RowSpan" src="images/tvu.gif" onclick="if (table.lastSelect == 'cell') table.delRowSpan();" />
512  <img alt="divider" src="images/div.gif" />
513  <img id="THead" alt="Head Cell" title="Head Cell" src="images/th.gif" onclick="if (table.lastSelect == 'cell') table.th();"/><br />
514  <label><?php echo 'Horizontal'; ?></label>
515  <img id="cell_aleft" title="Align Left" alt="Align Left" src="images/al.gif" onclick="if (table.lastSelect == 'cell') table.setAlign('left');" />
516  <img id="cell_acenter" title="Align Center" alt="Align Center" src="images/ac.gif" onclick="if (table.lastSelect == 'cell') table.setAlign('center');" />
517  <img id="cell_aright" title="Align Right" alt="Align Right" src="images/ar.gif" onclick="if (table.lastSelect == 'cell') table.setAlign('right');" /><br />
518  <label><?php echo 'Vertical'; ?></label>
519  <img id="cell_atop" title="Align Top" alt="Align Top" src="images/at.gif" onclick="if (table.lastSelect == 'cell') table.setVAlign('top');" />
520  <img id="cell_amiddle" title="Align Middle" alt="Align Middle" src="images/am.gif" onclick="if (table.lastSelect == 'cell') table.setVAlign('middle');" />
521  <img id="cell_abottom" title="Align Bottom" alt="Align Bottom" src="images/ab.gif" onclick="if (table.lastSelect == 'cell') table.setVAlign('bottom');" /><br />
522  <hr />
523  <label for="abbr"><?php echo translate('abbr'); ?></label>
524  <input id="abbr" name="abbr" onkeyup="table.setAbbr(this.value)" disabled="disabled" /><br />
525  <label for="axis"><?php echo translate('axis'); ?></label>
526  <input id="axis" name="axis" onkeyup="table.setAxis(this.value)" disabled="disabled" /><br />
527  <label for="scope"><?php echo translate('scope'); ?></label>
528  <select id="scope" name="scope" onchange="table.setScope(this.value)" disabled="disabled">
529  <option value=""><?php echo strtolower(translate('empty')); ?></option>
530  <option value="row"><?php echo strtolower(translate('row')); ?></option>
531  <option value="col"><?php echo strtolower(translate('col')); ?></option>
532  </select><br />
533  <label for="headings"><?php echo translate('headings'); ?></label>
534  <button id="headings" name="headings" onclick="table.toggleHeaders();" disabled="disabled" ><?php echo translate('click_to_select'); ?></button>
535  </fieldset>
536 
537  <fieldset id="color_panel">
538  <legend><?php echo translate('colour'); ?></legend>
539  <div style="width:40px;height:40px;position:relative;" id="bgborder" onclick="table.toggleBgBorder();">
540  <div id="border" style="width:30px;height:30px;position:absolute;left:10px;top:10px;border:inset 1px;background:url(images/empty.gif)">
541  <div style="width:19px;height:19px;position:absolute;left:5px;top:5px;border:outset 1px;background:#FFF;font-size:5px"></div>
542  </div>
543  <div id="bg" style="width:30px;height:30px;position:absolute;left:0px;top:0px;border:inset 1px;background:url(images/empty.gif)"></div>
544  </div>
545  <div id="colors" style="margin-top:5px" class="colors">
546  <script type="text/javascript">
547  //<![CDATA[
548  var Clr = Array("0", "3", "6", "9", "C", "F");
549  var out = '<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse">';
550  for (h1 = 0; h1 < Clr.length; h1++) {
551  if (h1 == 0) out += '<tr>' + '<td style="width:10px;height:10px;font-size:4px;" title="none" onclick="table.setColor(null)"><img src="images/empty.gif" width="10" height="10" alt="none" /></td>';
552  else out += '<tr>' + '<td style="width:10px;height:10px;font-size:4px;background:#' + Clr[h1] + Clr[h1] + Clr[h1] + '" title="' + Clr[h1] + Clr[h1] + Clr[h1] + Clr[h1] + Clr[h1] + Clr[h1] + '" onclick="table.setColor(\'' + Clr[h1] + Clr[h1] + Clr[h1] + '\')"></td>';
553  for (h2 = 0; h2 < Clr.length; h2++)
554  for (h3 = 0; h3 < Clr.length; h3++) {
555  color = Clr[h1] + Clr[h2] + Clr[h3];
556  title = Clr[h1] + Clr[h1] + Clr[h2] + Clr[h2] + Clr[h3] + Clr[h3]
557  out += '<td style="width:10px;height:10px;font-size:4px;background:#' + color + '" title="' + title + '" onclick="table.setColor(\'' + color + '\')"></td>';
558  }
559  out += '</tr>';
560  }
561  out += '</table>';
562  document.write(out);
563  //]]>
564  </script>
565  </div>
566  </fieldset>
567 
568  <div align="right">
569  <button accesskey="s" type="button" onclick="onOK()"><?php echo translate('ok'); ?></button>
570  <button type="button" onclick="onCancel()"><?php echo translate('cancel'); ?></button>
571  </div>
572  </div>
573 
574 
575  <img alt="" src="images/semigray.gif" style="display:none;" id="semigray" />
576  <img alt="" src="images/semired.gif" style="display:none;" id="semired" />
577  <img alt="" src="images/empty.gif" style="display:none;" id="empty" />
578 </body>
579 </html>