1 /*

     2 YUI 3.10.3 (build 2fb5187)

     3 Copyright 2013 Yahoo! Inc. All rights reserved.

     4 Licensed under the BSD License.

     5 http://yuilibrary.com/license/

     6 */

     7 

     8 YUI.add('button-group', function (Y, NAME) {

     9 

    10 /**

    11  * A Widget to create groups of buttons

    12  *

    13  * @module button-group

    14  * @since 3.5.0

    15  */

    16 

    17 var CONTENT_BOX = "contentBox",

    18     CLICK_EVENT = "click",

    19     CLASS_NAMES = Y.ButtonCore.CLASS_NAMES;

    20 

    21 /**

    22  * Creates a ButtonGroup

    23  *

    24  * @class ButtonGroup

    25  * @extends Widget

    26  * @param config {Object} Configuration object

    27  * @constructor

    28  */

    29 function ButtonGroup() {

    30     ButtonGroup.superclass.constructor.apply(this, arguments);

    31 }

    32 

    33 /* ButtonGroup extends Widget */

    34 Y.ButtonGroup = Y.extend(ButtonGroup, Y.Widget, {

    35 

    36     /**

    37      * @method renderUI

    38      * @description Creates a visual representation of the widget based on existing parameters.

    39      * @public

    40      */

    41     renderUI: function() {

    42         this.getButtons().plug(Y.Plugin.Button);

    43     },

    44 

    45     /**

    46      * @method bindUI

    47      * @description Hooks up events for the widget

    48      * @public

    49      */

    50     bindUI: function() {

    51         var group = this,

    52             cb = group.get(CONTENT_BOX);

    53 

    54         cb.delegate(CLICK_EVENT, group._handleClick, Y.ButtonGroup.BUTTON_SELECTOR, group);

    55     },

    56 

    57     /**

    58      * @method getButtons

    59      * @description Returns all buttons inside this this button group

    60      * @public

    61      */

    62     getButtons: function() {

    63         var cb = this.get(CONTENT_BOX);

    64 

    65         return cb.all(Y.ButtonGroup.BUTTON_SELECTOR);

    66     },

    67 

    68     /**

    69      * @method getSelectedButtons

    70      * @description Returns all Y.Buttons instances that are selected

    71      * @public

    72      */

    73     getSelectedButtons: function() {

    74         var group = this,

    75             selected = [],

    76             buttons = group.getButtons(),

    77             selectedClass = ButtonGroup.CLASS_NAMES.SELECTED;

    78 

    79         buttons.each(function(node){

    80             if (node.hasClass(selectedClass)){

    81                 selected.push(node);

    82             }

    83         });

    84 

    85         return selected;

    86     },

    87 

    88     /**

    89      * @method getSelectedValues

    90      * @description Returns the values of all Y.Button instances that are selected

    91      * @public

    92      */

    93     getSelectedValues: function() {

    94         var selected = this.getSelectedButtons(),

    95             values = [],

    96             value;

    97 

    98         Y.Array.each(selected, function(node){

    99             value = node.getContent();

   100             values.push(value);

   101         });

   102 

   103         return values;

   104     },

   105 

   106     /**

   107      * @method _handleClick

   108      * @description A delegated click handler for when any button is clicked in the content box

   109      * @param e {Object} An event object

   110      * @private

   111      */

   112     _handleClick: function(e){

   113         var group = this,

   114             clickedNode = e.target.ancestor('.' + ButtonGroup.CLASS_NAMES.BUTTON, true),

   115             type = group.get('type'),

   116             selectedClass = ButtonGroup.CLASS_NAMES.SELECTED,

   117             isSelected = clickedNode.hasClass(selectedClass),

   118             buttons;

   119 

   120         // TODO: Anything for 'push' groups?

   121         if (type === 'checkbox') {

   122             clickedNode.toggleClass(selectedClass, !isSelected);

   123             /**

   124              * @event selectionChange

   125              * @description fires when any button in the group changes its checked status

   126              * @param {Event} the event object. It contains an "originEvent" property

   127              * linking to the original DOM event that triggered the selection change

   128              */

   129             group.fire('selectionChange', {originEvent: e});

   130         }

   131         else if (type === 'radio' && !isSelected) {

   132             buttons = group.getButtons(); // Todo: getSelectedButtons()? Need it to return an arraylist then.

   133             buttons.removeClass(selectedClass);

   134             clickedNode.addClass(selectedClass);

   135             group.fire('selectionChange', {originEvent: e});

   136         }

   137     }

   138 

   139 }, {

   140     // Y.ButtonGroup static properties

   141 

   142     /**

   143      * The identity of the widget.

   144      *

   145      * @property NAME

   146      * @type {String}

   147      * @default 'buttongroup'

   148      * @readOnly

   149      * @protected

   150      * @static

   151      */

   152     NAME: 'buttongroup',

   153 

   154     /**

   155      * Static property used to define the default attribute configuration of

   156      * the Widget.

   157      *

   158      * @property ATTRS

   159      * @type {Object}

   160      * @protected

   161      * @static

   162      */

   163     ATTRS: {

   164 

   165         /**

   166          * @attribute type

   167          * @type String

   168          */

   169         type: {

   170             writeOnce: 'initOnly',

   171             value: 'radio'

   172         }

   173     },

   174 

   175     /**

   176      * List of class names to use for ButtonGroups

   177      *

   178      * @property CLASS_NAMES

   179      * @type {Object}

   180      * @static

   181      */

   182     CLASS_NAMES: CLASS_NAMES,

   183     

   184     /**

   185      * Selector used to find buttons inside a ButtonGroup

   186      * @property BUTTON_SELECTOR

   187      * @type {String}

   188      */

   189     BUTTON_SELECTOR: "button, input[type=button], input[type=reset], input[type=submit], input[type=radio], input[type=checkbox]"

   190 });

   191 

   192 

   193 }, '3.10.3', {"requires": ["button-plugin", "cssbutton", "widget"]});