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

   1 <html><head><title>../roojs1/Roo/form/HtmlEditor/ToolbarContext.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">// &lt;script type=&quot;text/javascript&quot;&gt;
   2 /*
   3  * Based on
   4  * Ext JS Library 1.1.1
   5  * Copyright(c) 2006-2007, Ext JS, LLC.
   6  *
   7
   8  */
   9
  10
  11 /**
  12  * @class Roo.form.HtmlEditor.ToolbarContext
  13  * Context Toolbar
  14  *
  15  * Usage:
  16  *
  17  new Roo.form.HtmlEditor({
  18     ....
  19     toolbars : [
  20         { xtype: 'ToolbarStandard', styles : {} }
  21         { xtype: 'ToolbarContext', disable : {} }
  22     ]
  23 })
  24
  25
  26  *
  27  * @config : {Object} disable List of elements to disable.. (not done yet.)
  28  * @config : {Object} styles  Map of styles available.
  29  *
  30  */
  31
  32 </span><span class="jsdoc-var">Roo.form.HtmlEditor.ToolbarContext </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">)
  33 {
  34
  35     </span><span class="jsdoc-var">Roo.apply</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">);
  36     </span><span class="jsdoc-comment">//Roo.form.HtmlEditorToolbar1.superclass.constructor.call(this, editor.wrap.dom.firstChild, [], config);
  37     // dont call parent... till later.
  38     </span><span class="jsdoc-var">this.styles </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.styles </span><span class="jsdoc-syntax">|| {};
  39 }
  40 </span><span class="jsdoc-var">Roo.form.HtmlEditor.ToolbarContext.types </span><span class="jsdoc-syntax">= {
  41     </span><span class="jsdoc-string">'IMG' </span><span class="jsdoc-syntax">: {
  42         </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">: {
  43             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Width&quot;</span><span class="jsdoc-syntax">,
  44             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 40
  45         },
  46         </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">:  {
  47             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Height&quot;</span><span class="jsdoc-syntax">,
  48             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 40
  49         },
  50         </span><span class="jsdoc-var">align</span><span class="jsdoc-syntax">: {
  51             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Align&quot;</span><span class="jsdoc-syntax">,
  52             </span><span class="jsdoc-var">opts </span><span class="jsdoc-syntax">: [ [</span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">],[ </span><span class="jsdoc-string">&quot;left&quot;</span><span class="jsdoc-syntax">],[ </span><span class="jsdoc-string">&quot;right&quot;</span><span class="jsdoc-syntax">],[ </span><span class="jsdoc-string">&quot;center&quot;</span><span class="jsdoc-syntax">],[ </span><span class="jsdoc-string">&quot;top&quot;</span><span class="jsdoc-syntax">]],
  53             </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">: 80
  54
  55         },
  56         </span><span class="jsdoc-var">border</span><span class="jsdoc-syntax">: {
  57             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Border&quot;</span><span class="jsdoc-syntax">,
  58             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 40
  59         },
  60         </span><span class="jsdoc-var">alt</span><span class="jsdoc-syntax">: {
  61             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Alt&quot;</span><span class="jsdoc-syntax">,
  62             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 120
  63         },
  64         </span><span class="jsdoc-var">src </span><span class="jsdoc-syntax">: {
  65             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Src&quot;</span><span class="jsdoc-syntax">,
  66             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 220
  67         }
  68
  69     },
  70     </span><span class="jsdoc-string">'A' </span><span class="jsdoc-syntax">: {
  71         </span><span class="jsdoc-var">name </span><span class="jsdoc-syntax">: {
  72             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Name&quot;</span><span class="jsdoc-syntax">,
  73             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 50
  74         },
  75         </span><span class="jsdoc-var">href</span><span class="jsdoc-syntax">:  {
  76             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Href&quot;</span><span class="jsdoc-syntax">,
  77             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 220
  78         } </span><span class="jsdoc-comment">// border?
  79
  80     </span><span class="jsdoc-syntax">},
  81     </span><span class="jsdoc-string">'TABLE' </span><span class="jsdoc-syntax">: {
  82         </span><span class="jsdoc-var">rows </span><span class="jsdoc-syntax">: {
  83             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Rows&quot;</span><span class="jsdoc-syntax">,
  84             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 20
  85         },
  86         </span><span class="jsdoc-var">cols </span><span class="jsdoc-syntax">: {
  87             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Cols&quot;</span><span class="jsdoc-syntax">,
  88             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 20
  89         },
  90         </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">: {
  91             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Width&quot;</span><span class="jsdoc-syntax">,
  92             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 40
  93         },
  94         </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">: {
  95             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Height&quot;</span><span class="jsdoc-syntax">,
  96             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 40
  97         },
  98         </span><span class="jsdoc-var">border </span><span class="jsdoc-syntax">: {
  99             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Border&quot;</span><span class="jsdoc-syntax">,
 100             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 20
 101         }
 102     },
 103     </span><span class="jsdoc-string">'TD' </span><span class="jsdoc-syntax">: {
 104         </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">: {
 105             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Width&quot;</span><span class="jsdoc-syntax">,
 106             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 40
 107         },
 108         </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">: {
 109             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Height&quot;</span><span class="jsdoc-syntax">,
 110             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 40
 111         },
 112         </span><span class="jsdoc-var">align</span><span class="jsdoc-syntax">: {
 113             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Align&quot;</span><span class="jsdoc-syntax">,
 114             </span><span class="jsdoc-var">opts </span><span class="jsdoc-syntax">: [[</span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">],[ </span><span class="jsdoc-string">&quot;left&quot;</span><span class="jsdoc-syntax">],[ </span><span class="jsdoc-string">&quot;center&quot;</span><span class="jsdoc-syntax">],[ </span><span class="jsdoc-string">&quot;right&quot;</span><span class="jsdoc-syntax">],[ </span><span class="jsdoc-string">&quot;justify&quot;</span><span class="jsdoc-syntax">],[ </span><span class="jsdoc-string">&quot;char&quot;</span><span class="jsdoc-syntax">]],
 115             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 80
 116         },
 117         </span><span class="jsdoc-var">valign</span><span class="jsdoc-syntax">: {
 118             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Valign&quot;</span><span class="jsdoc-syntax">,
 119             </span><span class="jsdoc-var">opts </span><span class="jsdoc-syntax">: [[</span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">],[ </span><span class="jsdoc-string">&quot;top&quot;</span><span class="jsdoc-syntax">],[ </span><span class="jsdoc-string">&quot;middle&quot;</span><span class="jsdoc-syntax">],[ </span><span class="jsdoc-string">&quot;bottom&quot;</span><span class="jsdoc-syntax">],[ </span><span class="jsdoc-string">&quot;baseline&quot;</span><span class="jsdoc-syntax">]],
 120             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 80
 121         },
 122         </span><span class="jsdoc-var">colspan</span><span class="jsdoc-syntax">: {
 123             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Colspan&quot;</span><span class="jsdoc-syntax">,
 124             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 20
 125
 126         }
 127     },
 128     </span><span class="jsdoc-string">'INPUT' </span><span class="jsdoc-syntax">: {
 129         </span><span class="jsdoc-var">name </span><span class="jsdoc-syntax">: {
 130             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;name&quot;</span><span class="jsdoc-syntax">,
 131             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 120
 132         },
 133         </span><span class="jsdoc-var">value </span><span class="jsdoc-syntax">: {
 134             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Value&quot;</span><span class="jsdoc-syntax">,
 135             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 120
 136         },
 137         </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">: {
 138             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Width&quot;</span><span class="jsdoc-syntax">,
 139             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 40
 140         }
 141     },
 142     </span><span class="jsdoc-string">'LABEL' </span><span class="jsdoc-syntax">: {
 143         </span><span class="jsdoc-string">'for' </span><span class="jsdoc-syntax">: {
 144             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;For&quot;</span><span class="jsdoc-syntax">,
 145             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 120
 146         }
 147     },
 148     </span><span class="jsdoc-string">'TEXTAREA' </span><span class="jsdoc-syntax">: {
 149           </span><span class="jsdoc-var">name </span><span class="jsdoc-syntax">: {
 150             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;name&quot;</span><span class="jsdoc-syntax">,
 151             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 120
 152         },
 153         </span><span class="jsdoc-var">rows </span><span class="jsdoc-syntax">: {
 154             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Rows&quot;</span><span class="jsdoc-syntax">,
 155             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 20
 156         },
 157         </span><span class="jsdoc-var">cols </span><span class="jsdoc-syntax">: {
 158             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Cols&quot;</span><span class="jsdoc-syntax">,
 159             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 20
 160         }
 161     },
 162     </span><span class="jsdoc-string">'SELECT' </span><span class="jsdoc-syntax">: {
 163         </span><span class="jsdoc-var">name </span><span class="jsdoc-syntax">: {
 164             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;name&quot;</span><span class="jsdoc-syntax">,
 165             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 120
 166         },
 167         </span><span class="jsdoc-var">selectoptions </span><span class="jsdoc-syntax">: {
 168             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Options&quot;</span><span class="jsdoc-syntax">,
 169             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 200
 170         }
 171     },
 172
 173     </span><span class="jsdoc-comment">// should we really allow this??
 174     // should this just be
 175     </span><span class="jsdoc-string">'BODY' </span><span class="jsdoc-syntax">: {
 176         </span><span class="jsdoc-var">title </span><span class="jsdoc-syntax">: {
 177             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;title&quot;</span><span class="jsdoc-syntax">,
 178             </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 200,
 179             </span><span class="jsdoc-var">disabled </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
 180         </span><span class="jsdoc-syntax">}
 181     },
 182     </span><span class="jsdoc-string">'*' </span><span class="jsdoc-syntax">: {
 183         </span><span class="jsdoc-comment">// empty..
 184     </span><span class="jsdoc-syntax">}
 185 };
 186
 187
 188
 189 </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.form.HtmlEditor.ToolbarContext.prototype</span><span class="jsdoc-syntax">,  {
 190
 191     </span><span class="jsdoc-var">tb</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 192
 193     </span><span class="jsdoc-var">rendered</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 194
 195     </span><span class="jsdoc-var">editor </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 196     </span><span class="jsdoc-comment">/**
 197      * @cfg {Object} disable  List of toolbar elements to disable
 198
 199      */
 200     </span><span class="jsdoc-var">disable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 201     </span><span class="jsdoc-comment">/**
 202      * @cfg {Object} styles List of styles
 203      *    eg. { '*' : [ 'headline' ] , 'TD' : [ 'underline', 'double-underline' ] }
 204      *
 205      * These must be defined in the page, so they get rendered correctly..
 206      * .headline { }
 207      * TD.underline { }
 208      *
 209      */
 210     </span><span class="jsdoc-var">styles </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 211
 212
 213
 214     </span><span class="jsdoc-var">toolbars </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 215
 216     </span><span class="jsdoc-var">init </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">editor</span><span class="jsdoc-syntax">)
 217     {
 218         </span><span class="jsdoc-var">this.editor </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">editor</span><span class="jsdoc-syntax">;
 219
 220
 221         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">fid </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">editor.frameId</span><span class="jsdoc-syntax">;
 222         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">etb </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 223         </span><span class="jsdoc-keyword">function </span><span class="jsdoc-var">btn</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">toggle</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">handler</span><span class="jsdoc-syntax">){
 224             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">xid </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">fid </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'-'</span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">id </span><span class="jsdoc-syntax">;
 225             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
 226                 </span><span class="jsdoc-var">id </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">xid</span><span class="jsdoc-syntax">,
 227                 </span><span class="jsdoc-var">cmd </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">,
 228                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'x-btn-icon x-edit-'</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">,
 229                 </span><span class="jsdoc-var">enableToggle</span><span class="jsdoc-syntax">:</span><span class="jsdoc-var">toggle </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 230                 </span><span class="jsdoc-var">scope</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">editor</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// was editor...
 231                 </span><span class="jsdoc-var">handler</span><span class="jsdoc-syntax">:</span><span class="jsdoc-var">handler</span><span class="jsdoc-syntax">||</span><span class="jsdoc-var">editor.relayBtnCmd</span><span class="jsdoc-syntax">,
 232                 </span><span class="jsdoc-var">clickEvent</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'mousedown'</span><span class="jsdoc-syntax">,
 233                 </span><span class="jsdoc-var">tooltip</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">etb.buttonTips</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">] || </span><span class="jsdoc-var">undefined</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">///tips ???
 234                 </span><span class="jsdoc-var">tabIndex</span><span class="jsdoc-syntax">:-1
 235             };
 236         }
 237         </span><span class="jsdoc-comment">// create a new element.
 238         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">wdiv </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">editor.wrap.createChild</span><span class="jsdoc-syntax">({
 239                 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'
 240             </span><span class="jsdoc-syntax">}, </span><span class="jsdoc-var">editor.wrap.dom.firstChild.nextSibling</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 241
 242         </span><span class="jsdoc-comment">// can we do this more than once??
 243
 244          // stop form submits
 245
 246
 247         // disable everything...
 248         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ty</span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.form.HtmlEditor.ToolbarContext.types</span><span class="jsdoc-syntax">;
 249         </span><span class="jsdoc-var">this.toolbars </span><span class="jsdoc-syntax">= {};
 250
 251         </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-keyword">in  </span><span class="jsdoc-var">ty</span><span class="jsdoc-syntax">) {
 252
 253             </span><span class="jsdoc-var">this.toolbars</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">this.buildToolbar</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ty</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">],</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">);
 254         }
 255         </span><span class="jsdoc-var">this.tb </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.toolbars.BODY</span><span class="jsdoc-syntax">;
 256         </span><span class="jsdoc-var">this.tb.el.show</span><span class="jsdoc-syntax">();
 257         </span><span class="jsdoc-var">this.buildFooter</span><span class="jsdoc-syntax">();
 258         </span><span class="jsdoc-var">this.footer.show</span><span class="jsdoc-syntax">();
 259         </span><span class="jsdoc-var">editor.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'hide'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">( ) { </span><span class="jsdoc-var">this.footer.hide</span><span class="jsdoc-syntax">() }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 260         </span><span class="jsdoc-var">editor.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'show'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">( ) { </span><span class="jsdoc-var">this.footer.show</span><span class="jsdoc-syntax">() }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 261
 262
 263         </span><span class="jsdoc-var">this.rendered </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 264
 265         </span><span class="jsdoc-comment">// the all the btns;
 266         </span><span class="jsdoc-var">editor.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'editorevent'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.updateToolbar</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 267         </span><span class="jsdoc-comment">// other toolbars need to implement this..
 268         //editor.on('editmodechange', this.updateToolbar, this);
 269     </span><span class="jsdoc-syntax">},
 270
 271
 272
 273     </span><span class="jsdoc-comment">/**
 274      * Protected method that will not generally be called directly. It triggers
 275      * a toolbar update by reading the markup state of the current selection in the editor.
 276      */
 277     </span><span class="jsdoc-var">updateToolbar</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">editor</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">ev</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">){
 278
 279         </span><span class="jsdoc-comment">//Roo.log(ev);
 280         // capture mouse up - this is handy for selecting images..
 281         // perhaps should go somewhere else...
 282         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.editor.activated</span><span class="jsdoc-syntax">){
 283              </span><span class="jsdoc-var">this.editor.onFirstFocus</span><span class="jsdoc-syntax">();
 284             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 285         }
 286
 287         </span><span class="jsdoc-comment">// http://developer.yahoo.com/yui/docs/simple-editor.js.html
 288         // selectNode - might want to handle IE?
 289         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ev </span><span class="jsdoc-syntax">&amp;&amp;
 290             (</span><span class="jsdoc-var">ev.type </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'mouseup' </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">ev.type </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'click' </span><span class="jsdoc-syntax">) &amp;&amp;
 291             </span><span class="jsdoc-var">ev.target </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">ev.target.tagName </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'IMG'</span><span class="jsdoc-syntax">) {
 292             </span><span class="jsdoc-comment">// they have click on an image...
 293             // let's see if we can change the selection...
 294             </span><span class="jsdoc-var">sel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ev.target</span><span class="jsdoc-syntax">;
 295
 296               </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">nodeRange </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel.ownerDocument.createRange</span><span class="jsdoc-syntax">();
 297             </span><span class="jsdoc-keyword">try </span><span class="jsdoc-syntax">{
 298                 </span><span class="jsdoc-var">nodeRange.selectNode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">);
 299             } </span><span class="jsdoc-keyword">catch </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">) {
 300                 </span><span class="jsdoc-var">nodeRange.selectNodeContents</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">);
 301             }
 302             </span><span class="jsdoc-comment">//nodeRange.collapse(true);
 303             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">s </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">editor.win.getSelection</span><span class="jsdoc-syntax">();
 304             </span><span class="jsdoc-var">s.removeAllRanges</span><span class="jsdoc-syntax">();
 305             </span><span class="jsdoc-var">s.addRange</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">nodeRange</span><span class="jsdoc-syntax">);
 306         }
 307
 308
 309         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">updateFooter </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel </span><span class="jsdoc-syntax">? </span><span class="jsdoc-keyword">false </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 310
 311
 312         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ans </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.editor.getAllAncestors</span><span class="jsdoc-syntax">();
 313
 314         </span><span class="jsdoc-comment">// pick
 315         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ty</span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.form.HtmlEditor.ToolbarContext.types</span><span class="jsdoc-syntax">;
 316
 317         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">) {
 318             </span><span class="jsdoc-var">sel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ans.length </span><span class="jsdoc-syntax">? (</span><span class="jsdoc-var">ans</span><span class="jsdoc-syntax">[0] ?  </span><span class="jsdoc-var">ans</span><span class="jsdoc-syntax">[0]  : </span><span class="jsdoc-var">ans</span><span class="jsdoc-syntax">[1]) : </span><span class="jsdoc-var">this.editor.doc.body</span><span class="jsdoc-syntax">;
 319             </span><span class="jsdoc-var">sel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">sel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.editor.doc.body</span><span class="jsdoc-syntax">;
 320             </span><span class="jsdoc-var">sel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel.tagName.length </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">sel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.editor.doc.body</span><span class="jsdoc-syntax">;
 321
 322         }
 323         </span><span class="jsdoc-comment">// pick a menu that exists..
 324         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">tn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel.tagName.toUpperCase</span><span class="jsdoc-syntax">();
 325         </span><span class="jsdoc-comment">//sel = typeof(ty[tn]) != 'undefined' ? sel : this.editor.doc.body;
 326
 327         </span><span class="jsdoc-var">tn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel.tagName.toUpperCase</span><span class="jsdoc-syntax">();
 328
 329         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">lastSel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.tb.selectedNode
 330
 331         this.tb.selectedNode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">;
 332
 333         </span><span class="jsdoc-comment">// if current menu does not match..
 334         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">this.tb.name </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">tn</span><span class="jsdoc-syntax">) || (</span><span class="jsdoc-var">lastSel </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">this.tb.selectedNode</span><span class="jsdoc-syntax">)) {
 335
 336             </span><span class="jsdoc-var">this.tb.el.hide</span><span class="jsdoc-syntax">();
 337             </span><span class="jsdoc-comment">///console.log(&quot;show: &quot; + tn);
 338             </span><span class="jsdoc-var">this.tb </span><span class="jsdoc-syntax">=  </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ty</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">tn</span><span class="jsdoc-syntax">]) != </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.toolbars</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">tn</span><span class="jsdoc-syntax">] : </span><span class="jsdoc-var">this.toolbars</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'*'</span><span class="jsdoc-syntax">];
 339             </span><span class="jsdoc-var">this.tb.el.show</span><span class="jsdoc-syntax">();
 340             </span><span class="jsdoc-comment">// update name
 341             </span><span class="jsdoc-var">this.tb.items.first</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.el.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">tn </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">':&amp;nbsp;'</span><span class="jsdoc-syntax">;
 342
 343
 344             </span><span class="jsdoc-comment">// update attributes
 345             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tb.fields</span><span class="jsdoc-syntax">) {
 346                 </span><span class="jsdoc-var">this.tb.fields.each</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">) {
 347                    </span><span class="jsdoc-var">e.setValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sel.getAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.name</span><span class="jsdoc-syntax">));
 348                 });
 349             }
 350
 351             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hasStyles </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 352             </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-keyword">in </span><span class="jsdoc-var">this.styles</span><span class="jsdoc-syntax">) {
 353                 </span><span class="jsdoc-var">hasStyles </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 354                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 355             }
 356
 357             </span><span class="jsdoc-comment">// update styles
 358             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hasStyles</span><span class="jsdoc-syntax">) {
 359                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">st </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.tb.fields.item</span><span class="jsdoc-syntax">(0);
 360
 361                 </span><span class="jsdoc-var">st.store.removeAll</span><span class="jsdoc-syntax">();
 362
 363
 364                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel.className.split</span><span class="jsdoc-syntax">(/\s+/);
 365
 366                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">avs </span><span class="jsdoc-syntax">= [];
 367                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.styles</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'*'</span><span class="jsdoc-syntax">]) {
 368
 369                     </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.styles</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'*'</span><span class="jsdoc-syntax">], </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">) {
 370                         </span><span class="jsdoc-var">avs.push</span><span class="jsdoc-syntax">( [ </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cn.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">) &gt; -1 ? 1 : 0 ] );
 371                     });
 372                 }
 373                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.styles</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">tn</span><span class="jsdoc-syntax">]) {
 374                     </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.styles</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">tn</span><span class="jsdoc-syntax">], </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">) {
 375                         </span><span class="jsdoc-var">avs.push</span><span class="jsdoc-syntax">( [ </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cn.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">) &gt; -1 ? 1 : 0 ] );
 376                     });
 377                 }
 378
 379                 </span><span class="jsdoc-var">st.store.loadData</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">avs</span><span class="jsdoc-syntax">);
 380                 </span><span class="jsdoc-var">st.collapse</span><span class="jsdoc-syntax">();
 381                 </span><span class="jsdoc-var">st.setValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">);
 382             }
 383             </span><span class="jsdoc-comment">// flag our selected Node.
 384             </span><span class="jsdoc-var">this.tb.selectedNode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">;
 385
 386
 387             </span><span class="jsdoc-var">Roo.menu.MenuMgr.hideAll</span><span class="jsdoc-syntax">();
 388
 389         }
 390
 391         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">updateFooter</span><span class="jsdoc-syntax">) {
 392             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 393         }
 394         </span><span class="jsdoc-comment">// update the footer
 395         //
 396         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 397
 398         </span><span class="jsdoc-var">this.footerEls </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ans.reverse</span><span class="jsdoc-syntax">();
 399         </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.footerEls</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">) {
 400             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">) { </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">; }
 401             </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">html.length </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">' &amp;gt; '  </span><span class="jsdoc-syntax">:  </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 402
 403             </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">'&lt;span class=&quot;x-ed-loc-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'&quot;&gt;' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">a.tagName </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'&lt;/span&gt;'</span><span class="jsdoc-syntax">;
 404
 405         });
 406
 407         </span><span class="jsdoc-comment">//
 408         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">sz </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.footDisp.up</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'td'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.getSize</span><span class="jsdoc-syntax">();
 409         </span><span class="jsdoc-var">this.footDisp.dom.style.width </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">sz.width </span><span class="jsdoc-syntax">-10) + </span><span class="jsdoc-string">'px'</span><span class="jsdoc-syntax">;
 410         </span><span class="jsdoc-var">this.footDisp.dom.style.marginLeft </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'5px'</span><span class="jsdoc-syntax">;
 411
 412         </span><span class="jsdoc-var">this.footDisp.dom.style.overflow </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'hidden'</span><span class="jsdoc-syntax">;
 413
 414         </span><span class="jsdoc-var">this.footDisp.dom.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">;
 415
 416         </span><span class="jsdoc-comment">//this.editorsyncValue();
 417     </span><span class="jsdoc-syntax">},
 418
 419
 420     </span><span class="jsdoc-comment">// private
 421     </span><span class="jsdoc-var">onDestroy </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 422         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.rendered</span><span class="jsdoc-syntax">){
 423
 424             </span><span class="jsdoc-var">this.tb.items.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">){
 425                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item.menu</span><span class="jsdoc-syntax">){
 426                     </span><span class="jsdoc-var">item.menu.removeAll</span><span class="jsdoc-syntax">();
 427                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item.menu.el</span><span class="jsdoc-syntax">){
 428                         </span><span class="jsdoc-var">item.menu.el.destroy</span><span class="jsdoc-syntax">();
 429                     }
 430                 }
 431                 </span><span class="jsdoc-var">item.destroy</span><span class="jsdoc-syntax">();
 432             });
 433
 434         }
 435     },
 436     </span><span class="jsdoc-var">onFirstFocus</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
 437         </span><span class="jsdoc-comment">// need to do this for all the toolbars..
 438         </span><span class="jsdoc-var">this.tb.items.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">){
 439            </span><span class="jsdoc-var">item.enable</span><span class="jsdoc-syntax">();
 440         });
 441     },
 442     </span><span class="jsdoc-var">buildToolbar</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tlist</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">nm</span><span class="jsdoc-syntax">)
 443     {
 444         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">editor </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.editor</span><span class="jsdoc-syntax">;
 445          </span><span class="jsdoc-comment">// create a new element.
 446         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">wdiv </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">editor.wrap.createChild</span><span class="jsdoc-syntax">({
 447                 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'
 448             </span><span class="jsdoc-syntax">}, </span><span class="jsdoc-var">editor.wrap.dom.firstChild.nextSibling</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 449
 450
 451         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">tb </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.Toolbar</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">wdiv</span><span class="jsdoc-syntax">);
 452         </span><span class="jsdoc-comment">// add the name..
 453
 454         </span><span class="jsdoc-var">tb.add</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">nm</span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">&quot;:&amp;nbsp;&quot;</span><span class="jsdoc-syntax">);
 455
 456         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">styles </span><span class="jsdoc-syntax">= [];
 457         </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-keyword">in </span><span class="jsdoc-var">this.styles</span><span class="jsdoc-syntax">) {
 458             </span><span class="jsdoc-var">styles.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">);
 459         }
 460
 461         </span><span class="jsdoc-comment">// styles...
 462         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">styles </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">styles.length</span><span class="jsdoc-syntax">) {
 463
 464             </span><span class="jsdoc-comment">// this needs a multi-select checkbox...
 465             </span><span class="jsdoc-var">tb.addField</span><span class="jsdoc-syntax">( </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.form.ComboBox</span><span class="jsdoc-syntax">({
 466                 </span><span class="jsdoc-var">store</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.data.SimpleStore</span><span class="jsdoc-syntax">({
 467                     </span><span class="jsdoc-var">id </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'val'</span><span class="jsdoc-syntax">,
 468                     </span><span class="jsdoc-var">fields</span><span class="jsdoc-syntax">: [</span><span class="jsdoc-string">'val'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'selected'</span><span class="jsdoc-syntax">],
 469                     </span><span class="jsdoc-var">data </span><span class="jsdoc-syntax">: []
 470                 }),
 471                 </span><span class="jsdoc-var">name </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'className'</span><span class="jsdoc-syntax">,
 472                 </span><span class="jsdoc-var">displayField</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'val'</span><span class="jsdoc-syntax">,
 473                 </span><span class="jsdoc-var">typeAhead</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 474                 </span><span class="jsdoc-var">mode</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'local'</span><span class="jsdoc-syntax">,
 475                 </span><span class="jsdoc-var">editable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 476                 </span><span class="jsdoc-var">triggerAction</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'all'</span><span class="jsdoc-syntax">,
 477                 </span><span class="jsdoc-var">emptyText</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'Select Style'</span><span class="jsdoc-syntax">,
 478                 </span><span class="jsdoc-var">selectOnFocus</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 479                 </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 130,
 480                 </span><span class="jsdoc-var">listeners </span><span class="jsdoc-syntax">: {
 481                     </span><span class="jsdoc-string">'select'</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">c</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">) {
 482                         </span><span class="jsdoc-comment">// initial support only for on class per el..
 483                         </span><span class="jsdoc-var">tb.selectedNode.className </span><span class="jsdoc-syntax">=  </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">r.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'val'</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 484                         </span><span class="jsdoc-var">editor.syncValue</span><span class="jsdoc-syntax">();
 485                     }
 486                 }
 487
 488             }));
 489         }
 490
 491
 492
 493         </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-keyword">in </span><span class="jsdoc-var">tlist</span><span class="jsdoc-syntax">) {
 494
 495             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">item </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">tlist</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">];
 496             </span><span class="jsdoc-var">tb.add</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item.title </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">&quot;:&amp;nbsp;&quot;</span><span class="jsdoc-syntax">);
 497
 498
 499
 500
 501             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item.opts</span><span class="jsdoc-syntax">) {
 502                 </span><span class="jsdoc-comment">// opts == pulldown..
 503                 </span><span class="jsdoc-var">tb.addField</span><span class="jsdoc-syntax">( </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.form.ComboBox</span><span class="jsdoc-syntax">({
 504                     </span><span class="jsdoc-var">store</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.data.SimpleStore</span><span class="jsdoc-syntax">({
 505                         </span><span class="jsdoc-var">id </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'val'</span><span class="jsdoc-syntax">,
 506                         </span><span class="jsdoc-var">fields</span><span class="jsdoc-syntax">: [</span><span class="jsdoc-string">'val'</span><span class="jsdoc-syntax">],
 507                         </span><span class="jsdoc-var">data </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">item.opts
 508                     </span><span class="jsdoc-syntax">}),
 509                     </span><span class="jsdoc-var">name </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">,
 510                     </span><span class="jsdoc-var">displayField</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'val'</span><span class="jsdoc-syntax">,
 511                     </span><span class="jsdoc-var">typeAhead</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 512                     </span><span class="jsdoc-var">mode</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'local'</span><span class="jsdoc-syntax">,
 513                     </span><span class="jsdoc-var">editable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 514                     </span><span class="jsdoc-var">triggerAction</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'all'</span><span class="jsdoc-syntax">,
 515                     </span><span class="jsdoc-var">emptyText</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'Select'</span><span class="jsdoc-syntax">,
 516                     </span><span class="jsdoc-var">selectOnFocus</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 517                     </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">item.width </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">item.width  </span><span class="jsdoc-syntax">: 130,
 518                     </span><span class="jsdoc-var">listeners </span><span class="jsdoc-syntax">: {
 519                         </span><span class="jsdoc-string">'select'</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">c</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">) {
 520                             </span><span class="jsdoc-var">tb.selectedNode.setAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">c.name</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">r.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'val'</span><span class="jsdoc-syntax">));
 521                         }
 522                     }
 523
 524                 }));
 525                 </span><span class="jsdoc-keyword">continue</span><span class="jsdoc-syntax">;
 526
 527
 528
 529                 </span><span class="jsdoc-var">tb.addField</span><span class="jsdoc-syntax">( </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.form.TextField</span><span class="jsdoc-syntax">({
 530                     </span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">,
 531                     </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 100,
 532                     </span><span class="jsdoc-comment">//allowBlank:false,
 533                     </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''
 534                 </span><span class="jsdoc-syntax">}));
 535                 </span><span class="jsdoc-keyword">continue</span><span class="jsdoc-syntax">;
 536             }
 537             </span><span class="jsdoc-var">tb.addField</span><span class="jsdoc-syntax">( </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.form.TextField</span><span class="jsdoc-syntax">({
 538                 </span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">,
 539                 </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">item.width</span><span class="jsdoc-syntax">,
 540                 </span><span class="jsdoc-comment">//allowBlank:true,
 541                 </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
 542                 </span><span class="jsdoc-var">listeners</span><span class="jsdoc-syntax">: {
 543                     </span><span class="jsdoc-string">'change' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">nv</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">ov</span><span class="jsdoc-syntax">) {
 544                         </span><span class="jsdoc-var">tb.selectedNode.setAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">f.name</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">nv</span><span class="jsdoc-syntax">);
 545                     }
 546                 }
 547             }));
 548
 549         }
 550         </span><span class="jsdoc-var">tb.el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</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">){
 551             </span><span class="jsdoc-var">e.preventDefault</span><span class="jsdoc-syntax">(); </span><span class="jsdoc-comment">// what does this do?
 552         </span><span class="jsdoc-syntax">});
 553         </span><span class="jsdoc-var">tb.el.setVisibilityMode</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">Roo.Element.DISPLAY</span><span class="jsdoc-syntax">);
 554         </span><span class="jsdoc-var">tb.el.hide</span><span class="jsdoc-syntax">();
 555         </span><span class="jsdoc-var">tb.name </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">nm</span><span class="jsdoc-syntax">;
 556         </span><span class="jsdoc-comment">// dont need to disable them... as they will get hidden
 557         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">tb</span><span class="jsdoc-syntax">;
 558
 559
 560     },
 561     </span><span class="jsdoc-var">buildFooter </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 562     {
 563
 564         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">fel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.editor.wrap.createChild</span><span class="jsdoc-syntax">();
 565         </span><span class="jsdoc-var">this.footer </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.Toolbar</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">fel</span><span class="jsdoc-syntax">);
 566         </span><span class="jsdoc-comment">// toolbar has scrolly on left / right?
 567         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">footDisp</span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.Toolbar.Fill</span><span class="jsdoc-syntax">();
 568         </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">;
 569         </span><span class="jsdoc-var">this.footer.add</span><span class="jsdoc-syntax">(
 570             {
 571                 </span><span class="jsdoc-var">text </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'&amp;lt;'</span><span class="jsdoc-syntax">,
 572                 </span><span class="jsdoc-var">xtype</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Button'</span><span class="jsdoc-syntax">,
 573                 </span><span class="jsdoc-var">handler </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
 574                     </span><span class="jsdoc-var">_t.footDisp.scrollTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'left'</span><span class="jsdoc-syntax">,0,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)
 575                 }
 576             }
 577         );
 578         </span><span class="jsdoc-var">this.footer.add</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">footDisp </span><span class="jsdoc-syntax">);
 579         </span><span class="jsdoc-var">this.footer.add</span><span class="jsdoc-syntax">(
 580             {
 581                 </span><span class="jsdoc-var">text </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'&amp;gt;'</span><span class="jsdoc-syntax">,
 582                 </span><span class="jsdoc-var">xtype</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Button'</span><span class="jsdoc-syntax">,
 583                 </span><span class="jsdoc-var">handler </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
 584                     </span><span class="jsdoc-comment">// no animation..
 585                     </span><span class="jsdoc-var">_t.footDisp.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.last</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.scrollIntoView</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">_t.footDisp</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 586                 }
 587             }
 588         );
 589         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">fel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">footDisp.el</span><span class="jsdoc-syntax">);
 590         </span><span class="jsdoc-var">fel.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'x-editor-context'</span><span class="jsdoc-syntax">);
 591         </span><span class="jsdoc-var">this.footDispWrap </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">fel</span><span class="jsdoc-syntax">;
 592         </span><span class="jsdoc-var">this.footDispWrap.overflow  </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'hidden'</span><span class="jsdoc-syntax">;
 593
 594         </span><span class="jsdoc-var">this.footDisp </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">fel.createChild</span><span class="jsdoc-syntax">();
 595         </span><span class="jsdoc-var">this.footDispWrap.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onContextClick</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">)
 596
 597
 598     },
 599     </span><span class="jsdoc-var">onContextClick </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">,</span><span class="jsdoc-var">dom</span><span class="jsdoc-syntax">)
 600     {
 601         </span><span class="jsdoc-var">ev.preventDefault</span><span class="jsdoc-syntax">();
 602         </span><span class="jsdoc-keyword">var  </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">dom.className</span><span class="jsdoc-syntax">;
 603         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">);
 604         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">cn.match</span><span class="jsdoc-syntax">(/x-ed-loc-/)) {
 605             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 606         }
 607         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">n </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">cn.split</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'-'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.pop</span><span class="jsdoc-syntax">();
 608         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ans </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.footerEls</span><span class="jsdoc-syntax">;
 609         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">sel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ans</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">];
 610
 611          </span><span class="jsdoc-comment">// pick
 612         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">range </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.editor.createRange</span><span class="jsdoc-syntax">();
 613
 614         </span><span class="jsdoc-var">range.selectNodeContents</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">);
 615         </span><span class="jsdoc-comment">//range.selectNode(sel);
 616
 617
 618         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">selection </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.editor.getSelection</span><span class="jsdoc-syntax">();
 619         </span><span class="jsdoc-var">selection.removeAllRanges</span><span class="jsdoc-syntax">();
 620         </span><span class="jsdoc-var">selection.addRange</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">range</span><span class="jsdoc-syntax">);
 621
 622
 623
 624         </span><span class="jsdoc-var">this.updateToolbar</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">);
 625
 626
 627     }
 628
 629
 630
 631
 632
 633 });
 634
 635
 636
 637
 638
 639 </span></code></body></html>