<html>
<head>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>The source code</title>
<link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="../resources/prettify/prettify.js"></script>
</head>
<body onload="prettyPrint();">
- <pre class="prettyprint lang-js"><div id="cls-Ext.ux.SliderTip"></div>/**\r
- * @class Ext.ux.SliderTip\r
- * @extends Ext.Tip\r
- * Simple plugin for using an Ext.Tip with a slider to show the slider value\r
- */\r
-Ext.ux.SliderTip = Ext.extend(Ext.Tip, {\r
- minWidth: 10,\r
- offsets : [0, -10],\r
- init : function(slider){\r
- slider.on('dragstart', this.onSlide, this);\r
- slider.on('drag', this.onSlide, this);\r
- slider.on('dragend', this.hide, this);\r
- slider.on('destroy', this.destroy, this);\r
- },\r
-\r
- onSlide : function(slider){\r
- this.show();\r
- this.body.update(this.getText(slider));\r
- this.doAutoWidth();\r
- this.el.alignTo(slider.thumb, 'b-t?', this.offsets);\r
- },\r
-\r
- getText : function(slider){\r
- return String(slider.getValue());\r
- }\r
-});\r
+ <pre class="prettyprint lang-js">/*!
+ * Ext JS Library 3.3.1
+ * Copyright(c) 2006-2010 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+<div id="cls-Ext.slider.Tip"></div>/**
+ * @class Ext.slider.Tip
+ * @extends Ext.Tip
+ * Simple plugin for using an Ext.Tip with a slider to show the slider value. Example usage:
+<pre>
+new Ext.Slider({
+ width: 214,
+ minValue: 0,
+ maxValue: 100,
+ plugins: new Ext.slider.Tip()
+});
</pre>
+ * Optionally provide your own tip text by overriding getText:
+ <pre>
+ new Ext.Slider({
+ width: 214,
+ minValue: 0,
+ maxValue: 100,
+ plugins: new Ext.slider.Tip({
+ getText: function(thumb){
+ return String.format('<b>{0}% complete</b>', thumb.value);
+ }
+ })
+ });
+ </pre>
+ */
+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);
+ },
+
+ <div id="method-Ext.slider.Tip-getText"></div>/**
+ * 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;</pre>
</body>
</html>
\ No newline at end of file