From 2292bdfe51a190fca7b40f0665e0ebdebc0df2cc Mon Sep 17 00:00:00 2001 From: Alan Date: Thu, 19 Jan 2023 16:37:11 +0800 Subject: [PATCH] fix the image paste correctly --- Roo/HtmlEditorCore.js | 42 ++++++++++++++++++++++++---------------- roojs-bootstrap-debug.js | 42 ++++++++++++++++++++++++---------------- roojs-bootstrap.js | 15 +++++++------- 3 files changed, 58 insertions(+), 41 deletions(-) diff --git a/Roo/HtmlEditorCore.js b/Roo/HtmlEditorCore.js index 0673308ced..128ed4d0bb 100644 --- a/Roo/HtmlEditorCore.js +++ b/Roo/HtmlEditorCore.js @@ -606,26 +606,34 @@ Roo.extend(Roo.HtmlEditorCore, Roo.Component, { var urlAPI = (window.createObjectURL && window) || (window.URL && URL.revokeObjectURL && URL) || (window.webkitURL && webkitURL); - - var url = urlAPI.createObjectURL( cd.files[0]); - var d = (new DOMParser().parseFromString('', 'text/html')).body; - // is insert asycn? - if (this.enableBlocks) { + + var r = new FileReader(); + var t = this; + r.addEventListener('load',function() + { - Array.from(d.getElementsByTagName('img')).forEach(function(img) { - if (img.closest('figure')) { // assume!! that it's aready - return; - } - var fig = new Roo.htmleditor.BlockFigure({ - image_src : img.src - }); - fig.updateElement(img); // replace it.. + var d = (new DOMParser().parseFromString('', 'text/html')).body; + // is insert asycn? + if (t.enableBlocks) { - }); - } - this.insertAtCursor(d.innerHTML.replace(/ /g,' ')); + Array.from(d.getElementsByTagName('img')).forEach(function(img) { + if (img.closest('figure')) { // assume!! that it's aready + return; + } + var fig = new Roo.htmleditor.BlockFigure({ + image_src : img.src + }); + fig.updateElement(img); // replace it.. + + }); + } + t.insertAtCursor(d.innerHTML.replace(/ /g,' ')); + t.owner.fireEvent('paste', this); + }); + r.readAsDataURL(cd.files[0]); + e.preventDefault(); - this.owner.fireEvent('paste', this); + return false; } if (cd.types.indexOf('text/html') < 0 ) { diff --git a/roojs-bootstrap-debug.js b/roojs-bootstrap-debug.js index 0a676f7eb5..429b553d9e 100644 --- a/roojs-bootstrap-debug.js +++ b/roojs-bootstrap-debug.js @@ -31373,26 +31373,34 @@ Roo.extend(Roo.HtmlEditorCore, Roo.Component, { var urlAPI = (window.createObjectURL && window) || (window.URL && URL.revokeObjectURL && URL) || (window.webkitURL && webkitURL); - - var url = urlAPI.createObjectURL( cd.files[0]); - var d = (new DOMParser().parseFromString('', 'text/html')).body; - // is insert asycn? - if (this.enableBlocks) { + + var r = new FileReader(); + var t = this; + r.addEventListener('load',function() + { - Array.from(d.getElementsByTagName('img')).forEach(function(img) { - if (img.closest('figure')) { // assume!! that it's aready - return; - } - var fig = new Roo.htmleditor.BlockFigure({ - image_src : img.src - }); - fig.updateElement(img); // replace it.. + var d = (new DOMParser().parseFromString('', 'text/html')).body; + // is insert asycn? + if (t.enableBlocks) { - }); - } - this.insertAtCursor(d.innerHTML.replace(/ /g,' ')); + Array.from(d.getElementsByTagName('img')).forEach(function(img) { + if (img.closest('figure')) { // assume!! that it's aready + return; + } + var fig = new Roo.htmleditor.BlockFigure({ + image_src : img.src + }); + fig.updateElement(img); // replace it.. + + }); + } + t.insertAtCursor(d.innerHTML.replace(/ /g,' ')); + t.owner.fireEvent('paste', this); + }); + r.readAsDataURL(cd.files[0]); + e.preventDefault(); - this.owner.fireEvent('paste', this); + return false; } if (cd.types.indexOf('text/html') < 0 ) { diff --git a/roojs-bootstrap.js b/roojs-bootstrap.js index ad01200f85..b8ea2480c8 100644 --- a/roojs-bootstrap.js +++ b/roojs-bootstrap.js @@ -1348,14 +1348,15 @@ var lc=this.doc.body.lastChild;if(lc&&lc.nodeType==1&&lc.getAttribute("contented this.win=(A.contentWindow||Roo.get(this.frameId).dom.contentWindow);}},initEditor:function(){this.assignDocWin();this.doc.designMode="on";this.doc.open();this.doc.write(this.getDocMarkup());this.doc.close();var A=(this.doc.body||this.doc.documentElement); A.bgProperties='fixed';A.setAttribute("translate","no");Roo.EventManager.on(this.doc,{'mouseup':this.onEditorEvent,'dblclick':this.onEditorEvent,'click':this.onEditorEvent,'keyup':this.onEditorEvent,buffer:100,scope:this});Roo.EventManager.on(this.doc,{'paste':this.onPasteEvent,scope: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]); -var d=(new DOMParser().parseFromString('','text/html')).body;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,' '));e.preventDefault();this.owner.fireEvent('paste',this);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){var ar=Array.from(d.getElementsByTagName('v:imagedata'));Roo.each(ar,function(F){F.parentNode.insertBefore(d.ownerDocument.createElement('img'),F); -F.parentNode.removeChild(F);});Roo.each(d.getElementsByTagName('img'),function(F,i){F.setAttribute('src',C[i]);});}if(this.autoClean){new Roo.htmleditor.FilterWord({node:d});new Roo.htmleditor.FilterStyleToTag({node:d});new Roo.htmleditor.FilterAttributes({node:d,attrib_white:['href','src','name','align','colspan','rowspan','data-display','data-width','start'],attrib_clean:['href','src']} +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 r=new FileReader(); +var t=this;r.addEventListener('load',function(){var d=(new DOMParser().parseFromString('','text/html')).body;if(t.enableBlocks){Array.from(d.getElementsByTagName('img')).forEach(function(E){if(E.closest('figure')){return;}var F=new Roo.htmleditor.BlockFigure({image_src:E.src} +);F.updateElement(E);});}t.insertAtCursor(d.innerHTML.replace(/ /g,' '));t.owner.fireEvent('paste',this);});r.readAsDataURL(cd.files[0]);e.preventDefault();return false;}if(cd.types.indexOf('text/html')<0){return false;}var B=[];var C=cd.getData('text/html'); +if(cd.types.indexOf('text/rtf')>-1){var D=new Roo.rtf.Parser(cd.getData('text/rtf'));B=D.doc?D.doc.getElementsByType('pict'):[];}B=B.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';});C=this.cleanWordChars(C);var d=(new DOMParser().parseFromString(C,'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(B.length>0){var ar=Array.from(d.getElementsByTagName('v:imagedata'));Roo.each(ar,function(E){E.parentNode.insertBefore(d.ownerDocument.createElement('img'),E);E.parentNode.removeChild(E);});Roo.each(d.getElementsByTagName('img'),function(E,i){E.setAttribute('src',B[i]); +});}if(this.autoClean){new Roo.htmleditor.FilterWord({node:d});new Roo.htmleditor.FilterStyleToTag({node:d});new Roo.htmleditor.FilterAttributes({node:d,attrib_white:['href','src','name','align','colspan','rowspan','data-display','data-width','start'],attrib_clean:['href','src']} );new Roo.htmleditor.FilterBlack({node:d,tag:this.black});new Roo.htmleditor.FilterKeepChildren({node:d,tag:['FONT',':']});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); +);}if(this.enableBlocks){Array.from(d.getElementsByTagName('img')).forEach(function(E){if(E.closest('figure')){return;}var F=new Roo.htmleditor.BlockFigure({image_src:E.src});F.updateElement(E);});}this.insertAtCursor(d.innerHTML.replace(/ /g,' '));if(this.enableBlocks){Roo.htmleditor.Block.initAll(this.doc.body); }e.preventDefault();this.owner.fireEvent('paste',this);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} -- 2.39.2