Chromium Code Reviews| Index: remoting/webapp/menu_button.js |
| diff --git a/remoting/webapp/menu_button.js b/remoting/webapp/menu_button.js |
| index 225e0e79c409bca120bda26aab2607cd763f0af8..ec67b8e57423ff66be3d0fb495c25cf8d5bd62e2 100644 |
| --- a/remoting/webapp/menu_button.js |
| +++ b/remoting/webapp/menu_button.js |
| @@ -20,75 +20,41 @@ var remoting = remoting || {}; |
| * menu is shown. |
| */ |
| remoting.MenuButton = function(container, opt_onShow) { |
| - /** |
| - * @type {HTMLElement} |
| - * @private |
| - */ |
| - this.button_ = /** @type {HTMLElement} */ |
| + /** @type {HTMLElement} */ |
| + var button = /** @type {HTMLElement} */ |
| (container.querySelector('button,.menu-button-activator')); |
| - /** |
| - * @type {undefined|function():void} |
| - * @private |
| - */ |
| - this.onShow_ = opt_onShow; |
| - |
| - /** @type {remoting.MenuButton} */ |
| - var that = this; |
| - |
| - // Create event handlers to show and hide the menu, attached to the button |
| - // and the document <html> tag, respectively. These handlers are added and |
| - // removed depending on the state of the menu. To prevent both triggering |
| - // for one click, they are added by a timer. |
| - /** |
| - * @type {function(Event):void} |
| - * @private |
| - */ |
| - this.onClick_ = function(event) { |
| - if (that.onShow_) { |
| - that.onShow_(); |
| - } |
| - that.button_.classList.add(remoting.MenuButton.BUTTON_ACTIVE_CLASS_); |
| - that.button_.removeEventListener('click', that.onClick_, false); |
| - window.setTimeout( |
| - function() { |
| - // Attach the click handler to the <html> node so that it includes |
| - // the document area outside the plugin, which is not covered by |
| - // the <body> node. |
| - var htmlNode = document.body.parentNode; |
| - htmlNode.addEventListener('click', that.closeHandler_, true); |
| - }, |
| - 100); |
| + /** @param {Event} event */ |
| + var closeHandler = function(event) { |
| + button.classList.remove(remoting.MenuButton.BUTTON_ACTIVE_CLASS_); |
| + document.body.removeEventListener('click', closeHandler, false); |
| }; |
| - /** |
| - * @type {function(Event):void} |
| - * @private |
| - */ |
| - this.closeHandler_ = function(event) { |
| - that.button_.classList.remove(remoting.MenuButton.BUTTON_ACTIVE_CLASS_); |
| - document.body.removeEventListener('click', that.closeHandler_, true); |
| - window.setTimeout( |
| - function() { |
| - that.button_.addEventListener('click', that.onClick_, false); |
| - }, |
| - 100); |
| + /** @param {Event} event */ |
| + var onClick = function(event) { |
| + if (opt_onShow) { |
| + opt_onShow(); |
| + } |
| + button.classList.toggle(remoting.MenuButton.BUTTON_ACTIVE_CLASS_); |
| + document.body.addEventListener('click', closeHandler, false); |
| + // Make sure that close handler doesn't fire for this event. |
| + event.stopPropagation(); |
| }; |
| - this.button_.addEventListener('click', this.onClick_, false); |
| + container.addEventListener('click', onClick, false); |
| }; |
| /** |
| * Set or unset the selected state of an <li> menu item. |
| - * @param {HTMLElement} item The menu item to update. |
| + * @param {Element} item The menu item to update. |
|
Jamie
2014/07/17 17:04:03
Previously, this was only ever called with the res
|
| * @param {boolean} selected True to select the item, false to deselect it. |
| * @return {void} Nothing. |
| */ |
| remoting.MenuButton.select = function(item, selected) { |
| if (selected) { |
| - item.classList.add('selected'); |
| + /** @type {DOMTokenList} */(item.classList).add('selected'); |
| } else { |
| - item.classList.remove('selected'); |
| + /** @type {DOMTokenList} */(item.classList).remove('selected'); |
| } |
| }; |