Iniitial option templating.

src/options.php

@@ -148,7 +148,7 @@ switch ($optpage) {
 
 if ( !@is_file( $optpage_file ) ) {
     $optpage = SMOPT_PAGE_MAIN;
-} else if ($optpage != SMOPT_PAGE_MAIN ) {
+} elseif ($optpage != SMOPT_PAGE_MAIN ) {
     /* Include the file for this optionpage. */
 
     require_once($optpage_file);
@@ -157,8 +157,7 @@ if ( !@is_file( $optpage_file ) ) {
     $optpage_data = array();
     $optpage_data = $optpage_loader();
     do_hook($optpage_loadhook);
-    $optpage_data['options'] =
-        create_option_groups($optpage_data['grps'], $optpage_data['vals']);
+    $optpage_data['options'] = create_option_groups($optpage_data['grps'], $optpage_data['vals']);
 }
 
 /***********************************************************/
@@ -229,14 +228,6 @@ if ($optmode == SMOPT_MODE_SUBMIT) {
 
 displayPageHeader($color, 'None', (isset($optpage_data['xtra']) ? $optpage_data['xtra'] : ''));
 
-echo html_tag( 'table', '', 'center', $color[0], 'width="95%" cellpadding="1" cellspacing="0" border="0"' ) . "\n" .
-        html_tag( 'tr' ) . "\n" .
-            html_tag( 'td', '', 'center' ) .
-                "<b>$optpage_title</b><br />\n".
-                html_tag( 'table', '', '', '', 'width="100%" cellpadding="5" cellspacing="0" border="0"' ) . "\n" .
-                    html_tag( 'tr' ) . "\n" .
-                        html_tag( 'td', '', 'center', $color[4] ) . "\n";
-
 /*
  * The main option page has a different layout then the rest of the option
  * pages. Therefore, we create it here first, then the others below.
@@ -252,16 +243,14 @@ if ($optpage == SMOPT_PAGE_MAIN) {
         }
 
         if (isset($optpage_save_error) && $optpage_save_error!=array()) {
-            $notice = "<font color=\"$color[2]\"><b>" . _("Error(s) occurred while saving your options") . "</b></font><br />\n"
-                ."<ul>\n";
+            $notice = _("Error(s) occurred while saving your options") . "<br />\n<ul>\n";
             foreach ($optpage_save_error as $error_message) {
                 $notice.= '<li><small>' . $error_message . "</small></li>\n";
             }
-            $notice.= "</ul>\n"
-                . '<b>' . _("Some of your preference changes were not applied.") . "</b><br />\n";
+            $notice.= "</ul>\n" . _("Some of your preference changes were not applied.") . "\n";
         } else {
             /* Display a message indicating a successful save. */
-            $notice = '<b>' . _("Successfully Saved Options") . ": $optpage_name</b><br />\n";
+            $notice = _("Successfully Saved Options") . ": $optpage_name</b><br />\n";
         }
 
         /* If $max_refresh != SMOPT_REFRESH_NONE, provide a refresh link. */
@@ -272,8 +261,12 @@ if ($optpage == SMOPT_PAGE_MAIN) {
             $notice .= '<a href="../src/webmail.php?right_frame=options.php" target="' . $frame_top . '">' . _("Refresh Page") . '</a><br />';
         }
     }
-    $oTemplate->assign('notice',$notice);
-
+    
+    if (!empty($notice)) {
+        $oTemplate->assign('note', $notice);
+        $oTemplate->display('note.tpl');
+    }
+    
     /******************************************/
     /* Build our array of Option Page Blocks. */
     /******************************************/
@@ -347,11 +340,11 @@ if ($optpage == SMOPT_PAGE_MAIN) {
     /********************************************/
     /* Now, print out each option page section. */
     /********************************************/
+    $oTemplate->assign('page_title', $optpage_title);
+    $oTemplate->assign('options', $optpage_blocks);
 
-    $oTemplate->assign('color',$color);
-    $oTemplate->assign('optpage_blocks',$optpage_blocks);
     $oTemplate->display('option_groups.tpl');
-
+    
     do_hook('options_link_and_description');
 
 
@@ -359,14 +352,6 @@ if ($optpage == SMOPT_PAGE_MAIN) {
 /* If we are not looking at the main option page, display the page here. */
 /*************************************************************************/
 } else {
-    echo addForm('options.php', 'post', 'f')
-       . create_optpage_element($optpage)
-       . create_optmode_element(SMOPT_MODE_SUBMIT)
-       . html_tag( 'table', '', '', '', 'width="100%" cellpadding="2" cellspacing="0" border="0"' ) . "\n";
-
-    /* Output the option groups for this page. */
-    print_option_groups($optpage_data['options']);
-
     /* Set the inside_hook_name and submit_name. */
     switch ($optpage) {
         case SMOPT_PAGE_PERSONAL:
@@ -405,6 +390,41 @@ if ($optpage == SMOPT_PAGE_MAIN) {
             $submit_name = 'submit';
     }
 
+    // Begin output form
+    echo addForm('options.php', 'post', 'f')
+       . create_optpage_element($optpage)
+       . create_optmode_element(SMOPT_MODE_SUBMIT);
+
+    // Wrap the template in a table to keep from breaking the hooks below
+    echo "<table cellspacing=\"0\" class=\"table_blank\">\n" .
+         " <tr>\n" .
+         "  <td colspan=\"2\">\n";
+
+    // This is the only variable that is needed by *just* the template.
+    $oTemplate->assign('options', $optpage_data['options']);
+    
+    /**
+     * The variables below should not be needed by the template since all plugin
+     * hooks are called here, not in the template.  If we find otherwise, these
+     * variables can be passed to the template.  Commenting out for not.
+     */
+/*
+    $oTemplate->assign('max_refresh', isset($max_refresh) ? $max_refresh : NULL);
+    $oTemplate->assign('page_title', $optpage_title);
+    $oTemplate->assign('optpage',$optpage);
+    $oTemplate->assign('optpage_name',$optpage_name);
+    $oTemplate->assign('optmode',$optmode);
+    $oTemplate->assign('optpage_data',$optpage_data);
+*/
+    /**
+     * END comment block
+     */    
+     
+    $oTemplate->display('options.tpl');
+
+    echo "  </td>\n" .
+         " </tr>\n";
+
     /* If it is not empty, trigger the inside hook. */
     if ($inside_hook_name != '') {
         do_hook($inside_hook_name);
@@ -412,19 +432,15 @@ if ($optpage == SMOPT_PAGE_MAIN) {
 
     /* Spit out a submit button. */
     OptionSubmit($submit_name);
-    echo '</table></form>';
+    echo "</table>\n" .
+         "</form>\n";
 
     /* If it is not empty, trigger the bottom hook. */
     if ($bottom_hook_name != '') {
         do_hook($bottom_hook_name);
     }
-    if (isset($max_refresh)) $oTemplate->assign('max_refresh',$max_refresh);
-    $oTemplate->assign('color',$color);
-    $oTemplate->assign('optpage',$optpage);
-    $oTemplate->assign('optpage_name',$optpage_name);
-    $oTemplate->assign('optpage_data',$optpage_data);
-    $oTemplate->assign('optmode',$optmode);
-    $oTemplate->display('options.tpl');
+    
 }
 
 $oTemplate->display('footer.tpl');
+?>

templates/default/option_groups.tpl

@@ -3,6 +3,15 @@
  * option_groups.tpl
  *
  * Template for rendering main option page blocks
+ * 
+ * The following variables are available to this template:
+ *      $page_title - string containing the title element for this page
+ *      $options    - array containing option blocks to be displayed.  Each
+ *                    element in the array will contain the following fields:
+ *          $el['url']  - The URL of the link to display that option page
+ *          $el['name'] - The name of the option page
+ *          $el['desc'] - string containing the description of that option block
+ *          $el['js']   - boolean TRUE if the element requires javascript being enabled. 
  *
  * @copyright © 2006 The SquirrelMail Project Team
  * @license http://opensource.org/licenses/gpl-license.php GNU Public License
@@ -11,87 +20,40 @@
  * @subpackage templates
  */
 
-/**
- * This function prints out an option page row.
- * FIXME: remove function from template
- */
-function print_optionpages_row($leftopt, $rightopt = false) {
-    global $color;
-
-    if ($rightopt) {
-        $rightopt_name = html_tag( 'td', '<a href="' . $rightopt['url'] . '">' . $rightopt['name'] . '</a>', 'left', $color[9], 'valign="top" width="49%"' );
-        $rightopt_desc = html_tag( 'td', $rightopt['desc'], 'left', $color[0], 'valign="top" width="49%"' );
-    } else {
-        $rightopt_name = html_tag( 'td', '&nbsp;', 'left', $color[4], 'valign="top" width="49%"' );
-        $rightopt_desc = html_tag( 'td', '&nbsp;', 'left', $color[4], 'valign="top" width="49%"' );
-    }
-
-    echo
-    html_tag( 'table', "\n" .
-        html_tag( 'tr', "\n" .
-            html_tag( 'td', "\n" .
-                html_tag( 'table', "\n" .
-                    html_tag( 'tr', "\n" .
-                        html_tag( 'td',
-                            '<a href="' . $leftopt['url'] . '">' . $leftopt['name'] . '</a>' ,
-                        'left', $color[9], 'valign="top" width="49%"' ) .
-                        html_tag( 'td',
-                            '&nbsp;' ,
-                        'left', $color[4], 'valign="top" width="2%"' ) . "\n" .
-                        $rightopt_name
-                    ) . "\n" .
-                    html_tag( 'tr', "\n" .
-                        html_tag( 'td',
-                            $leftopt['desc'] ,
-                        'left', $color[0], 'valign="top" width="49%"' ) .
-                        html_tag( 'td',
-                            '&nbsp;' ,
-                        'left', $color[4], 'valign="top" width="2%"' ) . "\n" .
-                        $rightopt_desc
-                    ) ,
-                '', '', 'width="100%" cellpadding="2" cellspacing="0" border="0"' ) ,
-            'left', '', 'valign="top"' )
-        ) ,
-    '', $color[4], 'width="100%" cellpadding="0" cellspacing="5" border="0"' );
-}
-
 /** extract variables */
 extract($t);
-
-/**
- * Display error notices and other messages
- * Maybe formating should be moved from src/options.php
- */
-echo $notice;
-
-/********************************************/
-/* Now, print out each option page section. */
-/********************************************/
-$first_optpage = false;
-echo html_tag( 'table', '', '', $color[4], 'width="100%" cellpadding="0" cellspacing="5" border="0"' ) . "\n" .
-    html_tag( 'tr' ) . "\n" .
-    html_tag( 'td', '', 'left', '', 'valign="top"' ) .
-    html_tag( 'table', '', '', $color[4], 'width="100%" cellpadding="3" cellspacing="0" border="0"' ) . "\n" .
-    html_tag( 'tr' ) . "\n" .
-    html_tag( 'td', '', 'left' );
-
-foreach ($optpage_blocks as $next_optpage) {
-    if ($first_optpage == false) {
-        $first_optpage = $next_optpage;
-    } else {
-        print_optionpages_row($first_optpage, $next_optpage);
-        $first_optpage = false;
-    }
-}
-
-if ($first_optpage != false) {
-    print_optionpages_row($first_optpage);
-}
-echo "</td></tr></table></td></tr></table>\n";
-
-
 ?>
-</td></tr>
-</table>
-</td></tr>
+<div id="optionGroups">
+<table cellspacing="0">
+ <tr>
+  <td colspan="2" class="title">
+   <?php echo $page_title; ?>
+  </td>
+ </tr>
+ <tr>
+  <?php
+    foreach ($options as $index=>$option) {
+        ?>
+  <td class="optionElement">
+   <table cellspacing="0">
+    <tr>
+     <td class="optionName">
+      <a href=<?php echo '"'.$option['url'].'"'; ?>><?php echo $option['name']; ?></a>
+     </td>
+    </tr>
+    <tr>
+     <td class="optionDesc">
+      <?php echo $option['desc']; ?>
+     </td>
+    </tr>
+   </table>
+  </td>
+        <?php
+        if (($index+1) % 2 == 0) {
+            echo " </tr>\n <tr>\n";
+        }
+    }
+  ?>
+ </tr>
 </table>
+</div>

templates/default/options.tpl

@@ -3,6 +3,12 @@
  * options.tpl
  *
  * Template for rendering the options page
+ * 
+ * The following variables are available to this template:
+ *      $options - array of options as built by SquirrelMail.  Important fields
+ *                 in this array include (but are not limited to):
+ *          $el['name']     - The name of the option group
+ *          $el['options']  - array of squirrelOption objects
  *
  * @copyright © 1999-2006 The SquirrelMail Project Team
  * @license http://opensource.org/licenses/gpl-license.php GNU Public License
@@ -13,13 +19,38 @@
 
 /** add required includes */
 
-
 /** extract variables */
 extract($t);
-
 ?>
-</td></tr>
-</table>
-</td></tr>
-</table>
+<div id="optionDisplay">
+<?php
+foreach ($options as $option) {
+    echo "<table cellspacing=\"0\">\n";
 
+    if (!empty($option['name'])) {
+        echo " <tr>\n" .
+             "  <td class=\"header1\" colspan=\"2\">\n" .
+             "   ".$option['name']."\n" .
+             "  </td>\n" .
+             " </tr>\n";
+    }
+
+    foreach ($option['options'] as $opt) {
+        if ($opt->type != SMOPT_TYPE_HIDDEN) {
+            echo   "<tr>\n" .
+                   " <td class=\"optionName\">\n" .
+                   "  ".$opt->caption."\n" .
+                   " </td>\n" .
+                   " <td class=\"optionValue\">\n" .
+                   "  ".$opt->createHTMLWidget()."\n" .
+                   " </td>\n" .
+                   "</tr>\n";
+        } else {
+            echo $opt->createHTMLWidget();
+        }
+    }
+
+    echo "</table>\n";
+}
+?>
+</div>

templates/default/stylesheet.tpl

@@ -1,5 +1,4 @@
 <?php
-
 /**
  * SquirrelMail CSS template
  *
@@ -120,6 +119,12 @@ a:link, a:visited, a:hover, a:active {
     background-color: <?php echo $color[0]; ?>;
 }
 
+table.table_empty, table.table_blank    {
+    margin: 0;
+    padding: 0;
+    border: 0;
+    width: 100%;
+}
 
 td.header1  {
     background: <?php echo $color[0]; ?>;
@@ -449,4 +454,80 @@ tr.odd  {
 
 #addrAddEdit    select  {
     font-size: 75%;
+}
+
+#optionGroups   {
+    text-align: center;
+}
+
+#optionGroups   table   {
+    border: 1px solid <?php echo $color[0]; ?>;
+    margin-left: auto;
+    margin-right: auto;
+    padding: 0;
+    width: 95%;
+}
+
+#optionGroups   td  {
+    width: 50%;
+    padding: 2px;
+    vertical-align: top;
+}
+
+#optionGroups   td.title    {
+    background: <?php echo $color[0]; ?>;
+    text-align: center;
+    font-weight: bold;
+}
+
+#optionGroups   td.optionElement    {
+    height: 100%;
+    padding: 10px; 
+}
+
+#optionGroups   td.optionElement    table   {
+    border:1px solid <?php echo $color[9]; ?>;
+    height: 100%;
+}
+
+
+#optionGroups   td.optionName   {
+    background: <?php echo $color[9]; ?>;
+    text-align: left;
+    height: 1%;
+}
+
+#optionGroups   td.optionDesc   {
+    text-align: left;
+    background: <?php echo $color[0]; ?>;
+}
+
+#optionDisplay  {
+    text-align:center;
+}
+
+#optionDisplay  table   {
+    margin-left: auto;
+    margin-right: auto;
+    margin-top: 8px;
+    margin-bottom: 8px;
+    width: 95%;
+    border: 1px solid <?php echo $color[0]; ?>
+}
+
+#optionDisplay  td  {
+    width: 50%;
+    padding-top: 2px;
+    padding-bottom: 2px;
+    padding-left: 4px;
+    padding-right: 4px;
+    white-space: nowrap;
+}
+
+#optionDisplay  td.optionName   {
+    text-align: right;
+}
+
+#optionDisplay  td.optionValue  {
+    text-align: left;
 }