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

源码开发语言/平台
当前位置：首页 > 源码/资料 > 中间件编程 > 查看源码
pkg-tips-debug.js
资源名称：ext-3.0.0.zip　[点击查看]
上传用户：shuoshiled
上传日期：2018-01-28
资源大小：10124k
文件大小：34k
源码类别：

中间件编程

开发平台：

JavaScript

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