Merge pull request #1221 from ether/focus-on-password

proper fix for focus and some styling of the form and allows for pressin...

3 files changed, 58 insertions, 16 deletions

diff --git a/src/static/css/pad.css b/src/static/css/pad.css
index c3deebc1..9897a303 100644
--- a/src/static/css/pad.css
+++ b/src/static/css/pad.css
@@ -22,6 +22,7 @@ iframe {
 .readonly .acl-write {
   display: none;
 }
+
 #users {
   background: #f7f7f7;
   background: -webkit-linear-gradient( #F7F7F7,#EEE);
@@ -190,6 +191,19 @@ a img {
   height: 30px;
   z-index: 100;
 }
+
+#editorloadingbox .passForm{
+  padding:10px;
+}
+
+#editorloadingbox input{
+  padding:10px;
+}
+
+#editorloadingbox button{
+  padding:10px;
+}
+
 #editorcontainerbox {
   position: absolute;
   bottom: 0;
@@ -883,3 +897,15 @@ input[type=checkbox] {
       line-height: 24px
     }
 }
+
+#passwordRequired{
+  display:none;
+}
+
+#permissionDenied{
+  display:none;
+}
+
+#wrongPassword{
+  display:none;
+}
diff --git a/src/static/js/pad.js b/src/static/js/pad.js
index 34f2a287..9ad701b3 100644
--- a/src/static/js/pad.js
+++ b/src/static/js/pad.js
@@ -51,18 +51,20 @@ var randomString = require('./pad_utils').randomString;
 
 var hooks = require('./pluginfw/hooks');
 
-function createCookie(name, value, days, path)
-{
+function createCookie(name, value, days, path){ /* Warning Internet Explorer doesn't use this it uses the one from pad_utils.js */
   if (days)
   {
     var date = new Date();
     date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
     var expires = "; expires=" + date.toGMTString();
   }
-  else var expires = "";
+  else{
+    var expires = "";
+  }
   
-  if(!path)
+  if(!path){ // If the path isn't set then just whack the cookie on the root path
     path = "/";
+  }
   
   //Check if the browser is IE and if so make sure the full path is set in the cookie
   if(navigator.appName=='Microsoft Internet Explorer'){
@@ -202,6 +204,7 @@ function savePassword()
   createCookie("password",$("#passwordinput").val(),null,document.location.pathname);
   //reload
   document.location=document.location;
+  return false;
 }
 
 function handshake()
@@ -298,21 +301,25 @@ function handshake()
     //the access was not granted, give the user a message
     if(!receivedClientVars && obj.accessStatus)
     {
+      $('.passForm').submit(require(module.id).savePassword);
+
       if(obj.accessStatus == "deny")
       {
-        $("#editorloadingbox").html("<b>You do not have permission to access this pad</b>");
+        $('#loading').hide();
+        $("#permissionDenied").show();
       }
       else if(obj.accessStatus == "needPassword")
       {
-        $("#editorloadingbox").html("<b>You need a password to access this pad</b><br>" +
-                                    "<input id='passwordinput' type='password' name='password'>"+
-                                    "<button type='button' onclick=\"" + padutils.escapeHtml('require('+JSON.stringify(module.id)+").savePassword()") + "\">ok</button>");
+        $('#loading').hide();
+        $('#passwordRequired').show();
+        $("#passwordinput").focus();
       }
       else if(obj.accessStatus == "wrongPassword")
       {
-        $("#editorloadingbox").html("<b>Your password was wrong</b><br>" +
-                                    "<input id='passwordinput' type='password' name='password'>"+
-                                    "<button type='button' onclick=\"" + padutils.escapeHtml('require('+JSON.stringify(module.id)+").savePassword()") + "\">ok</button>");
+        $('#loading').hide();
+        $('#wrongPassword').show();
+        $('#passwordRequired').show();
+        $("#passwordinput").focus();
       }
     }
     
diff --git a/src/static/js/pad_utils.js b/src/static/js/pad_utils.js
index 83ee9aae..82f7fcad 100644
--- a/src/static/js/pad_utils.js
+++ b/src/static/js/pad_utils.js
@@ -39,20 +39,29 @@ function randomString(len)
   return randomstring;
 }
 
-function createCookie(name, value, days, path)
-{
+function createCookie(name, value, days, path){ /* Used by IE */
   if (days)
   {
     var date = new Date();
     date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
     var expires = "; expires=" + date.toGMTString();
   }
-  else var expires = "";
+  else{
+    var expires = "";
+  }
 
-  if(!path)
+  if(!path){ // IF the Path of the cookie isn't set then just create it on root
     path = "/";
+  }
+
+  //Check if the browser is IE and if so make sure the full path is set in the cookie
+  if(navigator.appName=='Microsoft Internet Explorer'){
+    document.cookie = name + "=" + value + expires + "; path=/"; /* Note this bodge fix for IE is temporary until auth is rewritten */
+  }
+  else{
+    document.cookie = name + "=" + value + expires + "; path=" + path;
+  }
 
-  document.cookie = name + "=" + value + expires + "; path=" + path;
 }
 
 function readCookie(name)