1 <html><head><title>Roo/bootstrap/Tooltip.js</title><link rel="stylesheet" type="text/css" href="../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty"><span class="jsdoc-comment">/*
9 * @class Roo.bootstrap.Tooltip
10 * Bootstrap Tooltip class
11 * This is basic at present - all componets support it by default, however they should add tooltipEl() method
12 * to determine which dom element triggers the tooltip.
14 * It needs to add support for additional attributes like tooltip-position
18 * @param {Object} config The config object
21 </span><span class="jsdoc-var">Roo.bootstrap.Tooltip </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">){
22 </span><span class="jsdoc-var">Roo.bootstrap.Tooltip.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
24 </span><span class="jsdoc-var">this.alignment </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.bootstrap.Tooltip.alignment</span><span class="jsdoc-syntax">;
26 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config.alignment</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">){
27 </span><span class="jsdoc-var">this.alignment </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">config.alignment</span><span class="jsdoc-syntax">;
32 </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.Tooltip</span><span class="jsdoc-syntax">, {
33 </span><span class="jsdoc-comment">/**
34 * @function init initialize tooltip monitoring.
37 </span><span class="jsdoc-var">currentEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
38 </span><span class="jsdoc-var">currentTip </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
39 </span><span class="jsdoc-var">currentRegion </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
41 </span><span class="jsdoc-comment">// init : delay?
43 </span><span class="jsdoc-var">init </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
45 </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'mouseover'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.enter </span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
46 </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'mouseout'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.leave</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
49 </span><span class="jsdoc-var">this.currentTip </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.bootstrap.Tooltip</span><span class="jsdoc-syntax">();
52 </span><span class="jsdoc-var">enter </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ev</span><span class="jsdoc-syntax">)
54 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ev.getTarget</span><span class="jsdoc-syntax">();
56 </span><span class="jsdoc-comment">//Roo.log(['enter',dom]);
57 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.fly</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dom</span><span class="jsdoc-syntax">);
58 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.currentEl</span><span class="jsdoc-syntax">) {
59 </span><span class="jsdoc-comment">//Roo.log(dom);
60 //Roo.log(this.currentEl);
61 //Roo.log(this.currentEl.contains(dom));
62 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.currentEl </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">) {
63 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
65 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dom </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">this.currentEl.dom </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">this.currentEl.contains</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dom</span><span class="jsdoc-syntax">)) {
66 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
71 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.currentTip.el</span><span class="jsdoc-syntax">) {
72 </span><span class="jsdoc-var">this.currentTip.el.setVisibilityMode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.Element.DISPLAY</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.hide</span><span class="jsdoc-syntax">(); </span><span class="jsdoc-comment">// force hiding...
73 </span><span class="jsdoc-syntax">}
74 </span><span class="jsdoc-comment">//Roo.log(ev);
76 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">el.dom </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">document</span><span class="jsdoc-syntax">){
77 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
80 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">bindEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">;
82 </span><span class="jsdoc-comment">// you can not look for children, as if el is the body.. then everythign is the child..
83 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">el.attr</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'tooltip'</span><span class="jsdoc-syntax">)) { </span><span class="jsdoc-comment">//
84 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"[tooltip]"</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.elements.length</span><span class="jsdoc-syntax">) {
85 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
87 </span><span class="jsdoc-comment">// is the mouse over this child...?
88 </span><span class="jsdoc-var">bindEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"[tooltip]"</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
89 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">xy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ev.getXY</span><span class="jsdoc-syntax">();
90 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">bindEl.getRegion</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.contains</span><span class="jsdoc-syntax">( { </span><span class="jsdoc-var">top </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[1] ,</span><span class="jsdoc-var">right </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[0] , </span><span class="jsdoc-var">bottom </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[1], </span><span class="jsdoc-var">left </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[0]})) {
91 </span><span class="jsdoc-comment">//Roo.log("not in region.");
92 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
94 </span><span class="jsdoc-comment">//Roo.log("child element over..");
96 </span><span class="jsdoc-syntax">}
97 </span><span class="jsdoc-var">this.currentEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">bindEl</span><span class="jsdoc-syntax">;
98 </span><span class="jsdoc-var">this.currentTip.bind</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">bindEl</span><span class="jsdoc-syntax">);
99 </span><span class="jsdoc-var">this.currentRegion </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.lib.Region.getRegion</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dom</span><span class="jsdoc-syntax">);
100 </span><span class="jsdoc-var">this.currentTip.enter</span><span class="jsdoc-syntax">();
103 </span><span class="jsdoc-var">leave </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ev</span><span class="jsdoc-syntax">)
105 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ev.getTarget</span><span class="jsdoc-syntax">();
106 </span><span class="jsdoc-comment">//Roo.log(['leave',dom]);
107 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.currentEl</span><span class="jsdoc-syntax">) {
108 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
112 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dom </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">this.currentEl.dom</span><span class="jsdoc-syntax">) {
113 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
115 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">xy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ev.getXY</span><span class="jsdoc-syntax">();
116 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.currentRegion.contains</span><span class="jsdoc-syntax">( </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.lib.Region</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[1], </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[0] ,</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[1], </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[0] ))) {
117 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
119 </span><span class="jsdoc-comment">// only activate leave if mouse cursor is outside... bounding box..
124 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.currentTip</span><span class="jsdoc-syntax">) {
125 </span><span class="jsdoc-var">this.currentTip.leave</span><span class="jsdoc-syntax">();
127 </span><span class="jsdoc-comment">//Roo.log('clear currentEl');
128 </span><span class="jsdoc-var">this.currentEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
132 </span><span class="jsdoc-var">alignment </span><span class="jsdoc-syntax">: {
133 </span><span class="jsdoc-string">'left' </span><span class="jsdoc-syntax">: [</span><span class="jsdoc-string">'r-l'</span><span class="jsdoc-syntax">, [-2,0], </span><span class="jsdoc-string">'right'</span><span class="jsdoc-syntax">],
134 </span><span class="jsdoc-string">'right' </span><span class="jsdoc-syntax">: [</span><span class="jsdoc-string">'l-r'</span><span class="jsdoc-syntax">, [2,0], </span><span class="jsdoc-string">'left'</span><span class="jsdoc-syntax">],
135 </span><span class="jsdoc-string">'bottom' </span><span class="jsdoc-syntax">: [</span><span class="jsdoc-string">'t-b'</span><span class="jsdoc-syntax">, [0,2], </span><span class="jsdoc-string">'top'</span><span class="jsdoc-syntax">],
136 </span><span class="jsdoc-string">'top' </span><span class="jsdoc-syntax">: [ </span><span class="jsdoc-string">'b-t'</span><span class="jsdoc-syntax">, [0,-2], </span><span class="jsdoc-string">'bottom'</span><span class="jsdoc-syntax">]
142 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.Tooltip</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Component</span><span class="jsdoc-syntax">, {
145 </span><span class="jsdoc-var">bindEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
147 </span><span class="jsdoc-var">delay </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// can be { show : 300 , hide: 500}
149 </span><span class="jsdoc-var">timeout </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
151 </span><span class="jsdoc-var">hoverState </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">//???
153 </span><span class="jsdoc-var">placement </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'bottom'</span><span class="jsdoc-syntax">,
155 </span><span class="jsdoc-var">alignment </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
157 </span><span class="jsdoc-var">getAutoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
159 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= {
160 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'tooltip'</span><span class="jsdoc-syntax">,
161 </span><span class="jsdoc-var">role </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'tooltip'</span><span class="jsdoc-syntax">,
162 </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
164 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'tooltip-arrow arrow'
165 </span><span class="jsdoc-syntax">},
167 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'tooltip-inner'
168 </span><span class="jsdoc-syntax">}
172 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
174 </span><span class="jsdoc-var">bind </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">)
176 </span><span class="jsdoc-var">this.bindEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">;
179 </span><span class="jsdoc-var">initEvents </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
181 </span><span class="jsdoc-var">this.arrowEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.arrow'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
182 </span><span class="jsdoc-var">this.innerEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.tooltip-inner'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
185 </span><span class="jsdoc-var">enter </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">() {
187 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.timeout </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">) {
188 </span><span class="jsdoc-var">clearTimeout</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.timeout</span><span class="jsdoc-syntax">);
191 </span><span class="jsdoc-var">this.hoverState </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'in'</span><span class="jsdoc-syntax">;
192 </span><span class="jsdoc-comment">//Roo.log("enter - show");
193 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.delay </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">this.delay.show</span><span class="jsdoc-syntax">) {
194 </span><span class="jsdoc-var">this.show</span><span class="jsdoc-syntax">();
195 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
197 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
198 </span><span class="jsdoc-var">this.timeout </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">setTimeout</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">() {
199 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">_t.hoverState </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'in'</span><span class="jsdoc-syntax">) {
200 </span><span class="jsdoc-var">_t.show</span><span class="jsdoc-syntax">();
202 }, </span><span class="jsdoc-var">this.delay.show</span><span class="jsdoc-syntax">);
204 </span><span class="jsdoc-var">leave </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
206 </span><span class="jsdoc-var">clearTimeout</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.timeout</span><span class="jsdoc-syntax">);
208 </span><span class="jsdoc-var">this.hoverState </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'out'</span><span class="jsdoc-syntax">;
209 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.delay </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">this.delay.hide</span><span class="jsdoc-syntax">) {
210 </span><span class="jsdoc-var">this.hide</span><span class="jsdoc-syntax">();
211 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
214 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
215 </span><span class="jsdoc-var">this.timeout </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">setTimeout</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">() {
216 </span><span class="jsdoc-comment">//Roo.log("leave - timeout");
218 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">_t.hoverState </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'out'</span><span class="jsdoc-syntax">) {
219 </span><span class="jsdoc-var">_t.hide</span><span class="jsdoc-syntax">();
220 </span><span class="jsdoc-var">Roo.bootstrap.Tooltip.currentEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
222 }, </span><span class="jsdoc-var">delay</span><span class="jsdoc-syntax">);
225 </span><span class="jsdoc-var">show </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">msg</span><span class="jsdoc-syntax">)
227 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">) {
228 </span><span class="jsdoc-var">this.render</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">);
230 </span><span class="jsdoc-comment">// set content.
231 //Roo.log([this.bindEl, this.bindEl.attr('tooltip')]);
233 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">tip </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">msg </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.bindEl.attr</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'tooltip'</span><span class="jsdoc-syntax">) || </span><span class="jsdoc-var">this.bindEl.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"[tooltip]"</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.attr</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'tooltip'</span><span class="jsdoc-syntax">);
235 </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.tooltip-inner'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">tip</span><span class="jsdoc-syntax">;
237 </span><span class="jsdoc-var">this.el.removeClass</span><span class="jsdoc-syntax">([</span><span class="jsdoc-string">'fade'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">'top'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">'bottom'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'left'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'right'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">'in'</span><span class="jsdoc-syntax">,
238 </span><span class="jsdoc-string">'bs-tooltip-top'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">'bs-tooltip-bottom'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'bs-tooltip-left'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'bs-tooltip-right'</span><span class="jsdoc-syntax">]);
240 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">placement </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">this.placement </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'function' </span><span class="jsdoc-syntax">?
241 </span><span class="jsdoc-var">this.placement.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">on_el</span><span class="jsdoc-syntax">) :
242 </span><span class="jsdoc-var">this.placement</span><span class="jsdoc-syntax">;
244 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">autoToken </span><span class="jsdoc-syntax">= /\s?auto?\s?/i;
245 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">autoPlace </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">autoToken.test</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">placement</span><span class="jsdoc-syntax">);
246 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">autoPlace</span><span class="jsdoc-syntax">) {
247 </span><span class="jsdoc-var">placement </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">placement.replace</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">autoToken</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">) || </span><span class="jsdoc-string">'top'</span><span class="jsdoc-syntax">;
250 </span><span class="jsdoc-comment">//this.el.detach()
251 //this.el.setXY([0,0]);
252 </span><span class="jsdoc-var">this.el.show</span><span class="jsdoc-syntax">();
253 </span><span class="jsdoc-comment">//this.el.dom.style.display='block';
255 //this.el.appendTo(on_el);
257 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getPosition</span><span class="jsdoc-syntax">();
258 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">box </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getBox</span><span class="jsdoc-syntax">();
260 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">autoPlace</span><span class="jsdoc-syntax">) {
261 </span><span class="jsdoc-comment">// fixme..
262 </span><span class="jsdoc-syntax">}
264 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">align </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.alignment</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">placement</span><span class="jsdoc-syntax">];
266 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">xy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getAlignToXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.bindEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">align</span><span class="jsdoc-syntax">[0], </span><span class="jsdoc-var">align</span><span class="jsdoc-syntax">[1]);
268 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">placement </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'top' </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">placement </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'bottom'</span><span class="jsdoc-syntax">){
269 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[0] < 0){
270 </span><span class="jsdoc-var">placement </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'right'</span><span class="jsdoc-syntax">;
273 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[0] + </span><span class="jsdoc-var">this.el.getWidth</span><span class="jsdoc-syntax">() > </span><span class="jsdoc-var">Roo.lib.Dom.getViewWidth</span><span class="jsdoc-syntax">()){
274 </span><span class="jsdoc-var">placement </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'left'</span><span class="jsdoc-syntax">;
277 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">scroll </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'body'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.getScroll</span><span class="jsdoc-syntax">();
279 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[1] > </span><span class="jsdoc-var">Roo.lib.Dom.getViewHeight</span><span class="jsdoc-syntax">() + </span><span class="jsdoc-var">scroll.top </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.el.getHeight</span><span class="jsdoc-syntax">()){
280 </span><span class="jsdoc-var">placement </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'top'</span><span class="jsdoc-syntax">;
283 </span><span class="jsdoc-var">align </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.alignment</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">placement</span><span class="jsdoc-syntax">];
285 </span><span class="jsdoc-var">this.arrowEl.setLeft</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">this.innerEl.getWidth</span><span class="jsdoc-syntax">()/2) - 5);
289 </span><span class="jsdoc-var">this.el.alignTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.bindEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">align</span><span class="jsdoc-syntax">[0],</span><span class="jsdoc-var">align</span><span class="jsdoc-syntax">[1]);
290 </span><span class="jsdoc-comment">//var arrow = this.el.select('.arrow',true).first();
291 //arrow.set(align[2],
293 </span><span class="jsdoc-var">this.el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">placement</span><span class="jsdoc-syntax">);
294 </span><span class="jsdoc-var">this.el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"bs-tooltip-"</span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">placement</span><span class="jsdoc-syntax">);
296 </span><span class="jsdoc-var">this.el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'in fade show'</span><span class="jsdoc-syntax">);
298 </span><span class="jsdoc-var">this.hoverState </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
300 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.hasClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'fade'</span><span class="jsdoc-syntax">)) {
301 </span><span class="jsdoc-comment">// fade it?
302 </span><span class="jsdoc-syntax">}
309 </span><span class="jsdoc-var">hide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
312 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">) {
313 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
315 </span><span class="jsdoc-comment">//this.el.setXY([0,0]);
316 </span><span class="jsdoc-var">this.el.removeClass</span><span class="jsdoc-syntax">([</span><span class="jsdoc-string">'show'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'in'</span><span class="jsdoc-syntax">]);
317 </span><span class="jsdoc-comment">//this.el.hide();
319 </span><span class="jsdoc-syntax">}
324 </span></code></body></html>