| OLD | NEW |
| 1 // Copyright (c) 2010 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2010 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('cr.ui', function() { | 5 cr.define('cr.ui', function() { |
| 6 | 6 |
| 7 const MenuItem = cr.ui.MenuItem; | 7 const MenuItem = cr.ui.MenuItem; |
| 8 | 8 |
| 9 /** | 9 /** |
| 10 * Creates a new menu element. | 10 * Creates a new menu element. |
| 11 * @param {Object=} opt_propertyBag Optional properties. | 11 * @param {Object=} opt_propertyBag Optional properties. |
| 12 * @constructor | 12 * @constructor |
| 13 * @extends {HTMLMenuElement} | 13 * @extends {HTMLMenuElement} |
| 14 */ | 14 */ |
| 15 var Menu = cr.ui.define('menu'); | 15 var Menu = cr.ui.define('menu'); |
| 16 | 16 |
| 17 Menu.prototype = { | 17 Menu.prototype = { |
| 18 __proto__: HTMLMenuElement.prototype, | 18 __proto__: HTMLMenuElement.prototype, |
| 19 | 19 |
| 20 selectedIndex_: -1, |
| 21 |
| 20 /** | 22 /** |
| 21 * Initializes the menu element. | 23 * Initializes the menu element. |
| 22 */ | 24 */ |
| 23 decorate: function() { | 25 decorate: function() { |
| 24 this.addEventListener('mouseover', this.handleMouseOver_); | 26 this.addEventListener('mouseover', this.handleMouseOver_); |
| 25 this.addEventListener('mouseout', this.handleMouseOut_); | 27 this.addEventListener('mouseout', this.handleMouseOut_); |
| 26 | 28 |
| 27 // Decorate the children as menu items. | 29 // Decorate the children as menu items. |
| 28 var children = this.children; | 30 var children = this.children; |
| 29 for (var i = 0, child; child = children[i]; i++) { | 31 for (var i = 0, child; child = children[i]; i++) { |
| (...skipping 27 matching lines...) Expand all Loading... |
| 57 /** | 59 /** |
| 58 * Handles mouseout events and deselects any selected item. | 60 * Handles mouseout events and deselects any selected item. |
| 59 * @param {Event} e The mouseout event. | 61 * @param {Event} e The mouseout event. |
| 60 * @private | 62 * @private |
| 61 */ | 63 */ |
| 62 handleMouseOut_: function(e) { | 64 handleMouseOut_: function(e) { |
| 63 this.selectedItem = null; | 65 this.selectedItem = null; |
| 64 }, | 66 }, |
| 65 | 67 |
| 66 /** | 68 /** |
| 67 * The index of the selected item. | |
| 68 * @type {boolean} | |
| 69 */ | |
| 70 // getter and default value is defined using cr.defineProperty. | |
| 71 set selectedIndex(selectedIndex) { | |
| 72 if (this.selectedIndex_ != selectedIndex) { | |
| 73 var oldSelectedItem = this.selectedItem; | |
| 74 this.selectedIndex_ = selectedIndex; | |
| 75 if (oldSelectedItem) | |
| 76 oldSelectedItem.selected = false; | |
| 77 var item = this.selectedItem; | |
| 78 if (item) | |
| 79 item.selected = true; | |
| 80 | |
| 81 cr.dispatchSimpleEvent(this, 'change'); | |
| 82 } | |
| 83 }, | |
| 84 | |
| 85 /** | |
| 86 * The selected menu item or null if none. | 69 * The selected menu item or null if none. |
| 87 * @type {cr.ui.MenuItem} | 70 * @type {cr.ui.MenuItem} |
| 88 */ | 71 */ |
| 89 get selectedItem() { | 72 get selectedItem() { |
| 90 return this.children[this.selectedIndex]; | 73 return this.children[this.selectedIndex]; |
| 91 }, | 74 }, |
| 92 set selectedItem(item) { | 75 set selectedItem(item) { |
| 93 var index = Array.prototype.indexOf.call(this.children, item); | 76 var index = Array.prototype.indexOf.call(this.children, item); |
| 94 this.selectedIndex = index; | 77 this.selectedIndex = index; |
| 95 }, | 78 }, |
| (...skipping 41 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 137 item.command.execute(); | 120 item.command.execute(); |
| 138 } | 121 } |
| 139 } | 122 } |
| 140 return true; | 123 return true; |
| 141 } | 124 } |
| 142 | 125 |
| 143 return false; | 126 return false; |
| 144 } | 127 } |
| 145 }; | 128 }; |
| 146 | 129 |
| 130 function selectedIndexChanged(selectedIndex, oldSelectedIndex) { |
| 131 var oldSelectedItem = this.chidren[oldSelectedIndex]; |
| 132 if (oldSelectedItem) |
| 133 oldSelectedItem.selected = false; |
| 134 var item = this.selectedItem; |
| 135 if (item) |
| 136 item.selected = true; |
| 137 } |
| 147 /** | 138 /** |
| 148 * The selected menu item. | 139 * The selected menu item. |
| 149 * @type {number} | 140 * @type {number} |
| 150 */ | 141 */ |
| 151 cr.defineProperty(Menu, 'selectedIndex', cr.PropertyKind.JS, -1); | 142 cr.defineProperty(Menu, 'selectedIndex', cr.PropertyKind.JS, |
| 143 selectedIndexChanged); |
| 152 | 144 |
| 153 // Export | 145 // Export |
| 154 return { | 146 return { |
| 155 Menu: Menu | 147 Menu: Menu |
| 156 }; | 148 }; |
| 157 }); | 149 }); |
| OLD | NEW |