X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/3789b528d8dd8aad4558e38e22d775bcab1cbd36..6746dc89c47ed01b165cc1152533605f97eb8e8d:/docs/source/Tip2.html diff --git a/docs/source/Tip2.html b/docs/source/Tip2.html index dfd6f75e..6f24dae8 100644 --- a/docs/source/Tip2.html +++ b/docs/source/Tip2.html @@ -15,81 +15,82 @@ -
/**
- * @class Ext.slider.Tip
- * @extends Ext.tip.Tip
- * Simple plugin for using an Ext.tip.Tip with a slider to show the slider value. In general this
- * class is not created directly, instead pass the {@link Ext.slider.Multi#useTips} and 
- * {@link Ext.slider.Multi#tipText} configuration options to the slider directly.
- * {@img Ext.slider.Tip/Ext.slider.Tip1.png Ext.slider.Tip component}
- * Example usage:
-<pre>
-    Ext.create('Ext.slider.Single', {
-        width: 214,
-        minValue: 0,
-        maxValue: 100,
-        useTips: true,
-        renderTo: Ext.getBody()
-    });   
-</pre>
- * Optionally provide your own tip text by passing tipText:
- <pre>
- new Ext.slider.Single({
-     width: 214,
-     minValue: 0,
-     maxValue: 100,
-     useTips: true,
-     tipText: function(thumb){
-         return Ext.String.format('<b>{0}% complete</b>', thumb.value);
-     }
- });
- </pre>
- * @xtype slidertip
+  /**
+ * Component layout for Tip/ToolTip/etc. components
+ * @class Ext.layout.component.Tip
+ * @extends Ext.layout.component.Dock
+ * @private
  */
-Ext.define('Ext.slider.Tip', {
-    extend: 'Ext.tip.Tip',
-    minWidth: 10,
-    alias: 'widget.slidertip',
-    offsets : [0, -10],
+
+Ext.define('Ext.layout.component.Tip', {
+
+    /* Begin Definitions */
+
+    alias: ['layout.tip'],
+
+    extend: 'Ext.layout.component.Dock',
+
+    /* End Definitions */
+
+    type: 'tip',
     
-    isSliderTip: true,
+    onLayout: function(width, height) {
+        var me = this,
+            owner = me.owner,
+            el = owner.el,
+            minWidth,
+            maxWidth,
+            naturalWidth,
+            constrainedWidth,
+            xy = el.getXY();
 
-    init: function(slider) {
-        var me = this;
-        
-        slider.on({
-            scope    : me,
-            dragstart: me.onSlide,
-            drag     : me.onSlide,
-            dragend  : me.hide,
-            destroy  : me.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) {
-        var me = this;
-        me.show();
-        me.update(me.getText(thumb));
-        me.doComponentLayout();
-        me.el.alignTo(thumb.el, 'b-t?', me.offsets);
-    },
+        // Position offscreen so the natural width is not affected by the viewport's right edge
+        el.setXY([-9999,-9999]);
+
+        // Calculate initial layout
+        this.callParent(arguments);
 
-    /**
-     * 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);
+        // Handle min/maxWidth for auto-width tips
+        if (!Ext.isNumber(width)) {
+            minWidth = owner.minWidth;
+            maxWidth = owner.maxWidth;
+            // IE6/7 in strict mode have a problem doing an autoWidth
+            if (Ext.isStrict && (Ext.isIE6 || Ext.isIE7)) {
+                constrainedWidth = me.doAutoWidth();
+            } else {
+                naturalWidth = el.getWidth();
+            }
+            if (naturalWidth < minWidth) {
+                constrainedWidth = minWidth;
+            }
+            else if (naturalWidth > maxWidth) {
+                constrainedWidth = maxWidth;
+            }
+            if (constrainedWidth) {
+                this.callParent([constrainedWidth, height]);
+            }
+        }
+
+        // Restore position
+        el.setXY(xy);
+    },
+    
+    doAutoWidth: function(){
+        var me = this,
+            owner = me.owner,
+            body = owner.body,
+            width = body.getTextWidth();
+            
+        if (owner.header) {
+            width = Math.max(width, owner.header.getWidth());
+        }
+        if (!Ext.isDefined(me.frameWidth)) {
+            me.frameWidth = owner.el.getWidth() - body.getWidth();
+        }
+        width += me.frameWidth + body.getPadding('lr');
+        return width;
     }
-});
+});
+