3 * Copyright(c) 2006-2010 Sencha Inc.
5 * http://www.sencha.com/license
11 * A specialized tooltip class for tooltips that can be specified in markup and automatically managed by the global
12 * {@link Ext.QuickTips} instance. See the QuickTips class header for additional usage details and examples.
15 * @param {Object} config The configuration options
17 Ext.QuickTip = Ext.extend(Ext.ToolTip, {
19 * @cfg {Mixed} target The target HTMLElement, Ext.Element or id to associate with this quicktip (defaults to the document).
22 * @cfg {Boolean} interceptTitles True to automatically use the element's DOM title value if available (defaults to false).
24 interceptTitles : false,
40 initComponent : function(){
41 this.target = this.target || Ext.getDoc();
42 this.targets = this.targets || {};
43 Ext.QuickTip.superclass.initComponent.call(this);
47 * Configures a new quick tip instance and assigns it to a target element. The following config values are
48 * supported (for example usage, see the {@link Ext.QuickTips} class header):
49 * <div class="mdetail-params"><ul>
52 * <li>dismissDelay (overrides the singleton value)</li>
53 * <li>target (required)</li>
54 * <li>text (required)</li>
56 * <li>width</li></ul></div>
57 * @param {Object} config The config object
59 register : function(config){
60 var cs = Ext.isArray(config) ? config : arguments;
61 for(var i = 0, len = cs.length; i < len; i++){
63 var target = c.target;
65 if(Ext.isArray(target)){
66 for(var j = 0, jlen = target.length; j < jlen; j++){
67 this.targets[Ext.id(target[j])] = c;
70 this.targets[Ext.id(target)] = c;
77 * Removes this quick tip from its element and destroys it.
78 * @param {String/HTMLElement/Element} el The element from which the quick tip is to be removed.
80 unregister : function(el){
81 delete this.targets[Ext.id(el)];
85 * Hides a visible tip or cancels an impending show for a particular element.
86 * @param {String/HTMLElement/Element} el The element that is the target of the tip.
88 cancelShow: function(el){
89 var at = this.activeTarget;
92 if(at && at.el == el){
95 }else if(at && at.el == el){
96 this.clearTimer('show');
100 getTipCfg: function(e) {
101 var t = e.getTarget(),
104 if(this.interceptTitles && t.title && Ext.isString(t.title)){
107 t.removeAttribute("title");
110 cfg = this.tagConfig;
111 ttp = t.qtip || Ext.fly(t).getAttribute(cfg.attribute, cfg.namespace);
117 onTargetOver : function(e){
121 this.targetXY = e.getXY();
122 var t = e.getTarget();
123 if(!t || t.nodeType !== 1 || t == document || t == document.body){
126 if(this.activeTarget && ((t == this.activeTarget.el) || Ext.fly(this.activeTarget.el).contains(t))){
127 this.clearTimer('hide');
131 if(t && this.targets[t.id]){
132 this.activeTarget = this.targets[t.id];
133 this.activeTarget.el = t;
134 this.anchor = this.activeTarget.anchor;
136 this.anchorTarget = t;
141 var ttp, et = Ext.fly(t), cfg = this.tagConfig, ns = cfg.namespace;
142 if(ttp = this.getTipCfg(e)){
143 var autoHide = et.getAttribute(cfg.hide, ns);
144 this.activeTarget = {
147 width: et.getAttribute(cfg.width, ns),
148 autoHide: autoHide != "user" && autoHide !== 'false',
149 title: et.getAttribute(cfg.title, ns),
150 cls: et.getAttribute(cfg.cls, ns),
151 align: et.getAttribute(cfg.align, ns)
154 this.anchor = et.getAttribute(cfg.anchor, ns);
156 this.anchorTarget = t;
163 onTargetOut : function(e){
165 // If moving within the current target, and it does not have a new tip, ignore the mouseout
166 if (this.activeTarget && e.within(this.activeTarget.el) && !this.getTipCfg(e)) {
170 this.clearTimer('show');
171 if(this.autoHide !== false){
177 showAt : function(xy){
178 var t = this.activeTarget;
181 this.render(Ext.getBody());
182 this.activeTarget = t;
185 this.setWidth(t.width);
186 this.body.setWidth(this.adjustBodyWidth(t.width - this.getFrameWidth()));
187 this.measureWidth = false;
189 this.measureWidth = true;
191 this.setTitle(t.title || '');
192 this.body.update(t.text);
193 this.autoHide = t.autoHide;
194 this.dismissDelay = t.dismissDelay || this.dismissDelay;
196 this.el.removeClass(this.lastCls);
200 this.el.addClass(t.cls);
201 this.lastCls = t.cls;
204 this.constrainPosition = false;
205 }else if(t.align){ // TODO: this doesn't seem to work consistently
206 xy = this.el.getAlignToXY(t.el, t.align);
207 this.constrainPosition = false;
209 this.constrainPosition = true;
212 Ext.QuickTip.superclass.showAt.call(this, xy);
217 delete this.activeTarget;
218 Ext.QuickTip.superclass.hide.call(this);
221 Ext.reg('quicktip', Ext.QuickTip);