OLD | NEW |
1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2012 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 cr.define('options.network', function() { | 5 cr.define('options.network', function() { |
6 var ArrayDataModel = cr.ui.ArrayDataModel; | 6 var ArrayDataModel = cr.ui.ArrayDataModel; |
7 var List = cr.ui.List; | 7 var List = cr.ui.List; |
8 var ListItem = cr.ui.ListItem; | 8 var ListItem = cr.ui.ListItem; |
9 var ListSingleSelectionModel = cr.ui.ListSingleSelectionModel; | 9 var ListSingleSelectionModel = cr.ui.ListSingleSelectionModel; |
10 var Menu = cr.ui.Menu; | 10 var Menu = cr.ui.Menu; |
(...skipping 87 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
98 if (data.Type == 'Ethernet') | 98 if (data.Type == 'Ethernet') |
99 return loadTimeData.getString('ethernetName'); | 99 return loadTimeData.getString('ethernetName'); |
100 return data.Name; | 100 return data.Name; |
101 } | 101 } |
102 | 102 |
103 /** | 103 /** |
104 * Create an element in the network list for controlling network | 104 * Create an element in the network list for controlling network |
105 * connectivity. | 105 * connectivity. |
106 * @param {Object} data Description of the network list or command. | 106 * @param {Object} data Description of the network list or command. |
107 * @constructor | 107 * @constructor |
| 108 * @extends {cr.ui.ListItem} |
108 */ | 109 */ |
109 function NetworkListItem(data) { | 110 function NetworkListItem(data) { |
110 var el = cr.doc.createElement('li'); | 111 var el = cr.doc.createElement('li'); |
111 el.data_ = {}; | 112 el.data_ = {}; |
112 for (var key in data) | 113 for (var key in data) |
113 el.data_[key] = data[key]; | 114 el.data_[key] = data[key]; |
114 NetworkListItem.decorate(el); | 115 NetworkListItem.decorate(el); |
115 return el; | 116 return el; |
116 } | 117 } |
117 | 118 |
(...skipping 137 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
255 textContent.appendChild(categoryLabel); | 256 textContent.appendChild(categoryLabel); |
256 this.subtitle_ = this.ownerDocument.createElement('div'); | 257 this.subtitle_ = this.ownerDocument.createElement('div'); |
257 this.subtitle_.className = 'network-subtitle'; | 258 this.subtitle_.className = 'network-subtitle'; |
258 textContent.appendChild(this.subtitle_); | 259 textContent.appendChild(this.subtitle_); |
259 }, | 260 }, |
260 }; | 261 }; |
261 | 262 |
262 /** | 263 /** |
263 * Creates a control that displays a popup menu when clicked. | 264 * Creates a control that displays a popup menu when clicked. |
264 * @param {Object} data Description of the control. | 265 * @param {Object} data Description of the control. |
| 266 * @constructor |
| 267 * @extends {NetworkListItem} |
265 */ | 268 */ |
266 function NetworkMenuItem(data) { | 269 function NetworkMenuItem(data) { |
267 var el = new NetworkListItem(data); | 270 var el = new NetworkListItem(data); |
268 el.__proto__ = NetworkMenuItem.prototype; | 271 el.__proto__ = NetworkMenuItem.prototype; |
269 el.decorate(); | 272 el.decorate(); |
270 return el; | 273 return el; |
271 } | 274 } |
272 | 275 |
273 NetworkMenuItem.prototype = { | 276 NetworkMenuItem.prototype = { |
274 __proto__: NetworkListItem.prototype, | 277 __proto__: NetworkListItem.prototype, |
(...skipping 84 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
359 this.menu_.hidden = false; | 362 this.menu_.hidden = false; |
360 } | 363 } |
361 if (rescan) | 364 if (rescan) |
362 chrome.send('refreshNetworks'); | 365 chrome.send('refreshNetworks'); |
363 }, | 366 }, |
364 }; | 367 }; |
365 | 368 |
366 /** | 369 /** |
367 * Creates a control for selecting or configuring a network connection based | 370 * Creates a control for selecting or configuring a network connection based |
368 * on the type of connection (e.g. wifi versus vpn). | 371 * on the type of connection (e.g. wifi versus vpn). |
369 * @param {Object} data Description of the network. | 372 * @param {{key: string, networkList: Array.<Object>}} data Description of the |
370 * @param {string} data.key Item key. | 373 * network. |
371 * @param {Array.<Object>} data.networkList Description of the network. | |
372 * @constructor | 374 * @constructor |
| 375 * @extends {NetworkMenuItem} |
373 */ | 376 */ |
374 function NetworkSelectorItem(data) { | 377 function NetworkSelectorItem(data) { |
375 var el = new NetworkMenuItem(data); | 378 var el = new NetworkMenuItem(data); |
376 el.__proto__ = NetworkSelectorItem.prototype; | 379 el.__proto__ = NetworkSelectorItem.prototype; |
377 el.decorate(); | 380 el.decorate(); |
378 return el; | 381 return el; |
379 } | 382 } |
380 | 383 |
381 NetworkSelectorItem.prototype = { | 384 NetworkSelectorItem.prototype = { |
382 __proto__: NetworkMenuItem.prototype, | 385 __proto__: NetworkMenuItem.prototype, |
(...skipping 39 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
422 // is deferred in order to ensure that position of this element has | 425 // is deferred in order to ensure that position of this element has |
423 // beem properly updated. | 426 // beem properly updated. |
424 var self = this; | 427 var self = this; |
425 setTimeout(function() {self.showMenu();}, 0); | 428 setTimeout(function() {self.showMenu();}, 0); |
426 } | 429 } |
427 }, | 430 }, |
428 | 431 |
429 /** | 432 /** |
430 * Creates a menu for selecting, configuring or disconnecting from a | 433 * Creates a menu for selecting, configuring or disconnecting from a |
431 * network. | 434 * network. |
432 * @return {Element} The newly created menu. | 435 * @return {!Element} The newly created menu. |
433 */ | 436 */ |
434 createMenu: function() { | 437 createMenu: function() { |
435 var menu = this.ownerDocument.createElement('div'); | 438 var menu = this.ownerDocument.createElement('div'); |
436 menu.id = this.getMenuName(); | 439 menu.id = this.getMenuName(); |
437 menu.className = 'network-menu'; | 440 menu.className = 'network-menu'; |
438 menu.hidden = true; | 441 menu.hidden = true; |
439 Menu.decorate(menu); | 442 Menu.decorate(menu); |
440 var addendum = []; | 443 var addendum = []; |
441 if (this.data_.key == 'WiFi') { | 444 if (this.data_.key == 'WiFi') { |
442 addendum.push({label: loadTimeData.getString('joinOtherNetwork'), | 445 addendum.push({label: loadTimeData.getString('joinOtherNetwork'), |
(...skipping 208 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
651 data.ConnectionState == 'Connecting') { | 654 data.ConnectionState == 'Connecting') { |
652 var label = menuItem.getElementsByClassName( | 655 var label = menuItem.getElementsByClassName( |
653 'network-menu-item-label')[0]; | 656 'network-menu-item-label')[0]; |
654 label.classList.add('active-network'); | 657 label.classList.add('active-network'); |
655 } | 658 } |
656 } | 659 } |
657 }; | 660 }; |
658 | 661 |
659 /** | 662 /** |
660 * Creates a button-like control for configurating internet connectivity. | 663 * Creates a button-like control for configurating internet connectivity. |
661 * @param {Object} data Description of the network control. | 664 * @param {{key: string, subtitle: string, command: Function}} data |
662 * @param {string} data.key Item key. | 665 * Description of the network control. |
663 * @param {string} data.subtitle Subtitle. | |
664 * @param {function} data.command Item callback. | |
665 * @constructor | 666 * @constructor |
| 667 * @extends {NetworkListItem} |
666 */ | 668 */ |
667 function NetworkButtonItem(data) { | 669 function NetworkButtonItem(data) { |
668 var el = new NetworkListItem(data); | 670 var el = new NetworkListItem(data); |
669 el.__proto__ = NetworkButtonItem.prototype; | 671 el.__proto__ = NetworkButtonItem.prototype; |
670 el.decorate(); | 672 el.decorate(); |
671 return el; | 673 return el; |
672 } | 674 } |
673 | 675 |
674 NetworkButtonItem.prototype = { | 676 NetworkButtonItem.prototype = { |
675 __proto__: NetworkListItem.prototype, | 677 __proto__: NetworkListItem.prototype, |
(...skipping 13 matching lines...) Expand all Loading... |
689 if (this.data.policyManaged) | 691 if (this.data.policyManaged) |
690 this.showManagedNetworkIndicator(); | 692 this.showManagedNetworkIndicator(); |
691 }, | 693 }, |
692 }; | 694 }; |
693 | 695 |
694 /** | 696 /** |
695 * Adds a command to a menu for modifying network settings. | 697 * Adds a command to a menu for modifying network settings. |
696 * @param {!Element} menu Parent menu. | 698 * @param {!Element} menu Parent menu. |
697 * @param {!Object} data Description of the network. | 699 * @param {!Object} data Description of the network. |
698 * @param {!string} label Display name for the menu item. | 700 * @param {!string} label Display name for the menu item. |
699 * @param {?(string|function)} command Callback function or name | 701 * @param {?(string|!Function)} command Callback function or name |
700 * of the command for |networkCommand|. | 702 * of the command for |networkCommand|. |
701 * @param {?string=} opt_iconURL Optional URL to an icon for the menu item. | 703 * @param {string=} opt_iconURL Optional URL to an icon for the menu item. |
702 * @return {!Element} The created menu item. | 704 * @return {!Element} The created menu item. |
703 * @private | 705 * @private |
704 */ | 706 */ |
705 function createCallback_(menu, data, label, command, opt_iconURL) { | 707 function createCallback_(menu, data, label, command, opt_iconURL) { |
706 var button = menu.ownerDocument.createElement('div'); | 708 var button = menu.ownerDocument.createElement('div'); |
707 button.className = 'network-menu-item'; | 709 button.className = 'network-menu-item'; |
708 | 710 |
709 var buttonIcon = menu.ownerDocument.createElement('div'); | 711 var buttonIcon = menu.ownerDocument.createElement('div'); |
710 buttonIcon.className = 'network-menu-item-icon'; | 712 buttonIcon.className = 'network-menu-item-icon'; |
711 button.appendChild(buttonIcon); | 713 button.appendChild(buttonIcon); |
712 if (opt_iconURL) | 714 if (opt_iconURL) |
713 buttonIcon.style.backgroundImage = url(opt_iconURL); | 715 buttonIcon.style.backgroundImage = url(opt_iconURL); |
714 | 716 |
715 var buttonLabel = menu.ownerDocument.createElement('span'); | 717 var buttonLabel = menu.ownerDocument.createElement('span'); |
716 buttonLabel.className = 'network-menu-item-label'; | 718 buttonLabel.className = 'network-menu-item-label'; |
717 buttonLabel.textContent = label; | 719 buttonLabel.textContent = label; |
718 button.appendChild(buttonLabel); | 720 button.appendChild(buttonLabel); |
719 var callback = null; | 721 var callback = null; |
720 if (typeof command == 'string') { | 722 if (typeof command == 'string') { |
721 var type = data.Type; | 723 var type = data.Type; |
722 var path = data.servicePath; | 724 var path = data.servicePath; |
723 callback = function() { | 725 callback = function() { |
724 chrome.send('networkCommand', | 726 chrome.send('networkCommand', |
725 [type, path, command]); | 727 [type, path, command]); |
726 closeMenu_(); | 728 closeMenu_(); |
727 }; | 729 }; |
728 } else if (command != null) { | 730 } else if (command != null) { |
729 if (data) { | 731 if (data) { |
730 callback = function() { | 732 callback = function() { |
731 command(data); | 733 (/** @type {Function} */(command))(data); |
732 closeMenu_(); | 734 closeMenu_(); |
733 }; | 735 }; |
734 } else { | 736 } else { |
735 callback = function() { | 737 callback = function() { |
736 command(); | 738 (/** @type {Function} */(command))(); |
737 closeMenu_(); | 739 closeMenu_(); |
738 }; | 740 }; |
739 } | 741 } |
740 } | 742 } |
741 if (callback != null) | 743 if (callback != null) |
742 button.addEventListener('click', callback); | 744 button.addEventListener('click', callback); |
743 else | 745 else |
744 buttonLabel.classList.add('network-disabled-control'); | 746 buttonLabel.classList.add('network-disabled-control'); |
745 | 747 |
746 button.data = {label: label}; | 748 button.data = {label: label}; |
747 MenuItem.decorate(button); | 749 MenuItem.decorate(button); |
748 menu.appendChild(button); | 750 menu.appendChild(button); |
749 return button; | 751 return button; |
750 } | 752 } |
751 | 753 |
752 /** | 754 /** |
753 * A list of controls for manipulating network connectivity. | 755 * A list of controls for manipulating network connectivity. |
754 * @constructor | 756 * @constructor |
| 757 * @extends {cr.ui.List} |
755 */ | 758 */ |
756 var NetworkList = cr.ui.define('list'); | 759 var NetworkList = cr.ui.define('list'); |
757 | 760 |
758 NetworkList.prototype = { | 761 NetworkList.prototype = { |
759 __proto__: List.prototype, | 762 __proto__: List.prototype, |
760 | 763 |
761 /** @override */ | 764 /** @override */ |
762 decorate: function() { | 765 decorate: function() { |
763 List.prototype.decorate.call(this); | 766 List.prototype.decorate.call(this); |
764 this.startBatchUpdates(); | 767 this.startBatchUpdates(); |
(...skipping 58 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
823 } | 826 } |
824 } | 827 } |
825 } | 828 } |
826 } | 829 } |
827 }, | 830 }, |
828 | 831 |
829 /** | 832 /** |
830 * Finds the index of a network item within the data model based on | 833 * Finds the index of a network item within the data model based on |
831 * category. | 834 * category. |
832 * @param {string} key Unique key for the item in the list. | 835 * @param {string} key Unique key for the item in the list. |
833 * @return {number} The index of the network item, or |undefined| if it is | 836 * @return {(number|undefined)} The index of the network item, or |
834 * not found. | 837 * |undefined| if it is not found. |
835 */ | 838 */ |
836 indexOf: function(key) { | 839 indexOf: function(key) { |
837 var size = this.dataModel.length; | 840 var size = this.dataModel.length; |
838 for (var i = 0; i < size; i++) { | 841 for (var i = 0; i < size; i++) { |
839 var entry = this.dataModel.item(i); | 842 var entry = this.dataModel.item(i); |
840 if (entry.key == key) | 843 if (entry.key == key) |
841 return i; | 844 return i; |
842 } | 845 } |
843 return undefined; | 846 return undefined; |
844 }, | 847 }, |
(...skipping 169 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
1014 var networkList = $('network-list'); | 1017 var networkList = $('network-list'); |
1015 networkList.update({key: name, | 1018 networkList.update({key: name, |
1016 subtitle: subtitle, | 1019 subtitle: subtitle, |
1017 iconType: icon, | 1020 iconType: icon, |
1018 command: enableNetwork}); | 1021 command: enableNetwork}); |
1019 } | 1022 } |
1020 | 1023 |
1021 /** | 1024 /** |
1022 * Element for indicating a policy managed network. | 1025 * Element for indicating a policy managed network. |
1023 * @constructor | 1026 * @constructor |
| 1027 * @extends {options.ControlledSettingIndicator} |
1024 */ | 1028 */ |
1025 function ManagedNetworkIndicator() { | 1029 function ManagedNetworkIndicator() { |
1026 var el = cr.doc.createElement('span'); | 1030 var el = cr.doc.createElement('span'); |
1027 el.__proto__ = ManagedNetworkIndicator.prototype; | 1031 el.__proto__ = ManagedNetworkIndicator.prototype; |
1028 el.decorate(); | 1032 el.decorate(); |
1029 return el; | 1033 return el; |
1030 } | 1034 } |
1031 | 1035 |
1032 ManagedNetworkIndicator.prototype = { | 1036 ManagedNetworkIndicator.prototype = { |
1033 __proto__: ControlledSettingIndicator.prototype, | 1037 __proto__: ControlledSettingIndicator.prototype, |
(...skipping 20 matching lines...) Expand all Loading... |
1054 * that would close any currently open menu and preventing propagation to | 1058 * that would close any currently open menu and preventing propagation to |
1055 * any elements located behind the bubble. | 1059 * any elements located behind the bubble. |
1056 * @param {Event} event Mouse event. | 1060 * @param {Event} event Mouse event. |
1057 */ | 1061 */ |
1058 stopEvent: function(event) { | 1062 stopEvent: function(event) { |
1059 event.preventDefault(); | 1063 event.preventDefault(); |
1060 event.stopPropagation(); | 1064 event.stopPropagation(); |
1061 }, | 1065 }, |
1062 | 1066 |
1063 /** @override */ | 1067 /** @override */ |
1064 toggleBubble_: function() { | 1068 toggleBubble: function() { |
1065 if (activeMenu_ && !$(activeMenu_).contains(this)) | 1069 if (activeMenu_ && !$(activeMenu_).contains(this)) |
1066 closeMenu_(); | 1070 closeMenu_(); |
1067 ControlledSettingIndicator.prototype.toggleBubble_.call(this); | 1071 ControlledSettingIndicator.prototype.toggleBubble.call(this); |
1068 if (this.showingBubble) { | 1072 if (this.showingBubble) { |
1069 var bubble = PageManager.getVisibleBubble(); | 1073 var bubble = PageManager.getVisibleBubble(); |
1070 bubble.addEventListener('mousedown', this.stopEvent); | 1074 bubble.addEventListener('mousedown', this.stopEvent); |
1071 bubble.addEventListener('click', this.stopEvent); | 1075 bubble.addEventListener('click', this.stopEvent); |
1072 } | 1076 } |
1073 } | 1077 } |
1074 }; | 1078 }; |
1075 | 1079 |
1076 /** | 1080 /** |
1077 * Updates the list of available networks and their status, filtered by | 1081 * Updates the list of available networks and their status, filtered by |
(...skipping 69 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
1147 * Whether the Network list is disabled. Only used for display purpose. | 1151 * Whether the Network list is disabled. Only used for display purpose. |
1148 * @type {boolean} | 1152 * @type {boolean} |
1149 */ | 1153 */ |
1150 cr.defineProperty(NetworkList, 'disabled', cr.PropertyKind.BOOL_ATTR); | 1154 cr.defineProperty(NetworkList, 'disabled', cr.PropertyKind.BOOL_ATTR); |
1151 | 1155 |
1152 // Export | 1156 // Export |
1153 return { | 1157 return { |
1154 NetworkList: NetworkList | 1158 NetworkList: NetworkList |
1155 }; | 1159 }; |
1156 }); | 1160 }); |
OLD | NEW |