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 */ 17var CommandButton = cr.ui.define('button'); 18 19/** @override */ 20CommandButton.prototype.__proto__ = HTMLButtonElement.prototype; 21 22/** 23 * Associated command. 24 * @type {Command} 25 * @private 26 */ 27CommandButton.prototype.command_ = null; 28 29/** 30 * Initializes the menu item. 31 */ 32CommandButton.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}; 39 40/** 41 * Returns associated command. 42 * @return {cr.ui.Command} associated command. 43 */ 44CommandButton.prototype.getCommand = function() { 45 return this.command_; 46}; 47 48/** 49 * Associates command with this button. 50 * @param {string|cr.ui.Command} command Command id, or command object to 51 * associate with this button. 52 */ 53CommandButton.prototype.setCommand = function(command) { 54 if (this.command_) { 55 this.command_.removeEventListener('labelChange', this); 56 this.command_.removeEventListener('disabledChange', this); 57 this.command_.removeEventListener('hiddenChange', this); 58 } 59 60 if (typeof command == 'string' && command[0] == '#') { 61 command = this.ownerDocument.getElementById(command.slice(1)); 62 cr.ui.decorate(command, cr.ui.Command); 63 } 64 65 this.command_ = command; 66 if (command) { 67 if (command.id) 68 this.setAttribute('command', '#' + command.id); 69 70 this.setLabel(command.label); 71 this.disabled = command.disabled; 72 this.hidden = command.hidden; 73 74 this.command_.addEventListener('labelChange', this); 75 this.command_.addEventListener('disabledChange', this); 76 this.command_.addEventListener('hiddenChange', this); 77 } 78}; 79 80/** 81 * Returns button label 82 * @return {string} Button label. 83 */ 84CommandButton.prototype.getLabel = function() { 85 return this.textContent; 86}; 87 88/** 89 * Sets button label. 90 * @param {string} label New button label. 91 */ 92CommandButton.prototype.setLabel = function(label) { 93 this.textContent = label; 94}; 95 96/** 97 * Handles click event and dispatches associated command. 98 * @param {Event} e The mouseup event object. 99 * @private 100 */ 101CommandButton.prototype.handleClick_ = function(e) { 102 if (!this.disabled && this.command_) 103 this.command_.execute(this); 104}; 105 106/** 107 * Handles changes to the associated command. 108 * @param {Event} e The event object. 109 */ 110CommandButton.prototype.handleEvent = function(e) { 111 switch (e.type) { 112 case 'disabledChange': 113 this.disabled = this.command_.disabled; 114 break; 115 case 'hiddenChange': 116 this.hidden = this.command_.hidden; 117 break; 118 case 'labelChange': 119 this.setLabel(this.command_.label); 120 break; 121 } 122}; 123 124/** 125 * Whether the button is disabled or not. 126 * @type {boolean} 127 */ 128cr.defineProperty(CommandButton, 'disabled', 129 cr.PropertyKind.BOOL_ATTR); 130 131/** 132 * Whether the button is hidden or not. 133 * @type {boolean} 134 */ 135cr.defineProperty(CommandButton, 'hidden', 136 cr.PropertyKind.BOOL_ATTR); 137