Permalink
Browse files

Button demo2 with single button within form

  • Loading branch information...
1 parent 88f09ff commit 913dfed422fc4e73df95020f1034ce96348e8649 @jiannicello committed Apr 13, 2012
@@ -214,8 +214,22 @@ Y.Icello.Button = Y.Base.create(
Y.Widget,
[],
{
+ /**
+ * set to <button></button>
+ * @property BOUNDING_TEMPLATE
+ * @type String
+ */
BOUNDING_TEMPLATE: '<button></button>',
+ /**
+ * set to null
+ * @property CONTENT_TEMPLATE
+ * @type String
+ */
CONTENT_TEMPLATE: null,
+ /**
+ * Calls `setOnButtonClickPreventDefault()` and if `disabled` attribute is true calls `disableButton()`
+ * @method initializer
+ */
initializer: function () {
Y.log('', 'info', 'Button initializer');
@@ -226,31 +240,32 @@ Y.Icello.Button = Y.Base.create(
* @private
*/
this.viewType = null;
- this._domButtonPreventDefault();
+
+ this.setOnButtonClickPreventDefault();
if (this.get('disabled')) {
- this._disableButton();
+ this.disableButton();
}
},
destructor: function () {
Y.log('', 'info', 'Button destructor');
},
disable: function () {
Y.log('', 'info', 'Button disable');
- this._disableButton();
+ this.disableButton();
Y.Icello.Button.superclass.disable.call(this);
},
enable: function () {
Y.log('', 'info', 'Button enable');
- this._enableButton();
+ this.enableButton();
Y.Icello.Button.superclass.enable.call(this);
},
renderUI: function () {
Y.log('', 'info', 'Button renderUI');
},
bindUI: function () {
Y.log('', 'info', 'Button bindUI');
- this.after('disabledChange', Y.bind(this._afterDisabledChange, this));
+ this.after('disabledChange', Y.bind(this.afterDisabledChange, this));
},
/**
* should be called explicitly after 'icon', 'label' and 'title' have changed
@@ -275,39 +290,36 @@ Y.Icello.Button = Y.Base.create(
}
cb.empty();
- this._renderIcon();
- this._renderText();
- this._setTitle();
+ this.renderIcon();
+ this.renderLabel();
+ this.setTitle();
},
- _afterDisabledChange: function (e) {
- Y.log(e.newVal, 'info', 'Buttton _afterDisabledChange');
+ afterDisabledChange: function (e) {
+ Y.log(e.newVal, 'info', 'Buttton afterDisabledChange');
var do_disable = e.newVal;
if (do_disable) {
this.disable();
} else {
this.enable();
}
},
- _domButtonPreventDefault: function () {
- Y.log('', 'info', 'Button _domButtonPreventDefault');
- var cb = this.get(CB);
- cb.on('click', function (e) {
- e.preventDefault(); // - this was needed so that when button is within form, the form doesn't submit automatically
- // - the client will not need to worry about this behavior; they can submit form as needed explicitly
- });
- },
- _disableButton: function () {
- Y.log('', 'info', 'Button _disableButton');
+ /**
+ * Sets the contentBox `disabled` attribute to true. Called by `disable()` and called by `initializer` if `disabled` attribute is true.
+ * @method disableButton
+ * @private
+ */
+ disableButton: function () {
+ Y.log('', 'info', 'Button disableButton');
var cb = this.get(CB);
cb.set('disabled', true);
},
- _enableButton: function () {
- Y.log('', 'info', 'Button _enableButton');
+ enableButton: function () {
+ Y.log('', 'info', 'Button enableButton');
var cb = this.get(CB);
cb.set('disabled', false);
},
- _renderIcon: function () {
- Y.log('', 'info', 'Button _renderIcon');
+ renderIcon: function () {
+ Y.log('', 'info', 'Button renderIcon');
var cssIcon = this.get('icon'),
data = null,
span = null,
@@ -321,8 +333,13 @@ Y.Icello.Button = Y.Base.create(
this.get(CB).appendChild(span);
}
},
- _renderText: function () {
- Y.log('', 'info', 'Button _renderText');
+ /**
+ * Renders label. If `viewType` is `VIEW_TYPES.ICON_ONLY`, then label is set to an html space. Called by syncUI.
+ * @method renderLabel
+ * @private
+ */
+ renderLabel: function () {
+ Y.log('', 'info', 'Button renderLabel');
var data = null,
label = null,
span = null,
@@ -333,8 +350,27 @@ Y.Icello.Button = Y.Base.create(
span = Node.create(sub(template, data));
this.get(CB).appendChild(span);
},
- _setTitle: function () {
- Y.log('', 'info', 'Button _setTitle');
+ /**
+ * Sets an on click event handler of contentBox which calls preventDefault, so that when button is within a form, the form does not submit automatically.
+ * Called by initializer, so that it's the first event handler called.
+ * @method setOnButtonClickPreventDefault
+ * @protected
+ */
+ setOnButtonClickPreventDefault: function () {
+ Y.log('', 'info', 'Button setOnButtonClickPreventDefault');
+ var cb = this.get(CB);
+ cb.on('click', function (e) {
+ Y.log('', 'info', 'Button click handler preventDefault')
+ e.preventDefault();
+ });
+ },
+ /**
+ * Sets button title with 'title' attribute if not empty, else with 'label' attribute if not empty. Called by syncUI.
+ * @method setTitle
+ * @private
+ */
+ setTitle: function () {
+ Y.log('', 'info', 'Button setTitle');
var cb = this.get(CB),
label = this.get('label'),
title = this.get('title');
@@ -347,7 +383,7 @@ Y.Icello.Button = Y.Base.create(
}
},
/**
- * called by syncUI. sets viewType to ICON WITH LABEL, ICON ONLY or LABEL ONLY
+ * Sets `viewType` to `VIEW_TYPES.ICON_WITH_LABEL`, `VIEW_TYPES.ICON_ONLY` or `VIEW_TYPES.LABEL_ONLY` depending on what combination of attributes has values between `icon` and `label`. Called by syncUI.
* @method setViewType
* @private
*/
Oops, something went wrong.

0 comments on commit 913dfed

Please sign in to comment.