From 975dd38482945e10cf0ea2f020856653298d5c28 Mon Sep 17 00:00:00 2001
From: Byron Jones <bjones@mozilla.com>
Date: Tue, 2 Jul 2013 11:48:27 +0800
Subject: Bug 888806: Bugzilla login field should use "placeholder" HTML5
 attribute instead of JavaScript

---
 js/global.js                                       | 35 ++++---------------
 .../en/default/account/auth/login-small.html.tmpl  | 40 ++--------------------
 template/en/default/index.html.tmpl                | 39 +++------------------
 3 files changed, 13 insertions(+), 101 deletions(-)

diff --git a/js/global.js b/js/global.js
index b62d7b9a7..1aac910c3 100644
--- a/js/global.js
+++ b/js/global.js
@@ -16,8 +16,6 @@
 *                 
 */
 
-var mini_login_constants;
-
 function show_mini_login_form( suffix ) {
     var login_link = document.getElementById('login_link' + suffix);
     var login_form = document.getElementById('mini_login' + suffix);
@@ -67,13 +65,10 @@ function hide_forgot_form( suffix ) {
 function init_mini_login_form( suffix ) {
     var mini_login = document.getElementById('Bugzilla_login' +  suffix );
     var mini_password = document.getElementById('Bugzilla_password' +  suffix );
-    var mini_dummy = document.getElementById(
-        'Bugzilla_password_dummy' + suffix);
+    var mini_dummy = document.getElementById('Bugzilla_password_dummy' + suffix);
     // If the login and password are blank when the page loads, we display
     // "login" and "password" in the boxes by default.
     if (mini_login.value == "" && mini_password.value == "") {
-        mini_login.value = mini_login_constants.login;
-        YAHOO.util.Dom.addClass(mini_login, "bz_mini_login_help");
         YAHOO.util.Dom.addClass(mini_password, 'bz_default_hidden');
         YAHOO.util.Dom.removeClass(mini_dummy, 'bz_default_hidden');
     }
@@ -82,33 +77,15 @@ function init_mini_login_form( suffix ) {
     }
 }
 
-// Clear the words "login" and "password" from the form when you click
-// in one of the boxes. We clear them both when you click in either box
-// so that the browser's password-autocomplete can work.
-function mini_login_on_focus( suffix ) {
-    var mini_login = document.getElementById('Bugzilla_login' +  suffix );
-    var mini_password = document.getElementById('Bugzilla_password' +  suffix );
-    var mini_dummy = document.getElementById(
-        'Bugzilla_password_dummy' + suffix);
-
-    YAHOO.util.Dom.removeClass(mini_login, "bz_mini_login_help");
-    if (mini_login.value == mini_login_constants.login) {
-        mini_login.value = '';
-    }
-    YAHOO.util.Dom.removeClass(mini_password, 'bz_default_hidden');
-    YAHOO.util.Dom.addClass(mini_dummy, 'bz_default_hidden');
-}
-
 function check_mini_login_fields( suffix ) {
     var mini_login = document.getElementById('Bugzilla_login' +  suffix );
     var mini_password = document.getElementById('Bugzilla_password' +  suffix );
-    if( (mini_login.value != "" && mini_password.value != "") 
-         &&  mini_login.value != mini_login_constants.login )
-    {
-      return true;
+    if (mini_login.value != "" && mini_password.value != "") {
+        return true;
+    } else {
+        window.alert("You must provide the email address and password before logging in.");
+        return false;
     }
-    window.alert( mini_login_constants.warning );
-    return false;
 }
 
 function set_language( value ) {
diff --git a/template/en/default/account/auth/login-small.html.tmpl b/template/en/default/account/auth/login-small.html.tmpl
index 216c4ed8a..220eb5f21 100644
--- a/template/en/default/account/auth/login-small.html.tmpl
+++ b/template/en/default/account/auth/login-small.html.tmpl
@@ -52,9 +52,9 @@
            class="bz_login"
            name="Bugzilla_login"
            title="Login"
-           onfocus="mini_login_on_focus('[% qs_suffix FILTER js %]')"
+           placeholder="email address"
     >
-    <input class="bz_password" 
+    <input class="bz_password"
            id="Bugzilla_password[% qs_suffix FILTER html %]" 
            name="Bugzilla_password"
            type="password"
@@ -63,7 +63,6 @@
     <input class="bz_password bz_default_hidden bz_mini_login_help" type="text" 
            id="Bugzilla_password_dummy[% qs_suffix %]" value="password"
            title="Password"
-           onfocus="mini_login_on_focus('[% qs_suffix FILTER js %]')"
     >
     [% IF Param('rememberlogin') == 'defaulton' ||
           Param('rememberlogin') == 'defaultoff' 
@@ -75,41 +74,6 @@
     [% END %]
     <input type="submit" name="GoAheadAndLogIn" value="Log in" 
             id="log_in[% qs_suffix %]">
-    <script type="text/javascript">
-      mini_login_constants = {
-          "login" : "email address",
-          "warning" : "You must set the email address and password before logging in."
-      };
-      [%# We need this event to fire after autocomplete, because it does
-        # something different depending on whether or not there's already
-        # data in the login and password box.
-        # However, autocomplete happens at all sorts of different times in
-        # different browsers (before or after onDOMReady, before or after
-        # window.onload, in almost all combinations you can imagine).
-        # The only good solution I found is to time the event 200 
-        # milliseconds after window.onload for WebKit (doing it immediately 
-        # at onload works in Chrome but not in Safari, but I can't detect 
-        # them separately using YUI), and right after onDOMReady in Gecko. 
-        # The WebKit solution is also fairly guaranteed to work on any 
-        # browser (it's just strange, since the fields only populate 200 ms
-        # after the page loads), so it's the default. IE doesn't even
-        # recognize our forms as login forms, so I made it use the Gecko
-        # method also (since it's nicer visually). Opera never autocompletes
-        # forms without user interaction, so it also uses the Gecko method.
-        #%]
-      if (YAHOO.env.ua.gecko || YAHOO.env.ua.ie || YAHOO.env.ua.opera) {
-          YAHOO.util.Event.onDOMReady(function() {
-              init_mini_login_form('[% qs_suffix FILTER html %]');
-          });
-      }
-      else {
-          YAHOO.util.Event.on(window, 'load', function () {
-              window.setTimeout(function() {
-                  init_mini_login_form('[% qs_suffix FILTER html %]');
-              }, 200);
-          });
-    }
-    </script>
     <a href="#" id="hide_mini_login[% qs_suffix FILTER html %]" 
        onclick="return hide_mini_login_form('[% qs_suffix %]')">[x]</a>
   </form>
diff --git a/template/en/default/index.html.tmpl b/template/en/default/index.html.tmpl
index 29bc9adb6..fa2a4d126 100644
--- a/template/en/default/index.html.tmpl
+++ b/template/en/default/index.html.tmpl
@@ -38,40 +38,13 @@
 
 
 <script type="text/javascript">
-<!--
-function onLoadActions() {
-  quicksearchHelpText('quicksearch_main', 'show');
-  if( window.external.AddSearchProvider ){
-    YAHOO.util.Dom.removeClass('quicksearch_plugin', 'bz_default_hidden');
-  }
-  document.getElementById('quicksearch_top').focus();
-}
-var quicksearch_message = "Enter [% terms.abug %] # or some search terms";
-
 function checkQuicksearch( form ) {
-  if (form.quicksearch.value == '' || form.quicksearch.value == quicksearch_message ) { 
+  if (form.quicksearch.value == '') {
     alert('Please enter one or more search terms first.');
-    return false; 
-  }
-  return true;         
-}
-
-function quicksearchHelpText(el_id, action){
-  var el = document.getElementById(el_id);
-  if ( action == "show") {
-    if( el.value == "" ) {
-      el.value = quicksearch_message
-      YAHOO.util.Dom.addClass(el, "quicksearch_help_text");
-    }
-  } else {
-    if( el.value == quicksearch_message ) {
-      el.value = "";
-      YAHOO.util.Dom.removeClass(el, "quicksearch_help_text");
-    }
+    return false;
   }
+  return true;
 }
-YAHOO.util.Event.onDOMReady(onLoadActions);
-//-->
 </script>
 
 [% IF release %]
@@ -144,10 +117,8 @@ YAHOO.util.Event.onDOMReady(onLoadActions);
               onsubmit="return checkQuicksearch(this);">
           <div>
             <input id="quicksearch_main" type="text" name="quicksearch"
-              title="Quick Search" 
-              onfocus="quicksearchHelpText(this.id, 'hide');"
-              onblur="quicksearchHelpText(this.id, 'show');"
-            >
+              placeholder="Enter [% terms.abug %] number or some search terms"
+              title="Quick Search">
             <input id="find" type="submit" value="Quick Search">
             <ul class="additional_links" id="quicksearch_links">
               <li>
-- 
cgit v1.2.3-24-g4f1b