OLD | NEW |
1 // Copyright 2014 The Chromium Authors. All rights reserved. | 1 // Copyright 2014 The Chromium Authors. All rights reserved. |
2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
4 | 4 |
5 Polymer((function() { | 5 Polymer((function() { |
6 /** @const */ var ICON_COLORS = ['#F0B9CB', '#F0ACC3', '#F098B6', '#F084A9', | 6 /** @const */ var ICON_COLORS = [ |
7 '#F06D99', '#F05287', '#F0467F', '#F03473', | 7 '#F0B9CB', '#F0ACC3', '#F098B6', '#F084A9', '#F06D99', '#F05287', '#F0467F', |
8 '#F01E65', '#F00051']; | 8 '#F03473', '#F01E65', '#F00051' |
| 9 ]; |
9 return { | 10 return { |
10 is: 'pairing-device-list', | 11 is: 'pairing-device-list', |
11 | 12 |
12 properties: { | 13 properties: { |
13 devices: Array, | 14 devices: Array, |
14 | 15 |
15 selected: { | 16 selected: {type: String, notify: true}, |
16 type: String, | |
17 notify: true | |
18 }, | |
19 | 17 |
20 connecting: { | 18 connecting: {type: Boolean, reflectToAttribute: true} |
21 type: Boolean, | |
22 reflectToAttribute: true | |
23 } | |
24 }, | 19 }, |
25 | 20 |
26 getStyleForDeviceIcon_: function(deviceName) { | 21 getStyleForDeviceIcon_: function(deviceName) { |
27 return 'color: ' + this.colorByName_(deviceName); | 22 return 'color: ' + this.colorByName_(deviceName); |
28 }, | 23 }, |
29 | 24 |
30 /* Returns pseudo-random color depending of hash of the |name|. */ | 25 /* Returns pseudo-random color depending of hash of the |name|. */ |
31 colorByName_: function(name) { | 26 colorByName_: function(name) { |
32 var hash = 0; | 27 var hash = 0; |
33 for (var i = 0; i < name.length; ++i) | 28 for (var i = 0; i < name.length; ++i) |
34 hash = (name.charCodeAt(i) + 31 * hash) | 0; | 29 hash = (name.charCodeAt(i) + 31 * hash) | 0; |
35 return ICON_COLORS[hash % ICON_COLORS.length]; | 30 return ICON_COLORS[hash % ICON_COLORS.length]; |
36 } | 31 } |
37 }; | 32 }; |
38 })()); | 33 })()); |
39 | 34 |
40 Polymer({ | 35 Polymer({ |
41 is: 'controller-pairing-page', | 36 is: 'controller-pairing-page', |
42 | 37 |
43 behaviors: [Polymer.NeonAnimatableBehavior], | 38 behaviors: [Polymer.NeonAnimatableBehavior], |
44 | 39 |
45 properties: { | 40 properties: { |
46 animationConfig: { | 41 animationConfig: { |
47 value: function() { | 42 value: function() { |
48 return { | 43 return { |
49 'entry': [{ | 44 'entry': [{name: 'fade-in-animation', node: this}], |
50 name: 'fade-in-animation', | |
51 node: this | |
52 }], | |
53 | 45 |
54 'exit': [{ | 46 'exit': [{name: 'fade-out-animation', node: this}] |
55 name: 'fade-out-animation', | |
56 node: this | |
57 }] | |
58 }; | 47 }; |
59 } | 48 } |
60 } | 49 } |
61 } | 50 } |
62 }); | 51 }); |
63 | 52 |
64 Polymer((function() { | 53 Polymer((function() { |
65 'use strict'; | 54 'use strict'; |
66 | 55 |
67 // Keep these constants synced with corresponding constants defined in | 56 // Keep these constants synced with corresponding constants defined in |
68 // controller_pairing_screen_actor.{h,cc}. | 57 // controller_pairing_screen_actor.{h,cc}. |
69 /** @const */ var CONTEXT_KEY_CONTROLS_DISABLED = 'controlsDisabled'; | 58 /** @const */ var CONTEXT_KEY_CONTROLS_DISABLED = 'controlsDisabled'; |
70 /** @const */ var CONTEXT_KEY_SELECTED_DEVICE = 'selectedDevice'; | 59 /** @const */ var CONTEXT_KEY_SELECTED_DEVICE = 'selectedDevice'; |
71 /** @const */ var CONTEXT_KEY_ACCOUNT_ID = 'accountId'; | 60 /** @const */ var CONTEXT_KEY_ACCOUNT_ID = 'accountId'; |
72 | 61 |
73 /** @const */ var ACTION_ENROLL = 'enroll'; | 62 /** @const */ var ACTION_ENROLL = 'enroll'; |
74 | 63 |
75 /** @const */ var PAGE_AUTHENTICATION = 'authentication'; | 64 /** @const */ var PAGE_AUTHENTICATION = 'authentication'; |
76 | 65 |
77 return { | 66 return { |
78 is: 'controller-pairing-screen', | 67 is: 'controller-pairing-screen', |
79 | 68 |
80 behaviors: [ | 69 behaviors: [login.OobeScreenBehavior], |
81 login.OobeScreenBehavior | |
82 ], | |
83 | 70 |
84 properties: { | 71 properties: |
85 selectedDevice: { | 72 {selectedDevice: {type: String, observer: 'selectedDeviceChanged_'}}, |
86 type: String, | |
87 observer: 'selectedDeviceChanged_' | |
88 } | |
89 }, | |
90 | 73 |
91 observers: [ | 74 observers: ['deviceListChanged_(C.devices)'], |
92 'deviceListChanged_(C.devices)' | |
93 ], | |
94 | 75 |
95 ready: function() { | 76 ready: function() { |
96 /** | 77 /** |
97 * Workaround for | 78 * Workaround for |
98 * https://github.com/PolymerElements/neon-animation/issues/32 | 79 * https://github.com/PolymerElements/neon-animation/issues/32 |
99 * TODO(dzhioev): Remove when fixed in Polymer. | 80 * TODO(dzhioev): Remove when fixed in Polymer. |
100 */ | 81 */ |
101 var pages = this.$.pages; | 82 var pages = this.$.pages; |
102 delete pages._squelchNextFinishEvent; | 83 delete pages._squelchNextFinishEvent; |
103 Object.defineProperty(pages, '_squelchNextFinishEvent', | 84 Object.defineProperty(pages, '_squelchNextFinishEvent', { |
104 { get: function() { return false; } }); | 85 get: function() { |
| 86 return false; |
| 87 } |
| 88 }); |
105 }, | 89 }, |
106 | 90 |
107 /** @override */ | 91 /** @override */ |
108 initialize: function() { | 92 initialize: function() { |
109 ['code', | 93 ['code', 'controlsDisabled', 'devices', 'enrollmentDomain', 'page'] |
110 'controlsDisabled', | 94 .forEach(this.registerBoundContextField, this); |
111 'devices', | |
112 'enrollmentDomain', | |
113 'page'].forEach(this.registerBoundContextField, this); | |
114 this.context.set(CONTEXT_KEY_CONTROLS_DISABLED, true); | 95 this.context.set(CONTEXT_KEY_CONTROLS_DISABLED, true); |
115 this.commitContextChanges(); | 96 this.commitContextChanges(); |
116 }, | 97 }, |
117 | 98 |
118 i18n: function(args) { | 99 i18n: function(args) { |
119 return loadTimeData.getStringF.apply(loadTimeData, args); | 100 return loadTimeData.getStringF.apply(loadTimeData, args); |
120 }, | 101 }, |
121 | 102 |
122 deviceListChanged_: function() { | 103 deviceListChanged_: function() { |
123 this.selectedDevice = this.context.get(CONTEXT_KEY_SELECTED_DEVICE, null); | 104 this.selectedDevice = this.context.get(CONTEXT_KEY_SELECTED_DEVICE, null); |
124 }, | 105 }, |
125 | 106 |
126 selectedDeviceChanged_: function(selectedDevice) { | 107 selectedDeviceChanged_: function(selectedDevice) { |
127 this.context.set(CONTEXT_KEY_SELECTED_DEVICE, | 108 this.context.set( |
128 selectedDevice ? selectedDevice : ''); | 109 CONTEXT_KEY_SELECTED_DEVICE, selectedDevice ? selectedDevice : ''); |
129 this.commitContextChanges(); | 110 this.commitContextChanges(); |
130 }, | 111 }, |
131 | 112 |
132 helpButtonClicked_: function() { | 113 helpButtonClicked_: function() { |
133 console.error('Help is not implemented yet.'); | 114 console.error('Help is not implemented yet.'); |
134 }, | 115 }, |
135 | 116 |
136 getHostEnrollmentStepTitle_: function(domain) { | 117 getHostEnrollmentStepTitle_: function(domain) { |
137 return this.i18n(['loginControllerPairingScreenEnrollmentInProgress', | 118 return this.i18n( |
138 domain]); | 119 ['loginControllerPairingScreenEnrollmentInProgress', domain]); |
139 }, | 120 }, |
140 | 121 |
141 getSuccessMessage_: function(selectedDevice) { | 122 getSuccessMessage_: function(selectedDevice) { |
142 return this.i18n(['loginControllerPairingScreenSuccessText', | 123 return this.i18n( |
143 selectedDevice]); | 124 ['loginControllerPairingScreenSuccessText', selectedDevice]); |
144 } | 125 } |
145 }; | 126 }; |
146 })()); | 127 })()); |
OLD | NEW |