| OLD | NEW |
| (Empty) |
| 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 | |
| 3 // found in the LICENSE file. | |
| 4 | |
| 5 'use strict'; | |
| 6 | |
| 7 /** | |
| 8 * @fileoverview This implements a common button control, bound to command. | |
| 9 */ | |
| 10 | |
| 11 /** | |
| 12 * Creates a new button element. | |
| 13 * @param {Object=} opt_propertyBag Optional properties. | |
| 14 * @constructor | |
| 15 * @extends {HTMLDivElement} | |
| 16 */ | |
| 17 var CommandButton = cr.ui.define('button'); | |
| 18 | |
| 19 /** @override */ | |
| 20 CommandButton.prototype.__proto__ = HTMLButtonElement.prototype; | |
| 21 | |
| 22 /** | |
| 23 * Associated command. | |
| 24 * @type {Command} | |
| 25 * @private | |
| 26 */ | |
| 27 CommandButton.prototype.command_ = null; | |
| 28 | |
| 29 /** | |
| 30 * Initializes the menu item. | |
| 31 */ | |
| 32 CommandButton.prototype.decorate = function() { | |
| 33 var commandId; | |
| 34 if ((commandId = this.getAttribute('command'))) | |
| 35 this.setCommand(commandId); | |
| 36 | |
| 37 this.addEventListener('click', this.handleClick_.bind(this)); | |
| 38 this.addEventListener('keypress', this.handleKeyPress_.bind(this)); | |
| 39 }; | |
| 40 | |
| 41 /** | |
| 42 * Returns associated command. | |
| 43 * @return {cr.ui.Command} associated command. | |
| 44 */ | |
| 45 CommandButton.prototype.getCommand = function() { | |
| 46 return this.command_; | |
| 47 }; | |
| 48 | |
| 49 /** | |
| 50 * Associates command with this button. | |
| 51 * @param {string|cr.ui.Command} command Command id, or command object to | |
| 52 * associate with this button. | |
| 53 */ | |
| 54 CommandButton.prototype.setCommand = function(command) { | |
| 55 if (this.command_) { | |
| 56 this.command_.removeEventListener('labelChange', this); | |
| 57 this.command_.removeEventListener('disabledChange', this); | |
| 58 this.command_.removeEventListener('hiddenChange', this); | |
| 59 } | |
| 60 | |
| 61 if (typeof command == 'string' && command[0] == '#') { | |
| 62 command = this.ownerDocument.getElementById(command.slice(1)); | |
| 63 cr.ui.decorate(command, cr.ui.Command); | |
| 64 } | |
| 65 | |
| 66 this.command_ = command; | |
| 67 if (command) { | |
| 68 if (command.id) | |
| 69 this.setAttribute('command', '#' + command.id); | |
| 70 | |
| 71 this.setLabel(command.label); | |
| 72 this.disabled = command.disabled; | |
| 73 this.hidden = command.hidden; | |
| 74 | |
| 75 this.command_.addEventListener('labelChange', this); | |
| 76 this.command_.addEventListener('disabledChange', this); | |
| 77 this.command_.addEventListener('hiddenChange', this); | |
| 78 } | |
| 79 }; | |
| 80 | |
| 81 /** | |
| 82 * Returns button label | |
| 83 * @return {string} Button label. | |
| 84 */ | |
| 85 CommandButton.prototype.getLabel = function() { | |
| 86 return this.textContent; | |
| 87 }; | |
| 88 | |
| 89 /** | |
| 90 * Sets button label. | |
| 91 * @param {string} label New button label. | |
| 92 */ | |
| 93 CommandButton.prototype.setLabel = function(label) { | |
| 94 this.textContent = label; | |
| 95 }; | |
| 96 | |
| 97 /** | |
| 98 * Handles click event and dispatches associated command. | |
| 99 * @param {Event} e The mouseup event object. | |
| 100 * @private | |
| 101 */ | |
| 102 CommandButton.prototype.handleClick_ = function(e) { | |
| 103 if (!this.disabled && this.command_) | |
| 104 this.command_.execute(this); | |
| 105 }; | |
| 106 | |
| 107 /** | |
| 108 * Handles keypress event and dispatches associated command. | |
| 109 * @param {Event} e The mouseup event object. | |
| 110 * @private | |
| 111 */ | |
| 112 CommandButton.prototype.handleKeyPress_ = function(e) { | |
| 113 if (!this.command_) return; | |
| 114 | |
| 115 switch (util.getKeyModifiers(e) + e.keyCode) { | |
| 116 case '13': // Enter | |
| 117 case '32': // Space | |
| 118 this.command_.execute(this); | |
| 119 break; | |
| 120 } | |
| 121 }; | |
| 122 | |
| 123 /** | |
| 124 * Handles changes to the associated command. | |
| 125 * @param {Event} e The event object. | |
| 126 */ | |
| 127 CommandButton.prototype.handleEvent = function(e) { | |
| 128 switch (e.type) { | |
| 129 case 'disabledChange': | |
| 130 this.disabled = this.command_.disabled; | |
| 131 break; | |
| 132 case 'hiddenChange': | |
| 133 this.hidden = this.command_.hidden; | |
| 134 break; | |
| 135 case 'labelChange': | |
| 136 this.setLabel(this.command_.label); | |
| 137 break; | |
| 138 } | |
| 139 }; | |
| 140 | |
| 141 /** | |
| 142 * Whether the button is disabled or not. | |
| 143 * @type {boolean} | |
| 144 */ | |
| 145 cr.defineProperty(CommandButton, 'disabled', | |
| 146 cr.PropertyKind.BOOL_ATTR); | |
| 147 | |
| 148 /** | |
| 149 * Whether the button is hidden or not. | |
| 150 * @type {boolean} | |
| 151 */ | |
| 152 cr.defineProperty(CommandButton, 'hidden', | |
| 153 cr.PropertyKind.BOOL_ATTR); | |
| OLD | NEW |