API Docs for: 3.10.3
Show:

File: button/js/core.js

  1. /**
  2. * Provides an interface for working with button-like DOM nodes
  3. *
  4. * @module button-core
  5. * @since 3.5.0
  6. */
  7. var getClassName = Y.ClassNameManager.getClassName;
  8.  
  9. /**
  10. * Creates a button
  11. *
  12. * @class ButtonCore
  13. * @uses AttributeCore
  14. * @param config {Object} Configuration object
  15. * @constructor
  16. */
  17. function ButtonCore(config) {
  18. this.initializer(config);
  19. }
  20.  
  21. ButtonCore.prototype = {
  22.  
  23. /**
  24. *
  25. * @property TEMPLATE
  26. * @type {String}
  27. * @default <button/>
  28. */
  29. TEMPLATE: '<button/>',
  30.  
  31. /**
  32. *
  33. * @property constructor
  34. * @type {Object}
  35. * @default ButtonCore
  36. * @private
  37. */
  38. constructor: ButtonCore,
  39.  
  40. /**
  41. * @method initializer
  42. * @description Internal init() handler.
  43. * @param config {Object} Config object.
  44. * @private
  45. */
  46. initializer: function(config) {
  47. this._initNode(config);
  48. this._initAttributes(config);
  49. this._renderUI(config);
  50. },
  51.  
  52. /**
  53. * @method _initNode
  54. * @description Node initializer
  55. * @param config {Object} Config object.
  56. * @private
  57. */
  58. _initNode: function(config) {
  59. if (config.host) {
  60. this._host = Y.one(config.host);
  61. } else {
  62. this._host = Y.Node.create(this.TEMPLATE);
  63. }
  64. },
  65.  
  66. /**
  67. * @method _initAttributes
  68. * @description Attribute initializer
  69. * @param config {Object} Config object.
  70. * @private
  71. */
  72. _initAttributes: function(config) {
  73. var host = this._host,
  74. node = host.one('.' + ButtonCore.CLASS_NAMES.LABEL) || host;
  75. config.label = config.label || this._getLabel(node);
  76. Y.AttributeCore.call(this, ButtonCore.ATTRS, config);
  77. },
  78.  
  79. /**
  80. * @method renderUI
  81. * @description Renders any UI/DOM elements for Button instances
  82. * @param config {Object} Config object.
  83. * @private
  84. */
  85. _renderUI: function() {
  86. var node = this.getNode(),
  87. tagName = node.get('tagName').toLowerCase();
  88.  
  89. // Set some default node attributes
  90. node.addClass(ButtonCore.CLASS_NAMES.BUTTON);
  91. if (tagName !== 'button' && tagName !== 'input') {
  92. node.set('role', 'button');
  93. }
  94. },
  95.  
  96. /**
  97. * @method enable
  98. * @description Sets the button's `disabled` DOM attribute to false
  99. * @public
  100. */
  101. enable: function() {
  102. this.set('disabled', false);
  103. },
  104.  
  105. /**
  106. * @method disable
  107. * @description Sets the button's `disabled` DOM attribute to true
  108. * @public
  109. */
  110. disable: function() {
  111. this.set('disabled', true);
  112. },
  113.  
  114. /**
  115. * @method getNode
  116. * @description Gets the host DOM node for this button instance
  117. * @public
  118. */
  119. getNode: function() {
  120. return this._host;
  121. },
  122. /**
  123. * @method _getLabel
  124. * @description Getter for a button's 'label' ATTR
  125. * @private
  126. */
  127. _getLabel: function () {
  128. var node = this.getNode(),
  129. tagName = node.get('tagName').toLowerCase(),
  130. label;
  131.  
  132. if (tagName === 'input') {
  133. label = node.get('value');
  134. }
  135. else {
  136. label = (node.one('.' + ButtonCore.CLASS_NAMES.LABEL) || node).get('text');
  137. }
  138. return label;
  139. },
  140. /**
  141. * @method _uiSetLabel
  142. * @description Setter for a button's 'label' ATTR
  143. * @param label {string}
  144. * @private
  145. */
  146. _uiSetLabel: function (label) {
  147. var node = this.getNode(),
  148. tagName = node.get('tagName').toLowerCase();
  149.  
  150. if (tagName === 'input') {
  151. node.set('value', label);
  152. } else {
  153. (node.one('.' + ButtonCore.CLASS_NAMES.LABEL) || node).set('text', label);
  154. }
  155.  
  156. return label;
  157. },
  158.  
  159. /**
  160. * @method _uiSetDisabled
  161. * @description Setter for the 'disabled' ATTR
  162. * @param value {boolean}
  163. * @private
  164. */
  165. _uiSetDisabled: function(value) {
  166. var node = this.getNode();
  167. node.getDOMNode().disabled = value; // avoid rerunning setter when this === node
  168. node.toggleClass(ButtonCore.CLASS_NAMES.DISABLED, value);
  169. return value;
  170. }
  171. };
  172.  
  173.  
  174. Y.mix(ButtonCore.prototype, Y.AttributeCore.prototype);
  175.  
  176. /**
  177. * Attribute configuration.
  178. *
  179. * @property ATTRS
  180. * @type {Object}
  181. * @protected
  182. * @static
  183. */
  184. ButtonCore.ATTRS = {
  185.  
  186. /**
  187. * The text of the button (the `value` or `text` property)
  188. *
  189. * @attribute label
  190. * @type String
  191. */
  192. label: {
  193. setter: '_uiSetLabel',
  194. getter: '_getLabel',
  195. lazyAdd: false
  196. },
  197.  
  198. /**
  199. * The button's enabled/disabled state
  200. *
  201. * @attribute disabled
  202. * @type Boolean
  203. */
  204. disabled: {
  205. value: false,
  206. setter: '_uiSetDisabled',
  207. lazyAdd: false
  208. }
  209. };
  210.  
  211. /**
  212. * Name of this component.
  213. *
  214. * @property NAME
  215. * @type String
  216. * @static
  217. */
  218. ButtonCore.NAME = "button";
  219.  
  220. /**
  221. * Array of static constants used to identify the classnames applied to DOM nodes
  222. *
  223. * @property CLASS_NAMES
  224. * @type {Object}
  225. * @public
  226. * @static
  227. */
  228. ButtonCore.CLASS_NAMES = {
  229. BUTTON : getClassName('button'),
  230. DISABLED: getClassName('button', 'disabled'),
  231. SELECTED: getClassName('button', 'selected'),
  232. LABEL : getClassName('button', 'label')
  233. };
  234.  
  235. /**
  236. * Array of static constants used to for applying ARIA states
  237. *
  238. * @property CLASS_NAMES
  239. * @type {Object}
  240. * @private
  241. * @static
  242. */
  243. ButtonCore.ARIA_STATES = {
  244. PRESSED : 'aria-pressed',
  245. CHECKED : 'aria-checked'
  246. };
  247.  
  248. /**
  249. * Array of static constants used to for applying ARIA roles
  250. *
  251. * @property CLASS_NAMES
  252. * @type {Object}
  253. * @private
  254. * @static
  255. */
  256. ButtonCore.ARIA_ROLES = {
  257. BUTTON : 'button',
  258. CHECKBOX: 'checkbox',
  259. TOGGLE : 'toggle'
  260. };
  261.  
  262. // Export Button
  263. Y.ButtonCore = ButtonCore;