Add tabsheet on administration pages.

Step 1: Refactoring tabsheet on NBM and introduce generic method to add tabsheet.tpl

On next commit, use of this new method in order to reduce # of link menu.

CSS friend don't hesitate to modify tabsheet css.

git-svn-id: http://piwigo.org/svn/trunk@1874 68402e56-0260-453c-a942-63ccdbb3a9ee

9 files changed, 210 insertions, 18 deletions

diff --git a/admin/include/functions_tabsheet.inc.php b/admin/include/functions_tabsheet.inc.php
new file mode 100644
index 000000000..52cf3f43d
--- /dev/null
+++ b/admin/include/functions_tabsheet.inc.php
@@ -0,0 +1,77 @@
+<?php

+// +-----------------------------------------------------------------------+

+// | PhpWebGallery - a PHP based picture gallery                           |

+// | Copyright (C) 2002-2003 Pierrick LE GALL - pierrick@phpwebgallery.net |

+// | Copyright (C) 2003-2007 PhpWebGallery Team - http://phpwebgallery.net |

+// +-----------------------------------------------------------------------+

+// | file          : $Id$

+// | last update   : $Date$

+// | last modifier : $Author$

+// | revision      : $Revision$

+// +-----------------------------------------------------------------------+

+// | This program is free software; you can redistribute it and/or modify  |

+// | it under the terms of the GNU General Public License as published by  |

+// | the Free Software Foundation                                          |

+// |                                                                       |

+// | This program is distributed in the hope that it will be useful, but   |

+// | WITHOUT ANY WARRANTY; without even the implied warranty of            |

+// | MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU      |

+// | General Public License for more details.                              |

+// |                                                                       |

+// | You should have received a copy of the GNU General Public License     |

+// | along with this program; if not, write to the Free Software           |

+// | Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA 02111-1307, |

+// | USA.                                                                  |

+// +-----------------------------------------------------------------------+

+

+/*

+ * Build TabSheet and assign this content to current page

+ *

+ * Uses $page['tabsheet'], it's an array of array

+ *

+ * $page['tabsheet'] description:

+ *  $page['tabsheet']'[url'] : Tab link

+ *  $page['tabsheet']['Caption'] : Tab caption

+ *  $page['tabsheet']['selected'] : Is the selected tab (default value false)

+ *

+ * Fill {TABSHEET} with HTML code for tabshette

+ * Fill {U_TABSHEET_TITLE} with formated caption of the selected tab

+ */

+

+function template_assign_tabsheet()

+{

+  global $page, $template;

+

+  if (count($page['tabsheet']) > 0)

+  {

+    $template->set_filename('tabsheet', 'admin/tabsheet.tpl');

+

+    foreach ($page['tabsheet'] as $tab_name => $tab)

+    {

+      $is_selected = isset($tab['selected']) and $tab['selected'] === true;

+      $template->assign_block_vars

+      (

+        'tab',

+        array

+        (

+          'CLASSNAME' => ($is_selected ? 'selected_tab' : 'normal_tab'),

+          'URL' => $tab['url'],

+          'CAPTION' => $tab['caption']

+        )

+      );

+

+      if ($is_selected)

+      {

+        $template->assign_vars(

+          array('TABSHEET_TITLE' => '['.$tab['caption'].']'));

+      }

+    }

+

+    $template->assign_var_from_handle('TABSHEET', 'tabsheet');

+  }

+}

+

+//TOTO:Voir pour intégrer U_TABSHEET_TITLE dans les autres tabs 

+//TODO:Selected sans link

+//Remplacer mode par tab_caption

+?>

diff --git a/admin/notification_by_mail.php b/admin/notification_by_mail.php
index 0894afe4f..cbde8a7d5 100644
--- a/admin/notification_by_mail.php
+++ b/admin/notification_by_mail.php
@@ -36,6 +36,7 @@ if (!defined('PHPWG_ROOT_PATH'))
 
 include_once(PHPWG_ROOT_PATH.'admin/include/functions.php');
 include_once(PHPWG_ROOT_PATH.'admin/include/functions_notification_by_mail.inc.php');
+include_once(PHPWG_ROOT_PATH.'admin/include/functions_tabsheet.inc.php');
 include_once(PHPWG_ROOT_PATH.'include/common.inc.php');
 include_once(PHPWG_ROOT_PATH.'include/functions_notification.inc.php');
 include_once(PHPWG_ROOT_PATH.'include/functions_mail.inc.php');
@@ -573,7 +574,6 @@ $template->assign_vars
 (
   array
   (
-    'U_TABSHEET_TITLE' => l10n('nbm_'.$page['mode'].'_mode'),
     'U_HELP' => add_url_params(get_root_url().'popuphelp.php', array('page' => 'notification_by_mail')),
     'F_ACTION'=> $base_url.get_query_string_diff(array())
   )
@@ -581,16 +581,31 @@ $template->assign_vars
 
 if (is_autorize_status(ACCESS_WEBMASTER))
 {
-  $template->assign_block_vars
+  // TabSheet initialization
+  $page['tabsheet'] = array
   (
-    'header_link',
-    array
-    (
-      'PARAM_MODE' => add_url_params($base_url.get_query_string_diff(array('mode', 'select')), array('mode' => 'param')),
-      'SUBSCRIBE_MODE' => add_url_params($base_url.get_query_string_diff(array('mode', 'select')), array('mode' => 'subscribe')),
-      'SEND_MODE' => add_url_params($base_url.get_query_string_diff(array('mode', 'select')), array('mode' => 'send'))
-    )
+    'param' => array
+     (
+      'caption' => l10n('nbm_param_mode'),
+      'url' => add_url_params($base_url.get_query_string_diff(array('mode', 'select')), 
+        array('mode' => 'param'))
+     ),
+    'subscribe' => array
+     (
+      'caption' => l10n('nbm_subscribe_mode'),
+      'url' => add_url_params($base_url.get_query_string_diff(array('mode', 'select')), array('mode' => 'subscribe')),
+     ),
+    'send' => array
+     (
+      'caption' => l10n('nbm_send_mode'),
+      'url' => add_url_params($base_url.get_query_string_diff(array('mode', 'select')), array('mode' => 'send'))
+     )
   );
+
+  $page['tabsheet'][$page['mode']]['selected'] = true;
+
+  // Assign tabsheet to template
+  template_assign_tabsheet();
 }
 
 if ($must_repost)
diff --git a/template/yoga/admin/default-layout.css b/template/yoga/admin/default-layout.css
index fda57c497..7d6f50502 100644
--- a/template/yoga/admin/default-layout.css
+++ b/template/yoga/admin/default-layout.css
@@ -149,4 +149,28 @@ FIELDSET#generalConf TEXTAREA.description {
   height: 10px;
   background-color: #66f;
   border: 1px solid black;
-}
\ No newline at end of file
+}

+

+/* Tabsheet */

+.tabsheet {

+  display: table;

+  list-style-type: none;

+  list-style-image: none; /* for firefox */

+  white-space: nowrap; 

+  margin-left: auto; margin-right: auto;

+  text-decoration : none;

+  background: transparent;

+}

+

+.tabsheet li {

+  float: left;

+  text-align: center;

+  margin: 0 6px;

+  color: white;

+  font-size: 120%;

+  font-weight: bold;

+  padding: 4px 8px;

+  border: 1px solid #fff;

+}

+

+/* Tabsheet */

diff --git a/template/yoga/admin/notification_by_mail.tpl b/template/yoga/admin/notification_by_mail.tpl
index 16f66d42d..da7fa808e 100644
--- a/template/yoga/admin/notification_by_mail.tpl
+++ b/template/yoga/admin/notification_by_mail.tpl
@@ -3,14 +3,8 @@
   <ul class="categoryActions">
     <li><a href="{U_HELP}" onclick="popuphelp(this.href); return false;" title="{lang:Help}"><img src="{themeconf:icon_dir}/help.png" class="button" alt="(?)"></a></li>
   </ul>
-  <h2>{lang:nbm_send_mail_to_users} [{U_TABSHEET_TITLE}]</h2>
-  <!-- BEGIN header_link -->
-  <h3>
-      <a href="{header_link.PARAM_MODE}">{lang:nbm_param_mode}</a> | 
-      <a href="{header_link.SUBSCRIBE_MODE}">{lang:nbm_subscribe_mode}</a> | 
-      <a href="{header_link.SEND_MODE}">{lang:nbm_send_mode}</a>
-  </h3>
-  <!-- END header_link -->
+  <h2>{lang:nbm_send_mail_to_users} {TABSHEET_TITLE}</h2>
+  {TABSHEET}
 </div>
 
 <form method="post" name="notification_by_mail" id="notification_by_mail" action="{F_ACTION}">
diff --git a/template/yoga/admin/tabsheet.tpl b/template/yoga/admin/tabsheet.tpl
new file mode 100644
index 000000000..257cfd13e
--- /dev/null
+++ b/template/yoga/admin/tabsheet.tpl
@@ -0,0 +1,6 @@
+<!-- $Id$ -->

+<ul class="tabsheet">

+<!-- BEGIN tab -->

+  <li class="{tab.CLASSNAME}"><a href="{tab.URL}">{tab.CAPTION}</a></li>

+<!-- END tab -->

+</ul>

diff --git a/template/yoga/theme/clear/theme.css b/template/yoga/theme/clear/theme.css
index 0f29d1fb2..f60e8154c 100644
--- a/template/yoga/theme/clear/theme.css
+++ b/template/yoga/theme/clear/theme.css
@@ -103,3 +103,21 @@ TD.calDayCellEmpty { color: silver; }
 #mbMenu #quicksearch > p { text-align: left; }
 #qsearchInput { color: #d3d3d3; }
 #qsearchInput:focus { color: #005e89; }
+
+.tabsheet li {
+  background: #ffffff;
+  color: #005e89;
+  border: 1px solid #696969;
+}
+
+.tabsheet a {
+  color: #005e89;
+}
+
+.selected_tab {
+  background: #d3d3d3 !important;
+}
+
+.tabsheet li:hover {
+  border: 1px solid #858460 !important;
+}
diff --git a/template/yoga/theme/dark/theme.css b/template/yoga/theme/dark/theme.css
index 5626e55e1..0bb601b1f 100644
--- a/template/yoga/theme/dark/theme.css
+++ b/template/yoga/theme/dark/theme.css
@@ -144,3 +144,17 @@ TD.calDayCellEmpty { color: silver; }
 }
 .qsearch { font-size: 80%; font-style: normal; }
 #mbMenu #quicksearch > p { text-align: left; }
+
+.tabsheet li {
+  background: #3f3f3f;
+  color: white;
+  border: 1px solid #fff;
+}
+
+.selected_tab {
+  background: #5f5f5f !important;
+}
+
+.tabsheet li:hover {
+  border: 1px solid #FFF48E;
+}
diff --git a/template/yoga/theme/p0w0/theme.css b/template/yoga/theme/p0w0/theme.css
index 7d81d8552..073bb26f0 100644
--- a/template/yoga/theme/p0w0/theme.css
+++ b/template/yoga/theme/p0w0/theme.css
@@ -276,3 +276,25 @@ input.submit:active {
 }
 .qsearch { font-size: 80%; font-style: italic; }
 * { outline: none; }
+
+.tabsheet li {
+  background: #369;
+  color: white;
+  border: 1px solid #fff;
+}
+
+.tabsheet a {
+  color: white;
+}
+
+.selected_tab {
+  background: #69c !important;
+}
+
+.tabsheet li:hover {
+  border: 1px solid #f92 !important;
+}
+
+.tabsheet li:hover a:hover {
+  color: #f92;
+}
diff --git a/template/yoga/theme/wipi/theme.css b/template/yoga/theme/wipi/theme.css
index 9755b89a1..da771de73 100644
--- a/template/yoga/theme/wipi/theme.css
+++ b/template/yoga/theme/wipi/theme.css
@@ -329,3 +329,25 @@ a.PWG:hover .G { color : #f92; }
 #menubar .menuInfoCatByChild, .qsearch,

 h2.showtitle, #theImage p.showlegend { display: none }

 * { outline-width: 0px; }

+

+.tabsheet li {

+  background: #222;

+  color: #69c;

+  border: 1px solid #fff;

+}

+

+.tabsheet a {

+  color: #69c;

+}

+

+.selected_tab {

+  background: #eee !important;

+}

+

+.tabsheet li:hover {

+  border: 1px solid #f92 !important;

+}

+

+.tabsheet li:hover a:hover {

+  color: #f92;

+}