if we have javascript available, use that to toggle more/less links. This is
[squirrelmail.git] / templates / default / js / default.js
index 97de27083d16b7ff37fd86eafb26fd5a247a90ea..2c045a36cee40927268c903d03d28920bf239957 100644 (file)
 /**
  * This array is used to remember mark status of rows in browse mode
+ *
+ * @copyright © 2005-2006 The SquirrelMail Project Team
+ * @license http://opensource.org/licenses/gpl-license.php GNU Public License
+ * @version $Id$
  */
 var marked_row = new Array;
 var orig_row_colors = new Array();
 
-
 /*
  * (un)Checks checkbox for the row that the current table cell is in
  * when it gets clicked.
  *
- * @param   string   the name of the checkbox that should be (un)checked
+ * @param string                  The (internal) name of the checkbox
+ *                                that should be (un)checked
+ * @param JavaScript event object The JavaScript event associated
+ *                                with this mouse click
+ * @param string                  The name of the encapsulating form
+ * @param string                  The (real) name of the checkbox
+ *                                that should be (un)checked
+ * @param string                  Any extra JavaScript (that will
+ *                                be executed herein if non-empty);
+ *                                must be valid JavaScript expression(s)
  */
-function row_click(chkboxName) {
-    chkbox = document.getElementById(chkboxName);
+function row_click(chkboxName, event, formName, checkboxRealName, extra) {
+    var chkbox = document.getElementById(chkboxName);
     if (chkbox) {
         // initialize orig_row_color if not defined already
         if (!orig_row_colors[chkboxName]) {
             orig_row_colors[chkboxName] = chkbox.parentNode.getAttribute('bgcolor');
+            if (orig_row_colors[chkboxName].indexOf("clicked_") == 0)
+                orig_row_colors[chkboxName] = orig_row_colors[chkboxName].substring(8, orig_row_colors[chkboxName].length);
         }
         chkbox.checked = (chkbox.checked ? false : true);
+
+        if (extra != '') eval(extra);
     }
 }
+
+/*
+ * Gets the current class of the requested row.  This is a browser specific function.
+ * Code shamelessly ripped from setPointer() below.
+ */
+function getCSSClass (theRow)
+{
+    var rowClass;
+       // 3.1 ... with DOM compatible browsers except Opera that does not return
+       //         valid values with "getAttribute"
+       if (typeof(window.opera) == 'undefined'
+               && typeof(theRow.getAttribute) != 'undefined'
+               && theRow.getAttribute('className') ) {
+               rowClass = theRow.getAttribute('className');
+       }
+       // 3.2 ... with other browsers
+       else {
+               rowClass = theRow.className;
+       }
+       
+       return rowClass;
+}
+
+/*
+ * Sets a new CSS class for the given row.  Browser-specific.
+ */
+function setCSSClass (obj, newClass) {
+       if (typeof(window.opera) == 'undefined' && typeof(obj.getAttribute) != 'undefined' && obj.getAttribute('className') ) {
+               obj.setAttribute('className', newClass, 0);
+       }
+       else {
+               obj.className = newClass;
+       }
+}
+
 /*
  * This function is used to initialize the orig_row_color array so we do not
  * need to predefine the entire array
  */
-function rowOver(chkboxName, overColor, clickedColor) {
-    chkbox = document.getElementById(chkboxName);
+function rowOver(chkboxName) {
+    var chkbox = document.getElementById(chkboxName);
+    var rowClass, rowNum, overClass, clickedClass;
     if (chkbox) {
         if (!orig_row_colors[chkboxName]) {
-            bgColor = chkbox.parentNode.getAttribute('bgcolor');
-            orig_row_colors[chkboxName] = bgColor;
+            rowClass = getCSSClass(chkbox.parentNode.parentNode);
+            if (rowClass.indexOf("clicked_") == 0)
+                rowClass = rowClass.substring(8, rowClass.length);
+            orig_row_colors[chkboxName] = rowClass;
         } else {
-            bgColor = orig_row_colors[chkboxName];
+            rowClass = orig_row_colors[chkboxName];
         }
-        j = chkbox.name.length - 1
-        setPointer(chkbox.parentNode.parentNode, j,'over' , bgColor, overColor, clickedColor);
+        rowNum = chkboxName.substring(chkboxName.length - 1, chkboxName.length);
+
+/*
+ * The mouseover and clicked CSS classes are always the same name!
+ */        
+        overClass = 'mouse_over';
+        clickedClass = 'clicked';
+        setPointer(chkbox.parentNode.parentNode, rowNum, 'over' , rowClass, overClass, clickedClass);
     }
 }
 
@@ -44,107 +104,81 @@ function rowOver(chkboxName, overColor, clickedColor) {
  * when it gets clicked.
  *
  * @param   string   the id of the form where all checkboxes should be (un)checked
+ * @param   string   the first three characters of target checkboxes, if any
  * @param   boolean  use fancy row coloring when a checkbox is checked
  * @param   string   new color of the checked rows
  */
-function toggle_all(formname, fancy, clickedColor) {
-     TargetForm = document.getElementById(formname);
-     j = 0;
-     for (var i = 0; i < TargetForm.elements.length; i++) {
-         if (TargetForm.elements[i].type == 'checkbox' && TargetForm.elements[i].name.substring(0,3) == 'msg') {
-             if (fancy) {
+function toggle_all(formname, name_prefix, fancy) {
+    var TargetForm = document.getElementById(formname);
+    var j = 0;
+    for (var i = 0; i < TargetForm.elements.length; i++) {
+        if (TargetForm.elements[i].type == 'checkbox' && (name_prefix == '' || TargetForm.elements[i].name.substring(0,3) == name_prefix)) {
+            if (fancy) {
                 array_key = TargetForm.elements[i].getAttribute('id');
-                if (TargetForm.elements[i].checked == false) {
-                    // initialize orig_row_color if not defined already
-                    if (!orig_row_colors[array_key]) {
-                        orig_row_colors[array_key] = TargetForm.elements[i].parentNode.getAttribute('bgcolor');
-                    }
+                // initialize orig_row_color if not defined already
+                if (!orig_row_colors[array_key]) {
+                    rowClass = getCSSClass(TargetForm.elements[i].parentNode.parentNode);
+                    if (rowClass.indexOf("clicked_") == 0)
+                        rowClass = rowClass.substring(8, rowClass.length);
+                    orig_row_colors[array_key] = rowClass;
                 }
-                origColor = orig_row_colors[array_key];
-                setPointer(TargetForm.elements[i].parentNode.parentNode, j,'click' , origColor, origColor, clickedColor);
+                origClass = orig_row_colors[array_key];
+                clickedClass = 'clicked';
+                setPointer(TargetForm.elements[i].parentNode.parentNode, j,'click' , origClass, origClass, clickedClass);
                 j++
             }
             TargetForm.elements[i].checked = !(TargetForm.elements[i].checked);
-         }
-     }
+        }
+    }
 }
 
 /*
  * Sets/unsets the pointer and marker in browse mode
  *
- * @param   object    the table row
- * @param   integer  the row number
- * @param   string    the action calling this script (over, out or click)
- * @param   string    the default background color
- * @param   string    the color to use for mouseover
- * @param   string    the color to use for marking a row
+ * @param object  theRow         the table row
+ * @param integer theRowNum      the row number
+ * @param string  theAction      the action calling this script (over, out or click)
+ * @param string  defaultClass   the default background CSS class
+ * @param string  mouseoverClass the CSS class to use for mouseover
+ * @param string  clickedClass   the CSS class to use for marking a row
  *
  * @return  boolean  whether pointer is set or not
  */
-function setPointer(theRow, theRowNum, theAction, theDefaultColor, thePointerColor, theMarkColor)
+function setPointer(theRow, theRowNum, theAction, defaultClass, mouseoverClass, clickedClass)
 {
-    var theCells = null;
-
     // 1. Pointer and mark feature are disabled or the browser can't get the
     //    row -> exits
-    if ((thePointerColor == '' && theMarkColor == '')
-        || typeof(theRow.style) == 'undefined') {
+    if ((mouseoverClass == '' && clickedClass == '')
+        || typeof(theRow.className) == 'undefined') {
         return false;
     }
 
-    // 2. Gets the current row and exits if the browser can't get it
+    // 2. Verify we can get the current row or exit
     if (typeof(document.getElementsByTagName) != 'undefined') {
-        theCells = theRow.getElementsByTagName('td');
+               // We are ok
     }
-    else if (typeof(theRow.cells) != 'undefined') {
-        theCells = theRow.cells;
+    else if (typeof(theRow) != 'undefined') {
+       // We are ok
     }
     else {
         return false;
     }
 
-    // 3. Gets the current color...
-    var rowCellsCnt  = theCells.length;
-    var domDetect    = null;
-    var currentColor = null;
-    var newColor     = null;
-    // 3.1 ... with DOM compatible browsers except Opera that does not return
-    //         valid values with "getAttribute"
-    if (typeof(window.opera) == 'undefined'
-        && typeof(theCells[0].getAttribute) != 'undefined') {
-        currentColor = theCells[0].getAttribute('bgcolor');
-        domDetect    = true;
-    }
-    // 3.2 ... with other browsers
-    else {
-        currentColor = theCells[0].style.backgroundColor;
-        domDetect    = false;
-    } // end 3
-
-    // 3.3 ... Opera changes colors set via HTML to rgb(r,g,b) format so fix it
-    if (currentColor.indexOf("rgb") >= 0)
-    {
-        var rgbStr = currentColor.slice(currentColor.indexOf('(') + 1,
-                                     currentColor.indexOf(')'));
-        var rgbValues = rgbStr.split(",");
-        currentColor = "#";
-        var hexChars = "0123456789ABCDEF";
-        for (var i = 0; i < 3; i++)
-        {
-            var v = rgbValues[i].valueOf();
-            currentColor += hexChars.charAt(v/16) + hexChars.charAt(v%16);
+    // 3. Gets the current CSS class...
+    var newClass     = null;
+    var currentClass = getCSSClass(theRow);
+    if (currentClass.indexOf("clicked_") == 0)
+        currentClass = 'clicked';
+    
+    // 4. Defines the new class
+    // 4.1 Current class is the default one
+    if (currentClass == ''
+        || currentClass.toLowerCase() == defaultClass.toLowerCase()) {
+        if (theAction == 'over' && mouseoverClass != '') {
+            newClass = mouseoverClass;
         }
-    }
-
-    // 4. Defines the new color
-    // 4.1 Current color is the default one
-    if (currentColor == ''
-        || currentColor.toLowerCase() == theDefaultColor.toLowerCase()) {
-        if (theAction == 'over' && thePointerColor != '') {
-            newColor              = thePointerColor;
-        }
-        else if (theAction == 'click' && theMarkColor != '') {
-            newColor              = theMarkColor;
+        else if (theAction == 'click' && clickedClass != '') {
+            newClass = clickedClass;
             marked_row[theRowNum] = true;
             // deactivated onclick marking of the checkbox because it's also executed
             // when an action (clicking on the checkbox itself) on a single item is
@@ -154,47 +188,33 @@ function setPointer(theRow, theRowNum, theAction, theDefaultColor, thePointerCol
             //document.getElementById('msg[' + theRowNum + ']').checked = true;
         }
     }
-    // 4.1.2 Current color is the pointer one
-    else if (currentColor.toLowerCase() == thePointerColor.toLowerCase()
+    // 4.1.2 Current class is the mouseover one
+    else if (currentClass.toLowerCase() == mouseoverClass.toLowerCase()
              && (typeof(marked_row[theRowNum]) == 'undefined' || !marked_row[theRowNum])) {
         if (theAction == 'out') {
-            newColor              = theDefaultColor;
+            newClass = defaultClass;
         }
-        else if (theAction == 'click' && theMarkColor != '') {
-            newColor              = theMarkColor;
+        else if (theAction == 'click' && clickedClass != '') {
+            newClass = clickedClass;
             marked_row[theRowNum] = true;
             //document.getElementById('msg[' + theRowNum + ']').checked = true;
         }
     }
-    // 4.1.3 Current color is the marker one
-    else if (currentColor.toLowerCase() == theMarkColor.toLowerCase()) {
+    // 4.1.3 Current color is the clicked one
+    else if (currentClass.toLowerCase() == clickedClass.toLowerCase()) {
         if (theAction == 'click') {
-            newColor              = (thePointerColor != '')
-                                  ? thePointerColor
-                                  : theDefaultColor;
-            marked_row[theRowNum] = (typeof(marked_row[theRowNum]) == 'undefined' || !marked_row[theRowNum])
-                                  ? true
-                                  : null;
+            newClass              = (mouseoverClass != '')
+                                  ? mouseoverClass
+                                  : defaultClass;
+            marked_row[theRowNum] = false;
             //document.getElementById('msg[' + theRowNum + ']').checked = false;
         }
     } // end 4
 
     // 5. Sets the new color...
-    if (newColor) {
-        var c = null;
-        // 5.1 ... with DOM compatible browsers except Opera
-        if (domDetect) {
-            for (c = 0; c < rowCellsCnt; c++) {
-                theCells[c].setAttribute('bgcolor', newColor, 0);
-            } // end for
-        }
-        // 5.2 ... with other browsers
-        else {
-            for (c = 0; c < rowCellsCnt; c++) {
-                theCells[c].style.backgroundColor = newColor;
-            }
-        }
-    } // end 5
+    if (newClass) {
+       setCSSClass(theRow, newClass);
+    }
 
     return true;
 } // end of the 'setPointer()' function
@@ -207,7 +227,7 @@ function comp_in_new_form(comp_uri, button, myform, iWidth, iHeight) {
     }
     if (!iWidth) iWidth   =  640;
     if (!iHeight) iHeight =  550;
-    sArg = "width=" + iWidth + ",height=" + iHeight + ",scrollbars=yes,resizable=yes,status=yes";
+    var sArg = "width=" + iWidth + ",height=" + iHeight + ",scrollbars=yes,resizable=yes,status=yes";
     var newwin = window.open(comp_uri, "_blank", sArg);
 }
 
@@ -222,8 +242,8 @@ function comp_in_new(comp_uri, iWidth, iHeight) {
  * Reload the read_body screen on sending an mdn receipt
  */
 function sendMDN() {
-    mdnuri=window.location+'&sendreceipt=1';
-    var newwin = window.open(mdnuri,'right');
+    var mdnuri=window.location+'&sendreceipt=1';
+    window.location = mdnuri; 
 }
 
 var alreadyFocused = false;
@@ -263,3 +283,23 @@ function checkForm(smaction) {
         }
     }
 }
+
+function printThis()
+{
+    parent.frames['right'].focus();
+    parent.frames['right'].print();
+}
+
+/* JS implementation of more/less links in To/CC. Could later be extended
+ * show/hide other interface items */
+function showhide (item, txtmore, txtless) {
+    var oTemp=document.getElementById("recpt_tail_" + item);
+    var oClick=document.getElementById("toggle_" + item);
+    if (oTemp.style.display=="inline") {
+        oTemp.style.display="none";
+        oClick.innerHTML=txtmore;
+    } else {
+        oTemp.style.display="inline";
+        oClick.innerHTML=txtless;
+    }
+}