docs/source/QuickTip.html

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