| 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 |