3 * Copyright(c) 2006-2010 Sencha Inc.
5 * http://www.sencha.com/license
8 * @class Ext.slider.Tip
10 * Simple plugin for using an Ext.Tip with a slider to show the slider value. Example usage:
16 plugins: new Ext.slider.Tip()
19 * Optionally provide your own tip text by overriding getText:
25 plugins: new Ext.slider.Tip({
26 getText: function(thumb){
27 return String.format('<b>{0}% complete</b>', thumb.value);
33 Ext.slider.Tip = Ext.extend(Ext.Tip, {
37 init: function(slider) {
40 dragstart: this.onSlide,
43 destroy : this.destroy
49 * Called whenever a dragstart or drag event is received on the associated Thumb.
50 * Aligns the Tip with the Thumb's new position.
51 * @param {Ext.slider.MultiSlider} slider The slider
52 * @param {Ext.EventObject} e The Event object
53 * @param {Ext.slider.Thumb} thumb The thumb that the Tip is attached to
55 onSlide : function(slider, e, thumb) {
57 this.body.update(this.getText(thumb));
59 this.el.alignTo(thumb.el, 'b-t?', this.offsets);
63 * Used to create the text that appears in the Tip's body. By default this just returns
64 * the value of the Slider Thumb that the Tip is attached to. Override to customize.
65 * @param {Ext.slider.Thumb} thumb The Thumb that the Tip is attached to
66 * @return {String} The text to display in the tip
68 getText : function(thumb) {
69 return String(thumb.value);
73 //backwards compatibility - SliderTip used to be a ux before 3.2
74 Ext.ux.SliderTip = Ext.slider.Tip;