sync

[roojs1] / docs / src / Roo_htmleditor_BlockFigure.js.html

diff --git a/docs/src/Roo_htmleditor_BlockFigure.js.html b/docs/src/Roo_htmleditor_BlockFigure.js.html
index 10a6222..eaf6609 100644 (file)
--- a/docs/src/Roo_htmleditor_BlockFigure.js.html
+++ b/docs/src/Roo_htmleditor_BlockFigure.js.html
@@ -5,8 +5,8 @@
  * Block that has an image and a figcaption
  * @cfg {String} image_src the url for the image
  * @cfg {String} align (left|right) alignment for the block default left
- * @cfg {String} text_align (left|right) alignment for the text caption default left.
  * @cfg {String} caption the text to appear below  (and in the alt tag)
+ * @cfg {String} caption_display (block|none) display or not the caption
  * @cfg {String|number} image_width the width of the image number or %?
  * @cfg {String|number} image_height the height of the image number or %?
  * 
@@ -28,20 +28,23 @@
 
     </span><span class="jsdoc-comment">// setable values.
     </span><span class="jsdoc-var">image_src</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
-
     </span><span class="jsdoc-var">align</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'center'</span><span class="jsdoc-syntax">,
     </span><span class="jsdoc-var">caption </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
-    </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-var">caption_display </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'block'</span><span class="jsdoc-syntax">,
-
     </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'100%'</span><span class="jsdoc-syntax">,
-    </span><span class="jsdoc-var">margin</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'2%'</span><span class="jsdoc-syntax">,
+    </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
+    </span><span class="jsdoc-var">href</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</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-comment">// margin: '2%', not used
 
-    </span><span class="jsdoc-comment">// used by context menu
+    </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
+
+
+    // used by context menu
     </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">,
     </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">,
 
-
     </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">)
     {
 
@@ -175,7 +178,7 @@
                     {
                         </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">();
                         </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">;
-                        </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">)
+                        </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">);
                         </span><span class="jsdoc-var">b.updateElement</span><span class="jsdoc-syntax">();
                         </span><span class="jsdoc-var">syncValue</span><span class="jsdoc-syntax">();
                         </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">);
@@ -183,7 +186,7 @@
                     }
                 },
                 </span><span class="jsdoc-var">xns </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">rooui.Toolbar
-            </span><span class="jsdoc-syntax">},
+            </span><span class="jsdoc-syntax">}
         ];
 
     },
@@ -196,6 +199,56 @@
         </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">);
         </span><span class="jsdoc-var">d.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.caption</span><span class="jsdoc-syntax">;
 
+        </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;
+
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">img </span><span class="jsdoc-syntax">=   {
+            </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'img'</span><span class="jsdoc-syntax">,
+            </span><span class="jsdoc-var">contenteditable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'false'</span><span class="jsdoc-syntax">,
+            </span><span class="jsdoc-var">src </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.image_src</span><span class="jsdoc-syntax">,
+            </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..
+            </span><span class="jsdoc-var">style</span><span class="jsdoc-syntax">: {
+                </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'auto'</span><span class="jsdoc-syntax">,
+                </span><span class="jsdoc-string">'max-width'</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'100%'</span><span class="jsdoc-syntax">,
+                </span><span class="jsdoc-var">margin </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'0px'
+
+
+            </span><span class="jsdoc-syntax">}
+        };
+        </span><span class="jsdoc-comment">/*
+        '&lt;div class=&quot;{0}&quot; width=&quot;420&quot; height=&quot;315&quot; src=&quot;{1}&quot; frameborder=&quot;0&quot; allowfullscreen&gt;' +
+                    '&lt;a href=&quot;{2}&quot;&gt;' + 
+                        '&lt;img class=&quot;{0}-thumbnail&quot; src=&quot;{3}/Images/{4}/{5}#image-{4}&quot; /&gt;' + 
+                    '&lt;/a&gt;' + 
+                '&lt;/div&gt;',
+        */
+
+        </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) {
+            </span><span class="jsdoc-var">img </span><span class="jsdoc-syntax">= {
+                </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'a'</span><span class="jsdoc-syntax">,
+                </span><span class="jsdoc-var">href</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.href</span><span class="jsdoc-syntax">,
+                </span><span class="jsdoc-var">contenteditable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'true'</span><span class="jsdoc-syntax">,
+                </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
+                    </span><span class="jsdoc-var">img
+                </span><span class="jsdoc-syntax">]
+            };
+        }
+
+
+        </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) {
+            </span><span class="jsdoc-var">img </span><span class="jsdoc-syntax">= {
+                </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
+                </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.cls</span><span class="jsdoc-syntax">,
+                </span><span class="jsdoc-var">frameborder </span><span class="jsdoc-syntax">: 0,
+                </span><span class="jsdoc-var">allowfullscreen </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
+                </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
+                </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">: 315,
+                </span><span class="jsdoc-var">src </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.video_url</span><span class="jsdoc-syntax">,
+                </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
+                    </span><span class="jsdoc-var">img
+                </span><span class="jsdoc-syntax">]
+            };
+        }
+
         </span><span class="jsdoc-keyword">return  </span><span class="jsdoc-syntax">{
             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'figure'</span><span class="jsdoc-syntax">,
             </span><span class="jsdoc-string">'data-block' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Figure'</span><span class="jsdoc-syntax">,
@@ -205,24 +258,16 @@
                 </span><span class="jsdoc-var">float </span><span class="jsdoc-syntax">:  </span><span class="jsdoc-var">this.align </span><span class="jsdoc-syntax">,
                 </span><span class="jsdoc-string">'max-width'</span><span class="jsdoc-syntax">:  </span><span class="jsdoc-var">this.width</span><span class="jsdoc-syntax">,
                 </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'auto'</span><span class="jsdoc-syntax">,
-                </span><span class="jsdoc-var">margin</span><span class="jsdoc-syntax">:  0,
-                </span><span class="jsdoc-var">padding</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'10px'</span><span class="jsdoc-syntax">,
+                </span><span class="jsdoc-var">margin</span><span class="jsdoc-syntax">:  </span><span class="jsdoc-var">m</span><span class="jsdoc-syntax">,
+                </span><span class="jsdoc-var">padding</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'10px'
+
+            </span><span class="jsdoc-syntax">},
+
 
-            },
             </span><span class="jsdoc-var">align </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.align</span><span class="jsdoc-syntax">,
             </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: [
-                {
-                    </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'img'</span><span class="jsdoc-syntax">,
-                    </span><span class="jsdoc-var">src </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.image_src</span><span class="jsdoc-syntax">,
-                    </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-comment">// removeHTML..
-                    </span><span class="jsdoc-var">style</span><span class="jsdoc-syntax">: {
-                        </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'auto'</span><span class="jsdoc-syntax">,
-                        </span><span class="jsdoc-string">'max-width'</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'100%'</span><span class="jsdoc-syntax">,
-                        </span><span class="jsdoc-var">margin </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'0px'
-
+                </span><span class="jsdoc-var">img</span><span class="jsdoc-syntax">,
 
-                    </span><span class="jsdoc-syntax">}
-                },
                 {
                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'figcaption'</span><span class="jsdoc-syntax">,
                     </span><span class="jsdoc-var">contenteditable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
@@ -234,6 +279,7 @@
                         </span><span class="jsdoc-string">'font-style'</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'italic'</span><span class="jsdoc-syntax">,
                         </span><span class="jsdoc-var">display </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.caption_display
                     </span><span class="jsdoc-syntax">},
+                    </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">,
                     </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.caption
 
                 </span><span class="jsdoc-syntax">}
@@ -244,7 +290,13 @@
 
     </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">)
     {
+        </span><span class="jsdoc-comment">// this should not really come from the link...
+        </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">);
+        </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">);
+        </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">);
+
         </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">);
+
         </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">);
         </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">);
         </span><span class="jsdoc-comment">//this.text_align = this.getVal(node, 'figcaption', 'style','text-align');