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

   1 <html><head><title>Roo/htmleditor/BlockFigure.js</title><link rel="stylesheet" type="text/css" href="../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty">
   2
   3 <span class="jsdoc-comment">/**
   4  * @class Roo.htmleditor.BlockFigure
   5  * Block that has an image and a figcaption
   6  * @cfg {String} image_src the url for the image
   7  * @cfg {String} align (left|right) alignment for the block default left
   8  * @cfg {String} caption the text to appear below  (and in the alt tag)
   9  * @cfg {String} caption_display (block|none) display or not the caption
  10  * @cfg {String|number} image_width the width of the image number or %?
  11  * @cfg {String|number} image_height the height of the image number or %?
  12  *
  13  * @constructor
  14  * Create a new Filter.
  15  * @param {Object} config Configuration options
  16  */
  17
  18 </span><span class="jsdoc-var">Roo.htmleditor.BlockFigure </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">)
  19 {
  20     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cfg.node</span><span class="jsdoc-syntax">) {
  21         </span><span class="jsdoc-var">this.readElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cfg.node</span><span class="jsdoc-syntax">);
  22         </span><span class="jsdoc-var">this.updateElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cfg.node</span><span class="jsdoc-syntax">);
  23     }
  24     </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">cfg</span><span class="jsdoc-syntax">);
  25 }
  26 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.htmleditor.BlockFigure</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.htmleditor.Block</span><span class="jsdoc-syntax">, {
  27
  28
  29     </span><span class="jsdoc-comment">// setable values.
  30     </span><span class="jsdoc-var">image_src</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  31     </span><span class="jsdoc-var">align</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'center'</span><span class="jsdoc-syntax">,
  32     </span><span class="jsdoc-var">caption </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  33     </span><span class="jsdoc-var">caption_display </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'block'</span><span class="jsdoc-syntax">,
  34     </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'100%'</span><span class="jsdoc-syntax">,
  35     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  36     </span><span class="jsdoc-var">href</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  37     </span><span class="jsdoc-var">video_url </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  38
  39     </span><span class="jsdoc-comment">// margin: '2%', not used
  40
  41     </span><span class="jsdoc-var">text_align</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'left'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">//   (left|right) alignment for the text caption default left. - not used at present
  42
  43
  44     // used by context menu
  45     </span><span class="jsdoc-var">friendly_name </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Image with caption'</span><span class="jsdoc-syntax">,
  46     </span><span class="jsdoc-var">deleteTitle </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Delete Image and Caption&quot;</span><span class="jsdoc-syntax">,
  47
  48     </span><span class="jsdoc-var">contextMenu </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">toolbar</span><span class="jsdoc-syntax">)
  49     {
  50
  51         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">block </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
  52             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">Roo.htmleditor.Block.factory</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">toolbar.tb.selectedNode</span><span class="jsdoc-syntax">);
  53         };
  54
  55
  56         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rooui </span><span class="jsdoc-syntax">=  </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">Roo </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.bootstrap</span><span class="jsdoc-syntax">;
  57
  58         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">syncValue </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">toolbar.editorcore.syncValue</span><span class="jsdoc-syntax">;
  59
  60         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">fields </span><span class="jsdoc-syntax">= {};
  61
  62         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">[
  63              {
  64                 </span><span class="jsdoc-var">xtype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'TextItem'</span><span class="jsdoc-syntax">,
  65                 </span><span class="jsdoc-var">text </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Source: &quot;</span><span class="jsdoc-syntax">,
  66                 </span><span class="jsdoc-var">xns </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rooui.Toolbar  </span><span class="jsdoc-comment">//Boostrap?
  67             </span><span class="jsdoc-syntax">},
  68             {
  69                 </span><span class="jsdoc-var">xtype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Button'</span><span class="jsdoc-syntax">,
  70                 </span><span class="jsdoc-var">text</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Change Image URL'</span><span class="jsdoc-syntax">,
  71
  72                 </span><span class="jsdoc-var">listeners </span><span class="jsdoc-syntax">: {
  73                     </span><span class="jsdoc-var">click</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">, </span><span class="jsdoc-var">state</span><span class="jsdoc-syntax">)
  74                     {
  75                         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">block</span><span class="jsdoc-syntax">();
  76
  77                         </span><span class="jsdoc-var">Roo.MessageBox.show</span><span class="jsdoc-syntax">({
  78                             </span><span class="jsdoc-var">title </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Image Source URL&quot;</span><span class="jsdoc-syntax">,
  79                             </span><span class="jsdoc-var">msg </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Enter the url for the image&quot;</span><span class="jsdoc-syntax">,
  80                             </span><span class="jsdoc-var">buttons</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.MessageBox.OKCANCEL</span><span class="jsdoc-syntax">,
  81                             </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">btn</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">val</span><span class="jsdoc-syntax">){
  82                                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">btn </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">'ok'</span><span class="jsdoc-syntax">) {
  83                                     </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
  84                                 }
  85                                 </span><span class="jsdoc-var">b.image_src </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">val</span><span class="jsdoc-syntax">;
  86                                 </span><span class="jsdoc-var">b.updateElement</span><span class="jsdoc-syntax">();
  87                                 </span><span class="jsdoc-var">syncValue</span><span class="jsdoc-syntax">();
  88                                 </span><span class="jsdoc-var">toolbar.editorcore.onEditorEvent</span><span class="jsdoc-syntax">();
  89                             },
  90                             </span><span class="jsdoc-var">minWidth</span><span class="jsdoc-syntax">:250,
  91                             </span><span class="jsdoc-var">prompt</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  92                             </span><span class="jsdoc-comment">//multiline: multiline,
  93                             </span><span class="jsdoc-var">modal </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  94                             </span><span class="jsdoc-var">value </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">b.image_src
  95                         </span><span class="jsdoc-syntax">});
  96                     }
  97                 },
  98                 </span><span class="jsdoc-var">xns </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rooui.Toolbar
  99             </span><span class="jsdoc-syntax">},
 100
 101             {
 102                 </span><span class="jsdoc-var">xtype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Button'</span><span class="jsdoc-syntax">,
 103                 </span><span class="jsdoc-var">text</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Change Link URL'</span><span class="jsdoc-syntax">,
 104
 105                 </span><span class="jsdoc-var">listeners </span><span class="jsdoc-syntax">: {
 106                     </span><span class="jsdoc-var">click</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">, </span><span class="jsdoc-var">state</span><span class="jsdoc-syntax">)
 107                     {
 108                         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">block</span><span class="jsdoc-syntax">();
 109
 110                         </span><span class="jsdoc-var">Roo.MessageBox.show</span><span class="jsdoc-syntax">({
 111                             </span><span class="jsdoc-var">title </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Link URL&quot;</span><span class="jsdoc-syntax">,
 112                             </span><span class="jsdoc-var">msg </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Enter the url for the link - leave blank to have no link&quot;</span><span class="jsdoc-syntax">,
 113                             </span><span class="jsdoc-var">buttons</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.MessageBox.OKCANCEL</span><span class="jsdoc-syntax">,
 114                             </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">btn</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">val</span><span class="jsdoc-syntax">){
 115                                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">btn </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">'ok'</span><span class="jsdoc-syntax">) {
 116                                     </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 117                                 }
 118                                 </span><span class="jsdoc-var">b.href </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">val</span><span class="jsdoc-syntax">;
 119                                 </span><span class="jsdoc-var">b.updateElement</span><span class="jsdoc-syntax">();
 120                                 </span><span class="jsdoc-var">syncValue</span><span class="jsdoc-syntax">();
 121                                 </span><span class="jsdoc-var">toolbar.editorcore.onEditorEvent</span><span class="jsdoc-syntax">();
 122                             },
 123                             </span><span class="jsdoc-var">minWidth</span><span class="jsdoc-syntax">:250,
 124                             </span><span class="jsdoc-var">prompt</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 125                             </span><span class="jsdoc-comment">//multiline: multiline,
 126                             </span><span class="jsdoc-var">modal </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 127                             </span><span class="jsdoc-var">value </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">b.href
 128                         </span><span class="jsdoc-syntax">});
 129                     }
 130                 },
 131                 </span><span class="jsdoc-var">xns </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rooui.Toolbar
 132             </span><span class="jsdoc-syntax">},
 133             {
 134                 </span><span class="jsdoc-var">xtype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Button'</span><span class="jsdoc-syntax">,
 135                 </span><span class="jsdoc-var">text</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Show Video URL'</span><span class="jsdoc-syntax">,
 136
 137                 </span><span class="jsdoc-var">listeners </span><span class="jsdoc-syntax">: {
 138                     </span><span class="jsdoc-var">click</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">, </span><span class="jsdoc-var">state</span><span class="jsdoc-syntax">)
 139                     {
 140                         </span><span class="jsdoc-var">Roo.MessageBox.alert</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;Video URL&quot;</span><span class="jsdoc-syntax">,
 141                             </span><span class="jsdoc-var">block</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.video_url </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'This image is not linked ot a video' </span><span class="jsdoc-syntax">:
 142                                 </span><span class="jsdoc-string">'The image is linked to: &lt;a target=&quot;_new&quot; href=&quot;' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">block</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.video_url </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'&quot;&gt;' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">block</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.video_url </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'&lt;/a&gt;'</span><span class="jsdoc-syntax">);
 143                     }
 144                 },
 145                 </span><span class="jsdoc-var">xns </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rooui.Toolbar
 146             </span><span class="jsdoc-syntax">},
 147
 148
 149             {
 150                 </span><span class="jsdoc-var">xtype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'TextItem'</span><span class="jsdoc-syntax">,
 151                 </span><span class="jsdoc-var">text </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Width: &quot;</span><span class="jsdoc-syntax">,
 152                 </span><span class="jsdoc-var">xns </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rooui.Toolbar  </span><span class="jsdoc-comment">//Boostrap?
 153             </span><span class="jsdoc-syntax">},
 154             {
 155                 </span><span class="jsdoc-var">xtype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'ComboBox'</span><span class="jsdoc-syntax">,
 156                 </span><span class="jsdoc-var">allowBlank </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 157                 </span><span class="jsdoc-var">displayField </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'val'</span><span class="jsdoc-syntax">,
 158                 </span><span class="jsdoc-var">editable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 159                 </span><span class="jsdoc-var">listWidth </span><span class="jsdoc-syntax">: 100,
 160                 </span><span class="jsdoc-var">triggerAction </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'all'</span><span class="jsdoc-syntax">,
 161                 </span><span class="jsdoc-var">typeAhead </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 162                 </span><span class="jsdoc-var">valueField </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'val'</span><span class="jsdoc-syntax">,
 163                 </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">: 70,
 164                 </span><span class="jsdoc-var">name </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'width'</span><span class="jsdoc-syntax">,
 165                 </span><span class="jsdoc-var">listeners </span><span class="jsdoc-syntax">: {
 166                     </span><span class="jsdoc-var">select </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">combo</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">index</span><span class="jsdoc-syntax">)
 167                     {
 168                         </span><span class="jsdoc-var">toolbar.editorcore.selectNode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">toolbar.tb.selectedNode</span><span class="jsdoc-syntax">);
 169                         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">block</span><span class="jsdoc-syntax">();
 170                         </span><span class="jsdoc-var">b.width </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">);
 171                         </span><span class="jsdoc-var">b.updateElement</span><span class="jsdoc-syntax">();
 172                         </span><span class="jsdoc-var">syncValue</span><span class="jsdoc-syntax">();
 173                         </span><span class="jsdoc-var">toolbar.editorcore.onEditorEvent</span><span class="jsdoc-syntax">();
 174                     }
 175                 },
 176                 </span><span class="jsdoc-var">xns </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rooui.form</span><span class="jsdoc-syntax">,
 177                 </span><span class="jsdoc-var">store </span><span class="jsdoc-syntax">: {
 178                     </span><span class="jsdoc-var">xtype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'SimpleStore'</span><span class="jsdoc-syntax">,
 179                     </span><span class="jsdoc-var">data </span><span class="jsdoc-syntax">: [
 180                         [</span><span class="jsdoc-string">'auto'</span><span class="jsdoc-syntax">],
 181                         [</span><span class="jsdoc-string">'50%'</span><span class="jsdoc-syntax">],
 182                         [</span><span class="jsdoc-string">'100%'</span><span class="jsdoc-syntax">]
 183                     ],
 184                     </span><span class="jsdoc-var">fields </span><span class="jsdoc-syntax">: [ </span><span class="jsdoc-string">'val'</span><span class="jsdoc-syntax">],
 185                     </span><span class="jsdoc-var">xns </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.data
 186                 </span><span class="jsdoc-syntax">}
 187             },
 188             {
 189                 </span><span class="jsdoc-var">xtype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'TextItem'</span><span class="jsdoc-syntax">,
 190                 </span><span class="jsdoc-var">text </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Align: &quot;</span><span class="jsdoc-syntax">,
 191                 </span><span class="jsdoc-var">xns </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rooui.Toolbar  </span><span class="jsdoc-comment">//Boostrap?
 192             </span><span class="jsdoc-syntax">},
 193             {
 194                 </span><span class="jsdoc-var">xtype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'ComboBox'</span><span class="jsdoc-syntax">,
 195                 </span><span class="jsdoc-var">allowBlank </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 196                 </span><span class="jsdoc-var">displayField </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'val'</span><span class="jsdoc-syntax">,
 197                 </span><span class="jsdoc-var">editable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 198                 </span><span class="jsdoc-var">listWidth </span><span class="jsdoc-syntax">: 100,
 199                 </span><span class="jsdoc-var">triggerAction </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'all'</span><span class="jsdoc-syntax">,
 200                 </span><span class="jsdoc-var">typeAhead </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 201                 </span><span class="jsdoc-var">valueField </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'val'</span><span class="jsdoc-syntax">,
 202                 </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">: 70,
 203                 </span><span class="jsdoc-var">name </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'align'</span><span class="jsdoc-syntax">,
 204                 </span><span class="jsdoc-var">listeners </span><span class="jsdoc-syntax">: {
 205                     </span><span class="jsdoc-var">select </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">combo</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">index</span><span class="jsdoc-syntax">)
 206                     {
 207                         </span><span class="jsdoc-var">toolbar.editorcore.selectNode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">toolbar.tb.selectedNode</span><span class="jsdoc-syntax">);
 208                         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">block</span><span class="jsdoc-syntax">();
 209                         </span><span class="jsdoc-var">b.align </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">);
 210                         </span><span class="jsdoc-var">b.updateElement</span><span class="jsdoc-syntax">();
 211                         </span><span class="jsdoc-var">syncValue</span><span class="jsdoc-syntax">();
 212                         </span><span class="jsdoc-var">toolbar.editorcore.onEditorEvent</span><span class="jsdoc-syntax">();
 213                     }
 214                 },
 215                 </span><span class="jsdoc-var">xns </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rooui.form</span><span class="jsdoc-syntax">,
 216                 </span><span class="jsdoc-var">store </span><span class="jsdoc-syntax">: {
 217                     </span><span class="jsdoc-var">xtype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'SimpleStore'</span><span class="jsdoc-syntax">,
 218                     </span><span class="jsdoc-var">data </span><span class="jsdoc-syntax">: [
 219                         [</span><span class="jsdoc-string">'left'</span><span class="jsdoc-syntax">],
 220                         [</span><span class="jsdoc-string">'right'</span><span class="jsdoc-syntax">],
 221                         [</span><span class="jsdoc-string">'center'</span><span class="jsdoc-syntax">]
 222                     ],
 223                     </span><span class="jsdoc-var">fields </span><span class="jsdoc-syntax">: [ </span><span class="jsdoc-string">'val'</span><span class="jsdoc-syntax">],
 224                     </span><span class="jsdoc-var">xns </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.data
 225                 </span><span class="jsdoc-syntax">}
 226             },
 227
 228
 229             {
 230                 </span><span class="jsdoc-var">xtype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Button'</span><span class="jsdoc-syntax">,
 231                 </span><span class="jsdoc-var">text</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Hide Caption'</span><span class="jsdoc-syntax">,
 232                 </span><span class="jsdoc-var">name </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'caption_display'</span><span class="jsdoc-syntax">,
 233                 </span><span class="jsdoc-var">pressed </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 234                 </span><span class="jsdoc-var">enableToggle </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 235                 </span><span class="jsdoc-var">setValue </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">) {
 236                     </span><span class="jsdoc-var">this.toggle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'block' </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">);
 237                 },
 238                 </span><span class="jsdoc-var">listeners </span><span class="jsdoc-syntax">: {
 239                     </span><span class="jsdoc-var">toggle</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">, </span><span class="jsdoc-var">state</span><span class="jsdoc-syntax">)
 240                     {
 241                         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">b  </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">block</span><span class="jsdoc-syntax">();
 242                         </span><span class="jsdoc-var">b.caption_display </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">b.caption_display </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'block' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'none' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'block'</span><span class="jsdoc-syntax">;
 243                         </span><span class="jsdoc-var">this.setText</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">b.caption_display </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'block' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">&quot;Hide Caption&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Show Caption&quot;</span><span class="jsdoc-syntax">);
 244                         </span><span class="jsdoc-var">b.updateElement</span><span class="jsdoc-syntax">();
 245                         </span><span class="jsdoc-var">syncValue</span><span class="jsdoc-syntax">();
 246                         </span><span class="jsdoc-var">toolbar.editorcore.selectNode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">toolbar.tb.selectedNode</span><span class="jsdoc-syntax">);
 247                         </span><span class="jsdoc-var">toolbar.editorcore.onEditorEvent</span><span class="jsdoc-syntax">();
 248                     }
 249                 },
 250                 </span><span class="jsdoc-var">xns </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rooui.Toolbar
 251             </span><span class="jsdoc-syntax">}
 252         ];
 253
 254     },
 255     </span><span class="jsdoc-comment">/**
 256      * create a DomHelper friendly object - for use with
 257      * Roo.DomHelper.markup / overwrite / etc..
 258      */
 259     </span><span class="jsdoc-var">toObject </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 260     {
 261         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.createElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">);
 262         </span><span class="jsdoc-var">d.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.caption</span><span class="jsdoc-syntax">;
 263
 264         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">m </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.width </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'50%' </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.align </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'center' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'0 auto' </span><span class="jsdoc-syntax">: 0;
 265
 266         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">img </span><span class="jsdoc-syntax">=   {
 267             </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'img'</span><span class="jsdoc-syntax">,
 268             </span><span class="jsdoc-var">contenteditable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'false'</span><span class="jsdoc-syntax">,
 269             </span><span class="jsdoc-var">src </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.image_src</span><span class="jsdoc-syntax">,
 270             </span><span class="jsdoc-var">alt </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">d.innerText.replace</span><span class="jsdoc-syntax">(/\n/g, </span><span class="jsdoc-string">&quot; &quot;</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.replace</span><span class="jsdoc-syntax">(/\s+/g, </span><span class="jsdoc-string">' '</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.trim</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-comment">// removeHTML and reduce spaces..
 271             </span><span class="jsdoc-var">style</span><span class="jsdoc-syntax">: {
 272                 </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'auto'</span><span class="jsdoc-syntax">,
 273                 </span><span class="jsdoc-string">'max-width'</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'100%'</span><span class="jsdoc-syntax">,
 274                 </span><span class="jsdoc-var">margin </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'0px'
 275
 276
 277             </span><span class="jsdoc-syntax">}
 278         };
 279         </span><span class="jsdoc-comment">/*
 280         '&lt;div class=&quot;{0}&quot; width=&quot;420&quot; height=&quot;315&quot; src=&quot;{1}&quot; frameborder=&quot;0&quot; allowfullscreen&gt;' +
 281                     '&lt;a href=&quot;{2}&quot;&gt;' +
 282                         '&lt;img class=&quot;{0}-thumbnail&quot; src=&quot;{3}/Images/{4}/{5}#image-{4}&quot; /&gt;' +
 283                     '&lt;/a&gt;' +
 284                 '&lt;/div&gt;',
 285         */
 286
 287         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.href.length </span><span class="jsdoc-syntax">&gt; 0) {
 288             </span><span class="jsdoc-var">img </span><span class="jsdoc-syntax">= {
 289                 </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'a'</span><span class="jsdoc-syntax">,
 290                 </span><span class="jsdoc-var">href</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.href</span><span class="jsdoc-syntax">,
 291                 </span><span class="jsdoc-var">contenteditable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'true'</span><span class="jsdoc-syntax">,
 292                 </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
 293                     </span><span class="jsdoc-var">img
 294                 </span><span class="jsdoc-syntax">]
 295             };
 296         }
 297
 298
 299         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.video_url.length </span><span class="jsdoc-syntax">&gt; 0) {
 300             </span><span class="jsdoc-var">img </span><span class="jsdoc-syntax">= {
 301                 </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 302                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.cls</span><span class="jsdoc-syntax">,
 303                 </span><span class="jsdoc-var">frameborder </span><span class="jsdoc-syntax">: 0,
 304                 </span><span class="jsdoc-var">allowfullscreen </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 305                 </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">: 420,  </span><span class="jsdoc-comment">// these are for video tricks - that we replace the outer
 306                 </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">: 315,
 307                 </span><span class="jsdoc-var">src </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.video_url</span><span class="jsdoc-syntax">,
 308                 </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
 309                     </span><span class="jsdoc-var">img
 310                 </span><span class="jsdoc-syntax">]
 311             };
 312         }
 313         </span><span class="jsdoc-comment">// we remove caption totally if its hidden... - will delete data.. but otherwise we end up with fake caption
 314         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">captionhtml </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.caption_display </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'hidden' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'' </span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">this.caption.length </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.caption </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;Caption&quot;</span><span class="jsdoc-syntax">);
 315
 316         </span><span class="jsdoc-keyword">return  </span><span class="jsdoc-syntax">{
 317             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'figure'</span><span class="jsdoc-syntax">,
 318             </span><span class="jsdoc-string">'data-block' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Figure'</span><span class="jsdoc-syntax">,
 319             </span><span class="jsdoc-var">contenteditable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'false'</span><span class="jsdoc-syntax">,
 320
 321             </span><span class="jsdoc-var">style </span><span class="jsdoc-syntax">: {
 322                 </span><span class="jsdoc-var">display</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'block'</span><span class="jsdoc-syntax">,
 323                 </span><span class="jsdoc-var">float </span><span class="jsdoc-syntax">:  </span><span class="jsdoc-var">this.align </span><span class="jsdoc-syntax">,
 324                 </span><span class="jsdoc-string">'max-width'</span><span class="jsdoc-syntax">:  </span><span class="jsdoc-var">this.width</span><span class="jsdoc-syntax">,
 325                 </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'auto'</span><span class="jsdoc-syntax">,
 326                 </span><span class="jsdoc-var">margin</span><span class="jsdoc-syntax">:  </span><span class="jsdoc-var">m</span><span class="jsdoc-syntax">,
 327                 </span><span class="jsdoc-var">padding</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'10px'
 328
 329             </span><span class="jsdoc-syntax">},
 330
 331
 332             </span><span class="jsdoc-var">align </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.align</span><span class="jsdoc-syntax">,
 333             </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
 334                 </span><span class="jsdoc-var">img</span><span class="jsdoc-syntax">,
 335
 336                 {
 337                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'figcaption'</span><span class="jsdoc-syntax">,
 338                     </span><span class="jsdoc-string">'data-display' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.caption_display</span><span class="jsdoc-syntax">,
 339                     </span><span class="jsdoc-var">style </span><span class="jsdoc-syntax">: {
 340                         </span><span class="jsdoc-string">'text-align'</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'left'</span><span class="jsdoc-syntax">,
 341                         </span><span class="jsdoc-string">'margin-top' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'16px'</span><span class="jsdoc-syntax">,
 342                         </span><span class="jsdoc-string">'font-size' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'16px'</span><span class="jsdoc-syntax">,
 343                         </span><span class="jsdoc-string">'line-height' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'24px'</span><span class="jsdoc-syntax">,
 344                          </span><span class="jsdoc-var">display </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.caption_display
 345                     </span><span class="jsdoc-syntax">},
 346                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.cls.length </span><span class="jsdoc-syntax">&gt; 0 ? (</span><span class="jsdoc-var">this.cls  </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'-thumbnail' </span><span class="jsdoc-syntax">) : </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
 347                     </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
 348                         {
 349                             </span><span class="jsdoc-comment">// we can not rely on yahoo syndication to use CSS elements - so have to use  '&lt;i&gt;' to encase stuff.
 350                             </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">,
 351                             </span><span class="jsdoc-var">contenteditable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 352                             </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">captionhtml
 353                         </span><span class="jsdoc-syntax">}
 354                     ]
 355
 356                 }
 357             ]
 358         };
 359
 360     },
 361
 362     </span><span class="jsdoc-var">readElement </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">node</span><span class="jsdoc-syntax">)
 363     {
 364         </span><span class="jsdoc-comment">// this should not really come from the link...
 365         </span><span class="jsdoc-var">this.video_url </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getVal</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">node</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'src'</span><span class="jsdoc-syntax">);
 366         </span><span class="jsdoc-var">this.cls </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getVal</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">node</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'class'</span><span class="jsdoc-syntax">);
 367         </span><span class="jsdoc-var">this.href </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getVal</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">node</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'a'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'href'</span><span class="jsdoc-syntax">);
 368
 369
 370         </span><span class="jsdoc-var">this.image_src </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getVal</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">node</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'img'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'src'</span><span class="jsdoc-syntax">);
 371
 372         </span><span class="jsdoc-var">this.align </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getVal</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">node</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'figure'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'align'</span><span class="jsdoc-syntax">);
 373         </span><span class="jsdoc-var">this.caption </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getVal</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">node</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'figcaption'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'html'</span><span class="jsdoc-syntax">);
 374         </span><span class="jsdoc-comment">// remove '&lt;i&gt;
 375         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.caption.trim</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.match</span><span class="jsdoc-syntax">(/^&lt;i[^&gt;]*&gt;/i)) {
 376             </span><span class="jsdoc-var">this.caption </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.caption.trim</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.replace</span><span class="jsdoc-syntax">(/^&lt;i[^&gt;]*&gt;/i, </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.replace</span><span class="jsdoc-syntax">(/^&lt;\/i&gt;$/i, </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">);
 377         }
 378         </span><span class="jsdoc-var">this.caption_display </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getVal</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">node</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'figcaption'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'data-display'</span><span class="jsdoc-syntax">);
 379         </span><span class="jsdoc-comment">//this.text_align = this.getVal(node, 'figcaption', 'style','text-align');
 380         </span><span class="jsdoc-var">this.width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getVal</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">node</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'figure'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'style'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'max-width'</span><span class="jsdoc-syntax">);
 381         </span><span class="jsdoc-comment">//this.margin = this.getVal(node, 'figure', 'style', 'margin');
 382
 383     </span><span class="jsdoc-syntax">},
 384     </span><span class="jsdoc-var">removeNode </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 385     {
 386         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.node</span><span class="jsdoc-syntax">;
 387     }
 388
 389
 390
 391
 392
 393
 394
 395
 396 })
 397
 398 </span></code></body></html>