X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/c930e9176a5a85509c5b0230e2bff5c22a591432..6a7e4474cba9d8be4b2ec445e10f1691f7277c50:/docs/source/SliderTip.html diff --git a/docs/source/SliderTip.html b/docs/source/SliderTip.html index 362576a7..f8ea95c1 100644 --- a/docs/source/SliderTip.html +++ b/docs/source/SliderTip.html @@ -1,36 +1,84 @@ - -
-/** - * @class Ext.ux.SliderTip - * @extends Ext.Tip - * Simple plugin for using an Ext.Tip with a slider to show the slider value - */ -Ext.ux.SliderTip = Ext.extend(Ext.Tip, { - minWidth: 10, - offsets : [0, -10], - init : function(slider){ - slider.on('dragstart', this.onSlide, this); - slider.on('drag', this.onSlide, this); - slider.on('dragend', this.hide, this); - slider.on('destroy', this.destroy, this); - }, - - onSlide : function(slider){ - this.show(); - this.body.update(this.getText(slider)); - this.doAutoWidth(); - this.el.alignTo(slider.thumb, 'b-t?', this.offsets); - }, - - getText : function(slider){ - return String(slider.getValue()); - } -}); -- + + + +
/*! + * Ext JS Library 3.2.0 + * Copyright(c) 2006-2010 Ext JS, Inc. + * licensing@extjs.com + * http://www.extjs.com/license + */ +/** + * @class Ext.slider.Tip + * @extends Ext.Tip + * Simple plugin for using an Ext.Tip with a slider to show the slider value. Example usage: ++ \ No newline at end of file+new Ext.Slider({ + width: 214, + minValue: 0, + maxValue: 100, + plugins: new Ext.slider.Tip() +}); ++ * Optionally provide your own tip text by overriding getText: ++ new Ext.Slider({ + width: 214, + minValue: 0, + maxValue: 100, + plugins: new Ext.slider.Tip({ + getText: function(thumb){ + return String.format('{0}% complete', thumb.value); + } + }) + }); ++ */ +Ext.slider.Tip = Ext.extend(Ext.Tip, { + minWidth: 10, + offsets : [0, -10], + + init: function(slider) { + slider.on({ + scope : this, + dragstart: this.onSlide, + drag : this.onSlide, + dragend : this.hide, + destroy : this.destroy + }); + }, + + /** + * @private + * Called whenever a dragstart or drag event is received on the associated Thumb. + * Aligns the Tip with the Thumb's new position. + * @param {Ext.slider.MultiSlider} slider The slider + * @param {Ext.EventObject} e The Event object + * @param {Ext.slider.Thumb} thumb The thumb that the Tip is attached to + */ + onSlide : function(slider, e, thumb) { + this.show(); + this.body.update(this.getText(thumb)); + this.doAutoWidth(); + this.el.alignTo(thumb.el, 'b-t?', this.offsets); + }, + + /** + * Used to create the text that appears in the Tip's body. By default this just returns + * the value of the Slider Thumb that the Tip is attached to. Override to customize. + * @param {Ext.slider.Thumb} thumb The Thumb that the Tip is attached to + * @return {String} The text to display in the tip + */ + getText : function(thumb) { + return String(thumb.value); + } +}); + +//backwards compatibility - SliderTip used to be a ux before 3.2 +Ext.ux.SliderTip = Ext.slider.Tip;