Chromium Code Reviews| 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('pairing-device-list', (function() { | 5 Polymer((function() { |
| 6 /** @const */ var ICON_COLORS = ['#F0B9CB', '#F0ACC3', '#F098B6', '#F084A9', | 6 /** @const */ var ICON_COLORS = ['#F0B9CB', '#F0ACC3', '#F098B6', '#F084A9', |
| 7 '#F06D99', '#F05287', '#F0467F', '#F03473', | 7 '#F06D99', '#F05287', '#F0467F', '#F03473', |
| 8 '#F01E65', '#F00051']; | 8 '#F01E65', '#F00051']; |
| 9 return { | 9 return { |
| 10 is: 'pairing-device-list', | |
| 11 | |
| 12 properties: { | |
| 13 devices: Array, | |
|
Roman Sorokin (ftl)
2015/06/19 13:10:31
nit: Add an empty string
dzhioev (left Google)
2015/06/20 02:01:55
Done.
| |
| 14 selected: { | |
| 15 type: String, | |
| 16 notify: true | |
| 17 }, | |
|
Roman Sorokin (ftl)
2015/06/19 13:10:31
ditto
dzhioev (left Google)
2015/06/20 02:01:55
Done.
| |
| 18 connecting: { | |
| 19 type: Boolean, | |
| 20 reflectToAttribute: true | |
| 21 } | |
| 22 }, | |
| 23 | |
| 24 getStyleForDeviceIcon_: function(deviceName) { | |
| 25 return 'color: ' + this.colorByName_(deviceName); | |
| 26 }, | |
| 27 | |
| 10 /* Returns pseudo-random color depending of hash of the |name|. */ | 28 /* Returns pseudo-random color depending of hash of the |name|. */ |
| 11 colorByName: function(name) { | 29 colorByName_: function(name) { |
| 12 var hash = 0; | 30 var hash = 0; |
| 13 for (var i = 0; i < name.length; ++i) | 31 for (var i = 0; i < name.length; ++i) |
| 14 hash = (name.charCodeAt(i) + 31 * hash) | 0; | 32 hash = (name.charCodeAt(i) + 31 * hash) | 0; |
| 15 return ICON_COLORS[hash % ICON_COLORS.length]; | 33 return ICON_COLORS[hash % ICON_COLORS.length]; |
| 16 } | 34 } |
| 17 }; | 35 }; |
| 18 })()); | 36 })()); |
| 19 | 37 |
| 20 Polymer('controller-pairing-screen', (function() { | 38 Polymer({ |
| 39 is: 'controller-pairing-page', | |
| 40 | |
| 41 behaviors: [ | |
| 42 Polymer.NeonSharedElementAnimatableBehavior | |
| 43 ], | |
| 44 | |
| 45 properties: { | |
| 46 sharedElements: { | |
| 47 value: function() { | |
| 48 return { | |
| 49 'top-hero': this.$.top, | |
| 50 'bottom-hero': this.$.bottom | |
| 51 }; | |
| 52 } | |
| 53 }, | |
| 54 | |
| 55 animationConfig: { | |
| 56 value: function() { | |
| 57 return { | |
| 58 'entry': [{ | |
| 59 name: 'hero-animation', | |
| 60 id: 'top-hero', | |
| 61 toPage: this | |
| 62 }, { | |
| 63 name: 'hero-animation', | |
| 64 id: 'bottom-hero', | |
| 65 toPage: this | |
| 66 }, { | |
| 67 name: 'fade-in-animation', | |
| 68 node: this | |
| 69 }], | |
| 70 | |
| 71 'exit': [{ | |
| 72 name: 'hero-animation', | |
| 73 id: 'top-hero', | |
| 74 fromPage: this | |
| 75 }, { | |
| 76 name: 'hero-animation', | |
| 77 id: 'bottom-hero', | |
| 78 fromPage: this | |
| 79 }, { | |
| 80 name: 'fade-out-animation', | |
| 81 node: this | |
| 82 }] | |
| 83 }; | |
| 84 } | |
| 85 } | |
| 86 } | |
| 87 }); | |
| 88 | |
| 89 Polymer((function() { | |
| 21 'use strict'; | 90 'use strict'; |
| 22 | 91 |
| 23 // Keep these constants synced with corresponding constants defined in | 92 // Keep these constants synced with corresponding constants defined in |
| 24 // controller_pairing_screen_actor.{h,cc}. | 93 // controller_pairing_screen_actor.{h,cc}. |
| 25 /** @const */ var CONTEXT_KEY_CONTROLS_DISABLED = 'controlsDisabled'; | 94 /** @const */ var CONTEXT_KEY_CONTROLS_DISABLED = 'controlsDisabled'; |
| 26 /** @const */ var CONTEXT_KEY_SELECTED_DEVICE = 'selectedDevice'; | 95 /** @const */ var CONTEXT_KEY_SELECTED_DEVICE = 'selectedDevice'; |
| 27 /** @const */ var CONTEXT_KEY_ACCOUNT_ID = 'accountId'; | 96 /** @const */ var CONTEXT_KEY_ACCOUNT_ID = 'accountId'; |
| 28 | 97 |
| 29 /** @const */ var ACTION_ENROLL = 'enroll'; | 98 /** @const */ var ACTION_ENROLL = 'enroll'; |
| 30 | 99 |
| 31 /** @const */ var PAGE_AUTHENTICATION = 'authentication'; | 100 /** @const */ var PAGE_AUTHENTICATION = 'authentication'; |
| 32 | 101 |
| 33 return { | 102 return { |
| 34 gaiaHost_: null, | 103 is: 'controller-pairing-screen', |
| 35 selectedDevice: null, | |
| 36 | 104 |
| 37 observe: { | 105 behaviors: [ |
| 38 'C.devices': 'deviceListChanged', | 106 login.OobeScreenBehavior |
| 39 'C.page': 'pageChanged' | 107 ], |
| 108 | |
| 109 properties: { | |
| 110 selectedDevice: { | |
| 111 type: String, | |
| 112 observer: 'selectedDeviceChanged_' | |
| 113 } | |
| 114 }, | |
| 115 | |
| 116 observers: [ | |
| 117 'deviceListChanged_(C.devices)' | |
| 118 ], | |
| 119 | |
| 120 ready: function() { | |
| 121 /** | |
| 122 * Workaround for | |
| 123 * https://github.com/PolymerElements/neon-animation/issues/32 | |
| 124 * TODO(dzhioev): Remove when fixed in Polymer. | |
| 125 */ | |
| 126 var pages = this.$.pages; | |
| 127 delete pages._squelchNextFinishEvent; | |
| 128 Object.defineProperty(pages, '_squelchNextFinishEvent', | |
| 129 { get: function() { return false; } }); | |
| 40 }, | 130 }, |
| 41 | 131 |
| 42 /** @override */ | 132 /** @override */ |
| 43 initialize: function() { | 133 initialize: function() { |
| 134 ['code', | |
| 135 'controlsDisabled', | |
| 136 'devices', | |
| 137 'enrollmentDomain', | |
| 138 'page'].forEach(this.registerBoundContextField, this); | |
| 44 this.context.set(CONTEXT_KEY_CONTROLS_DISABLED, true); | 139 this.context.set(CONTEXT_KEY_CONTROLS_DISABLED, true); |
| 45 this.commitContextChanges(); | 140 this.commitContextChanges(); |
| 46 }, | 141 }, |
| 47 | 142 |
| 48 pageChanged: function(oldPage, newPage) { | 143 deviceListChanged_: function() { |
| 49 if (newPage == PAGE_AUTHENTICATION) { | 144 this.selectedDevice = this.context.get(CONTEXT_KEY_SELECTED_DEVICE, null); |
| 50 this.gaiaHost_.load(cr.login.GaiaAuthHost.AuthMode.DEFAULT, | |
| 51 {}, | |
| 52 this.onAuthCompleted_.bind(this)); | |
| 53 } | |
| 54 }, | 145 }, |
| 55 | 146 |
| 56 deviceListChanged: function() { | 147 selectedDeviceChanged_: function(selectedDevice) { |
| 57 this.selectedDevice = this.context.get(CONTEXT_KEY_SELECTED_DEVICE); | |
| 58 }, | |
| 59 | |
| 60 selectedDeviceChanged: function() { | |
| 61 this.context.set(CONTEXT_KEY_SELECTED_DEVICE, | 148 this.context.set(CONTEXT_KEY_SELECTED_DEVICE, |
| 62 this.selectedDevice ? this.selectedDevice : ''); | 149 selectedDevice ? selectedDevice : ''); |
| 63 this.commitContextChanges(); | 150 this.commitContextChanges(); |
| 64 }, | 151 }, |
| 65 | 152 |
| 66 helpButtonClicked: function() { | 153 helpButtonClicked_: function() { |
| 67 console.error('Help is not implemented yet.'); | 154 console.error('Help is not implemented yet.'); |
| 68 }, | 155 }, |
| 69 | 156 |
| 70 onAuthCompleted_: function(credentials) { | 157 getHostEnrollmentStepTitle_: function(domain) { |
| 71 this.context.set(CONTEXT_KEY_ACCOUNT_ID, credentials.email); | 158 return this.i18n(['enrollmentInProgress', domain]); |
| 72 this.commitContextChanges(); | 159 }, |
| 73 this.send(login.Screen.CALLBACK_USER_ACTED, ACTION_ENROLL); | 160 |
| 161 getSuccessMessage_: function(selectedDevice) { | |
| 162 return this.i18n(['successText', selectedDevice]); | |
| 74 } | 163 } |
| 75 }; | 164 }; |
| 76 })()); | 165 })()); |
| 77 | 166 |
| OLD | NEW |