Added toolbar to administration module with "help" button.

Monotone-Parent: 7145f91bc53473eb5af77730e87d0ebc7d3988e3
Monotone-Revision: 78bab40835ca73611c47298a0a8de1393cf60c03

Monotone-Author: flachapelle@inverse.ca
Monotone-Date: 2009-10-15T17:21:01
Monotone-Branch: ca.inverse.sogo

ChangeLog

@@ -1,3 +1,8 @@
+2009-10-15  Francis Lachapelle  <flachapelle@inverse.ca>
+
+	* UI/WebServerResources/AdministrationUI.js (help): new function
+	to display the help from the toolbar instead of the module title.
+
 2009-10-15  Ludovic Marcotte  <lmarcotte@inverse.ca>
 
 	* UI/MailerUI/UIxMailAccountActions.m

UI/AdministrationUI/BrazilianPortuguese.lproj/Localizable.strings

@@ -1,5 +1,8 @@
 /* this file is in UTF-8 format! */
 
+"Help" = "Help";
+"Close" = "Close";
+
 "Modules" = "Modules";
 
 /* Modules short names */

UI/AdministrationUI/Czech.lproj/Localizable.strings

@@ -1,5 +1,8 @@
 /* this file is in UTF-8 format! */
 
+"Help" = "Help";
+"Close" = "Close";
+
 "Modules" = "Modules";
 
 /* Modules short names */

UI/AdministrationUI/Dutch.lproj/Localizable.strings

@@ -1,5 +1,8 @@
 /* this file is in UTF-8 format! */
 
+"Help" = "Help";
+"Close" = "Close";
+
 "Modules" = "Modules";
 
 /* Modules short names */

UI/AdministrationUI/English.lproj/Localizable.strings

@@ -1,5 +1,8 @@
 /* this file is in UTF-8 format! */
 
+"Help" = "Help";
+"Close" = "Close";
+
 "Modules" = "Modules";
 
 /* Modules short names */

UI/AdministrationUI/French.lproj/Localizable.strings

@@ -1,5 +1,8 @@
 /* this file is in UTF-8 format! */
 
+"Help" = "Aide";
+"Close" = "Fermer";
+
 "Modules" = "Modules";
 
 /* Modules short names */

UI/AdministrationUI/GNUmakefile

@@ -18,8 +18,8 @@ AdministrationUI_RESOURCE_FILES += \
 	Version		\
 	product.plist	
 
-#AdministrationUI_RESOURCE_FILES += \
-#	Toolbars/UIxAdministration.toolbar
+AdministrationUI_RESOURCE_FILES += \
+	Toolbars/UIxAdministration.toolbar
 
 AdministrationUI_LOCALIZED_RESOURCE_FILES += \
 	Localizable.strings		\

UI/AdministrationUI/German.lproj/Localizable.strings

@@ -1,5 +1,8 @@
 /* this file is in UTF-8 format! */
 
+"Help" = "Help";
+"Close" = "Close";
+
 "Modules" = "Modules";
 
 /* Modules short names */

UI/AdministrationUI/Hungarian.lproj/Localizable.strings

@@ -1,5 +1,8 @@
 /* this file is in UTF-8 format! */
 
+"Help" = "Help";
+"Close" = "Close";
+
 "Modules" = "Modules";
 
 /* Modules short names */

UI/AdministrationUI/Italian.lproj/Localizable.strings

@@ -1,5 +1,8 @@
 /* this file is in UTF-8 format! */
 
+"Help" = "Help";
+"Close" = "Close";
+
 "Modules" = "Modules";
 
 /* Modules short names */

UI/AdministrationUI/Russian.lproj/Localizable.strings

@@ -1,5 +1,8 @@
 /* this file is in UTF-8 format! */
 
+"Help" = "Help";
+"Close" = "Close";
+
 "Modules" = "Modules";
 
 /* Modules short names */

UI/AdministrationUI/Spanish.lproj/Localizable.strings

@@ -1,5 +1,8 @@
 /* this file is in UTF-8 format! */
 
+"Help" = "Help";
+"Close" = "Close";
+
 "Modules" = "Modules";
 
 /* Modules short names */

UI/AdministrationUI/Toolbars/UIxAdministration.toolbar

@@ -0,0 +1,7 @@
+( /* the toolbar groups -*-cperl-*- */
+  ( { link = "#";
+      label = "Help";
+      onclick = "help(this);";
+      image = "properties.png"; }
+  )
+)

UI/AdministrationUI/UIxAdministration.h

@@ -1,4 +1,4 @@
-/* UIxPreferences.h - this file is part of SOGo
+/* UIxAdministration.h - this file is part of SOGo
  *
  * Copyright (C) 2009 Inverse inc.
  *

UI/AdministrationUI/Welsh.lproj/Localizable.strings

@@ -1,5 +1,8 @@
 /* this file is in UTF-8 format! */
 
+"Help" = "Help";
+"Close" = "Close";
+
 "Modules" = "Modules";
 
 /* Modules short names */

UI/Templates/AdministrationUI/UIxAdministration.wox

@@ -7,8 +7,17 @@
   xmlns:label="OGo:label"
   className="UIxPageFrame"
   title="title"
+  const:toolbar="UIxAdministration.toolbar"
   const:jsFiles="dtree.js">
 
+  <div id="helpDialog" style="display: none" class="dialog left">
+    <div>
+      <h3><!-- module title --></h3>
+      <div><!-- module description --></div>
+      <p class="button"><a href="#" class="button" id="helpDialogClose"><var:string label:value="Close"/></a></p>
+    </div>
+  </div>
+
   <div id="leftPanel">
     <div class="titlediv"><var:string label:value="Modules" /></div>
     <div id="administrationModules">
@@ -21,8 +30,8 @@
   <div class="dragHandle" id="verticalDragHandle"><!-- space --></div>
 
   <div id="rightPanel">
-    <span><h1><a href="#" id="moduleDescription"><span><img rsrc:src="arrow-rit-sharp.gif"/></span><var:string label:value="ACLs_title"/></a></h1>
-    <div style="display: none;"><var:string label:value="ACLs_description" const:escapeHTML="NO"/></div></span>
+    <span><h1 id="moduleTitle"><var:string label:value="ACLs_title"/></h1>
+    <div id="moduleDescription" style="display: none"><var:string label:value="ACLs_description" const:escapeHTML="NO"/></div></span>
     <var:component className="UIxAdministrationFilterPanel" qualifier="qualifier" />
     <div id="administrationContent"><!-- space --></div>
   </div>

UI/WebServerResources/AdministrationUI.css

@@ -1,7 +1,33 @@
+DIV#helpDialog
+{
+    width: 300px;
+}
+
+DIV#helpDialog H3
+{
+    font-size: 1.2em;
+    margin: 0;
+    padding: 0;
+}
+
+DIV#helpDialog DIV DIV
+{
+    border: 0;
+    margin: 0;
+    padding: 0;
+}
+
+DIV#helpDialog P.button
+{
+    margin: 0;
+    padding: 0 0 5px 0;
+    text-align: right;
+}
+
 DIV#verticalDragHandle
 {
     cursor: e-resize;
-    top: 4em;
+    top: 6em;
     left: 15em;
     width: 5px;
     bottom: 0px;
@@ -17,7 +43,7 @@ DIV#verticalDragHandle
 DIV#administrationModules
 {
     position: absolute;
-    top: 5em;
+    top: 9em;
     left: 0;
     width: 15em;
     bottom: 2px;
@@ -69,12 +95,11 @@ DIV#administrationModules UL LI
 DIV#rightPanel
 {
     position: absolute;
-    top: 2em;
+    top: 6em;
     left: 15em;
     margin-left: 5px;
     right: 0px;
     bottom: 0px;
-    height: 100%;
     overflow: hidden;
 }
 
@@ -85,42 +110,10 @@ DIV#rightPanel > SPAN
 
 DIV#rightPanel H1
 {
-    display: inline;
     font-size: 14px;
     margin: 0.5em 0 5px 0;
 }
 
-DIV#rightPanel H1 A
-{
-    color: #000;
-}
-
-DIV#rightPanel H1 SPAN
-{
-    float: left;
-    margin-right: 5px;
-    text-align: right;
-    width: 15px;
-}
-
-DIV#rightPanel H1 SPAN IMG
-{
-    margin: 3px 0;
-}
-
-DIV#rightPanel SPAN DIV
-{
-    background-color: #eee;
-    margin: 0.5em 10px 0.5em 20px;
-    padding: 1em;
-}
-
-DIV#rightPanel SPAN DIV P
-{
-    margin: 0;
-    padding: 0;
-}
-
 DIV#filterPanel
 { 
     n0padding-top: 5px; 
@@ -133,7 +126,7 @@ DIV#administrationContent
     left: 0;
     right: 1em;
     top: 3em;
-    bottom: 3em;
+    bottom: 2px;
     background-color: #fff;
     padding: .5em;
     overflow: auto;

UI/WebServerResources/AdministrationUI.js

@@ -4,6 +4,8 @@ var d;
 var usersRightsWindowHeight = 220;
 var usersRightsWindowWidth = 450;
 
+/* ACLs module */
+
 function onSearchFormSubmit() {
     var searchValue = $("searchValue");
     var encodedValue = encodeURI(searchValue.value);
@@ -191,12 +193,7 @@ function onFolderOpen(event) {
     openAclWindow(urlstr);
 }
 
-function toggleDisplay(elementID) {
-    var e = $(elementID);
-    if (e) {
-	e.toggle();
-    }
-}
+/* Common functions */
 
 function configureDragHandles() {
     var handle = $("verticalDragHandle");
@@ -205,46 +202,35 @@ function configureDragHandles() {
         handle.leftBlock = $("administrationModules");
         handle.rightBlock = $("rightPanel");
         handle.leftMargin = 100;
-	document.observe("handle:dragged", onWindowResize);
     }
 }
 
-function onToggleDescription(event) {
-    var desc = this.up().next("div");
-    var span = this.up("span");
-    var h1 = this.up("h1");
-    var filter = $("filterPanel");
-    
-    var div = $("administrationContent");
-    var img = span.down("img");
-    if (event) {
-	// Toggle only if user clicks on the link
-	if (desc.visible()) {
-	    desc.hide();
-	    img.src = ResourcesURL + "/arrow-rit-sharp.gif";
-            filter.setStyle({ float: "right", clear: "none" });
-	}
-	else {
-	    desc.show();
-	    img.src = ResourcesURL + "/arrow-dwn.gif"; 
-            filter.setStyle({ float: "none", clear: "left" });
-	}
-    }
-    div.setStyle({ top: (filter.cumulativeOffset().top + 10) + "px" });
-}
+function help() {
+    var div = $("helpDialog");
+    var title = div.select('H3').first();
+    var description = div.select('DIV DIV')[0];
+    var module = $$("#administrationModules LI._selected").first();
 
-function onWindowResize(event) {
-    var f = onToggleDescription.bind($("moduleDescription"));
-    f(null);
+    var cellPosition = module.cumulativeOffset();
+    var cellDimensions = module.getDimensions();
+    var left = cellDimensions.width - 20;
+    var top = cellPosition.top + 3;
+
+    div.setStyle({ top: top + 'px',
+                left: left + 'px' });
+    title.update($("moduleTitle").innerHTML);
+    description.update($("moduleDescription").innerHTML);
+
+    div.show();
 }
 
 function initAdministration() {
+    $("helpDialogClose").observe("click", function(event) {
+            $("helpDialog").hide();
+        });
+
     var searchValue = $("searchValue");
     searchValue.focus();
-
-    $("moduleDescription").observe("click", onToggleDescription);
-
-    Event.observe(window, "resize", onWindowResize);
 }
 
 document.observe("dom:loaded", initAdministration);