Merge branch 'master' of http://git.roojs.com/roojs1
[roojs1] / docs / src / Roo_bootstrap_form_HtmlEditorToolbar_Standard.js.html
1 <html><head><title>Roo/bootstrap/form/HtmlEditorToolbar/Standard.js</title><link rel="stylesheet" type="text/css" href="../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty">
2 <span class="jsdoc-comment">/**
3  * @class Roo.bootstrap.form.HtmlEditorToolbar.Standard
4  * @parent Roo.bootstrap.form.HtmlEditor
5  * @extends Roo.bootstrap.nav.Simplebar
6  * Basic Toolbar
7  * 
8  * @example
9  * Usage:
10  *
11  new Roo.bootstrap.form.HtmlEditor({
12     ....
13     toolbars : [
14         new Roo.bootstrap.form.HtmlEditorToolbar.Standard({
15             disable : { fonts: 1 , format: 1, ..., ... , ...],
16             btns : [ .... ]
17         })
18     }
19      
20  * 
21  * @cfg {Object} disable List of elements to disable..
22  * @cfg {Array} btns List of additional buttons.
23  * 
24  * 
25  * NEEDS Extra CSS? 
26  * .x-html-editor-tb .x-edit-none .x-btn-text { background: none; }
27  */
28
29 </span><span class="jsdoc-var">Roo.bootstrap.form.HtmlEditorToolbar.Standard </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">)
30 {
31
32     </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">);
33
34     </span><span class="jsdoc-comment">// default disabled, based on 'good practice'..
35     </span><span class="jsdoc-var">this.disable </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.disable </span><span class="jsdoc-syntax">|| {};
36     </span><span class="jsdoc-var">Roo.applyIf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.disable</span><span class="jsdoc-syntax">, {
37         </span><span class="jsdoc-var">fontSize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
38         </span><span class="jsdoc-var">colors </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
39         </span><span class="jsdoc-var">specialElements </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
40     </span><span class="jsdoc-syntax">});
41     </span><span class="jsdoc-var">Roo.bootstrap.form.HtmlEditorToolbar.Standard.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">);
42
43     </span><span class="jsdoc-var">this.editor </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">config.editor</span><span class="jsdoc-syntax">;
44     </span><span class="jsdoc-var">this.editorcore </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">config.editor.editorcore</span><span class="jsdoc-syntax">;
45
46     </span><span class="jsdoc-var">this.buttons   </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.util.MixedCollection</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">) { </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">o.btnid</span><span class="jsdoc-syntax">; });
47
48     </span><span class="jsdoc-comment">//Roo.form.HtmlEditorToolbar1.superclass.constructor.call(this, editor.wrap.dom.firstChild, [], config);
49     // dont call parent... till later.
50 </span><span class="jsdoc-syntax">}
51 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.form.HtmlEditorToolbar.Standard</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.nav.Simplebar</span><span class="jsdoc-syntax">,  {
52
53     </span><span class="jsdoc-var">bar </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
54
55     </span><span class="jsdoc-var">editor </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
56     </span><span class="jsdoc-var">editorcore </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
57
58
59     </span><span class="jsdoc-var">formats </span><span class="jsdoc-syntax">: [
60         </span><span class="jsdoc-string">&quot;p&quot; </span><span class="jsdoc-syntax">,
61         </span><span class="jsdoc-string">&quot;h1&quot;</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">&quot;h2&quot;</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">&quot;h3&quot;</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">&quot;h4&quot;</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">&quot;h5&quot;</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">&quot;h6&quot;</span><span class="jsdoc-syntax">,
62         </span><span class="jsdoc-string">&quot;pre&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;code&quot;</span><span class="jsdoc-syntax">,
63         </span><span class="jsdoc-string">&quot;abbr&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;acronym&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;address&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;cite&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;samp&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;var&quot;</span><span class="jsdoc-syntax">,
64         </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">'span'
65     </span><span class="jsdoc-syntax">],
66
67
68     </span><span class="jsdoc-var">deleteBtn</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
69
70     </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">)
71     {
72        </span><span class="jsdoc-comment">// Roo.log(&quot;Call onRender: &quot; + this.xtype);
73
74        </span><span class="jsdoc-var">Roo.bootstrap.form.HtmlEditorToolbar.Standard.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">);
75        </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">);
76        </span><span class="jsdoc-var">this.el.dom.style.marginBottom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'0'</span><span class="jsdoc-syntax">;
77        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_this </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
78        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">editorcore </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.editorcore</span><span class="jsdoc-syntax">;
79        </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">;
80
81        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">children </span><span class="jsdoc-syntax">= [];
82        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">btn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cmd </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">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">){
83
84             </span><span class="jsdoc-keyword">var  </span><span class="jsdoc-var">event </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">toggle </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'toggle' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">;
85
86             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">a </span><span class="jsdoc-syntax">= {
87                 </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'sm'</span><span class="jsdoc-syntax">,
88                 </span><span class="jsdoc-var">xtype</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Button'</span><span class="jsdoc-syntax">,
89                 </span><span class="jsdoc-var">xns</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.bootstrap</span><span class="jsdoc-syntax">,
90                 </span><span class="jsdoc-comment">//glyphicon : id,
91                 </span><span class="jsdoc-var">btnid </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">,
92                 </span><span class="jsdoc-var">fa</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">,
93                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-html-editor-btn-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">,
94                 </span><span class="jsdoc-var">cmd </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">cmd</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// why id || cmd
95                 </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">,
96                 </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
97                 </span><span class="jsdoc-var">pressed </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">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
98                 </span><span class="jsdoc-var">listeners </span><span class="jsdoc-syntax">: {}
99             };
100             </span><span class="jsdoc-var">a.listeners</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">toggle </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'toggle' </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">() {
101                 </span><span class="jsdoc-var">handler </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">handler.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">_this</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">) :</span><span class="jsdoc-var">_this.onBtnClick.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">_this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cmd </span><span class="jsdoc-syntax">||  </span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">);
102             };
103             </span><span class="jsdoc-var">children.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">);
104             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">;
105        }
106
107     </span><span class="jsdoc-comment">//    var cb_box = function...
108
109         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">style </span><span class="jsdoc-syntax">= {
110                 </span><span class="jsdoc-var">xtype</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Button'</span><span class="jsdoc-syntax">,
111                 </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'sm'</span><span class="jsdoc-syntax">,
112                 </span><span class="jsdoc-var">xns</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.bootstrap</span><span class="jsdoc-syntax">,
113                 </span><span class="jsdoc-var">fa </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'font'</span><span class="jsdoc-syntax">,
114                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-html-editor-font-chooser'</span><span class="jsdoc-syntax">,
115                 </span><span class="jsdoc-comment">//html : 'submit'
116                 </span><span class="jsdoc-var">menu </span><span class="jsdoc-syntax">: {
117                     </span><span class="jsdoc-var">xtype</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Menu'</span><span class="jsdoc-syntax">,
118                     </span><span class="jsdoc-var">xns</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.bootstrap</span><span class="jsdoc-syntax">,
119                     </span><span class="jsdoc-var">items</span><span class="jsdoc-syntax">:  []
120                 }
121         };
122         </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.formats</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">) {
123             </span><span class="jsdoc-var">style.menu.items.push</span><span class="jsdoc-syntax">({
124                 </span><span class="jsdoc-var">xtype </span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'MenuItem'</span><span class="jsdoc-syntax">,
125                 </span><span class="jsdoc-var">xns</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.bootstrap</span><span class="jsdoc-syntax">,
126                 </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'&lt;'</span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">+</span><span class="jsdoc-string">' style=&quot;margin:2px&quot;&gt;'</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">f </span><span class="jsdoc-syntax">+</span><span class="jsdoc-string">'&lt;/'</span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">+</span><span class="jsdoc-string">'&gt;'</span><span class="jsdoc-syntax">,
127                 </span><span class="jsdoc-var">tagname </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">,
128                 </span><span class="jsdoc-var">listeners </span><span class="jsdoc-syntax">: {
129                     </span><span class="jsdoc-var">click </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
130                     {
131                         </span><span class="jsdoc-var">editorcore.insertTag</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tagname</span><span class="jsdoc-syntax">);
132                         </span><span class="jsdoc-var">editor.focus</span><span class="jsdoc-syntax">();
133                     }
134                 }
135
136             });
137         });
138         </span><span class="jsdoc-var">children.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">style</span><span class="jsdoc-syntax">);
139
140         </span><span class="jsdoc-var">btn</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'bold'</span><span class="jsdoc-syntax">,         </span><span class="jsdoc-string">'bold'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
141         </span><span class="jsdoc-var">btn</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'italic'</span><span class="jsdoc-syntax">,       </span><span class="jsdoc-string">'italic'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
142         </span><span class="jsdoc-var">btn</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'underline'</span><span class="jsdoc-syntax">,     </span><span class="jsdoc-string">'underline'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
143         </span><span class="jsdoc-var">btn</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'align-left'</span><span class="jsdoc-syntax">,   </span><span class="jsdoc-string">'justifyleft'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
144         </span><span class="jsdoc-var">btn</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'align-center'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'justifycenter'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
145         </span><span class="jsdoc-var">btn</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'align-right' </span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'justifyright'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
146         </span><span class="jsdoc-var">btn</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'link'</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">, </span><span class="jsdoc-var">this.onLinkClick</span><span class="jsdoc-syntax">);
147
148
149         </span><span class="jsdoc-var">btn</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'image'</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">, </span><span class="jsdoc-var">this.onImageClick</span><span class="jsdoc-syntax">);
150         </span><span class="jsdoc-var">btn</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'list'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">'insertunorderedlist'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
151         </span><span class="jsdoc-var">btn</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'list-ol'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">'insertorderedlist'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
152
153         </span><span class="jsdoc-var">btn</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'pencil'</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">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">btn</span><span class="jsdoc-syntax">){
154                 </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
155                 </span><span class="jsdoc-var">this.toggleSourceEdit</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">btn.pressed</span><span class="jsdoc-syntax">);
156         });
157
158         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.editor.btns.length </span><span class="jsdoc-syntax">&gt; 0) {
159             </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">this.editor.btns.length</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++) {
160                 </span><span class="jsdoc-var">children.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.editor.btns</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]);
161             }
162         }
163
164
165
166         </span><span class="jsdoc-var">this.xtype </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'NavSimplebar'</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// why?
167
168         </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">children.length</span><span class="jsdoc-syntax">;</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++) {
169
170             </span><span class="jsdoc-var">this.buttons.add</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.addxtypeChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">children</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]));
171
172         }
173         </span><span class="jsdoc-var">this.buildToolbarDelete</span><span class="jsdoc-syntax">();
174
175         </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">);
176     },
177
178     </span><span class="jsdoc-var">buildToolbarDelete </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
179     {
180
181        </span><span class="jsdoc-comment">/* this.addxtypeChild({
182             xtype : 'Element',
183             xns : Roo.bootstrap,
184             cls : 'roo-htmleditor-fill'
185         });
186         */
187         </span><span class="jsdoc-var">this.deleteBtn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.addxtypeChild</span><span class="jsdoc-syntax">({
188             </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'sm'</span><span class="jsdoc-syntax">,
189             </span><span class="jsdoc-var">xtype</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Button'</span><span class="jsdoc-syntax">,
190             </span><span class="jsdoc-var">xns</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.bootstrap</span><span class="jsdoc-syntax">,
191             </span><span class="jsdoc-var">fa</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'trash'</span><span class="jsdoc-syntax">,
192             </span><span class="jsdoc-var">listeners </span><span class="jsdoc-syntax">: {
193                 </span><span class="jsdoc-var">click </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.onDelete.createDelegate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">)
194             }
195         });
196         </span><span class="jsdoc-var">this.deleteBtn.hide</span><span class="jsdoc-syntax">();
197
198     },
199
200     </span><span class="jsdoc-var">onImageClick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
201     {
202         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.input</span><span class="jsdoc-syntax">) {
203             </span><span class="jsdoc-var">this.input.un</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'change'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onFileSelected</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
204         }
205         </span><span class="jsdoc-var">this.input </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">({
206           </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'input'</span><span class="jsdoc-syntax">,
207           </span><span class="jsdoc-var">type </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'file'</span><span class="jsdoc-syntax">,
208           </span><span class="jsdoc-var">style </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'display:none'</span><span class="jsdoc-syntax">,
209           </span><span class="jsdoc-var">multiple</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'multiple'
210        </span><span class="jsdoc-syntax">});
211         </span><span class="jsdoc-var">this.input.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'change'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onFileSelected</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
212         </span><span class="jsdoc-var">this.input.dom.click</span><span class="jsdoc-syntax">();
213     },
214
215     </span><span class="jsdoc-var">onFileSelected </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">)
216     {
217          </span><span class="jsdoc-var">e.preventDefault</span><span class="jsdoc-syntax">();
218
219         </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.input.dom.files</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">this.input.dom.files.length</span><span class="jsdoc-syntax">){
220             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
221         }
222
223
224         </span><span class="jsdoc-var">this.addFiles</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Array.prototype.slice.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.input.dom.files</span><span class="jsdoc-syntax">), </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
225     },
226
227     </span><span class="jsdoc-var">addFiles </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">far</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">fire_add</span><span class="jsdoc-syntax">) {
228
229
230         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">editor </span><span class="jsdoc-syntax">=  </span><span class="jsdoc-var">this.editorcore</span><span class="jsdoc-syntax">;
231
232         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">far.length</span><span class="jsdoc-syntax">) {
233             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">fire_add</span><span class="jsdoc-syntax">) {
234                 </span><span class="jsdoc-var">this.editor.syncValue</span><span class="jsdoc-syntax">();
235                 </span><span class="jsdoc-var">editor.owner.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'editorevent'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">editor.owner</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
236                 </span><span class="jsdoc-var">editor.owner.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'imageadd'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">editor.owner</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
237             }
238             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
239         }
240
241         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">f </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">far.pop</span><span class="jsdoc-syntax">();
242
243         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">f.type.match</span><span class="jsdoc-syntax">(/^image/)) {
244             </span><span class="jsdoc-var">this.addFiles</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">far</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">fire_add</span><span class="jsdoc-syntax">);
245             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
246         }
247
248         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">sn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.selectedNode</span><span class="jsdoc-syntax">;
249
250         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">bl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sn  </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.editorcore.enableBlocks </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">Roo.htmleditor.Block.factory</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sn</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
251
252
253         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">reader </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">FileReader</span><span class="jsdoc-syntax">();
254         </span><span class="jsdoc-var">reader.addEventListener</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'load'</span><span class="jsdoc-syntax">, (</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
255             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">bl</span><span class="jsdoc-syntax">) {
256                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">oldSrc </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">bl.image_src</span><span class="jsdoc-syntax">;
257                 </span><span class="jsdoc-var">bl.image_src </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">reader.result</span><span class="jsdoc-syntax">;
258                 </span><span class="jsdoc-comment">//bl.caption = f.name;
259                 </span><span class="jsdoc-var">bl.updateElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sn</span><span class="jsdoc-syntax">);
260                 </span><span class="jsdoc-var">this.editor.syncValue</span><span class="jsdoc-syntax">();
261                 </span><span class="jsdoc-var">editor.owner.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'editorevent'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">editor.owner</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
262                 </span><span class="jsdoc-var">editor.owner.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'imageupdate'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">editor.owner</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sn</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">oldSrc</span><span class="jsdoc-syntax">);
263                 </span><span class="jsdoc-comment">// we only do the first file!! and replace.
264                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
265             }
266             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.editorcore.enableBlocks</span><span class="jsdoc-syntax">) {
267                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">fig </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.htmleditor.BlockFigure</span><span class="jsdoc-syntax">({
268                     </span><span class="jsdoc-var">image_src </span><span class="jsdoc-syntax">:  </span><span class="jsdoc-var">reader.result</span><span class="jsdoc-syntax">,
269                     </span><span class="jsdoc-var">caption </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
270                     </span><span class="jsdoc-var">caption_display </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'none'  </span><span class="jsdoc-comment">//default to hide captions..
271                  </span><span class="jsdoc-syntax">});
272                 </span><span class="jsdoc-var">editor.insertAtCursor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">fig.toHTML</span><span class="jsdoc-syntax">());
273                 </span><span class="jsdoc-var">this.addFiles</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">far</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
274                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
275             }
276             </span><span class="jsdoc-comment">// just a standard img..
277             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sn </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">sn.tagName.toUpperCase</span><span class="jsdoc-syntax">() == </span><span class="jsdoc-string">'IMG'</span><span class="jsdoc-syntax">) {
278                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">oldSrc </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sn.src</span><span class="jsdoc-syntax">;
279                 </span><span class="jsdoc-var">sn.src </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">reader.result</span><span class="jsdoc-syntax">;
280                 </span><span class="jsdoc-var">this.editor.syncValue</span><span class="jsdoc-syntax">();
281                 </span><span class="jsdoc-var">editor.owner.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'editorevent'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">editor.owner</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
282                 </span><span class="jsdoc-var">editor.owner.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'imageupdate'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">editor.owner</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sn</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">oldSrc</span><span class="jsdoc-syntax">);
283                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
284             }
285             </span><span class="jsdoc-var">editor.insertAtCursor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'&lt;img src=&quot;' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">reader.result </span><span class="jsdoc-syntax">+</span><span class="jsdoc-string">'&quot;&gt;'</span><span class="jsdoc-syntax">);
286             </span><span class="jsdoc-var">this.addFiles</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">far</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
287
288         })</span><span class="jsdoc-var">.createDelegate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">));
289         </span><span class="jsdoc-var">reader.readAsDataURL</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">);
290
291
292      },
293
294
295     </span><span class="jsdoc-var">onBtnClick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">)
296     {
297        </span><span class="jsdoc-var">this.editorcore.relayCmd</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">);
298        </span><span class="jsdoc-var">this.editorcore.focus</span><span class="jsdoc-syntax">();
299     },
300
301     </span><span class="jsdoc-var">onLinkClick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">btn</span><span class="jsdoc-syntax">) {
302         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">url </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.selectedNode </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.selectedNode.tagName.toUpperCase</span><span class="jsdoc-syntax">() == </span><span class="jsdoc-string">'A' </span><span class="jsdoc-syntax">?
303                 </span><span class="jsdoc-var">this.selectedNode.getAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'href'</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
304
305         </span><span class="jsdoc-var">Roo.bootstrap.MessageBox.show</span><span class="jsdoc-syntax">({
306             </span><span class="jsdoc-var">title </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Add / Edit Link URL&quot;</span><span class="jsdoc-syntax">,
307             </span><span class="jsdoc-var">msg </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Enter the URL for the link&quot;</span><span class="jsdoc-syntax">,
308             </span><span class="jsdoc-var">buttons</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.bootstrap.MessageBox.OKCANCEL</span><span class="jsdoc-syntax">,
309             </span><span class="jsdoc-var">minWidth</span><span class="jsdoc-syntax">: 250,
310             </span><span class="jsdoc-var">scope </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">,
311             </span><span class="jsdoc-var">prompt</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
312             </span><span class="jsdoc-var">multiline</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
313             </span><span class="jsdoc-var">modal </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
314             </span><span class="jsdoc-var">value </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">url</span><span class="jsdoc-syntax">,
315             </span><span class="jsdoc-var">fn</span><span class="jsdoc-syntax">:  </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pressed</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">newurl</span><span class="jsdoc-syntax">) {
316                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pressed </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">'ok'</span><span class="jsdoc-syntax">) {
317                     </span><span class="jsdoc-var">this.editorcore.focus</span><span class="jsdoc-syntax">();
318                     </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
319                 }
320                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">url </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">) {
321                     </span><span class="jsdoc-var">this.selectedNode.setAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'href'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">newurl</span><span class="jsdoc-syntax">);
322                     </span><span class="jsdoc-var">this.editor.syncValue</span><span class="jsdoc-syntax">();
323                     </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
324                 }
325                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">newurl </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">newurl .match</span><span class="jsdoc-syntax">(/http(s):\/\/.+/)) {
326                     </span><span class="jsdoc-var">this.editorcore.relayCmd</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'createlink'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">newurl</span><span class="jsdoc-syntax">);
327                 }
328                 </span><span class="jsdoc-var">this.editorcore.focus</span><span class="jsdoc-syntax">();
329             },
330             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.editorcore.linkDialogCls
331         </span><span class="jsdoc-syntax">});
332     },
333     </span><span class="jsdoc-comment">/**
334      * Protected method that will not generally be called directly. It triggers
335      * a toolbar update by reading the markup state of the current selection in the editor.
336      */
337     </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">){
338
339         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.editorcore.activated</span><span class="jsdoc-syntax">){
340             </span><span class="jsdoc-var">this.editor.onFirstFocus</span><span class="jsdoc-syntax">(); </span><span class="jsdoc-comment">// is this neeed?
341             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
342         }
343
344         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">btns </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.buttons</span><span class="jsdoc-syntax">;
345         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">doc </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.editorcore.doc</span><span class="jsdoc-syntax">;
346         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hasToggle  </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
347         </span><span class="jsdoc-var">btns.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">) {
348             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.enableToggle </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">e.cmd</span><span class="jsdoc-syntax">) {
349                 </span><span class="jsdoc-var">hasToggle </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">hasToggle  </span><span class="jsdoc-syntax">|| ([</span><span class="jsdoc-string">'align-left'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'align-right'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'align-center'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'image' </span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'link'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'underline'</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.btnid</span><span class="jsdoc-syntax">) &lt; 0 &amp;&amp; </span><span class="jsdoc-var">doc.queryCommandState</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.cmd</span><span class="jsdoc-syntax">));
350                 </span><span class="jsdoc-var">e.setActive</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">doc.queryCommandState</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.cmd</span><span class="jsdoc-syntax">));
351             }
352         }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
353
354
355         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ev </span><span class="jsdoc-syntax">&amp;&amp;
356             (</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;
357             </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">'BODY' </span><span class="jsdoc-syntax">) { </span><span class="jsdoc-comment">// &amp;&amp; ev.target.tagName == 'IMG') {
358             // they have click on an image...
359             // let's see if we can change the selection...
360             </span><span class="jsdoc-var">sel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ev.target</span><span class="jsdoc-syntax">;
361
362         }
363
364         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ans </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.editorcore.getAllAncestors</span><span class="jsdoc-syntax">();
365         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">) {
366             </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.editorcore.doc.body</span><span class="jsdoc-syntax">;
367             </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.editorcore.doc.body</span><span class="jsdoc-syntax">;
368             </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.editorcore.doc.body</span><span class="jsdoc-syntax">;
369
370         }
371
372         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">lastSel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.selectedNode</span><span class="jsdoc-syntax">;
373         </span><span class="jsdoc-var">this.selectedNode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">;
374
375         </span><span class="jsdoc-comment">// ok see if we are editing a block?
376
377         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">db </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
378         </span><span class="jsdoc-comment">// you are not actually selecting the block.
379         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sel </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">sel.hasAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'data-block'</span><span class="jsdoc-syntax">)) {
380             </span><span class="jsdoc-var">db </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">;
381         } </span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sel </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">sel.closest</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'[data-block]'</span><span class="jsdoc-syntax">)) {
382             </span><span class="jsdoc-var">db </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel.closest</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'[data-block]'</span><span class="jsdoc-syntax">);
383         }
384
385         </span><span class="jsdoc-var">Array.from</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.editorcore.doc.body.querySelectorAll</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-ed-selection'</span><span class="jsdoc-syntax">))</span><span class="jsdoc-var">.forEach</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">) {
386             </span><span class="jsdoc-var">e.classList.remove</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'roo-ed-selection'</span><span class="jsdoc-syntax">);
387         });
388
389         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">block </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
390         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">db </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.editorcore.enableBlocks</span><span class="jsdoc-syntax">) {
391             </span><span class="jsdoc-var">block </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.htmleditor.Block.factory</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">db</span><span class="jsdoc-syntax">);
392
393             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">block</span><span class="jsdoc-syntax">) {
394                 </span><span class="jsdoc-var">db.className </span><span class="jsdoc-syntax">=  (</span><span class="jsdoc-var">db.classList.length </span><span class="jsdoc-syntax">&gt; 0  ? </span><span class="jsdoc-var">db.className </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">' ' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">) +
395                     </span><span class="jsdoc-string">' roo-ed-selection'</span><span class="jsdoc-syntax">;
396                 </span><span class="jsdoc-var">sel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.selectedNode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">db</span><span class="jsdoc-syntax">;
397             }
398         }
399
400         </span><span class="jsdoc-comment">// highlight the 'a'..
401         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">tn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">sel.tagName.toUpperCase</span><span class="jsdoc-syntax">() || </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
402         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">block </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">sel </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">tn </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">'A'</span><span class="jsdoc-syntax">) {
403             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">asel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel.closest</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'A'</span><span class="jsdoc-syntax">);
404             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">asel</span><span class="jsdoc-syntax">) {
405                 </span><span class="jsdoc-var">sel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">asel</span><span class="jsdoc-syntax">;
406             }
407         }
408
409         </span><span class="jsdoc-var">btns.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'link'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.setActive</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tn </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'A' </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.selectedNode.hasAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'href'</span><span class="jsdoc-syntax">));
410         </span><span class="jsdoc-var">btns.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'image'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.setActive</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tn </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'IMG' </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.editorcore.enableBlocks </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">tn </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'FIGURE'</span><span class="jsdoc-syntax">);
411         </span><span class="jsdoc-var">btns.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'underline'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.setActive</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tn </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'U' </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">sel.closest</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'u'</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-keyword">true </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
412
413         </span><span class="jsdoc-var">Roo.bootstrap.menu.Manager.hideAll</span><span class="jsdoc-syntax">();
414
415
416
417
418
419         </span><span class="jsdoc-comment">// handle delete button..
420         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hasToggle </span><span class="jsdoc-syntax">|| (</span><span class="jsdoc-var">tn.length </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">tn </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'BODY'</span><span class="jsdoc-syntax">)) {
421             </span><span class="jsdoc-var">this.deleteBtn.hide</span><span class="jsdoc-syntax">();
422             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
423
424         }
425         </span><span class="jsdoc-var">this.deleteBtn.show</span><span class="jsdoc-syntax">();
426
427
428
429         </span><span class="jsdoc-comment">//this.editorsyncValue();
430     </span><span class="jsdoc-syntax">},
431     </span><span class="jsdoc-var">onFirstFocus</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
432         </span><span class="jsdoc-var">this.buttons.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">){
433            </span><span class="jsdoc-var">item.enable</span><span class="jsdoc-syntax">();
434         });
435     },
436
437     </span><span class="jsdoc-var">onDelete </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
438     {
439         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">range </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.editorcore.createRange</span><span class="jsdoc-syntax">();
440         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">selection </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.editorcore.getSelection</span><span class="jsdoc-syntax">();
441         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">sn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.selectedNode</span><span class="jsdoc-syntax">;
442         </span><span class="jsdoc-var">range.setStart</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sn</span><span class="jsdoc-syntax">,0);
443         </span><span class="jsdoc-var">range.setEnd</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sn</span><span class="jsdoc-syntax">,0);
444
445
446         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sn.hasAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'data-block'</span><span class="jsdoc-syntax">)) {
447             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">block </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.htmleditor.Block.factory</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.selectedNode</span><span class="jsdoc-syntax">);
448             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">block</span><span class="jsdoc-syntax">) {
449                 </span><span class="jsdoc-var">sn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">block.removeNode</span><span class="jsdoc-syntax">();
450                 </span><span class="jsdoc-var">sn.parentNode.removeChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sn</span><span class="jsdoc-syntax">);
451                 </span><span class="jsdoc-var">selection.removeAllRanges</span><span class="jsdoc-syntax">();
452                 </span><span class="jsdoc-var">selection.addRange</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">range</span><span class="jsdoc-syntax">);
453                 </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-keyword">null</span><span class="jsdoc-syntax">);
454                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sn.tagName.toUpperCase</span><span class="jsdoc-syntax">() == </span><span class="jsdoc-string">'FIGURE'</span><span class="jsdoc-syntax">) {
455                     </span><span class="jsdoc-var">this.editor.syncValue</span><span class="jsdoc-syntax">();
456                     </span><span class="jsdoc-var">this.editor.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'imagedelete'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.editor</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sn</span><span class="jsdoc-syntax">);
457                 }
458
459                 </span><span class="jsdoc-var">this.selectedNode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
460                 </span><span class="jsdoc-var">this.editorcore.fireEditorEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
461                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
462             }
463
464         }
465         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">sn</span><span class="jsdoc-syntax">) {
466             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// should not really happen..
467         </span><span class="jsdoc-syntax">}
468         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sn </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">sn.tagName </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'BODY'</span><span class="jsdoc-syntax">) {
469             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
470         }
471         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">stn </span><span class="jsdoc-syntax">=  </span><span class="jsdoc-var">sn.childNodes</span><span class="jsdoc-syntax">[0] || </span><span class="jsdoc-var">sn.nextSibling </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">sn.previousSibling </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">sn.parentNode</span><span class="jsdoc-syntax">;
472
473         </span><span class="jsdoc-comment">// remove and keep parents.
474         </span><span class="jsdoc-var">a </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.htmleditor.FilterKeepChildren</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">});
475         </span><span class="jsdoc-var">a.replaceTag</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sn</span><span class="jsdoc-syntax">);
476
477         </span><span class="jsdoc-var">selection.removeAllRanges</span><span class="jsdoc-syntax">();
478         </span><span class="jsdoc-var">selection.addRange</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">range</span><span class="jsdoc-syntax">);
479         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sn.tagName.toUpperCase</span><span class="jsdoc-syntax">() == </span><span class="jsdoc-string">'IMG&quot;'</span><span class="jsdoc-syntax">) {
480             </span><span class="jsdoc-var">this.editor.syncValue</span><span class="jsdoc-syntax">();
481             </span><span class="jsdoc-var">this.editor.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'imagedelete'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.editor</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sn</span><span class="jsdoc-syntax">);
482         }
483
484         </span><span class="jsdoc-var">this.selectedNode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
485         </span><span class="jsdoc-var">this.editorcore.fireEditorEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
486
487
488     },
489
490
491     </span><span class="jsdoc-var">toggleSourceEdit </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sourceEditMode</span><span class="jsdoc-syntax">){
492
493
494         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sourceEditMode</span><span class="jsdoc-syntax">){
495             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;disabling buttons&quot;</span><span class="jsdoc-syntax">);
496            </span><span class="jsdoc-var">this.buttons.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">){
497                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item.cmd </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">'pencil'</span><span class="jsdoc-syntax">){
498                     </span><span class="jsdoc-var">item.disable</span><span class="jsdoc-syntax">();
499                 }
500             });
501
502         }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
503             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;enabling buttons&quot;</span><span class="jsdoc-syntax">);
504             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.editorcore.initialized</span><span class="jsdoc-syntax">){
505                 </span><span class="jsdoc-var">this.buttons.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">){
506                     </span><span class="jsdoc-var">item.enable</span><span class="jsdoc-syntax">();
507                 });
508             }
509
510         }
511         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;calling toggole on editor&quot;</span><span class="jsdoc-syntax">);
512         </span><span class="jsdoc-comment">// tell the editor that it's been pressed..
513         </span><span class="jsdoc-var">this.editor.toggleSourceEdit</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sourceEditMode</span><span class="jsdoc-syntax">);
514
515     }
516 });
517
518
519
520
521 </span></code></body></html>