From: Alan Date: Thu, 17 Mar 2022 03:38:16 +0000 (+0800) Subject: use data for storing width on figure X-Git-Url: http://git.roojs.org/?p=roojs1;a=commitdiff_plain;h=84e0c18dcdef720796deb7252c09d3fc5f7d04e4 use data for storing width on figure --- diff --git a/Roo/HtmlEditorCore.js b/Roo/HtmlEditorCore.js index d3bdea105b..991b962bd6 100644 --- a/Roo/HtmlEditorCore.js +++ b/Roo/HtmlEditorCore.js @@ -622,7 +622,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/Roo/htmleditor/BlockFigure.js b/Roo/htmleditor/BlockFigure.js index 45f5be11c1..6805239442 100644 --- a/Roo/htmleditor/BlockFigure.js +++ b/Roo/htmleditor/BlockFigure.js @@ -177,7 +177,6 @@ Roo.extend(Roo.htmleditor.BlockFigure, Roo.htmleditor.Block, { store : { xtype : 'SimpleStore', data : [ - ['auto'], ['50%'], ['80%'], ['100%'] @@ -321,7 +320,7 @@ Roo.extend(Roo.htmleditor.BlockFigure, Roo.htmleditor.Block, { var ret = { tag: 'figure', 'data-block' : 'Figure', - + 'data-width' : this.width, contenteditable : 'false', style : { @@ -350,7 +349,7 @@ Roo.extend(Roo.htmleditor.BlockFigure, Roo.htmleditor.Block, { 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%' }, @@ -402,7 +401,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'); }, diff --git a/docs/json/roodata.json b/docs/json/roodata.json index 49146ce23e..e8203b6e93 100644 --- a/docs/json/roodata.json +++ b/docs/json/roodata.json @@ -287497,6 +287497,16 @@ "tree_children" : [], "tree_parent" : [] }, + "Roo.htmleditor.FilterFileWarning" : { + "props" : [], + "events" : [], + "methods" : [], + "isAbstract" : false, + "isBuilderTop" : false, + "implementations" : [], + "tree_children" : [], + "tree_parent" : [] + }, "Roo.htmleditor.FilterKeepChildren" : { "props" : [], "events" : [], diff --git a/docs/src/Roo_HtmlEditorCore.js.html b/docs/src/Roo_HtmlEditorCore.js.html index 8b9383e09e..593e8a54af 100644 --- a/docs/src/Roo_HtmlEditorCore.js.html +++ b/docs/src/Roo_HtmlEditorCore.js.html @@ -588,8 +588,8 @@ var parser = new Roo.rtf.Parser(cd.getData('text/rtf')); images = parser.doc ? parser.doc.getElementsByType('pict') : []; } - Roo.log(images); - //Roo.log(imgs); + //Roo.log(images); + //Roo.log(imgs); // fixme.. images = images.filter(function(g) { return !g.path.match(/^rtf\/(head|pgdsctbl|listtable|footerf)/); }) // ignore headers/footers etc. .map(function(g) { return g.toDataURL(); }) @@ -632,6 +632,8 @@ new Roo.htmleditor.FilterSpan({ node : d }); new Roo.htmleditor.FilterLongBr({ node : d }); new Roo.htmleditor.FilterComment({ node : d }); + + } if (this.enableBlocks) { @@ -653,6 +655,11 @@ 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; diff --git a/docs/src/Roo_htmleditor_BlockFigure.js.html b/docs/src/Roo_htmleditor_BlockFigure.js.html index ae287070f6..69f908c44b 100644 --- a/docs/src/Roo_htmleditor_BlockFigure.js.html +++ b/docs/src/Roo_htmleditor_BlockFigure.js.html @@ -348,12 +348,12 @@ 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%', - }, + }, cls : this.cls.length > 0 ? (this.cls + '-thumbnail' ) : '', cn : [ { diff --git a/docs/tree.json b/docs/tree.json index ee493785a2..459b4164be 100644 --- a/docs/tree.json +++ b/docs/tree.json @@ -1350,6 +1350,11 @@ "cn" : [], "is_class" : false }, + { + "name" : "Roo.htmleditor.FilterFileWarning", + "cn" : [], + "is_class" : false + }, { "name" : "Roo.htmleditor.FilterKeepChildren", "cn" : [], diff --git a/roojs-all.js b/roojs-all.js index 0c70cdd266..35456cacb3 100644 --- a/roojs-all.js +++ b/roojs-all.js @@ -1994,16 +1994,16 @@ Roo.htmleditor.BlockFigure=function(A){if(A.node){this.readElement(A.node);this. }b.image_src=I;b.updateElement();D();A.editorcore.onEditorEvent();},minWidth:250,prompt:true,modal:true,value:b.image_src});}},xns:C.Toolbar},{xtype:'Button',text:'Change Link URL',listeners:{click:function(F,G){var b=B();Roo.MessageBox.show({title:"Link URL",msg:"Enter the url for the link - leave blank to have no link",buttons:Roo.MessageBox.OKCANCEL,fn:function(H,I){if(H!='ok'){return; }b.href=I;b.updateElement();D();A.editorcore.onEditorEvent();},minWidth:250,prompt:true,modal:true,value:b.href});}},xns:C.Toolbar},{xtype:'Button',text:'Show Video URL',listeners:{click:function(F,G){Roo.MessageBox.alert("Video URL",B().video_url==''?'This image is not linked ot a video':'The image is linked to: '+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(); diff --git a/roojs-bootstrap-debug.js b/roojs-bootstrap-debug.js index 919cf17219..cfb9e9a00b 100644 --- a/roojs-bootstrap-debug.js +++ b/roojs-bootstrap-debug.js @@ -29221,7 +29221,7 @@ Roo.extend(Roo.HtmlEditorCore, Roo.Component, { var parser = new Roo.rtf.Parser(cd.getData('text/rtf')); images = parser.doc ? parser.doc.getElementsByType('pict') : []; } - Roo.log(images); + //Roo.log(images); //Roo.log(imgs); // fixme.. images = images.filter(function(g) { return !g.path.match(/^rtf\/(head|pgdsctbl|listtable|footerf)/); }) // ignore headers/footers etc. @@ -29265,6 +29265,8 @@ Roo.extend(Roo.HtmlEditorCore, Roo.Component, { new Roo.htmleditor.FilterSpan({ node : d }); new Roo.htmleditor.FilterLongBr({ node : d }); new Roo.htmleditor.FilterComment({ node : d }); + + } if (this.enableBlocks) { @@ -29286,6 +29288,11 @@ Roo.extend(Roo.HtmlEditorCore, Roo.Component, { 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; diff --git a/roojs-bootstrap.js b/roojs-bootstrap.js index b61ed85a94..dc4e3b422d 100644 --- a/roojs-bootstrap.js +++ b/roojs-bootstrap.js @@ -1263,30 +1263,31 @@ A.bgProperties='fixed';A.setAttribute("translate","no");Roo.EventManager.on(this );if(Roo.isGecko){Roo.EventManager.on(this.doc,'keypress',this.mozKeyPress,this);}if(Roo.isIE||Roo.isSafari||Roo.isOpera){Roo.EventManager.on(this.doc,'keydown',this.fixKeys,this);}this.initialized=true;new Roo.htmleditor.KeyEnter({core:this});this.owner.fireEvent('initialize',this); this.pushValue();},onPasteEvent:function(e,v){var cd=(e.browserEvent.clipboardData||window.clipboardData);if(cd.files&&cd.files.length>0){var A=(window.createObjectURL&&window)||(window.URL&&URL.revokeObjectURL&&URL)||(window.webkitURL&&webkitURL);var B=A.createObjectURL(cd.files[0]); this.insertAtCursor('');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'):[]; -}Roo.log(C);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; +}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} );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);}e.preventDefault();return false;},onDestroy:function(){if(this.rendered){} -},onFirstFocus:function(){this.assignDocWin();this.undoManager=new Roo.lib.UndoManager(100,(this.doc.body||this.doc.documentElement));this.activated=true;if(Roo.isGecko){this.win.focus();var s=this.win.getSelection();if(!s.focusNode||s.focusNode.nodeType!=3){var r=s.getRangeAt(0); -r.selectNodeContents((this.doc.body||this.doc.documentElement));r.collapse(true);this.deferFocus();}try{this.execCmd('useCSS',true);this.execCmd('styleWithCSS',false);}catch(e){}}this.owner.fireEvent('activate',this);},adjustFont:function(A){var B=A.cmd=='increasefontsize'?1:-1; -var v=parseInt(this.doc.queryCommandValue('FontSize')||3,10);if(Roo.isSafari){var sm={10:1,13:2,16:3,18:4,24:5,32:6,48:7};v=(v<10)?10:v;v=(v>48)?48:v;v=typeof(sm[v])=='undefined'?1:sm[v];}v=Math.max(1,v+B);this.execCmd('FontSize',v);},onEditorEvent:function(e){if(e&&(e.ctrlKey||e.metaKey)&&e.keyCode===90){return; -}if(e&&e.target.nodeName=='BODY'&&e.type=="mouseup"&&this.doc.body.lastChild){var lc=this.doc.body.lastChild;while((lc.nodeType==3&&lc.nodeValue=='')||lc.id=='gtx-trans'){lc=lc.previousSibling;}if(lc.nodeType==1&&lc.nodeName!='BR'){var ns=this.doc.createElement('br'); -this.doc.body.appendChild(ns);range=this.doc.createRange();range.setStartAfter(ns);range.collapse(true);var A=this.win.getSelection();A.removeAllRanges();A.addRange(range);}}this.fireEditorEvent(e);this.syncValue();},fireEditorEvent:function(e){this.owner.fireEvent('editorevent',this,e); -},insertTag:function(tg){if(tg.toLowerCase()=='span'||tg.toLowerCase()=='code'||tg.toLowerCase()=='sup'||tg.toLowerCase()=='sub'){range=this.createRange(this.getSelection());var A=this.doc.createElement(tg.toLowerCase());A.appendChild(range.extractContents()); -range.insertNode(A);return;}this.execCmd("formatblock",tg);this.undoManager.addEvent();},insertText:function(A){var B=this.createRange();B.deleteContents();B.insertNode(this.doc.createTextNode(A));this.undoManager.addEvent();},relayCmd:function(A,B){switch(A){case 'justifyleft':case 'justifyright':case 'justifycenter':var n=this.getParentElement(); -var td=n.closest('td');if(td){var bl=Roo.htmleditor.Block.factory(td);bl.textAlign=A.replace('justify','');bl.updateElement();this.owner.fireEvent('editorevent',this);return;}this.execCmd('styleWithCSS',true);break;case 'bold':case 'italic':this.execCmd('styleWithCSS',false); -break;default:break;}this.win.focus();this.execCmd(A,B);this.owner.fireEvent('editorevent',this);this.owner.deferFocus();},execCmd:function(A,B){this.doc.execCommand(A,false,B===undefined?null:B);this.syncValue();},insertAtCursor:function(A){if(!this.activated){return; -}if(Roo.isGecko||Roo.isOpera||Roo.isSafari){this.win.focus();var B,C;var D=this.win;if(D.getSelection&&D.getSelection().getRangeAt){this.createRange(this.getSelection()).deleteContents();B=D.getSelection().getRangeAt(0);C=typeof(A)=='string'?B.createContextualFragment(A):A; -B.insertNode(C);B=B.cloneRange();B.collapse(false);D.getSelection().removeAllRanges();D.getSelection().addRange(B);}else if(D.document.selection&&D.document.selection.createRange){var E=typeof(A)=='string'?A:A.outerHTML;D.document.selection.createRange().pasteHTML(E); -}else{var E=typeof(A)=='string'?A:A.outerHTML;this.execCmd('InsertHTML',E);}this.syncValue();this.deferFocus();}},mozKeyPress:function(e){if(e.ctrlKey){var c=e.getCharCode(),A;if(c>0){c=String.fromCharCode(c).toLowerCase();switch(c){case 'b':A='bold';break; -case 'i':A='italic';break;case 'u':A='underline';break;}if(A){this.relayCmd(A);e.preventDefault();}}}},fixKeys:function(){if(Roo.isIE){return function(e){var k=e.getKey(),r;if(k==e.TAB){e.stopEvent();r=this.doc.selection.createRange();if(r){r.collapse(true); -r.pasteHTML('    ');this.deferFocus();}return;}};}else if(Roo.isOpera){return function(e){var k=e.getKey();if(k==e.TAB){e.stopEvent();this.win.focus();this.execCmd('InsertHTML','    ');this.deferFocus();}};}else if(Roo.isSafari){return function(e){var k=e.getKey(); -if(k==e.TAB){e.stopEvent();this.execCmd('InsertText','\t');this.deferFocus();return;}this.mozKeyPress(e);};}}(),getAllAncestors:function(){var p=this.getSelectedNode();var a=[];if(!p){a.push(p);p=this.getParentElement();}while(p&&(p.nodeType==1)&&(p.tagName.toLowerCase()!='body')){a.push(p); -p=p.parentNode;}a.push(this.doc.body);return a;},lastSel:false,lastSelNode:false,getSelection:function(){this.assignDocWin();return Roo.lib.Selection.wrap(Roo.isIE?this.doc.selection:this.win.getSelection(),this.doc);},selectNode:function(A,B){var C=A.ownerDocument.createRange(); -try{C.selectNode(A);}catch(e){C.selectNodeContents(A);}if(B===true){C.collapse(true);}var s=this.win.getSelection();s.removeAllRanges();s.addRange(C);},getSelectedNode:function(){var A=this.createRange(this.getSelection()).cloneRange();if(Roo.isIE){var B=A.parentElement(); -while(true){var C=A.duplicate();C.moveToElementText(B);if(C.inRange(A)){break;}if((B.nodeType!=1)||(B.tagName.toLowerCase()=='body')){break;}B=B.parentElement;}return B;}var ac=A.commonAncestorContainer;if(ac.nodeType==3){ac=ac.parentNode;}var ar=ac.childNodes; -var D=[];var E=[];var F=false;for(var i=0;i0)){E.push(ar[i]); +}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(); +this.undoManager=new Roo.lib.UndoManager(100,(this.doc.body||this.doc.documentElement));this.activated=true;if(Roo.isGecko){this.win.focus();var s=this.win.getSelection();if(!s.focusNode||s.focusNode.nodeType!=3){var r=s.getRangeAt(0);r.selectNodeContents((this.doc.body||this.doc.documentElement)); +r.collapse(true);this.deferFocus();}try{this.execCmd('useCSS',true);this.execCmd('styleWithCSS',false);}catch(e){}}this.owner.fireEvent('activate',this);},adjustFont:function(A){var B=A.cmd=='increasefontsize'?1:-1;var v=parseInt(this.doc.queryCommandValue('FontSize')||3,10); +if(Roo.isSafari){var sm={10:1,13:2,16:3,18:4,24:5,32:6,48:7};v=(v<10)?10:v;v=(v>48)?48:v;v=typeof(sm[v])=='undefined'?1:sm[v];}v=Math.max(1,v+B);this.execCmd('FontSize',v);},onEditorEvent:function(e){if(e&&(e.ctrlKey||e.metaKey)&&e.keyCode===90){return;}if(e&&e.target.nodeName=='BODY'&&e.type=="mouseup"&&this.doc.body.lastChild){var lc=this.doc.body.lastChild; +while((lc.nodeType==3&&lc.nodeValue=='')||lc.id=='gtx-trans'){lc=lc.previousSibling;}if(lc.nodeType==1&&lc.nodeName!='BR'){var ns=this.doc.createElement('br');this.doc.body.appendChild(ns);range=this.doc.createRange();range.setStartAfter(ns);range.collapse(true); +var A=this.win.getSelection();A.removeAllRanges();A.addRange(range);}}this.fireEditorEvent(e);this.syncValue();},fireEditorEvent:function(e){this.owner.fireEvent('editorevent',this,e);},insertTag:function(tg){if(tg.toLowerCase()=='span'||tg.toLowerCase()=='code'||tg.toLowerCase()=='sup'||tg.toLowerCase()=='sub'){range=this.createRange(this.getSelection()); +var A=this.doc.createElement(tg.toLowerCase());A.appendChild(range.extractContents());range.insertNode(A);return;}this.execCmd("formatblock",tg);this.undoManager.addEvent();},insertText:function(A){var B=this.createRange();B.deleteContents();B.insertNode(this.doc.createTextNode(A)); +this.undoManager.addEvent();},relayCmd:function(A,B){switch(A){case 'justifyleft':case 'justifyright':case 'justifycenter':var n=this.getParentElement();var td=n.closest('td');if(td){var bl=Roo.htmleditor.Block.factory(td);bl.textAlign=A.replace('justify',''); +bl.updateElement();this.owner.fireEvent('editorevent',this);return;}this.execCmd('styleWithCSS',true);break;case 'bold':case 'italic':this.execCmd('styleWithCSS',false);break;default:break;}this.win.focus();this.execCmd(A,B);this.owner.fireEvent('editorevent',this); +this.owner.deferFocus();},execCmd:function(A,B){this.doc.execCommand(A,false,B===undefined?null:B);this.syncValue();},insertAtCursor:function(A){if(!this.activated){return;}if(Roo.isGecko||Roo.isOpera||Roo.isSafari){this.win.focus();var B,C;var D=this.win; +if(D.getSelection&&D.getSelection().getRangeAt){this.createRange(this.getSelection()).deleteContents();B=D.getSelection().getRangeAt(0);C=typeof(A)=='string'?B.createContextualFragment(A):A;B.insertNode(C);B=B.cloneRange();B.collapse(false);D.getSelection().removeAllRanges(); +D.getSelection().addRange(B);}else if(D.document.selection&&D.document.selection.createRange){var E=typeof(A)=='string'?A:A.outerHTML;D.document.selection.createRange().pasteHTML(E);}else{var E=typeof(A)=='string'?A:A.outerHTML;this.execCmd('InsertHTML',E); +}this.syncValue();this.deferFocus();}},mozKeyPress:function(e){if(e.ctrlKey){var c=e.getCharCode(),A;if(c>0){c=String.fromCharCode(c).toLowerCase();switch(c){case 'b':A='bold';break;case 'i':A='italic';break;case 'u':A='underline';break;}if(A){this.relayCmd(A); +e.preventDefault();}}}},fixKeys:function(){if(Roo.isIE){return function(e){var k=e.getKey(),r;if(k==e.TAB){e.stopEvent();r=this.doc.selection.createRange();if(r){r.collapse(true);r.pasteHTML('    ');this.deferFocus();}return;}};}else if(Roo.isOpera){return function(e){var k=e.getKey(); +if(k==e.TAB){e.stopEvent();this.win.focus();this.execCmd('InsertHTML','    ');this.deferFocus();}};}else if(Roo.isSafari){return function(e){var k=e.getKey();if(k==e.TAB){e.stopEvent();this.execCmd('InsertText','\t');this.deferFocus(); +return;}this.mozKeyPress(e);};}}(),getAllAncestors:function(){var p=this.getSelectedNode();var a=[];if(!p){a.push(p);p=this.getParentElement();}while(p&&(p.nodeType==1)&&(p.tagName.toLowerCase()!='body')){a.push(p);p=p.parentNode;}a.push(this.doc.body);return a; +},lastSel:false,lastSelNode:false,getSelection:function(){this.assignDocWin();return Roo.lib.Selection.wrap(Roo.isIE?this.doc.selection:this.win.getSelection(),this.doc);},selectNode:function(A,B){var C=A.ownerDocument.createRange();try{C.selectNode(A);}catch(e){C.selectNodeContents(A); +}if(B===true){C.collapse(true);}var s=this.win.getSelection();s.removeAllRanges();s.addRange(C);},getSelectedNode:function(){var A=this.createRange(this.getSelection()).cloneRange();if(Roo.isIE){var B=A.parentElement();while(true){var C=A.duplicate();C.moveToElementText(B); +if(C.inRange(A)){break;}if((B.nodeType!=1)||(B.tagName.toLowerCase()=='body')){break;}B=B.parentElement;}return B;}var ac=A.commonAncestorContainer;if(ac.nodeType==3){ac=ac.parentNode;}var ar=ac.childNodes;var D=[];var E=[];var F=false;for(var i=0;i0)){E.push(ar[i]); continue;}if(!this.rangeIntersectsNode(A,ar[i])||(this.rangeCompareNode(A,ar[i])==0)){continue;}F=true;}if(!D.length&&E.length){D=E;}if(F||!D.length||(D.length>1)){return false;}return D[0];},createRange:function(A){if(typeof A!="undefined"){try{return A.getRangeAt?A.getRangeAt(0):A.createRange(); }catch(e){return this.doc.createRange();}}else{return this.doc.createRange();}},getParentElement:function(){this.assignDocWin();var A=Roo.isIE?this.doc.selection:this.win.getSelection();var B=this.createRange(A);try{var p=B.commonAncestorContainer;while(p.nodeType==3){p=p.parentNode; }return p;}catch(e){return null;}},rangeIntersectsNode:function(A,B){var C=B.ownerDocument.createRange();try{C.selectNode(B);}catch(e){C.selectNodeContents(B);}var D=A.cloneRange();D.collapse(true);var E=A.cloneRange();E.collapse(false);var F=C.cloneRange(); diff --git a/roojs-debug.js b/roojs-debug.js index 13e1efef50..6d0b5fb828 100644 --- a/roojs-debug.js +++ b/roojs-debug.js @@ -48055,7 +48055,6 @@ Roo.extend(Roo.htmleditor.BlockFigure, Roo.htmleditor.Block, { store : { xtype : 'SimpleStore', data : [ - ['auto'], ['50%'], ['80%'], ['100%'] @@ -48199,7 +48198,7 @@ Roo.extend(Roo.htmleditor.BlockFigure, Roo.htmleditor.Block, { var ret = { tag: 'figure', 'data-block' : 'Figure', - + 'data-width' : this.width, contenteditable : 'false', style : { @@ -48226,9 +48225,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%' }, @@ -48280,7 +48279,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'); }, @@ -50160,7 +50159,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-ui-debug.js b/roojs-ui-debug.js index 96f3c622c6..8e4d04d754 100644 --- a/roojs-ui-debug.js +++ b/roojs-ui-debug.js @@ -23563,7 +23563,6 @@ Roo.extend(Roo.htmleditor.BlockFigure, Roo.htmleditor.Block, { store : { xtype : 'SimpleStore', data : [ - ['auto'], ['50%'], ['80%'], ['100%'] @@ -23707,7 +23706,7 @@ Roo.extend(Roo.htmleditor.BlockFigure, Roo.htmleditor.Block, { var ret = { tag: 'figure', 'data-block' : 'Figure', - + 'data-width' : this.width, contenteditable : 'false', style : { @@ -23734,9 +23733,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%' }, @@ -23788,7 +23787,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'); }, @@ -25668,7 +25667,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-ui.js b/roojs-ui.js index d108d79375..3248e4a5db 100644 --- a/roojs-ui.js +++ b/roojs-ui.js @@ -1048,16 +1048,16 @@ Roo.htmleditor.BlockFigure=function(A){if(A.node){this.readElement(A.node);this. }b.image_src=I;b.updateElement();D();A.editorcore.onEditorEvent();},minWidth:250,prompt:true,modal:true,value:b.image_src});}},xns:C.Toolbar},{xtype:'Button',text:'Change Link URL',listeners:{click:function(F,G){var b=B();Roo.MessageBox.show({title:"Link URL",msg:"Enter the url for the link - leave blank to have no link",buttons:Roo.MessageBox.OKCANCEL,fn:function(H,I){if(H!='ok'){return; }b.href=I;b.updateElement();D();A.editorcore.onEditorEvent();},minWidth:250,prompt:true,modal:true,value:b.href});}},xns:C.Toolbar},{xtype:'Button',text:'Show Video URL',listeners:{click:function(F,G){Roo.MessageBox.alert("Video URL",B().video_url==''?'This image is not linked ot a video':'The image is linked to: '+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();