git.roojs.org Git - roojs1/blob - docs/src/Roo_bootstrap_Popover.js.html

   1 <html><head><title>Roo/bootstrap/Popover.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">/*
   2  * - LGPL
   3  *
   4  * element
   5  *
   6  */
   7
   8 /**
   9  * @class Roo.bootstrap.Popover
  10  * @extends Roo.bootstrap.Component
  11  * @builder-top
  12  * @parent none
  13  * @children Roo.bootstrap.Component
  14  * Bootstrap Popover class
  15  * @cfg {String} html contents of the popover   (or false to use children..)
  16  * @cfg {String} title of popover (or false to hide)
  17  * @cfg {String|function} (right|top|bottom|left|auto) placement how it is placed
  18  * @cfg {String} trigger click || hover (or false to trigger manually)
  19  * @cfg {Boolean} modal - popovers that are modal will mask the screen, and must be closed with another event.
  20  * @cfg {String|Boolean|Roo.Element} add click hander to trigger show over what element
  21  *      - if false and it has a 'parent' then it will be automatically added to that element
  22  *      - if string - Roo.get  will be called
  23  * @cfg {Number} delay - delay before showing
  24
  25  * @constructor
  26  * Create a new Popover
  27  * @param {Object} config The config object
  28  */
  29
  30 </span><span class="jsdoc-var">Roo.bootstrap.Popover </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">){
  31     </span><span class="jsdoc-var">Roo.bootstrap.Popover.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">);
  32
  33     </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
  34         </span><span class="jsdoc-comment">// raw events
  35          /**
  36          * @event show
  37          * After the popover show
  38          *
  39          * @param {Roo.bootstrap.Popover} this
  40          */
  41         </span><span class="jsdoc-string">&quot;show&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  42         </span><span class="jsdoc-comment">/**
  43          * @event hide
  44          * After the popover hide
  45          *
  46          * @param {Roo.bootstrap.Popover} this
  47          */
  48         </span><span class="jsdoc-string">&quot;hide&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
  49     </span><span class="jsdoc-syntax">});
  50 };
  51
  52 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.Popover</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Component</span><span class="jsdoc-syntax">,  {
  53
  54     </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  55     </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  56
  57     </span><span class="jsdoc-var">placement </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'right'</span><span class="jsdoc-syntax">,
  58     </span><span class="jsdoc-var">trigger </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'hover'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// hover
  59     </span><span class="jsdoc-var">modal </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  60     </span><span class="jsdoc-var">delay </span><span class="jsdoc-syntax">: 0,
  61
  62     </span><span class="jsdoc-var">over</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  63
  64     </span><span class="jsdoc-var">can_build_overlaid </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  65
  66     </span><span class="jsdoc-var">maskEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// the mask element
  67     </span><span class="jsdoc-var">headerEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  68     </span><span class="jsdoc-var">contentEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  69     </span><span class="jsdoc-var">alignEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// when show is called with an element - this get's stored.
  70
  71     </span><span class="jsdoc-var">getChildContainer </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
  72     {
  73         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.contentEl</span><span class="jsdoc-syntax">;
  74
  75     },
  76     </span><span class="jsdoc-var">getPopoverHeader </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
  77     {
  78         </span><span class="jsdoc-var">this.title </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// flag not to hide it..
  79         </span><span class="jsdoc-var">this.headerEl.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'p-0'</span><span class="jsdoc-syntax">);
  80         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.headerEl
  81     </span><span class="jsdoc-syntax">},
  82
  83
  84     </span><span class="jsdoc-var">getAutoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
  85
  86         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= {
  87            </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'popover roo-dynamic shadow roo-popover' </span><span class="jsdoc-syntax">+ (</span><span class="jsdoc-var">this.modal </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'-modal' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">),
  88            </span><span class="jsdoc-var">style</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'display:block'</span><span class="jsdoc-syntax">,
  89            </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
  90                 {
  91                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'arrow'
  92                 </span><span class="jsdoc-syntax">},
  93                 {
  94                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'popover-inner '</span><span class="jsdoc-syntax">,
  95                     </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
  96                         {
  97                             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'h3'</span><span class="jsdoc-syntax">,
  98                             </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'popover-title popover-header'</span><span class="jsdoc-syntax">,
  99                             </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.title </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">false </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.title
 100                         </span><span class="jsdoc-syntax">},
 101                         {
 102                             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'popover-content popover-body '  </span><span class="jsdoc-syntax">+ (</span><span class="jsdoc-var">this.cls </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">),
 103                             </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.html </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">''
 104                         </span><span class="jsdoc-syntax">}
 105                     ]
 106
 107                 }
 108            ]
 109         };
 110
 111         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
 112     },
 113     </span><span class="jsdoc-comment">/**
 114      * @param {string} the title
 115      */
 116     </span><span class="jsdoc-var">setTitle</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">str</span><span class="jsdoc-syntax">)
 117     {
 118         </span><span class="jsdoc-var">this.title </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">str</span><span class="jsdoc-syntax">;
 119         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">) {
 120             </span><span class="jsdoc-var">this.headerEl.dom.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">str</span><span class="jsdoc-syntax">;
 121         }
 122
 123     },
 124     </span><span class="jsdoc-comment">/**
 125      * @param {string} the body content
 126      */
 127     </span><span class="jsdoc-var">setContent</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">str</span><span class="jsdoc-syntax">)
 128     {
 129         </span><span class="jsdoc-var">this.html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">str</span><span class="jsdoc-syntax">;
 130         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.contentEl</span><span class="jsdoc-syntax">) {
 131             </span><span class="jsdoc-var">this.contentEl.dom.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">str</span><span class="jsdoc-syntax">;
 132         }
 133
 134     },
 135     </span><span class="jsdoc-comment">// as it get's added to the bottom of the page.
 136     </span><span class="jsdoc-var">onRender </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ct</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">)
 137     {
 138         </span><span class="jsdoc-var">Roo.bootstrap.Component.superclass.onRender.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">ct</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">);
 139
 140
 141
 142         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">){
 143             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">({},  </span><span class="jsdoc-var">this.getAutoCreate</span><span class="jsdoc-syntax">());
 144             </span><span class="jsdoc-var">cfg.id </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.id</span><span class="jsdoc-syntax">();
 145
 146             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.cls</span><span class="jsdoc-syntax">) {
 147                 </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' ' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.cls</span><span class="jsdoc-syntax">;
 148             }
 149             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.style</span><span class="jsdoc-syntax">) {
 150                 </span><span class="jsdoc-var">cfg.style </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.style</span><span class="jsdoc-syntax">;
 151             }
 152             </span><span class="jsdoc-comment">//Roo.log(&quot;adding to &quot;);
 153             </span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.createChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">);
 154 </span><span class="jsdoc-comment">//            Roo.log(this.el);
 155         </span><span class="jsdoc-syntax">}
 156
 157         </span><span class="jsdoc-var">this.contentEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.popover-content'</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">();
 158         </span><span class="jsdoc-var">this.headerEl </span><span class="jsdoc-syntax">=  </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.popover-title'</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">();
 159
 160         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">nitems </span><span class="jsdoc-syntax">= [];
 161         </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">this.items</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">){
 162             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">items </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.items</span><span class="jsdoc-syntax">;
 163             </span><span class="jsdoc-keyword">delete </span><span class="jsdoc-var">this.items</span><span class="jsdoc-syntax">;
 164
 165             </span><span class="jsdoc-keyword">for</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">=0;</span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">items.length</span><span class="jsdoc-syntax">;</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++) {
 166                 </span><span class="jsdoc-var">nitems.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.addxtype</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">({}, </span><span class="jsdoc-var">items</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">])));
 167             }
 168         }
 169
 170         </span><span class="jsdoc-var">this.items </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">nitems</span><span class="jsdoc-syntax">;
 171
 172         </span><span class="jsdoc-var">this.maskEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.DomHelper.append</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">, {</span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;div&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">&quot;x-dlg-mask&quot;</span><span class="jsdoc-syntax">}, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 173         </span><span class="jsdoc-var">Roo.EventManager.onWindowResize</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.resizeMask</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 174
 175
 176
 177         </span><span class="jsdoc-var">this.initEvents</span><span class="jsdoc-syntax">();
 178     },
 179
 180     </span><span class="jsdoc-var">resizeMask </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 181     {
 182         </span><span class="jsdoc-var">this.maskEl.setSize</span><span class="jsdoc-syntax">(
 183             </span><span class="jsdoc-var">Roo.lib.Dom.getViewWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">),
 184             </span><span class="jsdoc-var">Roo.lib.Dom.getViewHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)
 185         );
 186     },
 187
 188     </span><span class="jsdoc-var">initEvents </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 189     {
 190
 191         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.modal</span><span class="jsdoc-syntax">) {
 192             </span><span class="jsdoc-var">Roo.bootstrap.Popover.register</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 193         }
 194
 195         </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">();
 196         </span><span class="jsdoc-var">this.headerEl.setVisibilityMode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.Element.DISPLAY</span><span class="jsdoc-syntax">); </span><span class="jsdoc-comment">// probably not needed as it's default in BS4
 197         </span><span class="jsdoc-var">this.el.enableDisplayMode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'block'</span><span class="jsdoc-syntax">);
 198         </span><span class="jsdoc-var">this.el.hide</span><span class="jsdoc-syntax">();
 199
 200
 201         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.over </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">false </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.parent</span><span class="jsdoc-syntax">()) {
 202             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 203         }
 204         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.triggers </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">) {
 205             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 206         }
 207
 208         </span><span class="jsdoc-comment">// support parent
 209         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">on_el </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.over </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'parent' </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.over </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">this.parent</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.el </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.over</span><span class="jsdoc-syntax">);
 210         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">triggers </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.trigger </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.trigger.split</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">' '</span><span class="jsdoc-syntax">) : [];
 211         </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">triggers</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">trigger</span><span class="jsdoc-syntax">) {
 212
 213             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">trigger </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">) {
 214                 </span><span class="jsdoc-var">on_el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.toggle</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 215             } </span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">trigger </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">'manual'</span><span class="jsdoc-syntax">) {
 216                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">eventIn  </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">trigger </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'hover' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'mouseenter' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'focusin'</span><span class="jsdoc-syntax">;
 217                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">eventOut </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">trigger </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'hover' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'mouseleave' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'focusout'</span><span class="jsdoc-syntax">;
 218
 219                 </span><span class="jsdoc-var">on_el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">eventIn  </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">);
 220                 </span><span class="jsdoc-var">on_el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">eventOut</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">);
 221             }
 222         }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 223     },
 224
 225
 226     </span><span class="jsdoc-comment">// private
 227     </span><span class="jsdoc-var">timeout </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
 228     </span><span class="jsdoc-var">hoverState </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
 229
 230     </span><span class="jsdoc-var">toggle </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">() {
 231         </span><span class="jsdoc-var">this.hoverState </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'in' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.leave</span><span class="jsdoc-syntax">() : </span><span class="jsdoc-var">this.enter</span><span class="jsdoc-syntax">();
 232     },
 233
 234     </span><span class="jsdoc-var">enter </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">() {
 235
 236         </span><span class="jsdoc-var">clearTimeout</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.timeout</span><span class="jsdoc-syntax">);
 237
 238         </span><span class="jsdoc-var">this.hoverState </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'in'</span><span class="jsdoc-syntax">;
 239
 240         </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">) {
 241             </span><span class="jsdoc-var">this.show</span><span class="jsdoc-syntax">();
 242             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 243         }
 244         </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">;
 245         </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">() {
 246             </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">) {
 247                 </span><span class="jsdoc-var">_t.show</span><span class="jsdoc-syntax">();
 248             }
 249         }, </span><span class="jsdoc-var">this.delay.show</span><span class="jsdoc-syntax">)
 250     },
 251
 252     </span><span class="jsdoc-var">leave </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
 253         </span><span class="jsdoc-var">clearTimeout</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.timeout</span><span class="jsdoc-syntax">);
 254
 255         </span><span class="jsdoc-var">this.hoverState </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'out'</span><span class="jsdoc-syntax">;
 256
 257         </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">) {
 258             </span><span class="jsdoc-var">this.hide</span><span class="jsdoc-syntax">();
 259             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 260         }
 261         </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">;
 262         </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">() {
 263             </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">) {
 264                 </span><span class="jsdoc-var">_t.hide</span><span class="jsdoc-syntax">();
 265             }
 266         }, </span><span class="jsdoc-var">this.delay.hide</span><span class="jsdoc-syntax">)
 267     },
 268
 269     </span><span class="jsdoc-comment">/**
 270      * update the position of the dialog
 271      * normally this is needed if the popover get's bigger - due to a Table reload etc..
 272      *
 273      *
 274      */
 275
 276     </span><span class="jsdoc-var">doAlign </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 277     {
 278
 279         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.alignEl</span><span class="jsdoc-syntax">) {
 280             </span><span class="jsdoc-var">this.updatePosition</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.placement</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 281
 282         } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
 283             </span><span class="jsdoc-comment">// this is usually just done by the builder = to show the popoup in the middle of the scren.
 284             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">es </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getSize</span><span class="jsdoc-syntax">();
 285             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.lib.Dom.getViewWidth</span><span class="jsdoc-syntax">()/2;
 286             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.lib.Dom.getViewHeight</span><span class="jsdoc-syntax">()/2;
 287             </span><span class="jsdoc-var">this.el.setXY</span><span class="jsdoc-syntax">([ </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">-(</span><span class="jsdoc-var">es.width</span><span class="jsdoc-syntax">/2),  </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">-(</span><span class="jsdoc-var">es.height</span><span class="jsdoc-syntax">/2)] );
 288
 289         }
 290
 291
 292
 293
 294
 295     },
 296
 297     </span><span class="jsdoc-comment">/**
 298      * Show the popover
 299      * @param {Roo.Element|string|Boolean} - element to align and point to. (set align to [ pos, offset ])
 300      * @param {string} (left|right|top|bottom) position
 301      */
 302     </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">on_el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">placement</span><span class="jsdoc-syntax">)
 303     {
 304         </span><span class="jsdoc-var">this.placement </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">placement</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">?  </span><span class="jsdoc-var">this.placement   </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">placement</span><span class="jsdoc-syntax">;
 305         </span><span class="jsdoc-var">on_el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">on_el </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// default to false
 306
 307         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">on_el</span><span class="jsdoc-syntax">) {
 308             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.parent</span><span class="jsdoc-syntax">() &amp;&amp; (</span><span class="jsdoc-var">this.over </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'parent' </span><span class="jsdoc-syntax">|| (</span><span class="jsdoc-var">this.over </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">))) {
 309                 </span><span class="jsdoc-var">on_el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.parent</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.el</span><span class="jsdoc-syntax">;
 310             } </span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.over</span><span class="jsdoc-syntax">) {
 311                 </span><span class="jsdoc-var">on_el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.over</span><span class="jsdoc-syntax">);
 312             }
 313
 314         }
 315
 316         </span><span class="jsdoc-var">this.alignEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">on_el </span><span class="jsdoc-syntax">);
 317
 318         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">) {
 319             </span><span class="jsdoc-var">this.render</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">);
 320         }
 321
 322
 323
 324
 325         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.title </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">) {
 326             </span><span class="jsdoc-var">this.headerEl.hide</span><span class="jsdoc-syntax">();
 327         }
 328
 329
 330         </span><span class="jsdoc-var">this.el.show</span><span class="jsdoc-syntax">();
 331         </span><span class="jsdoc-var">this.el.dom.style.display </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'block'</span><span class="jsdoc-syntax">;
 332
 333         </span><span class="jsdoc-var">this.doAlign</span><span class="jsdoc-syntax">();
 334
 335         </span><span class="jsdoc-comment">//var arrow = this.el.select('.arrow',true).first();
 336         //arrow.set(align[2],
 337
 338         </span><span class="jsdoc-var">this.el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'in'</span><span class="jsdoc-syntax">);
 339
 340
 341
 342         </span><span class="jsdoc-var">this.hoverState </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'in'</span><span class="jsdoc-syntax">;
 343
 344         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.modal</span><span class="jsdoc-syntax">) {
 345             </span><span class="jsdoc-var">this.maskEl.setSize</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.lib.Dom.getViewWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">),   </span><span class="jsdoc-var">Roo.lib.Dom.getViewHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">));
 346             </span><span class="jsdoc-var">this.maskEl.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'z-index'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Popover.zIndex</span><span class="jsdoc-syntax">++);
 347             </span><span class="jsdoc-var">this.maskEl.dom.style.display </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'block'</span><span class="jsdoc-syntax">;
 348             </span><span class="jsdoc-var">this.maskEl.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'show'</span><span class="jsdoc-syntax">);
 349         }
 350         </span><span class="jsdoc-var">this.el.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'z-index'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Popover.zIndex</span><span class="jsdoc-syntax">++);
 351
 352         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'show'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 353
 354     },
 355     </span><span class="jsdoc-comment">/**
 356      * fire this manually after loading a grid in the table for example
 357      * @param {string} (left|right|top|bottom) where to try and put it (use false to use the last one)
 358      * @param {Boolean} try and move it if we cant get right position.
 359      */
 360     </span><span class="jsdoc-var">updatePosition </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">placement</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">try_move</span><span class="jsdoc-syntax">)
 361     {
 362         </span><span class="jsdoc-comment">// allow for calling with no parameters
 363         </span><span class="jsdoc-var">placement </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">placement   </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">placement </span><span class="jsdoc-syntax">:  </span><span class="jsdoc-var">this.placement</span><span class="jsdoc-syntax">;
 364         </span><span class="jsdoc-var">try_move </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">try_move</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-keyword">true </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">try_move</span><span class="jsdoc-syntax">;
 365
 366         </span><span class="jsdoc-var">this.el.removeClass</span><span class="jsdoc-syntax">([
 367             </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">,
 368             </span><span class="jsdoc-string">'bs-popover-top'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">'bs-popover-bottom'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'bs-popover-left'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'bs-popover-right'
 369         </span><span class="jsdoc-syntax">]);
 370         </span><span class="jsdoc-var">this.el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">placement </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">' bs-popover-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">placement</span><span class="jsdoc-syntax">);
 371
 372         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.alignEl </span><span class="jsdoc-syntax">) {
 373             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 374         }
 375
 376         </span><span class="jsdoc-keyword">switch </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">placement</span><span class="jsdoc-syntax">) {
 377             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'right'</span><span class="jsdoc-syntax">:
 378                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">exact </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getAlignToXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.alignEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'tl-tr'</span><span class="jsdoc-syntax">, [10,0]);
 379                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">offset </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getAlignToXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.alignEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'tl-tr?'</span><span class="jsdoc-syntax">,[10,0]);
 380                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">try_move </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">exact.equals</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">offset</span><span class="jsdoc-syntax">) || </span><span class="jsdoc-var">exact</span><span class="jsdoc-syntax">[0] == </span><span class="jsdoc-var">offset</span><span class="jsdoc-syntax">[0] ) {
 381                     </span><span class="jsdoc-comment">//normal display... or moved up/down.
 382                     </span><span class="jsdoc-var">this.el.setXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">offset</span><span class="jsdoc-syntax">);
 383                     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">xy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.alignEl.getAnchorXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'tr'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
 384                     </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[0]+=2;</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[1]+=5;
 385                     </span><span class="jsdoc-var">this.arrowEl.setXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">);
 386                     </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
 387                 }
 388                 </span><span class="jsdoc-comment">// continue through...
 389                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.updatePosition</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'left'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
 390
 391
 392             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'left'</span><span class="jsdoc-syntax">:
 393                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">exact </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getAlignToXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.alignEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'tr-tl'</span><span class="jsdoc-syntax">, [-10,0]);
 394                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">offset </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getAlignToXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.alignEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'tr-tl?'</span><span class="jsdoc-syntax">,[-10,0]);
 395                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">try_move </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">exact.equals</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">offset</span><span class="jsdoc-syntax">) || </span><span class="jsdoc-var">exact</span><span class="jsdoc-syntax">[0] == </span><span class="jsdoc-var">offset</span><span class="jsdoc-syntax">[0] ) {
 396                     </span><span class="jsdoc-comment">//normal display... or moved up/down.
 397                     </span><span class="jsdoc-var">this.el.setXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">offset</span><span class="jsdoc-syntax">);
 398                     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">xy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.alignEl.getAnchorXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'tl'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
 399                     </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[0]-=10;</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[1]+=5; </span><span class="jsdoc-comment">// &lt;&lt; fix me
 400                     </span><span class="jsdoc-var">this.arrowEl.setXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">);
 401                     </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
 402                 }
 403                 </span><span class="jsdoc-comment">// call self...
 404                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.updatePosition</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'right'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
 405
 406             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'top'</span><span class="jsdoc-syntax">:
 407                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">exact </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getAlignToXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.alignEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'b-t'</span><span class="jsdoc-syntax">, [0,-10]);
 408                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">offset </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getAlignToXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.alignEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'b-t?'</span><span class="jsdoc-syntax">,[0,-10]);
 409                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">try_move </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">exact.equals</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">offset</span><span class="jsdoc-syntax">) || </span><span class="jsdoc-var">exact</span><span class="jsdoc-syntax">[1] == </span><span class="jsdoc-var">offset</span><span class="jsdoc-syntax">[1] ) {
 410                     </span><span class="jsdoc-comment">//normal display... or moved up/down.
 411                     </span><span class="jsdoc-var">this.el.setXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">offset</span><span class="jsdoc-syntax">);
 412                     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">xy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.alignEl.getAnchorXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'t'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
 413                     </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[1]-=10; </span><span class="jsdoc-comment">// &lt;&lt; fix me
 414                     </span><span class="jsdoc-var">this.arrowEl.setXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">);
 415                     </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
 416                 }
 417                 </span><span class="jsdoc-comment">// fall through
 418                </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.updatePosition</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'bottom'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
 419
 420             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'bottom'</span><span class="jsdoc-syntax">:
 421                  </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">exact </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getAlignToXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.alignEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'t-b'</span><span class="jsdoc-syntax">, [0,10]);
 422                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">offset </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getAlignToXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.alignEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'t-b?'</span><span class="jsdoc-syntax">,[0,10]);
 423                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">try_move </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">exact.equals</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">offset</span><span class="jsdoc-syntax">) || </span><span class="jsdoc-var">exact</span><span class="jsdoc-syntax">[1] == </span><span class="jsdoc-var">offset</span><span class="jsdoc-syntax">[1] ) {
 424                     </span><span class="jsdoc-comment">//normal display... or moved up/down.
 425                     </span><span class="jsdoc-var">this.el.setXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">offset</span><span class="jsdoc-syntax">);
 426                     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">xy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.alignEl.getAnchorXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'b'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
 427                      </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[1]+=2; </span><span class="jsdoc-comment">// &lt;&lt; fix me
 428                     </span><span class="jsdoc-var">this.arrowEl.setXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">);
 429                     </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
 430                 }
 431                 </span><span class="jsdoc-comment">// fall through
 432                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.updatePosition</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'top'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
 433
 434
 435         }
 436
 437
 438         </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 439     },
 440
 441     </span><span class="jsdoc-var">hide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 442     {
 443         </span><span class="jsdoc-var">this.el.setXY</span><span class="jsdoc-syntax">([0,0]);
 444         </span><span class="jsdoc-var">this.el.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'in'</span><span class="jsdoc-syntax">);
 445         </span><span class="jsdoc-var">this.el.hide</span><span class="jsdoc-syntax">();
 446         </span><span class="jsdoc-var">this.hoverState </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
 447         </span><span class="jsdoc-var">this.maskEl.hide</span><span class="jsdoc-syntax">(); </span><span class="jsdoc-comment">// always..
 448         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'hide'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 449     }
 450
 451 });
 452
 453
 454 </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.Popover</span><span class="jsdoc-syntax">, {
 455
 456     </span><span class="jsdoc-var">alignment </span><span class="jsdoc-syntax">: {
 457         </span><span class="jsdoc-string">'left' </span><span class="jsdoc-syntax">: [</span><span class="jsdoc-string">'r-l'</span><span class="jsdoc-syntax">, [-10,0], </span><span class="jsdoc-string">'left bs-popover-left'</span><span class="jsdoc-syntax">],
 458         </span><span class="jsdoc-string">'right' </span><span class="jsdoc-syntax">: [</span><span class="jsdoc-string">'l-br'</span><span class="jsdoc-syntax">, [10,0], </span><span class="jsdoc-string">'right bs-popover-right'</span><span class="jsdoc-syntax">],
 459         </span><span class="jsdoc-string">'bottom' </span><span class="jsdoc-syntax">: [</span><span class="jsdoc-string">'t-b'</span><span class="jsdoc-syntax">, [0,10], </span><span class="jsdoc-string">'top bs-popover-top'</span><span class="jsdoc-syntax">],
 460         </span><span class="jsdoc-string">'top' </span><span class="jsdoc-syntax">: [ </span><span class="jsdoc-string">'b-t'</span><span class="jsdoc-syntax">, [0,-10], </span><span class="jsdoc-string">'bottom bs-popover-bottom'</span><span class="jsdoc-syntax">]
 461     },
 462
 463     </span><span class="jsdoc-var">zIndex </span><span class="jsdoc-syntax">: 20001,
 464
 465     </span><span class="jsdoc-var">clickHander </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 466
 467
 468
 469     </span><span class="jsdoc-var">onMouseDown </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)
 470     {
 471         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.popups.length </span><span class="jsdoc-syntax">&amp;&amp;  !</span><span class="jsdoc-var">e.getTarget</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;.roo-popover&quot;</span><span class="jsdoc-syntax">)) {
 472             </span><span class="jsdoc-comment">/// what is nothing is showing..
 473             </span><span class="jsdoc-var">this.hideAll</span><span class="jsdoc-syntax">();
 474         }
 475
 476     },
 477
 478
 479     </span><span class="jsdoc-var">popups </span><span class="jsdoc-syntax">: [],
 480
 481     </span><span class="jsdoc-var">register </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">popup</span><span class="jsdoc-syntax">)
 482     {
 483         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">Roo.bootstrap.Popover.clickHandler</span><span class="jsdoc-syntax">) {
 484             </span><span class="jsdoc-var">Roo.bootstrap.Popover.clickHandler </span><span class="jsdoc-syntax">= </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">&quot;mousedown&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Popover.onMouseDown</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Popover</span><span class="jsdoc-syntax">);
 485         }
 486         </span><span class="jsdoc-comment">// hide other popups.
 487         </span><span class="jsdoc-var">popup.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'show'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Popover.onShow</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">popup</span><span class="jsdoc-syntax">);
 488         </span><span class="jsdoc-var">popup.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'hide'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Popover.onHide</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">popup</span><span class="jsdoc-syntax">);
 489         </span><span class="jsdoc-var">this.hideAll</span><span class="jsdoc-syntax">(); </span><span class="jsdoc-comment">//&lt;&lt; why?
 490         //this.popups.push(popup);
 491     </span><span class="jsdoc-syntax">},
 492     </span><span class="jsdoc-var">hideAll </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 493     {
 494         </span><span class="jsdoc-var">this.popups.forEach</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">) {
 495             </span><span class="jsdoc-var">p.hide</span><span class="jsdoc-syntax">();
 496         });
 497     },
 498     </span><span class="jsdoc-var">onShow </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
 499         </span><span class="jsdoc-var">Roo.bootstrap.Popover.popups.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 500     },
 501     </span><span class="jsdoc-var">onHide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
 502         </span><span class="jsdoc-var">Roo.bootstrap.Popover.popups.remove</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 503     }
 504
 505 });</span></code></body></html>