* @param {Roo.HtmlEditorCore} this
*/
editorevent: true
-
+
});
*/
Roo.bootstrap.form.HtmlEditor = function(config){
- Roo.bootstrap.form.HtmlEditor.superclass.constructor.call(this, config);
- if (!this.toolbars) {
- this.toolbars = [];
- }
-
- this.editorcore = new Roo.HtmlEditorCore(Roo.apply({ owner : this} , config));
+
this.addEvents({
/**
* @event initialize
* Fires when the editor is fully initialized (including the iframe)
- * @param {HtmlEditor} this
+ * @param {Roo.bootstrap.form.HtmlEditor} this
*/
initialize: true,
/**
* @event activate
* Fires when the editor is first receives the focus. Any insertion must wait
* until after this event.
- * @param {HtmlEditor} this
+ * @param {Roo.bootstrap.form.HtmlEditor} this
*/
activate: true,
/**
* @event beforesync
* Fires before the textarea is updated with content from the editor iframe. Return false
* to cancel the sync.
- * @param {HtmlEditor} this
+ * @param {Roo.bootstrap.form.HtmlEditor} this
* @param {String} html
*/
beforesync: true,
* @event beforepush
* Fires before the iframe editor is updated with content from the textarea. Return false
* to cancel the push.
- * @param {HtmlEditor} this
+ * @param {Roo.bootstrap.form.HtmlEditor} this
* @param {String} html
*/
beforepush: true,
/**
* @event sync
* Fires when the textarea is updated with content from the editor iframe.
- * @param {HtmlEditor} this
+ * @param {Roo.bootstrap.form.HtmlEditor} this
* @param {String} html
*/
sync: true,
/**
* @event push
* Fires when the iframe editor is updated with content from the textarea.
- * @param {HtmlEditor} this
+ * @param {Roo.bootstrap.form.HtmlEditor} this
* @param {String} html
*/
push: true,
/**
* @event editmodechange
* Fires when the editor switches edit modes
- * @param {HtmlEditor} this
+ * @param {Roo.bootstrap.form.HtmlEditor} this
* @param {Boolean} sourceEdit True if source edit, false if standard editing.
*/
editmodechange: true,
/**
* @event editorevent
* Fires when on any editor (mouse up/down cursor movement etc.) - used for toolbar hooks.
- * @param {HtmlEditor} this
+ * @param {Roo.bootstrap.form.HtmlEditor} this
*/
editorevent: true,
/**
* @event firstfocus
* Fires when on first focus - needed by toolbars..
- * @param {HtmlEditor} this
+ * @param {Roo.bootstrap.form.HtmlEditor} this
*/
firstfocus: true,
/**
* @event autosave
* Auto save the htmlEditor value as a file into Events
- * @param {HtmlEditor} this
+ * @param {Roo.bootstrap.form.HtmlEditor} this
*/
autosave: true,
/**
* @event savedpreview
* preview the saved version of htmlEditor
- * @param {HtmlEditor} this
+ * @param {Roo.bootstrap.form.HtmlEditor} this
*/
savedpreview: true,
/**
/**
* @event imageadd
* Fires when on any editor when an image is added (excluding paste)
- * @param {Roo.HtmlEditorCore} this
+ * @param {Roo.bootstrap.form.HtmlEditor} this
*/
imageadd: true ,
/**
+ * @event imageupdated
+ * Fires when on any editor when an image is changed (excluding paste)
+ * @param {Roo.bootstrap.form.HtmlEditor} this
+ * @param {HTMLElement} img could also be a figure if blocks are enabled
+ */
+ imageupdate: true ,
+ /**
* @event imagedelete
* Fires when on any editor when an image is deleted
- * @param {Roo.HtmlEditorCore} this
+ * @param {Roo.bootstrap.form.HtmlEditor} this
+ * @param {HTMLElement} img could also be a figure if blocks are enabled
*/
imagedelete: true
- });
+ });
+ Roo.bootstrap.form.HtmlEditor.superclass.constructor.call(this, config);
+ if (!this.toolbars) {
+ this.toolbars = [];
+ }
+
+ this.editorcore = new Roo.HtmlEditorCore(Roo.apply({ owner : this} , config));
+
};
}
- this.addFiles(Array.prototype.slice.call(this.input.dom.files));
+ this.addFiles(Array.prototype.slice.call(this.input.dom.files), false);
},
- addFiles : function(far) {
+ addFiles : function(far, fire_add) {
+
+ var editor = this.editorcore;
+
if (!far.length) {
+ if (fire_add) {
+ editor.owner.fireEvent('editorevent', editor.owner, false);
+ editor.owner.fireEvent('imageadd', editor.owner, false);
+ }
return;
}
var f = far.pop();
if (!f.type.match(/^image/)) {
- this.addFiles(far);
+ this.addFiles(far, fire_add);
return;
}
var bl = sn && this.editorcore.enableBlocks ? Roo.htmleditor.Block.factory(sn) : false;
- var editor = this.editorcore;
var reader = new FileReader();
reader.addEventListener('load', (function() {
bl.image_src = reader.result;
//bl.caption = f.name;
bl.updateElement(sn);
- editor.owner.fireEvent('editorevent', editor, false);
+ editor.owner.fireEvent('editorevent', editor.owner, false);
+ editor.owner.fireEvent('imageupdate', editor.owner, sn);
// we only do the first file!! and replace.
return;
}
caption_display : 'none' //default to hide captions..
});
editor.insertAtCursor(fig.toHTML());
- editor.owner.fireEvent('editorevent', editor, false);
+ this.addFiles(far, true);
return;
}
// just a standard img..
if (sn && sn.tagName.toUpperCase() == 'IMG') {
sn.src = reader.result;
- editor.owner.fireEvent('editorevent', editor, false);
+ editor.owner.fireEvent('editorevent', editor.owner, false);
+ editor.owner.fireEvent('imageupdate', editor.owner, sn);
return;
}
editor.insertAtCursor('<img src="' + reader.result +'">');
- editor.owner.fireEvent('editorevent', editor, false);
+ this.addFiles(far, true);
}).createDelegate(this));
reader.readAsDataURL(f);
selection.removeAllRanges();
selection.addRange(range);
this.updateToolbar(null, null, null);
+ if (sn.tagName.toUpperCase() == 'FIGURE') {
+ this.editor.fireEvent('imagedelete', this.editor, sn);
+ }
+
+ this.selectedNode = false;
this.editorcore.fireEditorEvent(false);
return;
}
selection.removeAllRanges();
selection.addRange(range);
+ if (sn.tagName.toUpperCase() == 'IMG"') {
+ this.editor.fireEvent('imagedelete', this.editor, sn);
+ }
+
+ this.selectedNode = false;
this.editorcore.fireEditorEvent(false);
Roo.HtmlEditorCore.tag_remove=['FONT','TBODY'];Roo.HtmlEditorCore.ablack=['on'];Roo.HtmlEditorCore.aclean=['action','background','codebase','dynsrc','href','lowsrc'];Roo.HtmlEditorCore.pwhite=['http','https','mailto'];Roo.HtmlEditorCore.cwhite=[];Roo.HtmlEditorCore.cblack=[];
// Roo/bootstrap/form/HtmlEditor.js
-Roo.bootstrap.form.HtmlEditor=function(A){Roo.bootstrap.form.HtmlEditor.superclass.constructor.call(this,A);if(!this.toolbars){this.toolbars=[];}this.editorcore=new Roo.HtmlEditorCore(Roo.apply({owner:this},A));this.addEvents({initialize:true,activate:true,beforesync:true,beforepush:true,sync:true,push:true,editmodechange:true,editorevent:true,firstfocus:true,autosave:true,savedpreview:true,stylesheetsclick:true,paste:true,imageadd:true,imagedelete:true}
-);};Roo.extend(Roo.bootstrap.form.HtmlEditor,Roo.bootstrap.form.TextArea,{toolbars:true,btns:[],resize:false,height:300,width:false,stylesheets:false,frameId:false,validationEvent:false,deferHeight:true,initialized:false,activated:false,onFocus:Roo.emptyFn,iframePad:3,hideMode:'offsets',tbContainer:false,bodyCls:'',toolbarContainer:function(){return this.wrap.select('.x-html-editor-tb',true).first();
+Roo.bootstrap.form.HtmlEditor=function(A){this.addEvents({initialize:true,activate:true,beforesync:true,beforepush:true,sync:true,push:true,editmodechange:true,editorevent:true,firstfocus:true,autosave:true,savedpreview:true,stylesheetsclick:true,paste:true,imageadd:true,imageupdate:true,imagedelete:true}
+);Roo.bootstrap.form.HtmlEditor.superclass.constructor.call(this,A);if(!this.toolbars){this.toolbars=[];}this.editorcore=new Roo.HtmlEditorCore(Roo.apply({owner:this},A));};Roo.extend(Roo.bootstrap.form.HtmlEditor,Roo.bootstrap.form.TextArea,{toolbars:true,btns:[],resize:false,height:300,width:false,stylesheets:false,frameId:false,validationEvent:false,deferHeight:true,initialized:false,activated:false,onFocus:Roo.emptyFn,iframePad:3,hideMode:'offsets',tbContainer:false,bodyCls:'',toolbarContainer:function(){return this.wrap.select('.x-html-editor-tb',true).first();
},createToolbar:function(){if(this.toolbars===false){return;}if(this.toolbars===true){this.toolbars=['Standard'];}var ar=Array.from(this.toolbars);this.toolbars=[];ar.forEach(function(t,i){if(typeof(t)=='string'){t={xtype:t};}if(typeof(t)=='object'&&typeof(t.xtype)=='string'){t.editor=this;
t.xns=t.xns||Roo.bootstrap.form.HtmlEditorToolbar;t=Roo.factory(t);}this.toolbars[i]=t;this.toolbars[i].render(this.toolbarContainer());},this);},onRender:function(ct,A){var _t=this;Roo.bootstrap.form.HtmlEditor.superclass.onRender.call(this,ct,A);this.wrap=this.inputEl().wrap({cls:'x-html-editor-wrap',cn:{cls:'x-html-editor-tb'}
});this.editorcore.onRender(ct,A);this.createToolbar(this);},onResize:function(w,h){Roo.log('resize: '+w+','+h);Roo.bootstrap.form.HtmlEditor.superclass.onResize.apply(this,arguments);var ew=false;var eh=false;if(this.inputEl()){if(typeof w=='number'){var aw=w-this.wrap.getFrameWidth('lr');
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();},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();
+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),false);},addFiles:function(A,B){var C=this.editorcore;
+if(!A.length){if(B){C.owner.fireEvent('editorevent',C.owner,false);C.owner.fireEvent('imageadd',C.owner,false);}return;}var f=A.pop();if(!f.type.match(/^image/)){this.addFiles(A,B);return;}var sn=this.selectedNode;var bl=sn&&this.editorcore.enableBlocks?Roo.htmleditor.Block.factory(sn):false;
+var D=new FileReader();D.addEventListener('load',(function(){if(bl){bl.image_src=D.result;bl.updateElement(sn);C.owner.fireEvent('editorevent',C.owner,false);C.owner.fireEvent('imageupdate',C.owner,sn);return;}if(this.editorcore.enableBlocks){var E=new Roo.htmleditor.BlockFigure({image_src:D.result,caption:'',caption_display:'none'}
+);C.insertAtCursor(E.toHTML());this.addFiles(A,true);return;}if(sn&&sn.tagName.toUpperCase()=='IMG'){sn.src=D.result;C.owner.fireEvent('editorevent',C.owner,false);C.owner.fireEvent('imageupdate',C.owner,sn);return;}C.insertAtCursor('<img src="'+D.result+'">');
+this.addFiles(A,true);}).createDelegate(this));D.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','image','link','underline'].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;
});var H=false;if(db&&this.editorcore.enableBlocks){H=Roo.htmleditor.Block.factory(db);if(H){db.className=(db.classList.length>0?db.className+' ':'')+' roo-ed-selection';B=this.selectedNode=db;}}var tn=B&&B.tagName.toUpperCase()||'';if(!H&&B&&tn!='A'){var I=B.closest('A');
if(I){B=I;}}C.get('link').setActive(tn=='A'&&this.selectedNode.hasAttribute('href'));C.get('image').setActive(tn=='IMG'||this.editorcore.enableBlocks&&tn=='FIGURE');C.get('underline').setActive(tn=='U'||B.closest('u')?true:false);Roo.bootstrap.menu.Manager.hideAll();
if(E||(tn.length&&tn=='BODY')){this.deleteBtn.hide();return;}this.deleteBtn.show();},onFirstFocus:function(){this.buttons.each(function(A){A.enable();});},onDelete:function(){var A=this.editorcore.createRange();var B=this.editorcore.getSelection();var sn=this.selectedNode;
-A.setStart(sn,0);A.setEnd(sn,0);if(sn.hasAttribute('data-block')){var C=Roo.htmleditor.Block.factory(this.selectedNode);if(C){sn=C.removeNode();sn.parentNode.removeChild(sn);B.removeAllRanges();B.addRange(A);this.updateToolbar(null,null,null);this.editorcore.fireEditorEvent(false);
-return;}}if(!sn){return;}if(sn&&sn.tagName=='BODY'){return;}var D=sn.childNodes[0]||sn.nextSibling||sn.previousSibling||sn.parentNode;a=new Roo.htmleditor.FilterKeepChildren({tag:false});a.replaceTag(sn);B.removeAllRanges();B.addRange(A);this.editorcore.fireEditorEvent(false);
-},toggleSourceEdit:function(A){if(A){Roo.log("disabling buttons");this.buttons.each(function(B){if(B.cmd!='pencil'){B.disable();}});}else{Roo.log("enabling buttons");if(this.editorcore.initialized){this.buttons.each(function(B){B.enable();});}}Roo.log("calling toggole on editor");
-this.editor.toggleSourceEdit(A);}});
+A.setStart(sn,0);A.setEnd(sn,0);if(sn.hasAttribute('data-block')){var C=Roo.htmleditor.Block.factory(this.selectedNode);if(C){sn=C.removeNode();sn.parentNode.removeChild(sn);B.removeAllRanges();B.addRange(A);this.updateToolbar(null,null,null);if(sn.tagName.toUpperCase()=='FIGURE'){this.editor.fireEvent('imagedelete',this.editor,sn);
+}this.selectedNode=false;this.editorcore.fireEditorEvent(false);return;}}if(!sn){return;}if(sn&&sn.tagName=='BODY'){return;}var D=sn.childNodes[0]||sn.nextSibling||sn.previousSibling||sn.parentNode;a=new Roo.htmleditor.FilterKeepChildren({tag:false});a.replaceTag(sn);
+B.removeAllRanges();B.addRange(A);if(sn.tagName.toUpperCase()=='IMG"'){this.editor.fireEvent('imagedelete',this.editor,sn);}this.selectedNode=false;this.editorcore.fireEditorEvent(false);},toggleSourceEdit:function(A){if(A){Roo.log("disabling buttons");this.buttons.each(function(B){if(B.cmd!='pencil'){B.disable();
+}});}else{Roo.log("enabling buttons");if(this.editorcore.initialized){this.buttons.each(function(B){B.enable();});}}Roo.log("calling toggole on editor");this.editor.toggleSourceEdit(A);}});
// Roo/bootstrap/form/Markdown.js
Roo.bootstrap.form.Markdown=function(A){Roo.bootstrap.form.Markdown.superclass.constructor.call(this,A);};Roo.extend(Roo.bootstrap.form.Markdown,Roo.bootstrap.form.TextArea,{editing:false,initEvents:function(){Roo.bootstrap.form.TextArea.prototype.initEvents.call(this);
this.markdownEl=this.el.createChild({cls:'roo-markdown-area'});this.inputEl().addClass('d-none');if(this.getValue()==''){this.markdownEl.dom.innerHTML=String.format('<span class="roo-placeholder">{0}</span>',this.placeholder||'');}else{this.markdownEl.dom.innerHTML=Roo.Markdown.toHtml(Roo.util.Format.htmlEncode(this.getValue()));