Lines Matching defs:button
2 Provides header/body/footer button support for Widgets that use the
24 Provides header/body/footer button support for Widgets that use the
28 buttons. It adds a `buttons` attribute along with button- accessor and mutator
29 methods. All button nodes have the `Y.Plugin.Button` plugin applied.
54 All button nodes have the `Y.Plugin.Button` plugin applied.
67 A button can be specified as a `Y.Node`, config Object, or String name for a
68 predefined button on the `BUTTONS` prototype property. When a config Object
69 is provided, it will be merged with any defaults provided by a button with
80 // Uses predefined "close" button by string name.
116 The current default button as configured through this widget's `buttons`.
118 A button can be configured as the default button in the following ways:
124 `<button data-default="true">Okay</button>`.
129 **Note:** If two or more buttons are configured to be the default button,
153 button : getClassName('button'),
155 primary: getClassName('button', 'primary')
165 The list of button configuration properties which are specific to
183 These button configurations will serve as defaults for any button added to a
220 A map of button node `_yuid` -> event-handle for all button nodes which were
230 A map of this widget's `buttons`, both name -> button and
231 section:name -> button.
240 Internal reference to this widget's default button.
251 // Creates button mappings and sets the `defaultButton`.
276 Adds a button to this widget.
278 The new button node will have the `Y.Plugin.Button` plugin applied, be added
286 * `button`: The button node or config object to add.
289 button should be added.
291 * `index`: The index at which to add the button to the section.
296 @param {Node|Object|String} button The button to add. This can be a `Y.Node`
297 instance, config Object, or String name for a predefined button on the
299 be merged with any defaults provided by any `srcNode` and/or a button
303 @param {Function|String} [button.action] The default handler that should
304 be called when the button is clicked. A String name of a Function that
307 @param {String|String[]} [button.classNames] Additional CSS classes to add
308 to the button node.
309 @param {Object} [button.context=this] Context which any `events` or
311 **Note:** `e.target` will access the button node in the event handlers.
312 @param {Boolean} [button.disabled=false] Whether the button should be
314 @param {String|Object} [button.events="click"] Event name, or set of
315 events and handlers to bind to the button node. **See:** `Y.Node.on()`,
317 @param {Boolean} [button.isDefault=false] Whether the button is the
318 default button.
319 @param {String} [button.label] The visible text/value displayed in the
320 button.
321 @param {String} [button.name] A name which can later be used to reference
322 this button. If a button is defined on the `BUTTONS` property with this
324 @param {String} [button.section] The `WidgetStdMod` section (header, body,
325 footer) where the button should be added.
326 @param {Node} [button.srcNode] An existing Node to use for the button,
328 values specified in the config object. By default a new <button>
330 @param {String} [button.template] A specific template to use when creating
331 a new button node (e.g. "<a />"). **Note:** Specifying a `srcNode`
334 (header/body/footer) where the button should be added. This takes
335 precedence over the `button.section` configuration property.
336 @param {Number} [index] The index at which the button should be inserted. If
337 not specified, the button will be added to the end of the section.
342 addButton: function (button, section, index) {
347 if (!Y.instanceOf(button, Y.Node)) {
348 button = this._mergeButtonConfig(button);
349 section || (section = button.section);
356 // Insert new button at the correct position.
357 sectionButtons.splice(index, 0, button);
360 button : button,
370 Returns a button node from this widget's `buttons`.
373 @param {Number|String} name The string name or index of the button.
375 (header/body/footer) where the button exists. Only applicable when
376 looking for a button by numerical index, or by name but scoped to a
378 @return {Node} The button node.
395 // Looks up button by name or section:name.
400 Removes a button from this widget.
402 The button will be removed from this widget's `buttons` and its DOM. Any
403 event subscriptions on the button which were created by this widget will be
404 detached. If the content section becomes empty after removing the button
410 * `button`: The button node to remove.
413 button should be removed from.
415 * `index`: The index at which at which the button exists in the section.
420 @param {Node|Number|String} button The button to remove. This can be a
421 `Y.Node` instance, index, or String name of a button.
423 (header/body/footer) where the button exists. Only applicable when
424 removing a button by numerical index, or by name but scoped to a
429 removeButton: function (button, section) {
430 if (!isValue(button)) { return this; }
435 // Shortcut if `button` is already an index which is needed for slicing.
436 if (isNumber(button)) {
438 index = button;
439 button = buttons[section][index];
441 // Supports `button` being the string name.
442 if (isString(button)) {
443 button = this.getButton.apply(this, arguments);
446 // Determines the `section` and `index` at which the button exists.
448 index = YArray.indexOf(sectionButtons, button);
458 if (button && index > -1) {
459 // Remove button from `section` array.
463 button : button,
498 Returns a button node based on the specified `button` node or configuration.
500 The button node will either be created via `Y.Plugin.Button.createNode()`,
501 or when `button` is specified as a node already, it will by `plug()`ed with
505 @param {Node|Object} button Button node or configuration object.
506 @return {Node} The button node.
510 _createButton: function (button) {
515 if (Y.instanceOf(button, Y.Node)) {
516 return button.plug(ButtonPlugin);
519 // Merge `button` config with defaults and back-compat.
523 label : button.value
524 }, button);
529 // Remove all non-button Node config props.
534 // Create the button node using the button Node-only config.
535 button = ButtonPlugin.createNode(buttonConfig);
548 handle = button.on(config.events, action, context);
549 this._buttonsHandles[Y.stamp(button, true)] = handle;
551 // Tags the button with the configured `name` and `isDefault` settings.
552 button.setData('name', this._getButtonName(config));
553 button.setData('default', this._getButtonDefault(config));
555 // Add any CSS classnames to the button node.
556 YArray.each(YArray(config.classNames), button.addClass, button);
558 return button;
597 Returns whether or not the specified `button` is configured to be the
598 default button.
600 When a button node is specified, the button's `getData()` method will be
601 used to determine if the button is configured to be the default. When a
602 button config object is specified, the `isDefault` prop will determine
603 whether the button is the default.
605 **Note:** `<button data-default="true"></button>` is supported via the
606 `button.getData('default')` API call.
609 @param {Node|Object} button The button node or configuration object.
610 @return {Boolean} Whether the button is configured to be the default button.
614 _getButtonDefault: function (button) {
615 var isDefault = Y.instanceOf(button, Y.Node) ?
616 button.getData('default') : button.isDefault;
626 Returns the name of the specified `button`.
628 When a button node is specified, the button's `getData('name')` method is
630 the button's name. When a button config object is specified, the `name` prop
631 will determine the button's name.
633 **Note:** `<button data-name="foo"></button>` is supported via the
634 `button.getData('name')` API call.
637 @param {Node|Object} button The button node or configuration object.
638 @return {String} The name of the button.
642 _getButtonName: function (button) {
645 if (Y.instanceOf(button, Y.Node)) {
646 name = button.getData('name') || button.get('name');
648 name = button && (button.name || button.type);
660 (the button nodes are *not* copied/cloned.)
673 // Creates of copy of the array of button nodes.
681 Adds the specified `button` to the buttons map (both name -> button and
682 section:name -> button), and sets the button as the default if it is
683 configured as the default button.
686 configured to be the default button, the last one wins.
689 @param {Node} button The button node to map.
694 _mapButton: function (button, section) {
696 name = this._getButtonName(button),
697 isDefault = this._getButtonDefault(button);
700 // name -> button
701 map[name] = button;
703 // section:name -> button
704 map[section + ':' + name] = button;
707 isDefault && (this._defaultButton = button);
711 Adds the specified `buttons` to the buttons map (both name -> button and
712 section:name -> button), and set the a button as the default if one is
713 configured as the default button.
715 **Note:** This will clear all previous button mappings and null-out any
716 previous default button! If two or more buttons are configured with the same
717 `name` and/or configured to be the default button, the last one wins.
720 @param {Node[]} buttons The button nodes to map.
739 provided by a `srcNode` and/or a predefined configuration for a button
744 @return {Object} A copy of the button configuration object merged with any
750 var buttonConfig, defConfig, name, button, tagName, label;
755 // Seeds default values from the button node, if there is one.
757 button = config.srcNode;
758 tagName = button.get('tagName').toLowerCase();
759 label = button.get(tagName === 'input' ? 'value' : 'text');
761 // Makes sure the button's current values override any defaults.
763 disabled : !!button.get('disabled'),
764 isDefault: this._getButtonDefault(button),
765 name : this._getButtonName(button)
789 **Note:** To determine a button node's name its `data-name` and `name`
790 attributes are examined. Whether the button should be the default is
800 var buttonSelector = '.' + WidgetButtons.CLASS_NAMES.button,
813 // Creates a button config object for every button node found and
814 // adds it to the section. This way each button configuration can be
816 buttons.each(function (button) {
817 sectionButtons.push({srcNode: button});
832 The button nodes will either be created via `Y.Plugin.Button.createNode()`,
833 or when a button is already a Node already, it will by `plug()`ed with
850 var i, len, button, section;
853 button = buttonConfigs[i];
856 if (!Y.instanceOf(button, Y.Node)) {
857 button = this._mergeButtonConfig(button);
858 section || (section = button.section);
862 // is decorated as a button.
863 button = this._createButton(button);
868 // Add button to the array of buttons for the specified section.
869 (buttons[section] || (buttons[section] = [])).push(button);
884 Syncs this widget's current button-related state to its DOM. This method is
898 Inserts the specified `button` node into this widget's DOM at the specified
901 The section and button container nodes will be created if they do not
905 @param {Node} button The button node to insert into this widget's DOM.
907 @param {Number} index Index at which the `button` should be positioned.
911 _uiInsertButton: function (button, section, index) {
912 var buttonsClassName = WidgetButtons.CLASS_NAMES.button,
916 // Inserts the button node at the correct index.
917 buttonContainer.insertBefore(button, sectionButtons.item(index));
919 // Adds the button container to the section content.
924 Removes the button node from this widget's DOM and detaches any event
925 subscriptions on the button that were created by this widget. The section
929 By default the button container node will be removed when this removes the
930 last button of the specified `section`; and if no other content remains in
934 @param {Node} button The button to remove and destroy.
942 _uiRemoveButton: function (button, section, options) {
943 var yuid = Y.stamp(button, this),
951 button.remove();
955 // Remove the button container and section nodes if needed.
958 buttonClassName = WidgetButtons.CLASS_NAMES.button;
960 // Only matters if we have a button container which is empty.
976 moved if they should be in a new position. Old button nodes which are no
978 and any event subscriptions on the button which were created by this widget
981 If the button nodes in this widget's DOM actually change, then each content
990 var buttonClassName = WidgetButtons.CLASS_NAMES.button,
998 oldNodes, i, button, buttonIndex;
1000 // When there's no button container, there are no new buttons or old
1007 button = sectionButtons[i];
1008 buttonIndex = oldNodes ? oldNodes.indexOf(button) : -1;
1014 // Remove button from existing buttons nodeList since its in
1018 // Check that the button is at the right position, if not,
1021 // Using `i + 1` because the button should be at index
1023 buttonContainer.insertBefore(button, i + 1);
1027 buttonContainer.appendChild(button);
1032 // Safely removes the old button nodes which are no longer part of
1034 oldNodes.each(function (button) {
1035 this._uiRemoveButton(button, section, {preserveContent: true});
1039 // Remove leftover empty button containers and updated the StdMod
1047 // Adds the button container to the section content.
1055 Adds the "yui3-button-primary" CSS class to the new `defaultButton` and
1056 removes it from the old default button.
1090 Removes the specified `button` to the buttons map, and nulls-out the
1091 `defaultButton` if it is currently the default button.
1094 @param {Node} button The button node to remove from the buttons map.
1098 _unMapButton: function (button, section) {
1100 name = this._getButtonName(button),
1103 // Only delete the map entry if the specified `button` is mapped to it.
1105 // name -> button
1106 if (map[name] === button) {
1110 // section:name -> button
1112 if (map[sectionName] === button) {
1117 // Clear the default button if its the specified `button`.
1118 if (this._defaultButton === button) {
1181 button;
1183 // Special cases `addButton()` to only set and insert the new button.
1185 // Make sure we have the button node.
1186 button = buttons[section][index];
1188 this._mapButton(button, section);
1190 this._uiInsertButton(button, section, index);
1195 // Special cases `removeButton()` to only remove the specified button.
1198 button = e.button;
1200 this._unMapButton(button, section);
1202 this._uiRemoveButton(button, section);
1238 "yui3-button-primary" CSS class to the new `defaultButton` and removing it
1239 from the old default button.