roojs-bootstrap.js wip_alan_T7581_selection_of_blocks
authorAlan <alan@roojs.com>
Thu, 16 Feb 2023 09:22:56 +0000 (17:22 +0800)
committerAlan <alan@roojs.com>
Thu, 16 Feb 2023 09:22:56 +0000 (17:22 +0800)
roojs-bootstrap-debug.js

roojs-bootstrap-debug.js
roojs-bootstrap.js

index 6a850fe..01b44c9 100644 (file)
@@ -33011,9 +33011,7 @@ Roo.extend(Roo.bootstrap.form.HtmlEditorToolbar.Standard, Roo.bootstrap.nav.Simp
         btn('link', false, true, this.onLinkClick);
         
         
-        btn('image', false, true, function() {
-            
-        });
+        btn('image', false, true, this.onImageClick);
         btn('list','insertunorderedlist',true);
         btn('list-ol','insertorderedlist',true);
 
@@ -33064,6 +33062,87 @@ Roo.extend(Roo.bootstrap.form.HtmlEditorToolbar.Standard, Roo.bootstrap.nav.Simp
         
     },
     
+    onImageClick : function()
+    {
+        if (this.input) {
+            this.input.un('change', this.onFileSelected, this);
+        }
+        this.input = Roo.get(document.body).createChild({ 
+          tag: 'input', 
+          type : 'file', 
+          style : 'display:none', 
+          multiple: 'multiple'
+       });
+        this.input.on('change', this.onFileSelected, this);
+        this.input.dom.click();
+    },
+    
+    onFileSelected : function(e)
+    {
+         e.preventDefault();
+        
+        if(typeof(this.input.dom.files) == 'undefined' || !this.input.dom.files.length){
+            return;
+        }
+    
+         
+        this.addFiles(Array.prototype.slice.call(this.input.dom.files));
+    },
+    
+    addFiles : function(far) {
+
+        if (!far.length) {
+            return;
+        }
+        
+        var f = far.pop();
+        
+        if (!f.type.match(/^image/)) {
+            this.addFiles(far);
+            return;
+        }
+         
+        var sn = this.selectedNode;
+        
+        var bl = sn  && this.editorcore.enableBlocks ? Roo.htmleditor.Block.factory(sn) : false;
+        
+        var editor =  this.editorcore;
+        
+        var reader = new FileReader();
+        reader.addEventListener('load', (function() {
+            if (bl) {
+                bl.image_src = reader.result;
+                //bl.caption = f.name;
+                bl.updateElement(sn);
+                editor.owner.fireEvent('editorevent', editor, false);
+                // we only do the first file!! and replace.
+                return;
+            }
+            if (this.editorcore.enableBlocks) {
+                var fig = new Roo.htmleditor.BlockFigure({
+                    image_src :  reader.result,
+                    caption : '',
+                    caption_display : 'none'  //default to hide captions..
+                 });
+                editor.insertAtCursor(fig.toHTML());
+                editor.owner.fireEvent('editorevent', editor, false);
+                return;
+            }
+            // just a standard img..
+            if (sn && sn.tagName.toUpperCase() == 'IMG') {
+                sn.src = reader.result;
+                editor.owner.fireEvent('editorevent', editor, false);
+                return;
+            }
+            editor.insertAtCursor('<img src="' + reader.result +'">');
+            editor.owner.fireEvent('editorevent', editor, false);
+            
+        }).createDelegate(this));
+        reader.readAsDataURL(f);
+        
+    
+     },
+    
     
     onBtnClick : function(id)
     {
index efe76f8..44c95e7 100644 (file)
@@ -1417,10 +1417,15 @@ Roo.bootstrap.form.HtmlEditorToolbar.Standard=function(A){Roo.apply(this,A);this
 this.editor=A.editor;this.editorcore=A.editor.editorcore;this.buttons=new Roo.util.MixedCollection(false,function(o){return o.btnid;});};Roo.extend(Roo.bootstrap.form.HtmlEditorToolbar.Standard,Roo.bootstrap.nav.Simplebar,{bar:true,editor:false,editorcore:false,formats:["p","h1","h2","h3","h4","h5","h6","pre","code","abbr","acronym","address","cite","samp","var",'div','span'],deleteBtn:false,onRender:function(ct,A){Roo.bootstrap.form.HtmlEditorToolbar.Standard.superclass.onRender.call(this,ct,A);
 Roo.log(this.el);this.el.dom.style.marginBottom='0';var B=this;var C=this.editorcore;var D=this.editor;var E=[];var F=function(id,G,H,I,J){var K=H?'toggle':'click';var a={size:'sm',xtype:'Button',xns:Roo.bootstrap,btnid:id,fa:id,cmd:G,enableToggle:H!==false,html:J||'',pressed:H?false:null,listeners:{}
 };a.listeners[H?'toggle':'click']=function(){I?I.call(B,this):B.onBtnClick.call(B,G||id);};E.push(a);return a;};var style={xtype:'Button',size:'sm',xns:Roo.bootstrap,fa:'font',menu:{xtype:'Menu',xns:Roo.bootstrap,items:[]}};Roo.each(this.formats,function(f){style.menu.items.push({xtype:'MenuItem',xns:Roo.bootstrap,html:'<'+f+' style="margin:2px">'+f+'</'+f+'>',tagname:f,listeners:{click:function(){C.insertTag(this.tagname);
-D.focus();}}});});E.push(style);F('bold',false,true);F('italic',false,true);F('align-left','justifyleft',true);F('align-center','justifycenter',true);F('align-right','justifyright',true);F('link',false,true,this.onLinkClick);F('image',false,true,function(){}
-);F('list','insertunorderedlist',true);F('list-ol','insertorderedlist',true);F('pencil',false,true,function(G){Roo.log(this);this.toggleSourceEdit(G.pressed);});if(this.editor.btns.length>0){for(var i=0;i<this.editor.btns.length;i++){E.push(this.editor.btns[i]);
+D.focus();}}});});E.push(style);F('bold',false,true);F('italic',false,true);F('align-left','justifyleft',true);F('align-center','justifycenter',true);F('align-right','justifyright',true);F('link',false,true,this.onLinkClick);F('image',false,true,this.onImageClick);
+F('list','insertunorderedlist',true);F('list-ol','insertorderedlist',true);F('pencil',false,true,function(G){Roo.log(this);this.toggleSourceEdit(G.pressed);});if(this.editor.btns.length>0){for(var i=0;i<this.editor.btns.length;i++){E.push(this.editor.btns[i]);
 }}this.xtype='NavSimplebar';for(var i=0;i<E.length;i++){this.buttons.add(this.addxtypeChild(E[i]));}this.buildToolbarDelete();D.on('editorevent',this.updateToolbar,this);},buildToolbarDelete:function(){this.deleteBtn=this.addxtypeChild({size:'sm',xtype:'Button',xns:Roo.bootstrap,fa:'trash',listeners:{click:this.onDelete.createDelegate(this)}
-});this.deleteBtn.hide();},onBtnClick:function(id){this.editorcore.relayCmd(id);this.editorcore.focus();},onLinkClick:function(A){var B=this.selectedNode&&this.selectedNode.tagName.toUpperCase()=='A'?this.selectedNode.getAttribute('href'):'';Roo.bootstrap.MessageBox.show({title:"Add / Edit Link URL",msg:"Enter the URL for the link",buttons:Roo.bootstrap.MessageBox.OKCANCEL,minWidth:250,scope:this,prompt:true,multiline:false,modal:true,value:B,fn:function(C,D){if(C!='ok'){this.editorcore.focus();
+});this.deleteBtn.hide();},onImageClick:function(){if(this.input){this.input.un('change',this.onFileSelected,this);}this.input=Roo.get(document.body).createChild({tag:'input',type:'file',style:'display:none',multiple:'multiple'});this.input.on('change',this.onFileSelected,this);
+this.input.dom.click();},onFileSelected:function(e){e.preventDefault();if(typeof(this.input.dom.files)=='undefined'||!this.input.dom.files.length){return;}this.addFiles(Array.prototype.slice.call(this.input.dom.files));},addFiles:function(A){if(!A.length){return;
+}var f=A.pop();if(!f.type.match(/^image/)){this.addFiles(A);return;}var sn=this.selectedNode;var bl=sn&&this.editorcore.enableBlocks?Roo.htmleditor.Block.factory(sn):false;var B=this.editorcore;var C=new FileReader();C.addEventListener('load',(function(){if(bl){bl.image_src=C.result;
+bl.updateElement(sn);B.owner.fireEvent('editorevent',B,false);return;}if(this.editorcore.enableBlocks){var D=new Roo.htmleditor.BlockFigure({image_src:C.result,caption:'',caption_display:'none'});B.insertAtCursor(D.toHTML());B.owner.fireEvent('editorevent',B,false);
+return;}if(sn&&sn.tagName.toUpperCase()=='IMG'){sn.src=C.result;B.owner.fireEvent('editorevent',B,false);return;}B.insertAtCursor('<img src="'+C.result+'">');B.owner.fireEvent('editorevent',B,false);}).createDelegate(this));C.readAsDataURL(f);},onBtnClick:function(id){this.editorcore.relayCmd(id);
+this.editorcore.focus();},onLinkClick:function(A){var B=this.selectedNode&&this.selectedNode.tagName.toUpperCase()=='A'?this.selectedNode.getAttribute('href'):'';Roo.bootstrap.MessageBox.show({title:"Add / Edit Link URL",msg:"Enter the URL for the link",buttons:Roo.bootstrap.MessageBox.OKCANCEL,minWidth:250,scope:this,prompt:true,multiline:false,modal:true,value:B,fn:function(C,D){if(C!='ok'){this.editorcore.focus();
 return;}if(B!=''){this.selectedNode.setAttribute('href',D);return;}if(D&&D.match(/http(s):\/\/.+/)){this.editorcore.relayCmd('createlink',D);}this.editorcore.focus();}});},updateToolbar:function(A,ev,B){if(!this.editorcore.activated){this.editor.onFirstFocus();
 return;}var C=this.buttons;var D=this.editorcore.doc;var E=false;C.each(function(e){if(e.enableToggle&&e.cmd){E=E||(['align-left','align-right','align-center'].indexOf(e.btnid)<0&&D.queryCommandState(e.cmd));e.setActive(D.queryCommandState(e.cmd));}},this);
 if(ev&&(ev.type=='mouseup'||ev.type=='click')&&ev.target&&ev.target.tagName!='BODY'){B=ev.target;}var F=this.editorcore.getAllAncestors();if(!B){B=F.length?(F[0]?F[0]:F[1]):this.editorcore.doc.body;B=B?B:this.editorcore.doc.body;B=B.tagName.length?B:this.editorcore.doc.body;