Chromium Code Reviews| OLD | NEW |
|---|---|
| (Empty) | |
| 1 <polymer-element name="viewer-password-screen" attributes="text active"> | |
| 2 <template> | |
| 3 <link rel="stylesheet" href="viewer-password-screen.css"> | |
| 4 <div class="center"> | |
| 5 <form class="form"> | |
| 6 <div id="message">{{text}}</div> | |
| 7 <input id="password" type="password" size="20"></input> | |
| 8 <input id="submit" type="submit" on-click={{submit}}></input> | |
| 9 <div id="successMessage">{{successMessage}}</div> | |
| 10 </form> | |
| 11 </div> | |
| 12 </template> | |
| 13 <script> | |
| 14 Polymer('viewer-password-screen', { | |
| 15 text: 'This document is password protected. Please enter a password.', | |
| 16 active: false, | |
| 17 timerId: undefined, | |
| 18 ready: function () { | |
| 19 // Prevent default form submit behavior from occuring. | |
| 20 this.$.submit.click = null; | |
| 21 | |
| 22 this.activeChanged(); | |
| 23 }, | |
| 24 accept: function() { | |
| 25 this.successMessage = '✔' // Tick. | |
| 26 this.$.successMessage.style.color = 'rgb(0,125,0)'; | |
| 27 this.active = false; | |
| 28 }, | |
| 29 deny: function() { | |
| 30 this.successMessage = '✘'; // Cross. | |
| 31 this.$.successMessage.style.color = 'rgb(255,0,0)'; | |
| 32 this.$.password.disabled = false; | |
| 33 this.$.submit.disabled = false; | |
| 34 this.$.password.focus(); | |
| 35 this.$.password.select(); | |
| 36 }, | |
| 37 submit: function(e) { | |
| 38 e.preventDefault(); | |
| 39 if (this.$.password.value.length == 0) | |
| 40 return false; | |
| 41 this.successMessage = '...'; | |
| 42 this.$.successMessage.style.color = 'rgb(0,0,0)'; | |
| 43 this.$.password.disabled = true; | |
| 44 this.$.submit.disabled = true; | |
| 45 this.fire('password', { password: this.$.password.value }); | |
| 46 return false; | |
| 47 }, | |
| 48 activeChanged: function() { | |
| 49 clearTimeout(this.timerId); | |
| 50 this.timerId = undefined; | |
| 51 if (this.active) { | |
|
ganetsky1
2014/02/20 20:18:16
You can add arguments oldValue and newValue to the
| |
| 52 this.style.visibility = 'visible'; | |
| 53 this.style.opacity = 1; | |
| 54 this.successMessage = ''; | |
| 55 this.$.password.focus(); | |
| 56 } else { | |
| 57 this.style.opacity = 0; | |
| 58 this.timerId = setTimeout(function() { | |
| 59 this.style.visibility = 'hidden' | |
| 60 }.bind(this), 400); | |
| 61 } | |
| 62 } | |
| 63 }); | |
| 64 </script> | |
| 65 </polymer-element> | |
| OLD | NEW |