Update contacts javasacript code
authorMichael M Slusarz <slusarz@curecanti.org>
Mon, 9 Feb 2009 22:26:50 +0000 (15:26 -0700)
committerMichael M Slusarz <slusarz@curecanti.org>
Mon, 9 Feb 2009 22:26:50 +0000 (15:26 -0700)
imp/contacts.php
imp/js/contacts.js
imp/js/src/contacts.js
imp/templates/contacts/contacts.html
imp/themes/screen.css

index 432a2d2..3ff76a9 100644 (file)
@@ -80,14 +80,6 @@ if (count($source_list) > 1) {
     $template->set('source_list', key($source_list));
 }
 
-if ($browser->isBrowser('msie')) {
-    $template->set('select_event', ' ondblclick="addAddress(\'to\')"');
-    $template->set('option_event', null);
-} else {
-    $template->set('select_event', null);
-    $template->set('option_event', ' ondblclick="addAddress(\'to\')"');
-}
-
 $a_list = array();
 foreach ($addresses as $addr) {
     if (!empty($addr['email'])) {
@@ -111,8 +103,8 @@ Horde::addScriptFile('prototype.js', 'horde', true);
 Horde::addScriptFile('contacts.js', 'imp', true);
 require IMP_TEMPLATES . '/common-header.inc';
 IMP::addInlineScript(array(
-    'var formname = \'' . $formname . '\'',
-    'var to_only = ' . intval($to_only),
+    'ImpContacts.formname = \'' . $formname . '\'',
+    'ImpContacts.to_only = ' . intval($to_only),
 ));
 echo $template->fetch(IMP_TEMPLATES . '/contacts/contacts.html');
 require $registry->get('templates', 'horde') . '/common-footer.inc';
index 9f526d2..38a1936 100644 (file)
@@ -1 +1 @@
-function passAddresses(){var a="";$("selected_addresses").childElements().each(function(b){if(!b.value){return}a+=b.value+"|"});$("sa").setValue(a)}function sameOption(e,d,a){var c=e+": "+d.value,b=a.value;return Try.these(function(){return(c==b)||(decodeURIComponent(c)==decodeURIComponent(b))},function(){return(c==b)})}function addAddress(e){var c=$("search_results");if(!$F(c).size()){alert(IMP.text.contacts_select);return false}else{var g=$("selected_addresses"),a=$A(g).length,b;c.childElements().each(function(d){if(d.value&&d.selected){if(!$A(g).any(function(f){return sameOption(e,d,f)})){b=e+": "+d.value;g[a++]=new Option(b,b)}}})}return true}function updateMessage(){if(parent.opener.closed){alert(IMP.text.contacts_closed);this.close();return}if(!parent.opener.document[formname]){alert(IMP.text.contacts_called);this.close();return}$("selected_addresses").childElements().each(function(c){var a=c.value,d,e=null,g,b;g=a.indexOf(":");d=a.substring(0,g);a=a.substring(g+2,a.length);if(d=="to"){e=parent.opener.document[formname].to}else{if(!to_only&&d=="cc"){e=parent.opener.document[formname].cc}else{if(!to_only&&d=="bcc"){e=parent.opener.document[formname].bcc}else{return}}}if(e.value.length){b=e.value.replace(/, +/g,",").split(",").findAll(function(f){return f});e.value=b.join(", ");if(e.value.lastIndexOf(";")!=e.value.length-1){e.value+=","}e.value+=" "+a}else{e.value=a}if(a.lastIndexOf(";")!=a.length-1){e.value+=", "}});this.close()}function removeAddress(){$("selected_addresses").childElements().each(function(a){if(a.selected){a.remove()}})};
\ No newline at end of file
+var ImpContacts={_passAddresses:function(){var a="";$("selected_addresses").childElements().each(function(b){if(b.value){a+=b.value+"|"}});$("sa").setValue(a)},sameOption:function(e,d,a){var c=e+": "+d.value,b=a.value;return Try.these(function(){return(c==b)||(decodeURIComponent(c)==decodeURIComponent(b))},function(){return(c==b)})},addAddress:function(e){var g,a,c,b=$("search_results");if(!$F(b).size()){alert(IMP.text.contacts_select)}else{g=$("selected_addresses");a=$A(g).size();b.childElements().each(function(d){if(d.value&&d.selected){if(!$A(g).any(function(f){return this.sameOption(e,d,f)}.bind(this))){c=e+": "+d.value;g[a++]=new Option(c,c)}}}.bind(this))}},updateMessage:function(){if(parent.opener.closed){alert(IMP.text.contacts_closed);window.close();return}if(!parent.opener.document[this.formname]){alert(IMP.text.contacts_called);window.close();return}$("selected_addresses").childElements().each(function(c){var a=c.value,d,e=null,g,b;g=a.indexOf(":");d=a.substring(0,g);a=a.substring(g+2,a.length);if(d=="to"){e=parent.opener.document[this.formname].to}else{if(!this.to_only&&d=="cc"){e=parent.opener.document[this.formname].cc}else{if(!this.to_only&&d=="bcc"){e=parent.opener.document[this.formname].bcc}}}if(!e){return}if(e.value.length){b=e.value.replace(/, +/g,",").split(",").findAll(function(f){return f});e.value=b.join(", ");if(e.value.lastIndexOf(";")!=e.value.length-1){e.value+=","}e.value+=" "+a}else{e.value=a}if(a.lastIndexOf(";")!=a.length-1){e.value+=", "}}.bind(this));window.close()},removeAddress:function(){$("selected_addresses").childElements().each(function(a){if(a.selected){a.remove()}})},onDomLoad:function(){$("contacts").observe("submit",this._passAddresses.bind(this));document.observe("change",this._changeHandler.bindAsEventListener(this));document.observe("click",this._clickHandler.bindAsEventListener(this));document.observe("dblclick",this._dblclickHandler.bindAsEventListener(this))},_changeHandler:function(a){var b=a.element().readAttribute("id");switch(b){case"search_results":$(b)[0].selected=false;break}},_clickHandler:function(a){var b=a.element().readAttribute("id");switch(b){case"btn_add_to":case"btn_add_cc":case"btn_add_bcc":this.addAddress(b.substring(8));break;case"btn_update":this.updateMessage();break;case"btn_delete":this.removeAddress();break;case"btn_cancel":window.close();break}},_dblclickHandler:function(b){var a=b.element();if(!a.match("SELECT")){a=a.up("SELECT")}switch(a.readAttribute("id")){case"search_results":this.addAddress("to");break;case"selected_addresses":this.removeAddress();break}}};document.observe("dom:loaded",ImpContacts.onDomLoad.bind(ImpContacts));
\ No newline at end of file
index be611f0..f3c6655 100644 (file)
 /**
- * Provides the javascript for the contacts.php script
+ * Provides the javascript for the contacts.php script (standard view).
  *
  * See the enclosed file COPYING for license information (GPL). If you
  * did not receive this file, see http://www.fsf.org/copyleft/gpl.html.
  */
 
-// The following variables are defined in contacts.php:
-//   formname, to_only
+var ImpContacts = {
+    // The following variables are defined in contacts.php:
+    //   formname, to_only
 
-function passAddresses()
-{
-    var sa = '';
+    _passAddresses: function()
+    {
+        var sa = '';
 
-    $('selected_addresses').childElements().each(function(s) {
-        if (!s.value) {
-            return;
-        }
-        sa += s.value + '|';
-    });
-
-    $('sa').setValue(sa);
-}
-
-function sameOption(f, item, itemj)
-{
-    var t = f + ": " + item.value,
-        tj = itemj.value;
-
-    return Try.these(
-        function() {
-            return (t == tj) || (decodeURIComponent(t) == decodeURIComponent(tj));
-        },
-        // Catch exception with NS 7.1
-        function() {
-            return (t == tj);
-        }
-    );
-}
-
-function addAddress(f)
-{
-    var s = $('search_results');
-
-    if (!$F(s).size()) {
-        alert(IMP.text.contacts_select);
-        return false;
-    } else {
-        var d = $('selected_addresses'), l = $A(d).length, option;
-        s.childElements().each(function(i) {
-            if (i.value && i.selected) {
-                if (!$A(d).any(function(j) {
-                    return sameOption(f, i, j);
-                })) {
-                    option = f + ': ' + i.value;
-                    d[l++] = new Option(option, option);
-                }
+        $('selected_addresses').childElements().each(function(s) {
+            if (s.value) {
+                sa += s.value + '|';
             }
         });
-    }
-
-    return true;
-}
 
-function updateMessage()
-{
-    if (parent.opener.closed) {
-        alert(IMP.text.contacts_closed);
-        this.close();
-        return;
-    }
+        $('sa').setValue(sa);
+    },
+
+    sameOption: function(f, item, itemj)
+    {
+        var t = f + ": " + item.value,
+            tj = itemj.value;
+
+        return Try.these(
+            function() {
+                return (t == tj) || (decodeURIComponent(t) == decodeURIComponent(tj));
+            },
+            // Catch exception with NS 7.1
+            function() {
+                return (t == tj);
+            }
+        );
+    },
 
-    if (!parent.opener.document[formname]) {
-        alert(IMP.text.contacts_called);
-        this.close();
-        return;
-    }
+    addAddress: function(f)
+    {
+        var d, l, option, s = $('search_results');
 
-    $('selected_addresses').childElements().each(function(s) {
-        var address = s.value, f, field = null, pos, v;
-        pos = address.indexOf(':');
-        f = address.substring(0, pos);
-        address = address.substring(pos + 2, address.length)
-
-        if (f == 'to') {
-            field = parent.opener.document[formname].to;
-        } else if (!to_only && f == 'cc') {
-            field = parent.opener.document[formname].cc;
-        } else if (!to_only && f == 'bcc') {
-            field = parent.opener.document[formname].bcc;
+        if (!$F(s).size()) {
+            alert(IMP.text.contacts_select);
         } else {
+            d = $('selected_addresses');
+            l = $A(d).size();
+            s.childElements().each(function(i) {
+                if (i.value && i.selected) {
+                    if (!$A(d).any(function(j) {
+                        return this.sameOption(f, i, j);
+                    }.bind(this))) {
+                        option = f + ': ' + i.value;
+                        d[l++] = new Option(option, option);
+                    }
+                }
+            }.bind(this));
+        }
+    },
+
+    updateMessage: function()
+    {
+        if (parent.opener.closed) {
+            alert(IMP.text.contacts_closed);
+            window.close();
             return;
         }
 
-        // Always delimit with commas.
-        if (field.value.length) {
-            v = field.value.replace(/, +/g, ',').split(',').findAll(function(s) { return s; });
-            field.value = v.join(', ');
-            if (field.value.lastIndexOf(';') != field.value.length - 1) {
-                field.value += ',';
+        if (!parent.opener.document[this.formname]) {
+            alert(IMP.text.contacts_called);
+            window.close();
+            return;
+        }
+
+        $('selected_addresses').childElements().each(function(s) {
+            var address = s.value, f, field = null, pos, v;
+            pos = address.indexOf(':');
+            f = address.substring(0, pos);
+            address = address.substring(pos + 2, address.length)
+
+            if (f == 'to') {
+                field = parent.opener.document[this.formname].to;
+            } else if (!this.to_only && f == 'cc') {
+                field = parent.opener.document[this.formname].cc;
+            } else if (!this.to_only && f == 'bcc') {
+                field = parent.opener.document[this.formname].bcc;
             }
-            field.value += ' ' + address;
-        } else {
-            field.value = address;
+
+            if (!field) {
+                return;
+            }
+
+            // Always delimit with commas.
+            if (field.value.length) {
+                v = field.value.replace(/, +/g, ',').split(',').findAll(function(s) { return s; });
+                field.value = v.join(', ');
+                if (field.value.lastIndexOf(';') != field.value.length - 1) {
+                    field.value += ',';
+                }
+                field.value += ' ' + address;
+            } else {
+                field.value = address;
+            }
+            if (address.lastIndexOf(';') != address.length - 1) {
+                field.value += ', ';
+            }
+        }.bind(this));
+
+        window.close();
+    },
+
+    removeAddress: function()
+    {
+        $('selected_addresses').childElements().each(function(o) {
+            if (o.selected) {
+                o.remove();
+            }
+        });
+    },
+
+    onDomLoad: function()
+    {
+        $('contacts').observe('submit', this._passAddresses.bind(this));
+        document.observe('change', this._changeHandler.bindAsEventListener(this));
+        document.observe('click', this._clickHandler.bindAsEventListener(this));
+        document.observe('dblclick', this._dblclickHandler.bindAsEventListener(this));
+    },
+
+    _changeHandler: function(e)
+    {
+        var id = e.element().readAttribute('id');
+
+        switch (id) {
+        case 'search_results':
+            $(id)[0].selected = false;
+            break;
         }
-        if (address.lastIndexOf(';') != address.length - 1) {
-            field.value += ', ';
+    },
+
+    _clickHandler: function(e)
+    {
+        var id = e.element().readAttribute('id');
+
+        switch (id) {
+        case 'btn_add_to':
+        case 'btn_add_cc':
+        case 'btn_add_bcc':
+            this.addAddress(id.substring(8));
+            break;
+
+        case 'btn_update':
+            this.updateMessage();
+            break;
+
+        case 'btn_delete':
+            this.removeAddress();
+            break;
+
+        case 'btn_cancel':
+            window.close();
+            break;
+        }
+    },
+
+    _dblclickHandler: function(e)
+    {
+        var elt = e.element();
+        if (!elt.match('SELECT')) {
+            elt = elt.up('SELECT');
         }
-    });
 
-    this.close();
-}
+        switch (elt.readAttribute('id')) {
+        case 'search_results':
+            this.addAddress('to');
+            break;
 
-function removeAddress()
-{
-    $('selected_addresses').childElements().each(function(o) {
-        if (o.selected) {
-            o.remove();
+        case 'selected_addresses':
+            this.removeAddress();
+            break;
         }
-    });
-}
+    }
+
+};
+
+document.observe('dom:loaded', ImpContacts.onDomLoad.bind(ImpContacts));
index 99d72e6..15384d2 100644 (file)
@@ -1,4 +1,4 @@
-<form method="post" id="contacts" onsubmit="passAddresses();" action="<tag:action />">
+<form method="post" id="contacts" action="<tag:action />">
 <input type="hidden" name="formname" value="<tag:formname />" />
 <input type="hidden" name="searched" value="1" />
 <input type="hidden" id="sa" name="sa" />
@@ -11,7 +11,7 @@
 <div id="contactstable" class="headerbox item">
  <p class="control">
   <label for="search"><strong><gettext>Find:</gettext></strong></label>
-  <input value="<tag:search />" id="search" name="search" style="width:150px" />
+  <input value="<tag:search />" id="search" name="search" />
 <if:multiple_source>
   <strong><label for="source"><gettext>from</gettext></label></strong>
   <select id="source" name="source">
   <tr>
    <td width="33%">
     <label for="search_results" class="hidden"><gettext>Search Results</gettext></label>
-    <select id="search_results" name="search_results" multiple="multiple" size="10" style="width:200px" onchange="$('search_results')[0].selected=false"<tag:select_event />>
+    <select id="search_results" name="search_results" multiple="multiple" size="10">
      <option value=""><gettext>* Please select address(es) *</gettext></option>
 <loop:a_list>
-     <option title="<tag:a_list />" value="<tag:a_list />"<tag:option_event />><tag:a_list /></option>
+     <option title="<tag:a_list />" value="<tag:a_list />"><tag:a_list /></option>
 </loop:a_list>
     </select>
    </td>
-   <td width="33%" style="text-align:center">
-    <input type="button" class="button" style="width:60px" onclick="addAddress('to');" value="<gettext>To</gettext> &gt;&gt;" /><br />&nbsp;<br />
+   <td width="33%" class="contactsButtons">
+    <input id="btn_add_to" type="button" class="button" value="<gettext>To</gettext> &gt;&gt;" /><br />&nbsp;<br />
 <if:cc>
-    <input type="button" class="button" style="width:60px" onclick="addAddress('cc');" value="<gettext>Cc</gettext> &gt;&gt;" /><br />&nbsp;<br />
-    <input type="button" class="button" style="width:60px" onclick="addAddress('bcc');" value="<gettext>Bcc</gettext> &gt;&gt;" />
+    <input id="btn_add_cc" type="button" class="button" value="<gettext>Cc</gettext> &gt;&gt;" /><br />&nbsp;<br />
+    <input id="btn_add_bcc" type="button" class="button" value="<gettext>Bcc</gettext> &gt;&gt;" />
 </if:cc>
    </td>
    <td width="33%">
     <label for="selected_addresses" class="hidden"><gettext>Selected Addresses</gettext></label>
-    <select id="selected_addresses" name="selected_addresses" multiple="multiple" size="10" style="width:200px" onchange="$('selected_addresses')[0].selected = false;">
+    <select id="selected_addresses" name="selected_addresses" multiple="multiple" size="10">
      <option value=""><gettext>* Add these by clicking OK *</gettext></option>
 <loop:sa>
      <option value="<tag:sa />"><tag:sa /></option>
@@ -56,7 +56,7 @@
   <tr>
    <td colspan="2">&nbsp;</td>
    <td>
-    <input type="button" class="button" onclick="removeAddress()" value="<gettext>Delete</gettext>" />
+    <input type="button" class="button" value="<gettext>Delete</gettext>" />
    </td>
   </tr>
  </table>
@@ -65,8 +65,8 @@
 <br class="spacer" />
 
 <div>
- <input type="button" class="button" onclick="updateMessage();" value="<gettext>OK</gettext>" />
- <input type="button" class="button" onclick="window.close();" value="<gettext>Cancel</gettext>" />
+ <input id="btn_update" type="button" class="button" value="<gettext>OK</gettext>" />
+ <input id="btn_cancel" type="button" class="button" value="<gettext>Cancel</gettext>" />
 </div>
 
 </form>
index 60ee792..c38e38c 100644 (file)
@@ -312,6 +312,20 @@ tr.deleted:hover, tr.deleted-over {
     color: #090;
 }
 
+/* Contacts styles. */
+#contactstable #search {
+    width: 150px;
+}
+#contactstable #search_results, #contactstable #selected_addresses {
+    width: 200px;
+}
+.contactsButtons {
+    text-align: center;
+}
+.contactsButtons input {
+    width: 60px;
+}
+
 /* Popdown styles. */
 span.spellcheckPopdownImg {
     cursor: pointer;