Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(289)

Side by Side Diff: elements/viewer-password-screen/viewer-password-screen.html

Issue 176883002: Fixed some stylistic issues with <viewer-password-screen> (Closed) Base URL: https://chromium.googlesource.com/chromium/html-office-public.git@master
Patch Set: Created 6 years, 10 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « no previous file | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <polymer-element name="viewer-password-screen" attributes="text active"> 1 <polymer-element name="viewer-password-screen" attributes="text active">
2 <template> 2 <template>
3 <link rel="stylesheet" href="viewer-password-screen.css"> 3 <link rel="stylesheet" href="viewer-password-screen.css">
4 <div class="center"> 4 <div class="center">
5 <form class="form"> 5 <form class="form">
6 <div id="message">{{text}}</div> 6 <div id="message">{{text}}</div>
7 <input id="password" type="password" size="20"></input> 7 <input id="password" type="password" size="20"></input>
8 <input id="submit" type="submit" on-click={{submit}}></input> 8 <input id="submit" type="submit" on-click={{submit}}></input>
9 <div id="successMessage">{{successMessage}}</div> 9 <div id="successMessage">{{successMessage}}</div>
10 </form> 10 </form>
11 </div> 11 </div>
12 </template> 12 </template>
13 <script> 13 <script>
14 Polymer('viewer-password-screen', { 14 Polymer('viewer-password-screen', {
15 text: 'This document is password protected. Please enter a password.', 15 text: 'This document is password protected. Please enter a password.',
16 active: false, 16 active: false,
17 timerId: undefined, 17 timerId: undefined,
18 ready: function () { 18 ready: function () {
19 // Prevent default form submit behavior from occuring.
20 this.$.submit.click = null;
21
22 this.activeChanged(); 19 this.activeChanged();
23 }, 20 },
24 accept: function() { 21 accept: function() {
25 this.successMessage = '&#x2714;' // Tick. 22 this.successMessage = '&#x2714;' // Tick.
26 this.$.successMessage.style.color = 'rgb(0,125,0)'; 23 this.$.successMessage.style.color = 'rgb(0,125,0)';
27 this.active = false; 24 this.active = false;
28 }, 25 },
29 deny: function() { 26 deny: function() {
30 this.successMessage = '&#x2718;'; // Cross. 27 this.successMessage = '&#x2718;'; // Cross.
31 this.$.successMessage.style.color = 'rgb(255,0,0)'; 28 this.$.successMessage.style.color = 'rgb(255,0,0)';
32 this.$.password.disabled = false; 29 this.$.password.disabled = false;
33 this.$.submit.disabled = false; 30 this.$.submit.disabled = false;
34 this.$.password.focus(); 31 this.$.password.focus();
35 this.$.password.select(); 32 this.$.password.select();
36 }, 33 },
37 submit: function(e) { 34 submit: function(e) {
35 // Prevent the default form submission behavior.
38 e.preventDefault(); 36 e.preventDefault();
39 if (this.$.password.value.length == 0) 37 if (this.$.password.value.length == 0)
40 return false; 38 return;
41 this.successMessage = '...'; 39 this.successMessage = '...';
42 this.$.successMessage.style.color = 'rgb(0,0,0)'; 40 this.$.successMessage.style.color = 'rgb(0,0,0)';
43 this.$.password.disabled = true; 41 this.$.password.disabled = true;
44 this.$.submit.disabled = true; 42 this.$.submit.disabled = true;
45 this.fire('password-submitted', { password: this.$.password.value }); 43 this.fire('password-submitted', {password: this.$.password.value});
46 return false; 44 return;
47 }, 45 },
48 activeChanged: function() { 46 activeChanged: function() {
49 clearTimeout(this.timerId); 47 clearTimeout(this.timerId);
50 this.timerId = undefined; 48 this.timerId = undefined;
51 if (this.active) { 49 if (this.active) {
52 this.style.visibility = 'visible'; 50 this.style.visibility = 'visible';
53 this.style.opacity = 1; 51 this.style.opacity = 1;
54 this.successMessage = ''; 52 this.successMessage = '';
55 this.$.password.focus(); 53 this.$.password.focus();
56 } else { 54 } else {
57 this.style.opacity = 0; 55 this.style.opacity = 0;
58 this.timerId = setTimeout(function() { 56 this.timerId = setTimeout(function() {
59 this.style.visibility = 'hidden' 57 this.style.visibility = 'hidden'
60 }.bind(this), 400); 58 }.bind(this), 400);
61 } 59 }
62 } 60 }
63 }); 61 });
64 </script> 62 </script>
65 </polymer-element> 63 </polymer-element>
OLDNEW
« no previous file with comments | « no previous file | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698