changeset 60:07d3d1560b93

added find a user functionality
author Atul Varma <avarma@mozilla.com>
date Sun, 25 Apr 2010 07:54:09 -0700
parents 440c8e2d776d
children 0e50d4f77a77
files css/main.css js/modules/app.js main.html
diffstat 3 files changed, 78 insertions(+), 6 deletions(-) [+]
line wrap: on
line diff
--- a/css/main.css	Sun Apr 25 01:21:28 2010 -0700
+++ b/css/main.css	Sun Apr 25 07:54:09 2010 -0700
@@ -167,6 +167,16 @@
     background: white;
 }
 
+.dialog input:focus {
+    background: white;
+}
+
+.dialog input.ui-autocomplete-loading {
+    background-image: url('images/ajax-loader.gif');
+    background-repeat: no-repeat;
+    background-position: 95% 35%;
+}
+
 .dialog input[type=submit] {
     cursor: pointer;
 }
--- a/js/modules/app.js	Sun Apr 25 01:21:28 2010 -0700
+++ b/js/modules/app.js	Sun Apr 25 07:54:09 2010 -0700
@@ -97,6 +97,47 @@
   };
 };
 
+Require.modules["app/ui/find-user"] = function(exports, require) {
+  var $ = require("jQuery");
+  var bugzilla = require("app/bugzilla-auth").Bugzilla;
+  var window = require("window");
+  var currReq;
+
+  var options = {
+    minLength: 2,
+    delay: 1000,
+    source: function(request, response) {
+      function success(result) {
+        currReq = null;
+        var suggs = [];
+        result.users.forEach(
+          function(user) {
+            suggs.push({label: user.real_name + " (" + user.name + ")",
+                        value: user.name});
+          });
+        response(suggs);
+      }
+      if (currReq)
+        currReq.abort();
+      currReq = bugzilla.ajax({url: "/user",
+                               data: {match: request.term},
+                               success: success});
+    }
+  };
+
+  $("#find-user .query").autocomplete(options);
+  $("#find-user form").submit(
+    function(event) {
+      event.preventDefault();
+      var username = $("#find-user .query").val();
+      var url = require("app/ui/hash").usernameToHash(username);
+      window.open(url);
+    });
+
+  exports.init = function init() {
+  };
+};
+
 Require.modules["app/ui"] = function(exports, require) {
   var $ = require("jQuery");
   var startupCallbacks = [];
@@ -174,6 +215,7 @@
 
     require("app/ui/dashboard").init();
     require("app/ui/login-form").init();
+    require("app/ui/find-user").init();
     require("app/ui/hash").init(document);
 
     startupCallbacks.forEach(function(cb) { cb(); });
@@ -191,10 +233,6 @@
     return "";
   }
 
-  function usernameToHash(username) {
-    return "#username=" + escape(username);
-  }
-
   function setLoginFromHash(location) {
     var username = usernameFromHash(location);
 
@@ -203,11 +241,15 @@
       require("app/login").set(username);
   }
 
+  exports.usernameToHash = function usernameToHash(username) {
+    return "#username=" + escape(username);
+  };
+
   exports.init = function init(document) {
     require("app/login").whenChanged(
       function(user) {
         if (user.isLoggedIn) {
-          var hash = usernameToHash(user.username);
+          var hash = exports.usernameToHash(user.username);
           if (document.location.hash != hash)
             document.location.hash = hash;
         } else
--- a/main.html	Sun Apr 25 01:21:28 2010 -0700
+++ b/main.html	Sun Apr 25 07:54:09 2010 -0700
@@ -1,6 +1,8 @@
 <html>
 <head>
-  <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
+  <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
+  <link rel="stylesheet" type="text/css" media="all"
+        href="css/jquery-ui.css" />
   <link rel="stylesheet" type="text/css" media="all"
         href="css/main.css" />
   <title>Bugzilla Dashboard</title>
@@ -52,6 +54,23 @@
   </form>
   </div>
 </div>
+<div id="find-user" class="dialog">
+  <div class="content">
+  <form id="find-user-form">
+  <p>Just type in part of a user name below. You can optionally
+  open a customized Bugzilla dashboard for the user, too.</p>
+  <table>
+   <tr>
+      <td>Name</td>
+      <td><input type="text" class="query" id="find-user-query"/></td>
+    </tr>
+  </table>
+  <br/>
+  <input type="submit" id="find-user-submit"
+         value="Show User Dashboard"/>
+  </form>
+  </div>
+</div>
 <div id="templates">
   <div class="bug-tooltip">
     <div>
@@ -78,6 +97,7 @@
 </body>
 <!-- Base Scripts -->
 <script src="js/jquery.js"></script>
+<script src="js/jquery-ui.js"></script>
 <script src="js/require.js"></script>
 <script src="js/bugzilla.js"></script>
 <script>