QuickTip.js
上传用户:shuoshiled
上传日期:2018-01-28
资源大小:10124k
文件大小:7k
源码类别:

中间件编程

开发平台:

JavaScript

  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.QuickTip
  3.  * @extends Ext.ToolTip
  4.  * A specialized tooltip class for tooltips that can be specified in markup and automatically managed by the global
  5.  * {@link Ext.QuickTips} instance.  See the QuickTips class header for additional usage details and examples.
  6.  * @constructor
  7.  * Create a new Tip
  8.  * @param {Object} config The configuration options
  9.  */
  10. Ext.QuickTip = Ext.extend(Ext.ToolTip, {
  11.     /**
  12.      * @cfg {Mixed} target The target HTMLElement, Ext.Element or id to associate with this quicktip (defaults to the document).
  13.      */
  14.     /**
  15.      * @cfg {Boolean} interceptTitles True to automatically use the element's DOM title value if available (defaults to false).
  16.      */
  17.     interceptTitles : false,
  18.     // private
  19.     tagConfig : {
  20.         namespace : "ext",
  21.         attribute : "qtip",
  22.         width : "qwidth",
  23.         target : "target",
  24.         title : "qtitle",
  25.         hide : "hide",
  26.         cls : "qclass",
  27.         align : "qalign",
  28.         anchor : "anchor"
  29.     },
  30.     // private
  31.     initComponent : function(){
  32.         this.target = this.target || Ext.getDoc();
  33.         this.targets = this.targets || {};
  34.         Ext.QuickTip.superclass.initComponent.call(this);
  35.     },
  36.     /**
  37.      * Configures a new quick tip instance and assigns it to a target element.  The following config values are
  38.      * supported (for example usage, see the {@link Ext.QuickTips} class header):
  39.      * <div class="mdetail-params"><ul>
  40.      * <li>autoHide</li>
  41.      * <li>cls</li>
  42.      * <li>dismissDelay (overrides the singleton value)</li>
  43.      * <li>target (required)</li>
  44.      * <li>text (required)</li>
  45.      * <li>title</li>
  46.      * <li>width</li></ul></div>
  47.      * @param {Object} config The config object
  48.      */
  49.     register : function(config){
  50.         var cs = Ext.isArray(config) ? config : arguments;
  51.         for(var i = 0, len = cs.length; i < len; i++){
  52.             var c = cs[i];
  53.             var target = c.target;
  54.             if(target){
  55.                 if(Ext.isArray(target)){
  56.                     for(var j = 0, jlen = target.length; j < jlen; j++){
  57.                         this.targets[Ext.id(target[j])] = c;
  58.                     }
  59.                 } else{
  60.                     this.targets[Ext.id(target)] = c;
  61.                 }
  62.             }
  63.         }
  64.     },
  65.     /**
  66.      * Removes this quick tip from its element and destroys it.
  67.      * @param {String/HTMLElement/Element} el The element from which the quick tip is to be removed.
  68.      */
  69.     unregister : function(el){
  70.         delete this.targets[Ext.id(el)];
  71.     },
  72.     
  73.     /**
  74.      * Hides a visible tip or cancels an impending show for a particular element.
  75.      * @param {String/HTMLElement/Element} el The element that is the target of the tip.
  76.      */
  77.     cancelShow: function(el){
  78.         var at = this.activeTarget;
  79.         el = Ext.get(el).dom;
  80.         if(this.isVisible()){
  81.             if(at && at.el == el){
  82.                 this.hide();
  83.             }
  84.         }else if(at && at.el == el){
  85.             this.clearTimer('show');
  86.         }
  87.     },
  88.     // private
  89.     onTargetOver : function(e){
  90.         if(this.disabled){
  91.             return;
  92.         }
  93.         this.targetXY = e.getXY();
  94.         var t = e.getTarget();
  95.         if(!t || t.nodeType !== 1 || t == document || t == document.body){
  96.             return;
  97.         }
  98.         if(this.activeTarget && t == this.activeTarget.el){
  99.             this.clearTimer('hide');
  100.             this.show();
  101.             return;
  102.         }
  103.         if(t && this.targets[t.id]){
  104.             this.activeTarget = this.targets[t.id];
  105.             this.activeTarget.el = t;
  106.             this.anchor = this.activeTarget.anchor;
  107.             if(this.anchor){
  108.                 this.anchorTarget = t;
  109.             }
  110.             this.delayShow();
  111.             return;
  112.         }
  113.         
  114.         var ttp, et = Ext.fly(t), cfg = this.tagConfig;
  115.         var ns = cfg.namespace;
  116.         if(this.interceptTitles && t.title){
  117.             ttp = t.title;
  118.             t.qtip = ttp;
  119.             t.removeAttribute("title");
  120.             e.preventDefault();
  121.         } else{
  122.             ttp = t.qtip || et.getAttribute(cfg.attribute, ns);
  123.         }
  124.         if(ttp){
  125.             var autoHide = et.getAttribute(cfg.hide, ns);
  126.             this.activeTarget = {
  127.                 el: t,
  128.                 text: ttp,
  129.                 width: et.getAttribute(cfg.width, ns),
  130.                 autoHide: autoHide != "user" && autoHide !== 'false',
  131.                 title: et.getAttribute(cfg.title, ns),
  132.                 cls: et.getAttribute(cfg.cls, ns),
  133.                 align: et.getAttribute(cfg.align, ns)
  134.                 
  135.             };
  136.             this.anchor = et.getAttribute(cfg.anchor, ns);
  137.             if(this.anchor){
  138.                 this.anchorTarget = t;
  139.             }
  140.             this.delayShow();
  141.         }
  142.     },
  143.     // private
  144.     onTargetOut : function(e){
  145.         this.clearTimer('show');
  146.         if(this.autoHide !== false){
  147.             this.delayHide();
  148.         }
  149.     },
  150.     // inherit docs
  151.     showAt : function(xy){
  152.         var t = this.activeTarget;
  153.         if(t){
  154.             if(!this.rendered){
  155.                 this.render(Ext.getBody());
  156.                 this.activeTarget = t;
  157.             }
  158.             if(t.width){
  159.                 this.setWidth(t.width);
  160.                 this.body.setWidth(this.adjustBodyWidth(t.width - this.getFrameWidth()));
  161.                 this.measureWidth = false;
  162.             } else{
  163.                 this.measureWidth = true;
  164.             }
  165.             this.setTitle(t.title || '');
  166.             this.body.update(t.text);
  167.             this.autoHide = t.autoHide;
  168.             this.dismissDelay = t.dismissDelay || this.dismissDelay;
  169.             if(this.lastCls){
  170.                 this.el.removeClass(this.lastCls);
  171.                 delete this.lastCls;
  172.             }
  173.             if(t.cls){
  174.                 this.el.addClass(t.cls);
  175.                 this.lastCls = t.cls;
  176.             }
  177.             if(this.anchor){
  178.                 this.constrainPosition = false;
  179.             }else if(t.align){ // TODO: this doesn't seem to work consistently
  180.                 xy = this.el.getAlignToXY(t.el, t.align);
  181.                 this.constrainPosition = false;
  182.             }else{
  183.                 this.constrainPosition = true;
  184.             }
  185.         }
  186.         Ext.QuickTip.superclass.showAt.call(this, xy);
  187.     },
  188.     // inherit docs
  189.     hide: function(){
  190.         delete this.activeTarget;
  191.         Ext.QuickTip.superclass.hide.call(this);
  192.     }
  193. });