From: Alan Date: Thu, 17 Mar 2022 03:39:10 +0000 (+0800) Subject: use data for storing width on figure X-Git-Url: http://git.roojs.org/?p=roojs1;a=commitdiff_plain;h=d2cc514c56f52ca07bca81a50c163f85c5f0bbbb use data for storing width on figure --- diff --git a/docs/src/Roo_HtmlEditorCore.js.html b/docs/src/Roo_HtmlEditorCore.js.html index 593e8a54af..ef33af3c7f 100644 --- a/docs/src/Roo_HtmlEditorCore.js.html +++ b/docs/src/Roo_HtmlEditorCore.js.html @@ -622,7 +622,7 @@ new Roo.htmleditor.FilterStyleToTag({ node : d }); new Roo.htmleditor.FilterAttributes({ node : d, - attrib_white : ['href', 'src', 'name', 'align', 'colspan', 'rowspan', 'data-display'], + attrib_white : ['href', 'src', 'name', 'align', 'colspan', 'rowspan', 'data-display', 'data-width'], attrib_clean : ['href', 'src' ] }); new Roo.htmleditor.FilterBlack({ node : d, tag : this.black}); diff --git a/docs/src/Roo_htmleditor_BlockFigure.js.html b/docs/src/Roo_htmleditor_BlockFigure.js.html index 69f908c44b..d1ace556f9 100644 --- a/docs/src/Roo_htmleditor_BlockFigure.js.html +++ b/docs/src/Roo_htmleditor_BlockFigure.js.html @@ -177,7 +177,6 @@ store : { xtype : 'SimpleStore', data : [ - ['auto'], ['50%'], ['80%'], ['100%'] @@ -321,7 +320,7 @@ var ret = { tag: 'figure', 'data-block' : 'Figure', - + 'data-width' : this.width, contenteditable : 'false', style : { @@ -350,10 +349,10 @@ display : this.caption_display, maxWidth : (this.align == 'center' ? this.width : '100%' ) + ' !important', margin: m, - width: this.align == 'center' ? this.width : '100%', + width: this.align == 'center' ? this.width : '100%' - }, + }, cls : this.cls.length > 0 ? (this.cls + '-thumbnail' ) : '', cn : [ { @@ -402,7 +401,7 @@ this.caption_display = this.getVal(node, 'figcaption', 'data-display'); //this.text_align = this.getVal(node, 'figcaption', 'style','text-align'); - this.width = this.getVal(node, 'figcaption', 'style', 'width'); + this.width = this.getVal(node, true, 'data-width'); //this.margin = this.getVal(node, 'figure', 'style', 'margin'); }, diff --git a/roojs-bootstrap-debug.js b/roojs-bootstrap-debug.js index cfb9e9a00b..bb80db74bb 100644 --- a/roojs-bootstrap-debug.js +++ b/roojs-bootstrap-debug.js @@ -26741,6 +26741,33 @@ Roo.apply(Roo.htmleditor.FilterBlock.prototype, }); +/** + * @class Roo.htmleditor.FilterAttributes + * clean attributes and styles including http:// etc.. in attribute + * @constructor +* Run a new Attribute Filter +* @param {Object} config Configuration options + */ +Roo.htmleditor.FilterFileWarning = function(cfg) +{ + + var atag = cfg.node.getElementsByTagName('a'); + for(var i =0; i < atags.length;i++) { + var str = '' + atags.item(i).getAttribute('href'); + if (str.match(/^file:/)) { + throw new Exception ("got file url"); + } + } + // less likely + atag = cfg.node.getElementsByTagName('img'); + for(var i =0; i < atags.length;i++) { + var str = '' + atags.item(i).getAttribute('src'); + if (str.match(/^file:/)) { + throw new Exception ("got file url"); + } + } +} + /** * @class Roo.htmleditor.KeyEnter * Handle Enter press.. @@ -27150,7 +27177,6 @@ Roo.extend(Roo.htmleditor.BlockFigure, Roo.htmleditor.Block, { store : { xtype : 'SimpleStore', data : [ - ['auto'], ['50%'], ['80%'], ['100%'] @@ -27294,7 +27320,7 @@ Roo.extend(Roo.htmleditor.BlockFigure, Roo.htmleditor.Block, { var ret = { tag: 'figure', 'data-block' : 'Figure', - + 'data-width' : this.width, contenteditable : 'false', style : { @@ -27321,9 +27347,9 @@ Roo.extend(Roo.htmleditor.BlockFigure, Roo.htmleditor.Block, { fontSize : '16px', lineHeight : '24px', display : this.caption_display, - maxWidth : this.width + ' !important', + maxWidth : (this.align == 'center' ? this.width : '100%' ) + ' !important', margin: m, - width: this.width + width: this.align == 'center' ? this.width : '100%' }, @@ -27375,7 +27401,7 @@ Roo.extend(Roo.htmleditor.BlockFigure, Roo.htmleditor.Block, { this.caption_display = this.getVal(node, 'figcaption', 'data-display'); //this.text_align = this.getVal(node, 'figcaption', 'style','text-align'); - this.width = this.getVal(node, 'figcaption', 'style', 'width'); + this.width = this.getVal(node, true, 'data-width'); //this.margin = this.getVal(node, 'figure', 'style', 'margin'); }, @@ -29255,7 +29281,7 @@ Roo.extend(Roo.HtmlEditorCore, Roo.Component, { new Roo.htmleditor.FilterStyleToTag({ node : d }); new Roo.htmleditor.FilterAttributes({ node : d, - attrib_white : ['href', 'src', 'name', 'align', 'colspan', 'rowspan', 'data-display'], + attrib_white : ['href', 'src', 'name', 'align', 'colspan', 'rowspan', 'data-display', 'data-width'], attrib_clean : ['href', 'src' ] }); new Roo.htmleditor.FilterBlack({ node : d, tag : this.black}); diff --git a/roojs-bootstrap.js b/roojs-bootstrap.js index dc4e3b422d..664682eff8 100644 --- a/roojs-bootstrap.js +++ b/roojs-bootstrap.js @@ -1160,6 +1160,9 @@ return false;}if(!ps||ps.nodeType!=1){return false;}if(!ps||ps.tagName!='BR'){re // Roo/htmleditor/FilterBlock.js Roo.htmleditor.FilterBlock=function(A){Roo.apply(this,A);var qa=A.node.querySelectorAll;this.removeAttributes('data-block');this.removeAttributes('contenteditable');this.removeAttributes('id');};Roo.apply(Roo.htmleditor.FilterBlock.prototype,{node:true,removeAttributes:function(A){var ar=this.node.querySelectorAll('*['+A+']'); for(var i=0;i'+B().video_url+''); }},xns:C.Toolbar},{xtype:'TextItem',text:"Width: ",xns:C.Toolbar},{xtype:'ComboBox',allowBlank:false,displayField:'val',editable:true,listWidth:100,triggerAction:'all',typeAhead:true,valueField:'val',width:70,name:'width',listeners:{select:function(F,r,G){A.editorcore.selectNode(A.tb.selectedNode); -var b=B();b.width=r.get('val');b.updateElement();D();A.editorcore.onEditorEvent();}},xns:C.form,store:{xtype:'SimpleStore',data:[['auto'],['50%'],['80%'],['100%']],fields:['val'],xns:Roo.data}},{xtype:'TextItem',text:"Align: ",xns:C.Toolbar},{xtype:'ComboBox',allowBlank:false,displayField:'val',editable:true,listWidth:100,triggerAction:'all',typeAhead:true,valueField:'val',width:70,name:'align',listeners:{select:function(F,r,G){A.editorcore.selectNode(A.tb.selectedNode); +var b=B();b.width=r.get('val');b.updateElement();D();A.editorcore.onEditorEvent();}},xns:C.form,store:{xtype:'SimpleStore',data:[['50%'],['80%'],['100%']],fields:['val'],xns:Roo.data}},{xtype:'TextItem',text:"Align: ",xns:C.Toolbar},{xtype:'ComboBox',allowBlank:false,displayField:'val',editable:true,listWidth:100,triggerAction:'all',typeAhead:true,valueField:'val',width:70,name:'align',listeners:{select:function(F,r,G){A.editorcore.selectNode(A.tb.selectedNode); var b=B();b.align=r.get('val');b.updateElement();D();A.editorcore.onEditorEvent();}},xns:C.form,store:{xtype:'SimpleStore',data:[['left'],['right'],['center']],fields:['val'],xns:Roo.data}},{xtype:'Button',text:'Hide Caption',name:'caption_display',pressed:false,enableToggle:true,setValue:function(v){this.setText(v?"Hide Caption":"Show Caption"); this.setPressed(v!='block');},listeners:{toggle:function(F,G){var b=B();b.caption_display=b.caption_display=='block'?'none':'block';this.setText(b.caption_display=='block'?"Hide Caption":"Show Caption");b.updateElement();D();A.editorcore.selectNode(A.tb.selectedNode); A.editorcore.onEditorEvent();}},xns:C.Toolbar}];},toObject:function(){var d=document.createElement('div');d.innerHTML=this.caption;var m=this.width!='100%'&&this.align=='center'?'0 auto':0;var iw=this.align=='center'?this.width:'100%';var A={tag:'img',contenteditable:'false',src:this.image_src,alt:d.innerText.replace(/\n/g," ").replace(/\s+/g,' ').trim(),style:{width:iw,maxWidth:iw+' !important',margin:m} };if(this.href.length>0){A={tag:'a',href:this.href,contenteditable:'true',cn:[A]};}if(this.video_url.length>0){A={tag:'div',cls:this.cls,frameborder:0,allowfullscreen:true,width:420,height:315,src:this.video_url,cn:[A]};}var B=this.caption_display=='none'?'':(this.caption.length?this.caption:"Caption"); -var C={tag:'figure','data-block':'Figure',contenteditable:'false',style:{display:'block',float:this.align,maxWidth:this.align=='center'?'100% !important':(this.width+' !important'),width:this.align=='center'?'100%':this.width,margin:'0px',padding:this.align=='center'?'0':'0 10px',textAlign:this.align} -,align:this.align,cn:[A,{tag:'figcaption','data-display':this.caption_display,style:{textAlign:'left',fontSize:'16px',lineHeight:'24px',display:this.caption_display,maxWidth:this.width+' !important',margin:m,width:this.width},cls:this.cls.length>0?(this.cls+'-thumbnail'):'',cn:[{tag:'div',style:{marginTop:'16px',textAlign:'left'} -,align:'left',cn:[{tag:'i',contenteditable:true,html:B}]}]}]};return C;},readElement:function(A){this.video_url=this.getVal(A,'div','src');this.cls=this.getVal(A,'div','class');this.href=this.getVal(A,'a','href');this.image_src=this.getVal(A,'img','src'); -this.align=this.getVal(A,'figure','align');var B=this.getVal(A,'figcaption',false);if(B!==''){this.caption=this.getVal(B,'i','html');}this.caption_display=this.getVal(A,'figcaption','data-display');this.width=this.getVal(A,'figcaption','style','width');},removeNode:function(){return this.node; -}}) +var C={tag:'figure','data-block':'Figure','data-width':this.width,contenteditable:'false',style:{display:'block',float:this.align,maxWidth:this.align=='center'?'100% !important':(this.width+' !important'),width:this.align=='center'?'100%':this.width,margin:'0px',padding:this.align=='center'?'0':'0 10px',textAlign:this.align} +,align:this.align,cn:[A,{tag:'figcaption','data-display':this.caption_display,style:{textAlign:'left',fontSize:'16px',lineHeight:'24px',display:this.caption_display,maxWidth:(this.align=='center'?this.width:'100%')+' !important',margin:m,width:this.align=='center'?this.width:'100%'} +,cls:this.cls.length>0?(this.cls+'-thumbnail'):'',cn:[{tag:'div',style:{marginTop:'16px',textAlign:'left'},align:'left',cn:[{tag:'i',contenteditable:true,html:B}]}]}]};return C;},readElement:function(A){this.video_url=this.getVal(A,'div','src');this.cls=this.getVal(A,'div','class'); +this.href=this.getVal(A,'a','href');this.image_src=this.getVal(A,'img','src');this.align=this.getVal(A,'figure','align');var B=this.getVal(A,'figcaption',false);if(B!==''){this.caption=this.getVal(B,'i','html');}this.caption_display=this.getVal(A,'figcaption','data-display'); +this.width=this.getVal(A,true,'data-width');},removeNode:function(){return this.node;}}) // Roo/htmleditor/BlockTable.js Roo.htmleditor.BlockTable=function(A){if(A.node){this.readElement(A.node);this.updateElement(A.node);}Roo.apply(this,A);if(!A.node){this.rows=[];for(var r=0;r');return false;}if(cd.types.indexOf('text/html')<0){return false;}var C=[];var D=cd.getData('text/html');if(cd.types.indexOf('text/rtf')>-1){var E=new Roo.rtf.Parser(cd.getData('text/rtf'));C=E.doc?E.doc.getElementsByType('pict'):[]; }C=C.filter(function(g){return !g.path.match(/^rtf\/(head|pgdsctbl|listtable|footerf)/);}).map(function(g){return g.toDataURL();}).filter(function(g){return g!='about:blank';});D=this.cleanWordChars(D);var d=(new DOMParser().parseFromString(D,'text/html')).body; var sn=this.getParentElement();if(d.getElementsByTagName('table').length&&sn&&sn.closest('table')){e.preventDefault();this.insertAtCursor("You can not nest tables");return false;}if(C.length>0){Roo.each(d.getElementsByTagName('img'),function(F,i){F.setAttribute('src',C[i]); -});}if(this.autoClean){new Roo.htmleditor.FilterStyleToTag({node:d});new Roo.htmleditor.FilterAttributes({node:d,attrib_white:['href','src','name','align','colspan','rowspan','data-display'],attrib_clean:['href','src']});new Roo.htmleditor.FilterBlack({node:d,tag:this.black} +});}if(this.autoClean){new Roo.htmleditor.FilterStyleToTag({node:d});new Roo.htmleditor.FilterAttributes({node:d,attrib_white:['href','src','name','align','colspan','rowspan','data-display','data-width'],attrib_clean:['href','src']});new Roo.htmleditor.FilterBlack({node:d,tag:this.black} );new Roo.htmleditor.FilterKeepChildren({node:d,tag:['FONT','O:P']});new Roo.htmleditor.FilterParagraph({node:d});new Roo.htmleditor.FilterSpan({node:d});new Roo.htmleditor.FilterLongBr({node:d});new Roo.htmleditor.FilterComment({node:d});}if(this.enableBlocks){Array.from(d.getElementsByTagName('img')).forEach(function(F){if(F.closest('figure')){return; }var G=new Roo.htmleditor.BlockFigure({image_src:F.src});G.updateElement(F);});}this.insertAtCursor(d.innerHTML.replace(/ /g,' '));if(this.enableBlocks){Roo.htmleditor.Block.initAll(this.doc.body);}try{new Roo.htmleditor.FilterFileWarning({node:d});} catch(e){Roo.MessageBox.alert("Invalid URLS in content","The pasted Content contains file:// URLS - you probably want to check all the links in this file");}e.preventDefault();return false;},onDestroy:function(){if(this.rendered){}},onFirstFocus:function(){this.assignDocWin();