开通博客赚积分
发布资源赚积分
分类

源码开发语言/平台
当前位置：首页 > 源码/资料 > Java编程 > JavaScript > 查看源码
pkg-tips-debug.js
资源名称：ext-3.1.0.zip　[点击查看]
上传用户：dawnssy
上传日期：2022-08-06
资源大小：9345k
文件大小：36k
源码类别：

JavaScript

开发平台：

JavaScript

pkg-tips-debug.js：源码内容
  1. /*!  * Ext JS Library 3.1.0  * Copyright(c) 2006-2009 Ext JS, LLC  * licensing@extjs.com  * http://www.extjs.com/license  */ /**
  2.  * @class Ext.Tip
  3.  * @extends Ext.Panel
  4.  * @xtype tip
  5.  * This is the base class for {@link Ext.QuickTip} and {@link Ext.Tooltip} that provides the basic layout and
  6.  * positioning that all tip-based classes require. This class can be used directly for simple, statically-positioned
  7.  * tips that are displayed programmatically, or it can be extended to provide custom tip implementations.
  8.  * @constructor
  9.  * Create a new Tip
  10.  * @param {Object} config The configuration options
  11.  */
  12. Ext.Tip = Ext.extend(Ext.Panel, {
  13.     /**
  14.      * @cfg {Boolean} closable True to render a close tool button into the tooltip header (defaults to false).
  15.      */
  16.     /**
  17.      * @cfg {Number} width
  18.      * Width in pixels of the tip (defaults to auto).  Width will be ignored if it exceeds the bounds of
  19.      * {@link #minWidth} or {@link #maxWidth}.  The maximum supported value is 500.
  20.      */
  21.     /**
  22.      * @cfg {Number} minWidth The minimum width of the tip in pixels (defaults to 40).
  23.      */
  24.     minWidth : 40,
  25.     /**
  26.      * @cfg {Number} maxWidth The maximum width of the tip in pixels (defaults to 300).  The maximum supported value is 500.
  27.      */
  28.     maxWidth : 300,
  29.     /**
  30.      * @cfg {Boolean/String} shadow True or "sides" for the default effect, "frame" for 4-way shadow, and "drop"
  31.      * for bottom-right shadow (defaults to "sides").
  32.      */
  33.     shadow : "sides",
  34.     /**
  35.      * @cfg {String} defaultAlign <b>Experimental</b>. The default {@link Ext.Element#alignTo} anchor position value
  36.      * for this tip relative to its element of origin (defaults to "tl-bl?").
  37.      */
  38.     defaultAlign : "tl-bl?",
  39.     autoRender: true,
  40.     quickShowInterval : 250,
  42.     // private panel overrides
  43.     frame:true,
  44.     hidden:true,
  45.     baseCls: 'x-tip',
  46.     floating:{shadow:true,shim:true,useDisplay:true,constrain:false},
  47.     autoHeight:true,
  49.     closeAction: 'hide',
  51.     // private
  52.     initComponent : function(){
  53.         Ext.Tip.superclass.initComponent.call(this);
  54.         if(this.closable && !this.title){
  55.             this.elements += ',header';
  56.         }
  57.     },
  59.     // private
  60.     afterRender : function(){
  61.         Ext.Tip.superclass.afterRender.call(this);
  62.         if(this.closable){
  63.             this.addTool({
  64.                 id: 'close',
  65.                 handler: this[this.closeAction],
  66.                 scope: this
  67.             });
  68.         }
  69.     },
  71.     /**
  72.      * Shows this tip at the specified XY position.  Example usage:
  73.      * <pre><code>
  74. // Show the tip at x:50 and y:100
  75. tip.showAt([50,100]);
  76. </code></pre>
  77.      * @param {Array} xy An array containing the x and y coordinates
  78.      */
  79.     showAt : function(xy){
  80.         Ext.Tip.superclass.show.call(this);
  81.         if(this.measureWidth !== false && (!this.initialConfig || typeof this.initialConfig.width != 'number')){
  82.             this.doAutoWidth();
  83.         }
  84.         if(this.constrainPosition){
  85.             xy = this.el.adjustForConstraints(xy);
  86.         }
  87.         this.setPagePosition(xy[0], xy[1]);
  88.     },
  90.     // protected
  91.     doAutoWidth : function(adjust){
  92.         adjust = adjust || 0;
  93.         var bw = this.body.getTextWidth();
  94.         if(this.title){
  95.             bw = Math.max(bw, this.header.child('span').getTextWidth(this.title));
  96.         }
  97.         bw += this.getFrameWidth() + (this.closable ? 20 : 0) + this.body.getPadding("lr") + adjust;
  98.         this.setWidth(bw.constrain(this.minWidth, this.maxWidth));
  99.         
  100.         // IE7 repaint bug on initial show
  101.         if(Ext.isIE7 && !this.repainted){
  102.             this.el.repaint();
  103.             this.repainted = true;
  104.         }
  105.     },
  107.     /**
  108.      * <b>Experimental</b>. Shows this tip at a position relative to another element using a standard {@link Ext.Element#alignTo}
  109.      * anchor position value.  Example usage:
  110.      * <pre><code>
  111. // Show the tip at the default position ('tl-br?')
  112. tip.showBy('my-el');
  114. // Show the tip's top-left corner anchored to the element's top-right corner
  115. tip.showBy('my-el', 'tl-tr');
  116. </code></pre>
  117.      * @param {Mixed} el An HTMLElement, Ext.Element or string id of the target element to align to
  118.      * @param {String} position (optional) A valid {@link Ext.Element#alignTo} anchor position (defaults to 'tl-br?' or
  119.      * {@link #defaultAlign} if specified).
  120.      */
  121.     showBy : function(el, pos){
  122.         if(!this.rendered){
  123.             this.render(Ext.getBody());
  124.         }
  125.         this.showAt(this.el.getAlignToXY(el, pos || this.defaultAlign));
  126.     },
  128.     initDraggable : function(){
  129.         this.dd = new Ext.Tip.DD(this, typeof this.draggable == 'boolean' ? null : this.draggable);
  130.         this.header.addClass('x-tip-draggable');
  131.     }
  132. });
  134. Ext.reg('tip', Ext.Tip);
  136. // private - custom Tip DD implementation
  137. Ext.Tip.DD = function(tip, config){
  138.     Ext.apply(this, config);
  139.     this.tip = tip;
  140.     Ext.Tip.DD.superclass.constructor.call(this, tip.el.id, 'WindowDD-'+tip.id);
  141.     this.setHandleElId(tip.header.id);
  142.     this.scroll = false;
  143. };
  145. Ext.extend(Ext.Tip.DD, Ext.dd.DD, {
  146.     moveOnly:true,
  147.     scroll:false,
  148.     headerOffsets:[100, 25],
  149.     startDrag : function(){
  150.         this.tip.el.disableShadow();
  151.     },
  152.     endDrag : function(e){
  153.         this.tip.el.enableShadow(true);
  154.     }
  155. });/**
  156.  * @class Ext.ToolTip
  157.  * @extends Ext.Tip
  158.  * A standard tooltip implementation for providing additional information when hovering over a target element.
  159.  * @xtype tooltip
  160.  * @constructor
  161.  * Create a new Tooltip
  162.  * @param {Object} config The configuration options
  163.  */
  164. Ext.ToolTip = Ext.extend(Ext.Tip, {
  165.     /**
  166.      * When a Tooltip is configured with the <code>{@link #delegate}</code>
  167.      * option to cause selected child elements of the <code>{@link #target}</code>
  168.      * Element to each trigger a seperate show event, this property is set to
  169.      * the DOM element which triggered the show.
  170.      * @type DOMElement
  171.      * @property triggerElement
  172.      */
  173.     /**
  174.      * @cfg {Mixed} target The target HTMLElement, Ext.Element or id to monitor
  175.      * for mouseover events to trigger showing this ToolTip.
  176.      */
  177.     /**
  178.      * @cfg {Boolean} autoHide True to automatically hide the tooltip after the
  179.      * mouse exits the target element or after the <code>{@link #dismissDelay}</code>
  180.      * has expired if set (defaults to true).  If <code>{@link closable} = true</code>
  181.      * a close tool button will be rendered into the tooltip header.
  182.      */
  183.     /**
  184.      * @cfg {Number} showDelay Delay in milliseconds before the tooltip displays
  185.      * after the mouse enters the target element (defaults to 500)
  186.      */
  187.     showDelay : 500,
  188.     /**
  189.      * @cfg {Number} hideDelay Delay in milliseconds after the mouse exits the
  190.      * target element but before the tooltip actually hides (defaults to 200).
  191.      * Set to 0 for the tooltip to hide immediately.
  192.      */
  193.     hideDelay : 200,
  194.     /**
  195.      * @cfg {Number} dismissDelay Delay in milliseconds before the tooltip
  196.      * automatically hides (defaults to 5000). To disable automatic hiding, set
  197.      * dismissDelay = 0.
  198.      */
  199.     dismissDelay : 5000,
  200.     /**
  201.      * @cfg {Array} mouseOffset An XY offset from the mouse position where the
  202.      * tooltip should be shown (defaults to [15,18]).
  203.      */
  204.     /**
  205.      * @cfg {Boolean} trackMouse True to have the tooltip follow the mouse as it
  206.      * moves over the target element (defaults to false).
  207.      */
  208.     trackMouse : false,
  209.     /**
  210.      * @cfg {Boolean} anchorToTarget True to anchor the tooltip to the target
  211.      * element, false to anchor it relative to the mouse coordinates (defaults
  212.      * to true).  When <code>anchorToTarget</code> is true, use
  213.      * <code>{@link #defaultAlign}</code> to control tooltip alignment to the
  214.      * target element.  When <code>anchorToTarget</code> is false, use
  215.      * <code>{@link #anchorPosition}</code> instead to control alignment.
  216.      */
  217.     anchorToTarget : true,
  218.     /**
  219.      * @cfg {Number} anchorOffset A numeric pixel value used to offset the
  220.      * default position of the anchor arrow (defaults to 0).  When the anchor
  221.      * position is on the top or bottom of the tooltip, <code>anchorOffset</code>
  222.      * will be used as a horizontal offset.  Likewise, when the anchor position
  223.      * is on the left or right side, <code>anchorOffset</code> will be used as
  224.      * a vertical offset.
  225.      */
  226.     anchorOffset : 0,
  227.     /**
  228.      * @cfg {String} delegate <p>Optional. A {@link Ext.DomQuery DomQuery}
  229.      * selector which allows selection of individual elements within the
  230.      * <code>{@link #target}</code> element to trigger showing and hiding the
  231.      * ToolTip as the mouse moves within the target.</p>
  232.      * <p>When specified, the child element of the target which caused a show
  233.      * event is placed into the <code>{@link #triggerElement}</code> property
  234.      * before the ToolTip is shown.</p>
  235.      * <p>This may be useful when a Component has regular, repeating elements
  236.      * in it, each of which need a Tooltip which contains information specific
  237.      * to that element. For example:</p><pre><code>
  238. var myGrid = new Ext.grid.gridPanel(gridConfig);
  239. myGrid.on('render', function(grid) {
  240.     var store = grid.getStore();  // Capture the Store.
  241.     var view = grid.getView();    // Capture the GridView.
  242.     myGrid.tip = new Ext.ToolTip({
  243.         target: view.mainBody,    // The overall target element.
  244.         delegate: '.x-grid3-row', // Each grid row causes its own seperate show and hide.
  245.         trackMouse: true,         // Moving within the row should not hide the tip.
  246.         renderTo: document.body,  // Render immediately so that tip.body can be
  247.                                   //  referenced prior to the first show.
  248.         listeners: {              // Change content dynamically depending on which element
  249.                                   //  triggered the show.
  250.             beforeshow: function updateTipBody(tip) {
  251.                 var rowIndex = view.findRowIndex(tip.triggerElement);
  252.                 tip.body.dom.innerHTML = 'Over Record ID ' + store.getAt(rowIndex).id;
  253.             }
  254.         }
  255.     });
  256. });
  257.      *</code></pre>
  258.      */
  260.     // private
  261.     targetCounter : 0,
  263.     constrainPosition : false,
  265.     // private
  266.     initComponent : function(){
  267.         Ext.ToolTip.superclass.initComponent.call(this);
  268.         this.lastActive = new Date();
  269.         this.initTarget(this.target);
  270.         this.origAnchor = this.anchor;
  271.     },
  273.     // private
  274.     onRender : function(ct, position){
  275.         Ext.ToolTip.superclass.onRender.call(this, ct, position);
  276.         this.anchorCls = 'x-tip-anchor-' + this.getAnchorPosition();
  277.         this.anchorEl = this.el.createChild({
  278.             cls: 'x-tip-anchor ' + this.anchorCls
  279.         });
  280.     },
  282.     // private
  283.     afterRender : function(){
  284.         Ext.ToolTip.superclass.afterRender.call(this);
  285.         this.anchorEl.setStyle('z-index', this.el.getZIndex() + 1);
  286.     },
  288.     /**
  289.      * Binds this ToolTip to the specified element. The tooltip will be displayed when the mouse moves over the element.
  290.      * @param {Mixed} t The Element, HtmlElement, or ID of an element to bind to
  291.      */
  292.     initTarget : function(target){
  293.         var t;
  294.         if((t = Ext.get(target))){
  295.             if(this.target){
  296.                 var tg = Ext.get(this.target);
  297.                 this.mun(tg, 'mouseover', this.onTargetOver, this);
  298.                 this.mun(tg, 'mouseout', this.onTargetOut, this);
  299.                 this.mun(tg, 'mousemove', this.onMouseMove, this);
  300.             }
  301.             this.mon(t, {
  302.                 mouseover: this.onTargetOver,
  303.                 mouseout: this.onTargetOut,
  304.                 mousemove: this.onMouseMove,
  305.                 scope: this
  306.             });
  307.             this.target = t;
  308.         }
  309.         if(this.anchor){
  310.             this.anchorTarget = this.target;
  311.         }
  312.     },
  314.     // private
  315.     onMouseMove : function(e){
  316.         var t = this.delegate ? e.getTarget(this.delegate) : this.triggerElement = true;
  317.         if (t) {
  318.             this.targetXY = e.getXY();
  319.             if (t === this.triggerElement) {
  320.                 if(!this.hidden && this.trackMouse){
  321.                     this.setPagePosition(this.getTargetXY());
  322.                 }
  323.             } else {
  324.                 this.hide();
  325.                 this.lastActive = new Date(0);
  326.                 this.onTargetOver(e);
  327.             }
  328.         } else if (!this.closable && this.isVisible()) {
  329.             this.hide();
  330.         }
  331.     },
  333.     // private
  334.     getTargetXY : function(){
  335.         if(this.delegate){
  336.             this.anchorTarget = this.triggerElement;
  337.         }
  338.         if(this.anchor){
  339.             this.targetCounter++;
  340.             var offsets = this.getOffsets(),
  341.                 xy = (this.anchorToTarget && !this.trackMouse) ? this.el.getAlignToXY(this.anchorTarget, this.getAnchorAlign()) : this.targetXY,
  342.                 dw = Ext.lib.Dom.getViewWidth() - 5,
  343.                 dh = Ext.lib.Dom.getViewHeight() - 5,
  344.                 de = document.documentElement,
  345.                 bd = document.body,
  346.                 scrollX = (de.scrollLeft || bd.scrollLeft || 0) + 5,
  347.                 scrollY = (de.scrollTop || bd.scrollTop || 0) + 5,
  348.                 axy = [xy[0] + offsets[0], xy[1] + offsets[1]]
  349.                 sz = this.getSize();
  350.                 
  351.             this.anchorEl.removeClass(this.anchorCls);
  353.             if(this.targetCounter < 2){
  354.                 if(axy[0] < scrollX){
  355.                     if(this.anchorToTarget){
  356.                         this.defaultAlign = 'l-r';
  357.                         if(this.mouseOffset){this.mouseOffset[0] *= -1;}
  358.                     }
  359.                     this.anchor = 'left';
  360.                     return this.getTargetXY();
  361.                 }
  362.                 if(axy[0]+sz.width > dw){
  363.                     if(this.anchorToTarget){
  364.                         this.defaultAlign = 'r-l';
  365.                         if(this.mouseOffset){this.mouseOffset[0] *= -1;}
  366.                     }
  367.                     this.anchor = 'right';
  368.                     return this.getTargetXY();
  369.                 }
  370.                 if(axy[1] < scrollY){
  371.                     if(this.anchorToTarget){
  372.                         this.defaultAlign = 't-b';
  373.                         if(this.mouseOffset){this.mouseOffset[1] *= -1;}
  374.                     }
  375.                     this.anchor = 'top';
  376.                     return this.getTargetXY();
  377.                 }
  378.                 if(axy[1]+sz.height > dh){
  379.                     if(this.anchorToTarget){
  380.                         this.defaultAlign = 'b-t';
  381.                         if(this.mouseOffset){this.mouseOffset[1] *= -1;}
  382.                     }
  383.                     this.anchor = 'bottom';
  384.                     return this.getTargetXY();
  385.                 }
  386.             }
  388.             this.anchorCls = 'x-tip-anchor-'+this.getAnchorPosition();
  389.             this.anchorEl.addClass(this.anchorCls);
  390.             this.targetCounter = 0;
  391.             return axy;
  392.         }else{
  393.             var mouseOffset = this.getMouseOffset();
  394.             return [this.targetXY[0]+mouseOffset[0], this.targetXY[1]+mouseOffset[1]];
  395.         }
  396.     },
  398.     getMouseOffset : function(){
  399.         var offset = this.anchor ? [0,0] : [15,18];
  400.         if(this.mouseOffset){
  401.             offset[0] += this.mouseOffset[0];
  402.             offset[1] += this.mouseOffset[1];
  403.         }
  404.         return offset;
  405.     },
  407.     // private
  408.     getAnchorPosition : function(){
  409.         if(this.anchor){
  410.             this.tipAnchor = this.anchor.charAt(0);
  411.         }else{
  412.             var m = this.defaultAlign.match(/^([a-z]+)-([a-z]+)(?)?$/);
  413.             if(!m){
  414.                throw 'AnchorTip.defaultAlign is invalid';
  415.             }
  416.             this.tipAnchor = m[1].charAt(0);
  417.         }
  419.         switch(this.tipAnchor){
  420.             case 't': return 'top';
  421.             case 'b': return 'bottom';
  422.             case 'r': return 'right';
  423.         }
  424.         return 'left';
  425.     },
  427.     // private
  428.     getAnchorAlign : function(){
  429.         switch(this.anchor){
  430.             case 'top'  : return 'tl-bl';
  431.             case 'left' : return 'tl-tr';
  432.             case 'right': return 'tr-tl';
  433.             default     : return 'bl-tl';
  434.         }
  435.     },
  437.     // private
  438.     getOffsets : function(){
  439.         var offsets, 
  440.             ap = this.getAnchorPosition().charAt(0);
  441.         if(this.anchorToTarget && !this.trackMouse){
  442.             switch(ap){
  443.                 case 't':
  444.                     offsets = [0, 9];
  445.                     break;
  446.                 case 'b':
  447.                     offsets = [0, -13];
  448.                     break;
  449.                 case 'r':
  450.                     offsets = [-13, 0];
  451.                     break;
  452.                 default:
  453.                     offsets = [9, 0];
  454.                     break;
  455.             }
  456.         }else{
  457.             switch(ap){
  458.                 case 't':
  459.                     offsets = [-15-this.anchorOffset, 30];
  460.                     break;
  461.                 case 'b':
  462.                     offsets = [-19-this.anchorOffset, -13-this.el.dom.offsetHeight];
  463.                     break;
  464.                 case 'r':
  465.                     offsets = [-15-this.el.dom.offsetWidth, -13-this.anchorOffset];
  466.                     break;
  467.                 default:
  468.                     offsets = [25, -13-this.anchorOffset];
  469.                     break;
  470.             }
  471.         }
  472.         var mouseOffset = this.getMouseOffset();
  473.         offsets[0] += mouseOffset[0];
  474.         offsets[1] += mouseOffset[1];
  476.         return offsets;
  477.     },
  479.     // private
  480.     onTargetOver : function(e){
  481.         if(this.disabled || e.within(this.target.dom, true)){
  482.             return;
  483.         }
  484.         var t = e.getTarget(this.delegate);
  485.         if (t) {
  486.             this.triggerElement = t;
  487.             this.clearTimer('hide');
  488.             this.targetXY = e.getXY();
  489.             this.delayShow();
  490.         }
  491.     },
  493.     // private
  494.     delayShow : function(){
  495.         if(this.hidden && !this.showTimer){
  496.             if(this.lastActive.getElapsed() < this.quickShowInterval){
  497.                 this.show();
  498.             }else{
  499.                 this.showTimer = this.show.defer(this.showDelay, this);
  500.             }
  501.         }else if(!this.hidden && this.autoHide !== false){
  502.             this.show();
  503.         }
  504.     },
  506.     // private
  507.     onTargetOut : function(e){
  508.         if(this.disabled || e.within(this.target.dom, true)){
  509.             return;
  510.         }
  511.         this.clearTimer('show');
  512.         if(this.autoHide !== false){
  513.             this.delayHide();
  514.         }
  515.     },
  517.     // private
  518.     delayHide : function(){
  519.         if(!this.hidden && !this.hideTimer){
  520.             this.hideTimer = this.hide.defer(this.hideDelay, this);
  521.         }
  522.     },
  524.     /**
  525.      * Hides this tooltip if visible.
  526.      */
  527.     hide: function(){
  528.         this.clearTimer('dismiss');
  529.         this.lastActive = new Date();
  530.         if(this.anchorEl){
  531.             this.anchorEl.hide();
  532.         }
  533.         Ext.ToolTip.superclass.hide.call(this);
  534.         delete this.triggerElement;
  535.     },
  537.     /**
  538.      * Shows this tooltip at the current event target XY position.
  539.      */
  540.     show : function(){
  541.         if(this.anchor){
  542.             // pre-show it off screen so that the el will have dimensions
  543.             // for positioning calcs when getting xy next
  544.             this.showAt([-1000,-1000]);
  545.             this.origConstrainPosition = this.constrainPosition;
  546.             this.constrainPosition = false;
  547.             this.anchor = this.origAnchor;
  548.         }
  549.         this.showAt(this.getTargetXY());
  551.         if(this.anchor){
  552.             this.syncAnchor();
  553.             this.anchorEl.show();
  554.             this.constrainPosition = this.origConstrainPosition;
  555.         }else{
  556.             this.anchorEl.hide();
  557.         }
  558.     },
  560.     // inherit docs
  561.     showAt : function(xy){
  562.         this.lastActive = new Date();
  563.         this.clearTimers();
  564.         Ext.ToolTip.superclass.showAt.call(this, xy);
  565.         if(this.dismissDelay && this.autoHide !== false){
  566.             this.dismissTimer = this.hide.defer(this.dismissDelay, this);
  567.         }
  568.         if(this.anchor && !this.anchorEl.isVisible()){
  569.             this.syncAnchor();
  570.             this.anchorEl.show();
  571.         }
  572.     },
  574.     // private
  575.     syncAnchor : function(){
  576.         var anchorPos, targetPos, offset;
  577.         switch(this.tipAnchor.charAt(0)){
  578.             case 't':
  579.                 anchorPos = 'b';
  580.                 targetPos = 'tl';
  581.                 offset = [20+this.anchorOffset, 2];
  582.                 break;
  583.             case 'r':
  584.                 anchorPos = 'l';
  585.                 targetPos = 'tr';
  586.                 offset = [-2, 11+this.anchorOffset];
  587.                 break;
  588.             case 'b':
  589.                 anchorPos = 't';
  590.                 targetPos = 'bl';
  591.                 offset = [20+this.anchorOffset, -2];
  592.                 break;
  593.             default:
  594.                 anchorPos = 'r';
  595.                 targetPos = 'tl';
  596.                 offset = [2, 11+this.anchorOffset];
  597.                 break;
  598.         }
  599.         this.anchorEl.alignTo(this.el, anchorPos+'-'+targetPos, offset);
  600.     },
  602.     // private
  603.     setPagePosition : function(x, y){
  604.         Ext.ToolTip.superclass.setPagePosition.call(this, x, y);
  605.         if(this.anchor){
  606.             this.syncAnchor();
  607.         }
  608.     },
  610.     // private
  611.     clearTimer : function(name){
  612.         name = name + 'Timer';
  613.         clearTimeout(this[name]);
  614.         delete this[name];
  615.     },
  617.     // private
  618.     clearTimers : function(){
  619.         this.clearTimer('show');
  620.         this.clearTimer('dismiss');
  621.         this.clearTimer('hide');
  622.     },
  624.     // private
  625.     onShow : function(){
  626.         Ext.ToolTip.superclass.onShow.call(this);
  627.         Ext.getDoc().on('mousedown', this.onDocMouseDown, this);
  628.     },
  630.     // private
  631.     onHide : function(){
  632.         Ext.ToolTip.superclass.onHide.call(this);
  633.         Ext.getDoc().un('mousedown', this.onDocMouseDown, this);
  634.     },
  636.     // private
  637.     onDocMouseDown : function(e){
  638.         if(this.autoHide !== true && !this.closable && !e.within(this.el.dom)){
  639.             this.disable();
  640.             this.enable.defer(100, this);
  641.         }
  642.     },
  644.     // private
  645.     onDisable : function(){
  646.         this.clearTimers();
  647.         this.hide();
  648.     },
  650.     // private
  651.     adjustPosition : function(x, y){
  652.         if(this.contstrainPosition){
  653.             var ay = this.targetXY[1], h = this.getSize().height;
  654.             if(y <= ay && (y+h) >= ay){
  655.                 y = ay-h-5;
  656.             }
  657.         }
  658.         return {x : x, y: y};
  659.     },
  660.     
  661.     beforeDestroy : function(){
  662.         this.clearTimers();
  663.         Ext.destroy(this.anchorEl);
  664.         delete this.anchorEl;
  665.         delete this.target;
  666.         delete this.anchorTarget;
  667.         delete this.triggerElement;
  668.         Ext.ToolTip.superclass.beforeDestroy.call(this);    
  669.     },
  671.     // private
  672.     onDestroy : function(){
  673.         Ext.getDoc().un('mousedown', this.onDocMouseDown, this);
  674.         Ext.ToolTip.superclass.onDestroy.call(this);
  675.     }
  676. });
  678. Ext.reg('tooltip', Ext.ToolTip);/**
  679.  * @class Ext.QuickTip
  680.  * @extends Ext.ToolTip
  681.  * @xtype quicktip
  682.  * A specialized tooltip class for tooltips that can be specified in markup and automatically managed by the global
  683.  * {@link Ext.QuickTips} instance.  See the QuickTips class header for additional usage details and examples.
  684.  * @constructor
  685.  * Create a new Tip
  686.  * @param {Object} config The configuration options
  687.  */
  688. Ext.QuickTip = Ext.extend(Ext.ToolTip, {
  689.     /**
  690.      * @cfg {Mixed} target The target HTMLElement, Ext.Element or id to associate with this quicktip (defaults to the document).
  691.      */
  692.     /**
  693.      * @cfg {Boolean} interceptTitles True to automatically use the element's DOM title value if available (defaults to false).
  694.      */
  695.     interceptTitles : false,
  697.     // private
  698.     tagConfig : {
  699.         namespace : "ext",
  700.         attribute : "qtip",
  701.         width : "qwidth",
  702.         target : "target",
  703.         title : "qtitle",
  704.         hide : "hide",
  705.         cls : "qclass",
  706.         align : "qalign",
  707.         anchor : "anchor"
  708.     },
  710.     // private
  711.     initComponent : function(){
  712.         this.target = this.target || Ext.getDoc();
  713.         this.targets = this.targets || {};
  714.         Ext.QuickTip.superclass.initComponent.call(this);
  715.     },
  717.     /**
  718.      * Configures a new quick tip instance and assigns it to a target element.  The following config values are
  719.      * supported (for example usage, see the {@link Ext.QuickTips} class header):
  720.      * <div class="mdetail-params"><ul>
  721.      * <li>autoHide</li>
  722.      * <li>cls</li>
  723.      * <li>dismissDelay (overrides the singleton value)</li>
  724.      * <li>target (required)</li>
  725.      * <li>text (required)</li>
  726.      * <li>title</li>
  727.      * <li>width</li></ul></div>
  728.      * @param {Object} config The config object
  729.      */
  730.     register : function(config){
  731.         var cs = Ext.isArray(config) ? config : arguments;
  732.         for(var i = 0, len = cs.length; i < len; i++){
  733.             var c = cs[i];
  734.             var target = c.target;
  735.             if(target){
  736.                 if(Ext.isArray(target)){
  737.                     for(var j = 0, jlen = target.length; j < jlen; j++){
  738.                         this.targets[Ext.id(target[j])] = c;
  739.                     }
  740.                 } else{
  741.                     this.targets[Ext.id(target)] = c;
  742.                 }
  743.             }
  744.         }
  745.     },
  747.     /**
  748.      * Removes this quick tip from its element and destroys it.
  749.      * @param {String/HTMLElement/Element} el The element from which the quick tip is to be removed.
  750.      */
  751.     unregister : function(el){
  752.         delete this.targets[Ext.id(el)];
  753.     },
  754.     
  755.     /**
  756.      * Hides a visible tip or cancels an impending show for a particular element.
  757.      * @param {String/HTMLElement/Element} el The element that is the target of the tip.
  758.      */
  759.     cancelShow: function(el){
  760.         var at = this.activeTarget;
  761.         el = Ext.get(el).dom;
  762.         if(this.isVisible()){
  763.             if(at && at.el == el){
  764.                 this.hide();
  765.             }
  766.         }else if(at && at.el == el){
  767.             this.clearTimer('show');
  768.         }
  769.     },
  770.     
  771.     getTipCfg: function(e) {
  772.         var t = e.getTarget(), 
  773.             ttp, 
  774.             cfg;
  775.         if(this.interceptTitles && t.title && Ext.isString(t.title)){
  776.             ttp = t.title;
  777.             t.qtip = ttp;
  778.             t.removeAttribute("title");
  779.             e.preventDefault();
  780.         }else{
  781.             cfg = this.tagConfig;
  782.             ttp = t.qtip || Ext.fly(t).getAttribute(cfg.attribute, cfg.namespace);
  783.         }
  784.         return ttp;
  785.     },
  787.     // private
  788.     onTargetOver : function(e){
  789.         if(this.disabled){
  790.             return;
  791.         }
  792.         this.targetXY = e.getXY();
  793.         var t = e.getTarget();
  794.         if(!t || t.nodeType !== 1 || t == document || t == document.body){
  795.             return;
  796.         }
  797.         if(this.activeTarget && ((t == this.activeTarget.el) || Ext.fly(this.activeTarget.el).contains(t))){
  798.             this.clearTimer('hide');
  799.             this.show();
  800.             return;
  801.         }
  802.         if(t && this.targets[t.id]){
  803.             this.activeTarget = this.targets[t.id];
  804.             this.activeTarget.el = t;
  805.             this.anchor = this.activeTarget.anchor;
  806.             if(this.anchor){
  807.                 this.anchorTarget = t;
  808.             }
  809.             this.delayShow();
  810.             return;
  811.         }
  812.         var ttp, et = Ext.fly(t), cfg = this.tagConfig, ns = cfg.namespace;
  813.         if(ttp = this.getTipCfg(e)){
  814.             var autoHide = et.getAttribute(cfg.hide, ns);
  815.             this.activeTarget = {
  816.                 el: t,
  817.                 text: ttp,
  818.                 width: et.getAttribute(cfg.width, ns),
  819.                 autoHide: autoHide != "user" && autoHide !== 'false',
  820.                 title: et.getAttribute(cfg.title, ns),
  821.                 cls: et.getAttribute(cfg.cls, ns),
  822.                 align: et.getAttribute(cfg.align, ns)
  823.                 
  824.             };
  825.             this.anchor = et.getAttribute(cfg.anchor, ns);
  826.             if(this.anchor){
  827.                 this.anchorTarget = t;
  828.             }
  829.             this.delayShow();
  830.         }
  831.     },
  833.     // private
  834.     onTargetOut : function(e){
  836.         // If moving within the current target, and it does not have a new tip, ignore the mouseout
  837.         if (this.activeTarget && e.within(this.activeTarget.el) && !this.getTipCfg(e)) {
  838.             return;
  839.         }
  841.         this.clearTimer('show');
  842.         if(this.autoHide !== false){
  843.             this.delayHide();
  844.         }
  845.     },
  847.     // inherit docs
  848.     showAt : function(xy){
  849.         var t = this.activeTarget;
  850.         if(t){
  851.             if(!this.rendered){
  852.                 this.render(Ext.getBody());
  853.                 this.activeTarget = t;
  854.             }
  855.             if(t.width){
  856.                 this.setWidth(t.width);
  857.                 this.body.setWidth(this.adjustBodyWidth(t.width - this.getFrameWidth()));
  858.                 this.measureWidth = false;
  859.             } else{
  860.                 this.measureWidth = true;
  861.             }
  862.             this.setTitle(t.title || '');
  863.             this.body.update(t.text);
  864.             this.autoHide = t.autoHide;
  865.             this.dismissDelay = t.dismissDelay || this.dismissDelay;
  866.             if(this.lastCls){
  867.                 this.el.removeClass(this.lastCls);
  868.                 delete this.lastCls;
  869.             }
  870.             if(t.cls){
  871.                 this.el.addClass(t.cls);
  872.                 this.lastCls = t.cls;
  873.             }
  874.             if(this.anchor){
  875.                 this.constrainPosition = false;
  876.             }else if(t.align){ // TODO: this doesn't seem to work consistently
  877.                 xy = this.el.getAlignToXY(t.el, t.align);
  878.                 this.constrainPosition = false;
  879.             }else{
  880.                 this.constrainPosition = true;
  881.             }
  882.         }
  883.         Ext.QuickTip.superclass.showAt.call(this, xy);
  884.     },
  886.     // inherit docs
  887.     hide: function(){
  888.         delete this.activeTarget;
  889.         Ext.QuickTip.superclass.hide.call(this);
  890.     }
  891. });
  892. Ext.reg('quicktip', Ext.QuickTip);/**
  893.  * @class Ext.QuickTips
  894.  * <p>Provides attractive and customizable tooltips for any element. The QuickTips
  895.  * singleton is used to configure and manage tooltips globally for multiple elements
  896.  * in a generic manner.  To create individual tooltips with maximum customizability,
  897.  * you should consider either {@link Ext.Tip} or {@link Ext.ToolTip}.</p>
  898.  * <p>Quicktips can be configured via tag attributes directly in markup, or by
  899.  * registering quick tips programmatically via the {@link #register} method.</p>
  900.  * <p>The singleton's instance of {@link Ext.QuickTip} is available via
  901.  * {@link #getQuickTip}, and supports all the methods, and all the all the
  902.  * configuration properties of Ext.QuickTip. These settings will apply to all
  903.  * tooltips shown by the singleton.</p>
  904.  * <p>Below is the summary of the configuration properties which can be used.
  905.  * For detailed descriptions see {@link #getQuickTip}</p>
  906.  * <p><b>QuickTips singleton configs (all are optional)</b></p>
  907.  * <div class="mdetail-params"><ul><li>dismissDelay</li>
  908.  * <li>hideDelay</li>
  909.  * <li>maxWidth</li>
  910.  * <li>minWidth</li>
  911.  * <li>showDelay</li>
  912.  * <li>trackMouse</li></ul></div>
  913.  * <p><b>Target element configs (optional unless otherwise noted)</b></p>
  914.  * <div class="mdetail-params"><ul><li>autoHide</li>
  915.  * <li>cls</li>
  916.  * <li>dismissDelay (overrides singleton value)</li>
  917.  * <li>target (required)</li>
  918.  * <li>text (required)</li>
  919.  * <li>title</li>
  920.  * <li>width</li></ul></div>
  921.  * <p>Here is an example showing how some of these config options could be used:</p>
  922.  * <pre><code>
  923. // Init the singleton.  Any tag-based quick tips will start working.
  924. Ext.QuickTips.init();
  926. // Apply a set of config properties to the singleton
  927. Ext.apply(Ext.QuickTips.getQuickTip(), {
  928.     maxWidth: 200,
  929.     minWidth: 100,
  930.     showDelay: 50,
  931.     trackMouse: true
  932. });
  934. // Manually register a quick tip for a specific element
  935. Ext.QuickTips.register({
  936.     target: 'my-div',
  937.     title: 'My Tooltip',
  938.     text: 'This tooltip was added in code',
  939.     width: 100,
  940.     dismissDelay: 20
  941. });
  942. </code></pre>
  943.  * <p>To register a quick tip in markup, you simply add one or more of the valid QuickTip attributes prefixed with
  944.  * the <b>ext:</b> namespace.  The HTML element itself is automatically set as the quick tip target. Here is the summary
  945.  * of supported attributes (optional unless otherwise noted):</p>
  946.  * <ul><li><b>hide</b>: Specifying "user" is equivalent to setting autoHide = false.  Any other value will be the
  947.  * same as autoHide = true.</li>
  948.  * <li><b>qclass</b>: A CSS class to be applied to the quick tip (equivalent to the 'cls' target element config).</li>
  949.  * <li><b>qtip (required)</b>: The quick tip text (equivalent to the 'text' target element config).</li>
  950.  * <li><b>qtitle</b>: The quick tip title (equivalent to the 'title' target element config).</li>
  951.  * <li><b>qwidth</b>: The quick tip width (equivalent to the 'width' target element config).</li></ul>
  952.  * <p>Here is an example of configuring an HTML element to display a tooltip from markup:</p>
  953.  * <pre><code>
  954. // Add a quick tip to an HTML button
  955. &lt;input type="button" value="OK" ext:qtitle="OK Button" ext:qwidth="100"
  956.      ext:qtip="This is a quick tip from markup!">&lt;/input>
  957. </code></pre>
  958.  * @singleton
  959.  */
  960. Ext.QuickTips = function(){
  961.     var tip, locks = [];
  962.     return {
  963.         /**
  964.          * Initialize the global QuickTips instance and prepare any quick tips.
  965.          * @param {Boolean} autoRender True to render the QuickTips container immediately to preload images. (Defaults to true) 
  966.          */
  967.         init : function(autoRender){
  968.             if(!tip){
  969.                 if(!Ext.isReady){
  970.                     Ext.onReady(function(){
  971.                         Ext.QuickTips.init(autoRender);
  972.                     });
  973.                     return;
  974.                 }
  975.                 tip = new Ext.QuickTip({elements:'header,body'});
  976.                 if(autoRender !== false){
  977.                     tip.render(Ext.getBody());
  978.                 }
  979.             }
  980.         },
  982.         /**
  983.          * Enable quick tips globally.
  984.          */
  985.         enable : function(){
  986.             if(tip){
  987.                 locks.pop();
  988.                 if(locks.length < 1){
  989.                     tip.enable();
  990.                 }
  991.             }
  992.         },
  994.         /**
  995.          * Disable quick tips globally.
  996.          */
  997.         disable : function(){
  998.             if(tip){
  999.                 tip.disable();
  1000.             }
  1001.             locks.push(1);
  1002.         },
  1004.         /**
  1005.          * Returns true if quick tips are enabled, else false.
  1006.          * @return {Boolean}
  1007.          */
  1008.         isEnabled : function(){
  1009.             return tip !== undefined && !tip.disabled;
  1010.         },
  1012.         /**
  1013.          * Gets the global QuickTips instance.
  1014.          */
  1015.         getQuickTip : function(){
  1016.             return tip;
  1017.         },
  1019.         /**
  1020.          * Configures a new quick tip instance and assigns it to a target element.  See
  1021.          * {@link Ext.QuickTip#register} for details.
  1022.          * @param {Object} config The config object
  1023.          */
  1024.         register : function(){
  1025.             tip.register.apply(tip, arguments);
  1026.         },
  1028.         /**
  1029.          * Removes any registered quick tip from the target element and destroys it.
  1030.          * @param {String/HTMLElement/Element} el The element from which the quick tip is to be removed.
  1031.          */
  1032.         unregister : function(){
  1033.             tip.unregister.apply(tip, arguments);
  1034.         },
  1036.         /**
  1037.          * Alias of {@link #register}.
  1038.          * @param {Object} config The config object
  1039.          */
  1040.         tips :function(){
  1041.             tip.register.apply(tip, arguments);
  1042.         }
  1043.     }
  1044. }();