fix the image paste correctly
authorAlan <alan@roojs.com>
Thu, 19 Jan 2023 08:37:11 +0000 (16:37 +0800)
committerAlan <alan@roojs.com>
Thu, 19 Jan 2023 08:37:11 +0000 (16:37 +0800)
Roo/HtmlEditorCore.js
roojs-bootstrap-debug.js
roojs-bootstrap.js

index 0673308..128ed4d 100644 (file)
@@ -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('<img src="' + url + '">', '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('<img src="' + r.result+ '">', 'text/html')).body;
+                // is insert asycn?
+                if (t.enableBlocks) {
                     
-                });
-            }
-            this.insertAtCursor(d.innerHTML.replace(/&nbsp;/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(/&nbsp;/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 ) {
index 0a676f7..429b553 100644 (file)
@@ -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('<img src="' + url + '">', '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('<img src="' + r.result+ '">', 'text/html')).body;
+                // is insert asycn?
+                if (t.enableBlocks) {
                     
-                });
-            }
-            this.insertAtCursor(d.innerHTML.replace(/&nbsp;/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(/&nbsp;/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 ) {
index ad01200..b8ea248 100644 (file)
@@ -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('<img src="'+B+'">','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(/&nbsp;/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('<img src="'+r.result+'">','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(/&nbsp;/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(/&nbsp;/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(/&nbsp;/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}