chrome/browser/resources/http_auth.html

   1 <!DOCTYPE html>
   2 <html i18n-values="dir:textdirection">
   3 <head>
   4   <meta charset="utf-8">
   5   <link rel="stylesheet" href="dialog.css">
   6   <style>
   7     body {
   8       margin: 10px 10px 0 10px;
   9       -webkit-user-select: none;
  10     }
  11
  12     form {
  13       margin: 0;
  14     }
  15
  16     #explanation {
  17       cursor: default;
  18     }
  19
  20     #fields {
  21       padding: 10px 0;
  22       margin-left: auto;
  23       margin-right: auto;
  24     }
  25
  26     #username-label-cell,
  27     #password-label-cell {
  28       text-align: end;
  29       -webkit-padding-end: 5px;
  30     }
  31
  32     #username,
  33     #password {
  34       width: 150px;
  35     }
  36
  37     #buttons {
  38       text-align: end;
  39     }
  40
  41   </style>
  42   <script>
  43     function $(o) {
  44       return document.getElementById(o);
  45     }
  46
  47     function disableControls() {
  48       $('username').disabled = true;
  49       $('password').disabled = true;
  50       $('login').disabled = true;
  51       $('cancel').disabled = true;
  52     }
  53
  54     function sendCredentialsAndClose() {
  55       disableControls();
  56
  57       var result = JSON.stringify({
  58           'username': $('username').value,
  59           'password': $('password').value});
  60
  61       chrome.send('DialogClose', [result]);
  62     }
  63
  64     function cancel() {
  65       disableControls();
  66       chrome.send('DialogClose');
  67     }
  68
  69     function handleSubmit(e) {
  70       sendCredentialsAndClose();
  71       e.preventDefault();
  72     }
  73
  74     function handleKeyDown(e) {
  75       if (e.keyCode == 27) {  // Escape
  76         cancel();
  77         e.preventDefault();
  78       }
  79     }
  80
  81     function setAutofillCredentials(username, password) {
  82       $('username').value = username;
  83       $('password').value = password;
  84     }
  85
  86     function load() {
  87       document.addEventListener('keydown', handleKeyDown);
  88       $('explanation').textContent = chrome.getVariableValue('dialogArguments');
  89       $('form').onsubmit = handleSubmit;
  90       $('cancel').onclick = cancel;
  91
  92       chrome.send('GetAutofill', ['']);
  93     }
  94
  95     document.addEventListener('DOMContentLoaded', load);
  96   </script>
  97 </head>
  98 <body i18n-values=".style.fontFamily:fontfamily;.style.fontSize:fontsize">
  99   <div id="explanation"></div>
 100   <form id="form">
 101     <table id="fields">
 102       <tr>
 103         <td id="username-label-cell">
 104           <label for="username" i18n-content="username"></label>
 105         </td>
 106         <td>
 107           <input id="username" type="text" autofocus>
 108         </td>
 109       </tr>
 110       <tr>
 111         <td id="password-label-cell">
 112           <label for="password" i18n-content="password"></label>
 113         </td>
 114         <td>
 115           <input id="password" name="password" type="password">
 116         </td>
 117       </tr>
 118     </table>
 119     <div id="buttons">
 120       <input id="cancel" type="reset" i18n-values="value:cancel">
 121       <input id="login" type="submit" i18n-values="value:signin">
 122     </div>
 123   </form>
 124 </body>
 125 </html>