r2668 - spinner: moved markup generation code into _draw to separate from behavioural code.
Author: pazu2k@gmail.com
Date: Sun Jun 7 08:52:23 2009
New Revision: 2668
Modified:
branches/dev/spinner/ui/ui.spinner.js
Log:
spinner: moved markup generation code into _draw to separate from
behavioural code.
Modified: branches/dev/spinner/ui/ui.spinner.js
==============================================================================
--- branches/dev/spinner/ui/ui.spinner.js (original)
+++ branches/dev/spinner/ui/ui.spinner.js Sun Jun 7 08:52:23 2009
@@ -20,8 +20,7 @@
$.widget('ui.spinner', {
_init: function() {
var self = this,
- validChars,
- spinnerClass = 'ui-spinner ui-widget ui-widget-content ui-corner-all
ui-spinner-'+self.options.dir;
+ validChars;
function parse(val, ifNull) {
if (val == null)
@@ -73,31 +72,14 @@
var s = self.options.step.toString();
self._precision = s.slice(s.indexOf('.')+1, s.length).length;
}
-
- //Initialize needed constants
- self.element
- .addClass('ui-spinner-box')
- .attr('autocomplete', 'off'); // switch off autocomplete in opera
-
- // force a width if passed through options
- if (self.options.width) {
- self.element.width(self.options.width);
- }
self._setValue( isNaN(self._getValue()) ? self.options.value :
self._getValue() );
+
+ // draw widget
+ var widget = self._draw();
- if (self.options.spinnerClass)
- spinnerClass += ' '+ self.options.spinnerClass;
-
- var widget = self.element
- .wrap('<div>')
- .parent()
- .addClass(spinnerClass)
- // check for IE
- .css({
- display: !$.support.opacity &&
$(self).css('display', 'inline-block') ? 'inline' : false
- })
- .append('<a class="ui-spinner-button ui-spinner-up ui-state-default
ui-corner-t'+ self.options.dir.substr(-1,1) +'"><span
class="ui-spinner-button-inner"><span class="ui-icon
ui-icon-triangle-1-n">▲</span></span></a>')
+ // add behaviours
+ widget
.find('.ui-spinner-up')
.bind('mousedown', function(event) {
$(this).addClass(active);
@@ -122,7 +104,6 @@
}
})
.end()
- .append('<a class="ui-spinner-button ui-spinner-down ui-state-default
ui-corner-b'+ self.options.dir.substr(-1,1) +'"><span
class="ui-spinner-button-inner"><span class="ui-icon
ui-icon-triangle-1-s">▼</span></span></a>')
.find('.ui-spinner-down')
.bind('mousedown', function(event) {
$(this).addClass(active);
@@ -130,7 +111,7 @@
self.counter = 1;
}
self._mousedown(100, '_down', event);
- })
+ })
.bind('mouseup', function(event) {
$(this).removeClass(active);
if (self.counter == 1) {
@@ -169,14 +150,6 @@
if (self.options.hide)
self._hide();
- // Give the spinner casing a unique id only if one exists in original
input
- // - this should aid targetted customisations if a page contains
multiple instances
- self.element.attr('id', function(){
- if (this.id) {
- $(this).parent().attr('id', this.id+'-ui-spinner');
- }
- });
-
// DataList: Set contraints for object length and step size.
// Manipulate height of spinner.
self._items = self.element.children().length;
@@ -461,6 +434,40 @@
}
$.widget.prototype._setData.call(this, key, value);
+ },
+ _draw: function() {
+ var dir = this.options.dir,
+ spinnerClass = this.options.spinnerClass,
+ spinnerBoxClass = 'ui-spinner-box',
+ widgetClasses = 'ui-spinner ui-widget ui-widget-content ui-corner-all
ui-spinner-' + dir + (spinnerClass ? ' '+ spinnerClass: ''),
+ widget = this.element
+ .addClass(spinnerBoxClass)
+ .attr('autocomplete', 'off') // switch off autocomplete in opera
+ .wrap('<div>')
+ .parent()
+ .addClass(widgetClasses)
+ .append('<a class="ui-spinner-button ui-spinner-up ui-state-default
ui-corner-t'+ dir.substr(-1,1) +'"><span
class="ui-spinner-button-inner"><span class="ui-icon
ui-icon-triangle-1-n">▲</span></span></a>')
+ .append('<a class="ui-spinner-button ui-spinner-down ui-state-default
ui-corner-b'+ dir.substr(-1,1) +'"><span
class="ui-spinner-button-inner"><span class="ui-icon
ui-icon-triangle-1-s">▼</span></span></a>');
+
+ // TODO: need a better way to exclude IE8 without resorting to
$.browser.version
+ // fix inline-block issues for IE. Since IE8 supports inline-block we
need to exclude it.
+ if (!$.support.opacity && widget.css('display') == 'inline-block' &&
$.browser.version < 8) {
+ widget.css('display', 'inline');
+ }
+
+ // force width if passed through options
+ if (this.options.width)
+ widget.find('.'+spinnerBoxClass).width(this.options.width);
+
+ // Give the spinner casing a unique id only if one exists in original
input
+ // - this should aid targetted customisations if a page contains
multiple instances
+ widget.find('.'+spinnerBoxClass).attr('id', function(){
+ if (this.id) {
+ $(this).parent().attr('id', this.id + '-ui-spinner');
+ }
+ });
+
+ return widget;
},
plugins: {},