Advanced option highlighting demo. Make require some additional tweaks in IE, but...
[squirrelmail.git] / templates / default_advanced / options_highlight_addedit.tpl
1 <?php
2 /**
3  * options_highlight_addedit.tpl
4  *
5  * Template for adding new rules and editing existing rules
6  * 
7  * The following variables are available in this template:
8  *      $rule_name      - The name of this rule.  Blank if not given.
9  *      $rule_field     - The field being matched by the rule
10  *      $rule_value     - The value being matched by the rule
11  *      $rule_color     - The color to shade a match
12  *      $color_radio    - integer Identifier as to which radio button should be
13  *                        selected by default.  Will be 1 if the drop-down is
14  *                        selected, 2 if "other" is selected, or 0 if one of the
15  *                        other colors is selected
16  *      $color_input    - default value for the "other" input field.  Will be
17  *                        blank if not used.
18  *
19  * @copyright &copy; 1999-2006 The SquirrelMail Project Team
20  * @license http://opensource.org/licenses/gpl-license.php GNU Public License
21  * @version $Id$
22  * @package squirrelmail
23  * @subpackage templates
24  */
25
26 /** add required includes **/
27
28 /** extract template variables **/
29 extract($t);
30
31 /** Begin template **/
32 ?>
33 <script type="text/javascript">
34 <!--
35 function setSampleColor(color) {
36     s = document.getElementById('colorSample');
37     i = document.getElementById('newcolor_input');
38     if (color=='' || color=='#') {
39         if (typeof(window.opera) == 'undefined' && typeof(s.setAttribute) != 'undefined' && s.getAttribute('bgColor') ) {
40             s.setAttribute('bgcolor', '#ffffff');
41         } else {
42             s.style.backgroundColor = '#ffffff';
43         }
44         i.value = '';
45     } else {
46         if (typeof(window.opera) == 'undefined' && typeof(s.setAttribute) != 'undefined' && s.getAttribute('bgColor') ) {
47             s.setAttribute('bgcolor', color);
48         } else {
49             s.style.backgroundColor = color;
50         }
51
52         str = color.toLowerCase();
53         while (str.match(/[^0-9a-f]/)) {
54             str = str.replace(/[^0-9]/, '');
55         }
56         i.value = str.toUpperCase();
57     }
58 }
59
60 function sampleColor (thecell) {
61     if (typeof(window.opera) == 'undefined' && typeof(thecell.getAttribute) != 'undefined' && thecell.getAttribute('bgColor') ) {
62         color = thecell.getAttribute('bgColor');
63     } else {
64         color = thecell.style.backgroundColor;
65     }
66     document.getElementById('newcolor_choose').selectedIndex = 0;
67     setSampleColor(color);
68 }
69
70 function selectColor () {
71     el = document.getElementById('newcolor_choose');
72     color = el.options[el.selectedIndex].value;
73     setSampleColor('#'+color);
74 }
75
76 function inputColor () {
77     val = document.getElementById('newcolor_input').value;
78     
79     str = val.toLowerCase();
80     while (str.match(/[^0-9a-f]/)) {
81         str = str.replace(/[^0-9a-f]/, '');
82     }
83     document.getElementById('newcolor_choose').selectedIndex = 0;
84     setSampleColor('#'+str)
85 }
86 -->
87 </script>
88 <br />
89 <div id="optionHighlightAdd">
90 <table cellspacing="0" class="table1">
91  <tr>
92   <td class="header1">
93    <?php echo _("Add/Edit") .' '. _("Message Highlighting"); ?>
94   </td>
95  </tr>
96  <tr>
97   <td>
98    <table cellspacing="0" class="table1">
99     <tr>
100      <td class="ruleField">
101       <?php echo _("Identifying Name"); ?>:
102      </td>
103      <td class="fieldValue" colspan="3">
104       <input type="text" name="identname" value=<?php echo '"'.$rule_name.'"'; ?> />
105      </td>
106     </tr>
107     <tr>
108      <td class="ruleField">
109       <select name="match_type">
110        <option value="from" <?php if ($rule_field=='from') echo 'selected="selected"'; ?>> <?php echo _("From"); ?> </option>
111        <option value="to" <?php if ($rule_field=='to') echo 'selected="selected"'; ?>> <?php echo _("To"); ?> </option>
112        <option value="cc" <?php if ($rule_field=='cc') echo 'selected="selected"'; ?>> <?php echo _("Cc"); ?> </option>
113        <option value="to_cc" <?php if ($rule_field=='to_cc') echo 'selected="selected"'; ?>> <?php echo _("To or cc"); ?> </option>
114        <option value="subject" <?php if ($rule_field=='subject') echo 'selected="selected"'; ?>> <?php echo _("Subject"); ?> </option>
115       </select>
116       <?php echo _("Matches"); ?>:
117      </td>
118      <td class="fieldValue" colspan="3">
119       <input type="text" name="value" value=<?php echo '"'.$rule_value.'"'; ?> size="40" />
120      </td>
121     </tr>
122     <tr>
123      <td class="ruleField">
124       <?php echo _("Color"); ?>:
125      </td>
126      <td class="fieldValue" style="width:10%">
127       <input type="hidden" name="color_type" value="2" />
128       <input type="text" name="newcolor_input" value="<?php echo $rule_color; ?>" size="7" id="newcolor_input" onblur="inputColor()" />
129      </td>
130      <td id="colorSample" bgcolor="#<?php echo $rule_color; ?>">
131          &nbsp;
132      </td>
133      <td>
134      </td>
135     </tr>
136     <tr>
137      <td>
138       &nbsp;
139      </td>
140      <td colspan="3" class="fieldValue">
141       - <?php echo _("OR"); ?> -
142       <br />
143       <select id="newcolor_choose"  onchange="selectColor()">
144        <option value=""></option>
145        <option value="4444aa">Dark Blue</option>
146        <option value="44aa44">Dark Green</option>
147        <option value="aaaa44">Dark Yellow</option>
148        <option value="44aaaa">Dark Cyan</option>
149        <option value="aa44aa">Dark Magenta</option>
150        <option value="aaaaff">Light Blue</option>
151        <option value="aaffaa">Light Green</option>
152        <option value="ffffaa">Light Yellow</option>
153        <option value="aaffff">Light Cyan</option>
154        <option value="ffaaff">Light Magenta</option>
155        <option value="aaaaaa">Dark Gray</option>
156        <option value="bfbfbf">Medium Gray</option>
157        <option value="dfdfdf">Light Gray</option>
158        <option value="ffffff">White</option>
159       </select>
160       <br />
161       - <?php echo _("OR"); ?> -
162       <br />
163       <table cellspacing="0" class="colorTable">
164        <tr>
165         <td bgcolor="#cccccc" onclick="javascript:sampleColor(this)">&nbsp;</td>
166         <td bgcolor="#ff0000" onclick="javascript:sampleColor(this)">&nbsp;</td>
167         <td bgcolor="#ffcccc" onclick="javascript:sampleColor(this)">&nbsp;</td>
168         <td bgcolor="#ffcccc" onclick="javascript:sampleColor(this)">&nbsp;</td>
169         <td bgcolor="#00ff00" onclick="javascript:sampleColor(this)">&nbsp;</td>
170         <td bgcolor="#ccffcc" onclick="javascript:sampleColor(this)">&nbsp;</td>
171         <td bgcolor="#ccffcc" onclick="javascript:sampleColor(this)">&nbsp;</td>
172         <td bgcolor="#0000ff" onclick="javascript:sampleColor(this)">&nbsp;</td>
173         <td bgcolor="#ccccff" onclick="javascript:sampleColor(this)">&nbsp;</td>
174         <td bgcolor="#ccccff" onclick="javascript:sampleColor(this)">&nbsp;</td>
175         <td bgcolor="#ffff00" onclick="javascript:sampleColor(this)">&nbsp;</td>
176         <td bgcolor="#ffffcc" onclick="javascript:sampleColor(this)">&nbsp;</td>
177         <td bgcolor="#ffffcc" onclick="javascript:sampleColor(this)">&nbsp;</td>
178         <td bgcolor="#00ffff" onclick="javascript:sampleColor(this)">&nbsp;</td>
179         <td bgcolor="#ccffff" onclick="javascript:sampleColor(this)">&nbsp;</td>
180         <td bgcolor="#ccffff" onclick="javascript:sampleColor(this)">&nbsp;</td>
181         <td bgcolor="#ff00ff" onclick="javascript:sampleColor(this)">&nbsp;</td>
182         <td bgcolor="#ffccff" onclick="javascript:sampleColor(this)">&nbsp;</td>
183         <td bgcolor="#ffccff" onclick="javascript:sampleColor(this)">&nbsp;</td>
184        </tr>
185        <tr>
186         <td bgcolor="#999999" onclick="javascript:sampleColor(this)">&nbsp;</td>
187         <td bgcolor="#cc0000" onclick="javascript:sampleColor(this)">&nbsp;</td>
188         <td bgcolor="#cc9999" onclick="javascript:sampleColor(this)">&nbsp;</td>
189         <td bgcolor="#ff9999" onclick="javascript:sampleColor(this)">&nbsp;</td>
190         <td bgcolor="#00cc00" onclick="javascript:sampleColor(this)">&nbsp;</td>
191         <td bgcolor="#99cc99" onclick="javascript:sampleColor(this)">&nbsp;</td>
192         <td bgcolor="#99ff99" onclick="javascript:sampleColor(this)">&nbsp;</td>
193         <td bgcolor="#0000cc" onclick="javascript:sampleColor(this)">&nbsp;</td>
194         <td bgcolor="#9999cc" onclick="javascript:sampleColor(this)">&nbsp;</td>
195         <td bgcolor="#9999ff" onclick="javascript:sampleColor(this)">&nbsp;</td>
196         <td bgcolor="#cccc00" onclick="javascript:sampleColor(this)">&nbsp;</td>
197         <td bgcolor="#cccc99" onclick="javascript:sampleColor(this)">&nbsp;</td>
198         <td bgcolor="#ffff99" onclick="javascript:sampleColor(this)">&nbsp;</td>
199         <td bgcolor="#00cccc" onclick="javascript:sampleColor(this)">&nbsp;</td>
200         <td bgcolor="#99cccc" onclick="javascript:sampleColor(this)">&nbsp;</td>
201         <td bgcolor="#99ffff" onclick="javascript:sampleColor(this)">&nbsp;</td>
202         <td bgcolor="#cc00cc" onclick="javascript:sampleColor(this)">&nbsp;</td>
203         <td bgcolor="#cc99cc" onclick="javascript:sampleColor(this)">&nbsp;</td>
204         <td bgcolor="#ff99ff" onclick="javascript:sampleColor(this)">&nbsp;</td>
205        </tr>
206        <tr>
207         <td bgcolor="#666666" onclick="javascript:sampleColor(this)">&nbsp;</td>
208         <td bgcolor="#990000" onclick="javascript:sampleColor(this)">&nbsp;</td>
209         <td bgcolor="#996666" onclick="javascript:sampleColor(this)">&nbsp;</td>
210         <td bgcolor="#ff6666" onclick="javascript:sampleColor(this)">&nbsp;</td>
211         <td bgcolor="#009900" onclick="javascript:sampleColor(this)">&nbsp;</td>
212         <td bgcolor="#669966" onclick="javascript:sampleColor(this)">&nbsp;</td>
213         <td bgcolor="#66ff66" onclick="javascript:sampleColor(this)">&nbsp;</td>
214         <td bgcolor="#000099" onclick="javascript:sampleColor(this)">&nbsp;</td>
215         <td bgcolor="#666699" onclick="javascript:sampleColor(this)">&nbsp;</td>
216         <td bgcolor="#6666ff" onclick="javascript:sampleColor(this)">&nbsp;</td>
217         <td bgcolor="#999900" onclick="javascript:sampleColor(this)">&nbsp;</td>
218         <td bgcolor="#999966" onclick="javascript:sampleColor(this)">&nbsp;</td>
219         <td bgcolor="#ffff66" onclick="javascript:sampleColor(this)">&nbsp;</td>
220         <td bgcolor="#009999" onclick="javascript:sampleColor(this)">&nbsp;</td>
221         <td bgcolor="#669999" onclick="javascript:sampleColor(this)">&nbsp;</td>
222         <td bgcolor="#66ffff" onclick="javascript:sampleColor(this)">&nbsp;</td>
223         <td bgcolor="#990099" onclick="javascript:sampleColor(this)">&nbsp;</td>
224         <td bgcolor="#996699" onclick="javascript:sampleColor(this)">&nbsp;</td>
225         <td bgcolor="#ff66ff" onclick="javascript:sampleColor(this)">&nbsp;</td>
226        </tr>
227        <tr>
228         <td bgcolor="#333333" onclick="javascript:sampleColor(this)">&nbsp;</td>
229         <td bgcolor="#660000" onclick="javascript:sampleColor(this)">&nbsp;</td>
230         <td bgcolor="#663333" onclick="javascript:sampleColor(this)">&nbsp;</td>
231         <td bgcolor="#ff3333" onclick="javascript:sampleColor(this)">&nbsp;</td>
232         <td bgcolor="#006600" onclick="javascript:sampleColor(this)">&nbsp;</td>
233         <td bgcolor="#336633" onclick="javascript:sampleColor(this)">&nbsp;</td>
234         <td bgcolor="#33ff33" onclick="javascript:sampleColor(this)">&nbsp;</td>
235         <td bgcolor="#000066" onclick="javascript:sampleColor(this)">&nbsp;</td>
236         <td bgcolor="#333366" onclick="javascript:sampleColor(this)">&nbsp;</td>
237         <td bgcolor="#3333ff" onclick="javascript:sampleColor(this)">&nbsp;</td>
238         <td bgcolor="#666600" onclick="javascript:sampleColor(this)">&nbsp;</td>
239         <td bgcolor="#666633" onclick="javascript:sampleColor(this)">&nbsp;</td>
240         <td bgcolor="#ffff33" onclick="javascript:sampleColor(this)">&nbsp;</td>
241         <td bgcolor="#006666" onclick="javascript:sampleColor(this)">&nbsp;</td>
242         <td bgcolor="#336666" onclick="javascript:sampleColor(this)">&nbsp;</td>
243         <td bgcolor="#33ffff" onclick="javascript:sampleColor(this)">&nbsp;</td>
244         <td bgcolor="#660066" onclick="javascript:sampleColor(this)">&nbsp;</td>
245         <td bgcolor="#663366" onclick="javascript:sampleColor(this)">&nbsp;</td>
246         <td bgcolor="#ff33ff" onclick="javascript:sampleColor(this)">&nbsp;</td>
247        </tr>
248        <tr>
249         <td bgcolor="#000000" onclick="javascript:sampleColor(this)">&nbsp;</td>
250         <td bgcolor="#330000" onclick="javascript:sampleColor(this)">&nbsp;</td>
251         <td bgcolor="#330000" onclick="javascript:sampleColor(this)">&nbsp;</td>
252         <td bgcolor="#ff0000" onclick="javascript:sampleColor(this)">&nbsp;</td>
253         <td bgcolor="#003300" onclick="javascript:sampleColor(this)">&nbsp;</td>
254         <td bgcolor="#003300" onclick="javascript:sampleColor(this)">&nbsp;</td>
255         <td bgcolor="#00ff00" onclick="javascript:sampleColor(this)">&nbsp;</td>
256         <td bgcolor="#000033" onclick="javascript:sampleColor(this)">&nbsp;</td>
257         <td bgcolor="#000033" onclick="javascript:sampleColor(this)">&nbsp;</td>
258         <td bgcolor="#0000ff" onclick="javascript:sampleColor(this)">&nbsp;</td>
259         <td bgcolor="#333300" onclick="javascript:sampleColor(this)">&nbsp;</td>
260         <td bgcolor="#333300" onclick="javascript:sampleColor(this)">&nbsp;</td>
261         <td bgcolor="#ffff00" onclick="javascript:sampleColor(this)">&nbsp;</td>
262         <td bgcolor="#003333" onclick="javascript:sampleColor(this)">&nbsp;</td>
263         <td bgcolor="#003333" onclick="javascript:sampleColor(this)">&nbsp;</td>
264         <td bgcolor="#00ffff" onclick="javascript:sampleColor(this)">&nbsp;</td>
265         <td bgcolor="#330033" onclick="javascript:sampleColor(this)">&nbsp;</td>
266         <td bgcolor="#330033" onclick="javascript:sampleColor(this)">&nbsp;</td>
267         <td bgcolor="#ff00ff" onclick="javascript:sampleColor(this)">&nbsp;</td>
268        </tr>
269       </table>
270      </td>
271     </tr>
272     <tr>
273      <td colspan="4">
274       <input type="reset" value="<?php echo _("Reset"); ?>" onclick="setSampleColor('#'+document.getElementById('newcolor_input').defaultValue)" />
275       <input type="submit" value="<?php echo _("Save Changes"); ?>" />
276      </td>
277     </tr>
278    </table>
279   </td>
280  </tr>
281 </table>
282 </div>