| 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 /** | 5 /** |
| 6 * @fileoverview User pod row implementation. | 6 * @fileoverview User pod row implementation. |
| 7 */ | 7 */ |
| 8 | 8 |
| 9 cr.define('login', function() { | 9 cr.define('login', function() { |
| 10 /** | 10 /** |
| (...skipping 971 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 982 return this.classList.contains('expanded'); | 982 return this.classList.contains('expanded'); |
| 983 }, | 983 }, |
| 984 | 984 |
| 985 set expanded(expanded) { | 985 set expanded(expanded) { |
| 986 if (this.expanded == expanded) | 986 if (this.expanded == expanded) |
| 987 return; | 987 return; |
| 988 | 988 |
| 989 this.resetTabOrder(); | 989 this.resetTabOrder(); |
| 990 this.classList.toggle('expanded', expanded); | 990 this.classList.toggle('expanded', expanded); |
| 991 if (expanded) { | 991 if (expanded) { |
| 992 // Show the advanced expanded pod directly if there are at least two | |
| 993 // recommended locales. This will be the case in multilingual | |
| 994 // environments where users are likely to want to choose among locales. | |
| 995 if (this.querySelector('.language-select').multipleRecommendedLocales) | |
| 996 this.classList.add('advanced'); | |
| 997 this.usualLeft = this.left; | 992 this.usualLeft = this.left; |
| 998 this.makeSpaceForExpandedPod_(); | 993 this.makeSpaceForExpandedPod_(); |
| 999 } else if (typeof(this.usualLeft) != 'undefined') { | 994 } else if (typeof(this.usualLeft) != 'undefined') { |
| 1000 this.left = this.usualLeft; | 995 this.left = this.usualLeft; |
| 1001 } | 996 } |
| 1002 | 997 |
| 1003 var self = this; | 998 var self = this; |
| 1004 this.classList.add('animating'); | 999 this.classList.add('animating'); |
| 1005 this.addEventListener('webkitTransitionEnd', function f(e) { | 1000 this.addEventListener('webkitTransitionEnd', function f(e) { |
| 1006 self.removeEventListener('webkitTransitionEnd', f); | 1001 self.removeEventListener('webkitTransitionEnd', f); |
| (...skipping 42 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 1049 learnMore.addEventListener('mousedown', stopEventPropagation); | 1044 learnMore.addEventListener('mousedown', stopEventPropagation); |
| 1050 learnMore.addEventListener('click', this.handleLearnMoreEvent); | 1045 learnMore.addEventListener('click', this.handleLearnMoreEvent); |
| 1051 learnMore.addEventListener('keydown', this.handleLearnMoreEvent); | 1046 learnMore.addEventListener('keydown', this.handleLearnMoreEvent); |
| 1052 | 1047 |
| 1053 learnMore = this.querySelector('.expanded-pane-learn-more'); | 1048 learnMore = this.querySelector('.expanded-pane-learn-more'); |
| 1054 learnMore.addEventListener('click', this.handleLearnMoreEvent); | 1049 learnMore.addEventListener('click', this.handleLearnMoreEvent); |
| 1055 learnMore.addEventListener('keydown', this.handleLearnMoreEvent); | 1050 learnMore.addEventListener('keydown', this.handleLearnMoreEvent); |
| 1056 | 1051 |
| 1057 var languageSelect = this.querySelector('.language-select'); | 1052 var languageSelect = this.querySelector('.language-select'); |
| 1058 languageSelect.tabIndex = UserPodTabOrder.POD_INPUT; | 1053 languageSelect.tabIndex = UserPodTabOrder.POD_INPUT; |
| 1059 languageSelect.manuallyChanged = false; | |
| 1060 languageSelect.addEventListener( | 1054 languageSelect.addEventListener( |
| 1061 'change', | 1055 'change', |
| 1062 function() { | 1056 this.getPublicSessionKeyboardLayouts_.bind(this)); |
| 1063 languageSelect.manuallyChanged = true; | 1057 this.querySelector('.keyboard-select').tabIndex = |
| 1064 this.getPublicSessionKeyboardLayouts_(); | 1058 UserPodTabOrder.POD_INPUT; |
| 1065 }.bind(this)); | |
| 1066 | |
| 1067 var keyboardSelect = this.querySelector('.keyboard-select'); | |
| 1068 keyboardSelect.tabIndex = UserPodTabOrder.POD_INPUT; | |
| 1069 keyboardSelect.loadedLocale = null; | |
| 1070 | 1059 |
| 1071 var languageAndInput = this.querySelector('.language-and-input'); | 1060 var languageAndInput = this.querySelector('.language-and-input'); |
| 1072 languageAndInput.tabIndex = UserPodTabOrder.POD_INPUT; | 1061 languageAndInput.tabIndex = UserPodTabOrder.POD_INPUT; |
| 1073 languageAndInput.addEventListener('click', | 1062 languageAndInput.addEventListener('click', |
| 1074 this.transitionToAdvanced_.bind(this)); | 1063 this.transitionToAdvanced_.bind(this)); |
| 1075 | 1064 |
| 1076 this.enterButtonElement.addEventListener('click', (function(e) { | 1065 this.enterButtonElement.addEventListener('click', (function(e) { |
| 1077 this.enterButtonElement.disabled = true; | 1066 this.enterButtonElement.disabled = true; |
| 1078 var locale = this.querySelector('.language-select').value; | 1067 var locale = ''; |
| 1079 var keyboardSelect = this.querySelector('.keyboard-select'); | 1068 var keyboardLayout = ''; |
| 1080 // The contents of |keyboardSelect| is updated asynchronously. If its | 1069 if (this.advanced) { |
| 1081 // locale does not match |locale|, it has not updated yet and the | 1070 // If the advanced pod is being shown, honor the selected UI language |
| 1082 // currently selected keyboard layout may not be applicable to |locale|. | 1071 // and keyboard layout. |
| 1083 // Do not return any keyboard layout in this case and let the backend | 1072 locale = this.querySelector('.language-select').value; |
| 1084 // choose a suitable layout. | 1073 keyboardLayout = this.querySelector('.keyboard-select').value; |
| 1085 var keyboardLayout = | 1074 } |
| 1086 keyboardSelect.loadedLocale == locale ? keyboardSelect.value : ''; | |
| 1087 chrome.send('launchPublicSession', | 1075 chrome.send('launchPublicSession', |
| 1088 [this.user.username, locale, keyboardLayout]); | 1076 [this.user.username, locale, keyboardLayout]); |
| 1089 }).bind(this)); | 1077 }).bind(this)); |
| 1090 }, | 1078 }, |
| 1091 | 1079 |
| 1092 /** @override **/ | 1080 /** @override **/ |
| 1093 initialize: function() { | 1081 initialize: function() { |
| 1094 UserPod.prototype.initialize.call(this); | 1082 UserPod.prototype.initialize.call(this); |
| 1095 | 1083 |
| 1096 id = this.user.username + '-keyboard'; | |
| 1097 this.querySelector('.keyboard-select-label').htmlFor = id; | |
| 1098 this.querySelector('.keyboard-select').setAttribute('id', id); | |
| 1099 | |
| 1100 var id = this.user.username + '-language'; | 1084 var id = this.user.username + '-language'; |
| 1101 this.querySelector('.language-select-label').htmlFor = id; | 1085 this.querySelector('.language-select-label').htmlFor = id; |
| 1102 var languageSelect = this.querySelector('.language-select'); | 1086 var languageSelect = this.querySelector('.language-select'); |
| 1103 languageSelect.setAttribute('id', id); | 1087 languageSelect.setAttribute('id', id); |
| 1104 this.populateLanguageSelect(this.user.initialLocales, | 1088 var list = this.user.initialLocales; |
| 1105 this.user.initialLocale, | 1089 languageSelect.innerHTML = ''; |
| 1106 this.user.initialMultipleRecommendedLocales); | 1090 var group = languageSelect; |
| 1091 for (var i = 0; i < list.length; ++i) { |
| 1092 var item = list[i]; |
| 1093 if (item.optionGroupName) { |
| 1094 group = document.createElement('optgroup'); |
| 1095 group.label = item.optionGroupName; |
| 1096 languageSelect.appendChild(group); |
| 1097 } else { |
| 1098 group.appendChild( |
| 1099 new Option(item.title, item.value, item.selected, item.selected)); |
| 1100 } |
| 1101 } |
| 1102 |
| 1103 id = this.user.username + '-keyboard'; |
| 1104 this.querySelector('.keyboard-select-label').htmlFor = id; |
| 1105 this.querySelector('.keyboard-select').setAttribute('id', id); |
| 1106 this.populateKeyboardSelect_([this.user.initialKeyboardLayout]); |
| 1107 this.getPublicSessionKeyboardLayouts_(); |
| 1107 }, | 1108 }, |
| 1108 | 1109 |
| 1109 /** @override **/ | 1110 /** @override **/ |
| 1110 update: function() { | 1111 update: function() { |
| 1111 UserPod.prototype.update.call(this); | 1112 UserPod.prototype.update.call(this); |
| 1112 this.querySelector('.expanded-pane-name').textContent = | 1113 this.querySelector('.expanded-pane-name').textContent = |
| 1113 this.user_.displayName; | 1114 this.user_.displayName; |
| 1114 this.querySelector('.info').textContent = | 1115 this.querySelector('.info').textContent = |
| 1115 loadTimeData.getStringF('publicAccountInfoFormat', | 1116 loadTimeData.getStringF('publicAccountInfoFormat', |
| 1116 this.user_.enterpriseDomain); | 1117 this.user_.enterpriseDomain); |
| (...skipping 104 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 1221 // Guard timer set to animation duration + 20ms. | 1222 // Guard timer set to animation duration + 20ms. |
| 1222 ensureTransitionEndEvent(languageAndInputSection, 380); | 1223 ensureTransitionEndEvent(languageAndInputSection, 380); |
| 1223 }, 0); | 1224 }, 0); |
| 1224 }, | 1225 }, |
| 1225 | 1226 |
| 1226 /** | 1227 /** |
| 1227 * Retrieves the list of keyboard layouts available for the currently | 1228 * Retrieves the list of keyboard layouts available for the currently |
| 1228 * selected locale. | 1229 * selected locale. |
| 1229 */ | 1230 */ |
| 1230 getPublicSessionKeyboardLayouts_: function() { | 1231 getPublicSessionKeyboardLayouts_: function() { |
| 1231 var selectedLocale = this.querySelector('.language-select').value; | 1232 var languageSelect = this.querySelector('.language-select'); |
| 1232 if (selectedLocale == | 1233 chrome.send('getPublicSessionKeyboardLayouts', [ |
| 1233 this.querySelector('.keyboard-select').loadedLocale) { | 1234 this.user.username, |
| 1234 // If the list of keyboard layouts was loaded for the currently selected | 1235 languageSelect.options[languageSelect.selectedIndex].value]); |
| 1235 // locale, it is already up to date. | |
| 1236 return; | |
| 1237 } | |
| 1238 chrome.send('getPublicSessionKeyboardLayouts', | |
| 1239 [this.user.username, selectedLocale]); | |
| 1240 }, | 1236 }, |
| 1241 | 1237 |
| 1242 /** | 1238 /** |
| 1243 * Populates the keyboard layout "select" element with a list of layouts. | 1239 * Populates the keyboard layout "select" element with a list of layouts. |
| 1244 * @param {string} locale The locale to which this list of keyboard layouts | |
| 1245 * applies | |
| 1246 * @param {!Object} list List of available keyboard layouts | 1240 * @param {!Object} list List of available keyboard layouts |
| 1247 */ | 1241 */ |
| 1248 populateKeyboardSelect: function(locale, list) { | 1242 populateKeyboardSelect_: function(list) { |
| 1249 if (locale != this.querySelector('.language-select').value) { | |
| 1250 // The selected locale has changed and the list of keyboard layouts is | |
| 1251 // not applicable. This method will be called again when a list of | |
| 1252 // keyboard layouts applicable to the selected locale is retrieved. | |
| 1253 return; | |
| 1254 } | |
| 1255 | |
| 1256 var keyboardSelect = this.querySelector('.keyboard-select'); | 1243 var keyboardSelect = this.querySelector('.keyboard-select'); |
| 1257 keyboardSelect.loadedLocale = locale; | |
| 1258 keyboardSelect.innerHTML = ''; | 1244 keyboardSelect.innerHTML = ''; |
| 1259 for (var i = 0; i < list.length; ++i) { | 1245 for (var i = 0; i < list.length; ++i) { |
| 1260 var item = list[i]; | 1246 var item = list[i]; |
| 1261 keyboardSelect.appendChild( | 1247 keyboardSelect.appendChild( |
| 1262 new Option(item.title, item.value, item.selected, item.selected)); | 1248 new Option(item.title, item.value, item.selected, item.selected)); |
| 1263 } | 1249 } |
| 1264 }, | |
| 1265 | |
| 1266 /** | |
| 1267 * Populates the language "select" element with a list of locales. | |
| 1268 * @param {!Object} locales The list of available locales | |
| 1269 * @param {string} defaultLocale The locale to select by default | |
| 1270 * @param {boolean} multipleRecommendedLocales Whether |locales| contains | |
| 1271 * two or more recommended locales | |
| 1272 */ | |
| 1273 populateLanguageSelect: function(locales, | |
| 1274 defaultLocale, | |
| 1275 multipleRecommendedLocales) { | |
| 1276 var languageSelect = this.querySelector('.language-select'); | |
| 1277 // If the user manually selected a locale, do not change the selection. | |
| 1278 // Otherwise, select the new |defaultLocale|. | |
| 1279 var selected = | |
| 1280 languageSelect.manuallyChanged ? languageSelect.value : defaultLocale; | |
| 1281 languageSelect.innerHTML = ''; | |
| 1282 var group = languageSelect; | |
| 1283 for (var i = 0; i < locales.length; ++i) { | |
| 1284 var item = locales[i]; | |
| 1285 if (item.optionGroupName) { | |
| 1286 group = document.createElement('optgroup'); | |
| 1287 group.label = item.optionGroupName; | |
| 1288 languageSelect.appendChild(group); | |
| 1289 } else { | |
| 1290 group.appendChild(new Option(item.title, | |
| 1291 item.value, | |
| 1292 item.value == selected, | |
| 1293 item.value == selected)); | |
| 1294 } | |
| 1295 } | |
| 1296 languageSelect.multipleRecommendedLocales = multipleRecommendedLocales; | |
| 1297 | |
| 1298 // Retrieve a list of keyboard layouts applicable to the locale that is | |
| 1299 // now selected. | |
| 1300 this.getPublicSessionKeyboardLayouts_(); | |
| 1301 } | 1250 } |
| 1302 }; | 1251 }; |
| 1303 | 1252 |
| 1304 /** | 1253 /** |
| 1305 * Creates a user pod to be used only in desktop chrome. | 1254 * Creates a user pod to be used only in desktop chrome. |
| 1306 * @constructor | 1255 * @constructor |
| 1307 * @extends {UserPod} | 1256 * @extends {UserPod} |
| 1308 */ | 1257 */ |
| 1309 var DesktopUserPod = cr.ui.define(function() { | 1258 var DesktopUserPod = cr.ui.define(function() { |
| 1310 // Don't just instantiate a UserPod(), as this will call decorate() on the | 1259 // Don't just instantiate a UserPod(), as this will call decorate() on the |
| (...skipping 579 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 1890 * @param {string} userID The user ID of the public session | 1839 * @param {string} userID The user ID of the public session |
| 1891 * @param {string} displayName The new display name | 1840 * @param {string} displayName The new display name |
| 1892 */ | 1841 */ |
| 1893 setPublicSessionDisplayName: function(userID, displayName) { | 1842 setPublicSessionDisplayName: function(userID, displayName) { |
| 1894 var pod = this.getPodWithUsername_(userID); | 1843 var pod = this.getPodWithUsername_(userID); |
| 1895 if (pod != null) | 1844 if (pod != null) |
| 1896 pod.setDisplayName(displayName); | 1845 pod.setDisplayName(displayName); |
| 1897 }, | 1846 }, |
| 1898 | 1847 |
| 1899 /** | 1848 /** |
| 1900 * Updates the list of locales available for a public session. | |
| 1901 * @param {string} userID The user ID of the public session | |
| 1902 * @param {!Object} locales The list of available locales | |
| 1903 * @param {string} defaultLocale The locale to select by default | |
| 1904 * @param {boolean} multipleRecommendedLocales Whether |locales| contains | |
| 1905 * two or more recommended locales | |
| 1906 */ | |
| 1907 setPublicSessionLocales: function(userID, | |
| 1908 locales, | |
| 1909 defaultLocale, | |
| 1910 multipleRecommendedLocales) { | |
| 1911 var pod = this.getPodWithUsername_(userID); | |
| 1912 if (pod != null) { | |
| 1913 pod.populateLanguageSelect(locales, | |
| 1914 defaultLocale, | |
| 1915 multipleRecommendedLocales); | |
| 1916 } | |
| 1917 }, | |
| 1918 | |
| 1919 /** | |
| 1920 * Updates the list of available keyboard layouts for a public session pod. | 1849 * Updates the list of available keyboard layouts for a public session pod. |
| 1921 * @param {string} userID The user ID of the public session | 1850 * @param {string} userID The user ID of the public session |
| 1922 * @param {string} locale The locale to which this list of keyboard layouts | |
| 1923 * applies | |
| 1924 * @param {!Object} list List of available keyboard layouts | 1851 * @param {!Object} list List of available keyboard layouts |
| 1925 */ | 1852 */ |
| 1926 setPublicSessionKeyboardLayouts: function(userID, locale, list) { | 1853 setPublicSessionKeyboardLayouts: function(userID, list) { |
| 1927 var pod = this.getPodWithUsername_(userID); | 1854 var pod = this.getPodWithUsername_(userID); |
| 1928 if (pod != null) | 1855 if (pod != null) |
| 1929 pod.populateKeyboardSelect(locale, list); | 1856 pod.populateKeyboardSelect_(list); |
| 1930 }, | 1857 }, |
| 1931 | 1858 |
| 1932 /** | 1859 /** |
| 1933 * Called when window was resized. | 1860 * Called when window was resized. |
| 1934 */ | 1861 */ |
| 1935 onWindowResize: function() { | 1862 onWindowResize: function() { |
| 1936 var layout = this.calculateLayout_(); | 1863 var layout = this.calculateLayout_(); |
| 1937 if (layout.columns != this.columns || layout.rows != this.rows) | 1864 if (layout.columns != this.columns || layout.rows != this.rows) |
| 1938 this.placePods_(); | 1865 this.placePods_(); |
| 1939 | 1866 |
| (...skipping 563 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 2503 if (pod && pod.multiProfilesPolicyApplied) { | 2430 if (pod && pod.multiProfilesPolicyApplied) { |
| 2504 pod.userTypeBubbleElement.classList.remove('bubble-shown'); | 2431 pod.userTypeBubbleElement.classList.remove('bubble-shown'); |
| 2505 } | 2432 } |
| 2506 } | 2433 } |
| 2507 }; | 2434 }; |
| 2508 | 2435 |
| 2509 return { | 2436 return { |
| 2510 PodRow: PodRow | 2437 PodRow: PodRow |
| 2511 }; | 2438 }; |
| 2512 }); | 2439 }); |
| OLD | NEW |