// Roo/htmleditor/BlockFigure.js
Roo.htmleditor.BlockFigure=function(A){if(A.node){this.readElement(A.node);this.updateElement(A.node);}Roo.apply(this,A);};Roo.extend(Roo.htmleditor.BlockFigure,Roo.htmleditor.Block,{image_src:'',align:'left',caption:'',text_align:'left',image_width:'',image_height:'',friendly_name:'Image with caption',context:{image_width:{title:"Width",width:40}
,image_height:{title:"Height",width:40},align:{title:"Align",opts:[["left"],["right"]],width:80},text_align:{title:"Caption Align",opts:[["left"],["right"],["center"]],width:80},image_src:{title:"Src",width:220}},toObject:function(){var d=document.createElement('div');
-d.innerHTML=this.caption;var A={tag:'img',src:this.image_src,alt:d.innerText.replace(/\n/g," ")};if((''+this.image_width).length){A.width=this.image_width;}if((''+this.height).length){A.height=this.image_height;}return {tag:'figure','data-block':'Figure',contenteditable:'false',style:'display:table; float:'+this.align,cn:[A,{tag:'figcaption',contenteditable:true,style:'text-align:'+this.text_align,html:this.caption}
+d.innerHTML=this.caption;var A={tag:'img',src:this.image_src,alt:d.innerText.replace(/\n/g," ")};if((''+this.image_width).length>0){A.width=this.image_width;}if((''+this.image_height).length>0){A.height=this.image_height;}return {tag:'figure','data-block':'Figure',contenteditable:'false',style:'display:table; float:'+this.align,cn:[A,{tag:'figcaption',contenteditable:true,style:'text-align:'+this.text_align,html:this.caption}
]};},readElement:function(A){this.image_src=this.getVal(A,'img','src');this.align=this.getVal(A,'figure','style','float');this.caption=this.getVal(A,'figcaption','html');this.text_align=this.getVal(A,'figcaption','style','text-align');}})
// Roo/HtmlEditorCore.js
Roo.HtmlEditorCore=function(A){Roo.HtmlEditorCore.superclass.constructor.call(this,A);this.addEvents({initialize:true,activate:true,beforesync:true,beforepush:true,sync:true,push:true,editorevent:true});this.applyBlacklists();};Roo.extend(Roo.HtmlEditorCore,Roo.Component,{owner:false,resizable:false,height:300,width:500,stylesheets:false,allowComments:false,frameId:false,validationEvent:false,deferHeight:true,initialized:false,activated:false,sourceEditMode:false,onFocus:Roo.emptyFn,iframePad:3,hideMode:'offsets',clearUp:true,black:false,white:false,bodyCls:'',getDocMarkup:function(){var st='';
}
};
+
+/**
+ * @class Roo.htmleditor.Block
+ * Base class for html editor blocks - do not use it directly .. extend it..
+ * @cfg {DomElement} node The node to apply stuff to.
+ * @cfg {String} friendly_name the name that appears in the context bar about this block
+ * @cfg {Object} Context menu - see Roo.form.HtmlEditor.ToolbarContext
+
+ * @constructor
+ * Create a new Filter.
+ * @param {Object} config Configuration options
+ */
+
+Roo.htmleditor.Block = function(cfg)
+{
+ // do nothing .. should not be called really.
+}
+
+Roo.htmleditor.Block.factory = function(node)
+{
+ var cls = Roo.htmleditor['Block' + Roo.get(node).attr('data-block')];
+ if (typeof(cls) == 'undefined') {
+ Roo.log("OOps missing block : " + 'Block' + Roo.get(node).attr('data-block'));
+ return false;
+ }
+ return new cls({ node: node }); /// should trigger update element
+}
+
+
+Roo.htmleditor.Block.prototype = {
+
+ // used by context menu
+ friendly_name : 'Image with caption',
+
+ context : false,
+ /**
+ * Update a node with values from this object
+ * @param {DomElement} node
+ */
+ updateElement : function(node)
+ {
+ Roo.DomHelper.update(node, this.toObject());
+ },
+ /**
+ * convert to plain HTML for calling insertAtCursor..
+ */
+ toHTML : function()
+ {
+ return Roo.DomHelper.markup(this.toObject());
+ },
+ /**
+ * used by readEleemnt to extract data from a node
+ * may need improving as it's pretty basic
+
+ * @param {DomElement} node
+ * @param {String} tag - tag to find, eg. IMG ?? might be better to use DomQuery ?
+ * @param {String} attribute (use html - for contents, or style for using next param as style)
+ * @param {String} style the style property - eg. text-align
+ */
+ getVal : function(node, tag, attr, style)
+ {
+ var n = node;
+ if (n.tagName != tag.toUpperCase()) {
+ // in theory we could do figure[3] << 3rd figure? or some more complex search..?
+ // but kiss for now.
+ n = node.getElementsByTagName(tag).item(0);
+ }
+ if (attr == 'html') {
+ return n.innerHTML;
+ }
+ if (attr == 'style') {
+ return Roo.get(n).getStyle(style);
+ }
+
+ return Roo.get(n).attr(attr);
+
+ },
/**
+ * create a DomHelper friendly object - for use with
+ * Roo.DomHelper.markup / overwrite / etc..
+ * (override this)
+ */
+ toObject : function()
+ {
+ return {};
+ },
+ /**
+ * Read a node that has a 'data-block' property - and extract the values from it.
+ * @param {DomElement} node - the node
+ */
+ readElement : function(node)
+ {
+
+ }
+
+
+}
+
+/**
*
* <figure data-block="BlockFigure" contenteditable="false" role="group" style="text-align:left">' +
<img data-name="image" src="{SRC}">' +
},
align: {
title: "Align",
- opts : [ [""],[ "left"],[ "right"],[ "center"],[ "top"]],
+ opts : [[ "left"],[ "right"]],
width : 80
},
text_align: {
title: "Caption Align",
- opts : [ [""],[ "left"],[ "right"],[ "center"],[ "top"]],
+ opts : [ [ "left"],[ "right"],[ "center"]],
width : 80
},
*/
toObject : function()
{
+ var d = document.createElement('div');
+ d.innerHTML = this.caption;
var img = {
tag : 'img',
src : this.image_src,
- alt : this.caption
+ alt : d.innerText.replace(/\n/g, " ") // removeHTML..
};
- if ((''+this.image_width).length) {
+ if ((''+this.image_width).length > 0) {
img.width = this.image_width;
}
- if ((''+ this.height).length) {
+ if ((''+ this.image_height).length > 0) {
img.height = this.image_height;
}
return {
tag: 'figure',
'data-block' : 'Figure',
contenteditable : 'false',
- style : 'text-align:' + this.align,
+ style : 'display:table; float:' + this.align,
cn : [
img,
{
tag: 'figcaption',
contenteditable : true,
- style : 'text-align:left',
+ style : 'text-align:' + this.text_align,
html : this.caption
}
]
readElement : function(node)
{
this.image_src = this.getVal(node, 'img', 'src');
- this.align = this.getVal(node, 'figure', 'style', 'text-align');
+ this.align = this.getVal(node, 'figure', 'style', 'float');
this.caption = this.getVal(node, 'figcaption', 'html');
this.text_align = this.getVal(node, 'figcaption', 'style','text-align');
}
Roo.htmleditor.KeyEnter=function(A){Roo.apply(this,A);Roo.get(this.core.doc.body).on('keypress',this.keypress,this);};Roo.htmleditor.KeyEnter.prototype={core:false,keypress:function(e){if(e.charCode!=13){return true;}e.preventDefault();var A=this.core.doc;
var B=A.createDocumentFragment();var C=A.createTextNode('\n');B.appendChild(C);C=A.createElement('br');B.appendChild(C);var D=this.core.win.getSelection().getRangeAt(0);D.deleteContents();D.insertNode(B);D=A.createRange();D.setStartAfter(C);D.collapse(true);
var E=this.core.win.getSelection();E.removeAllRanges();E.addRange(D);return false;}};
+// Roo/htmleditor/Block.js
+Roo.htmleditor.Block=function(A){};Roo.htmleditor.Block.factory=function(A){var B=Roo.htmleditor['Block'+Roo.get(A).attr('data-block')];if(typeof(B)=='undefined'){Roo.log("OOps missing block : "+'Block'+Roo.get(A).attr('data-block'));return false;}return new B({node:A}
+);};Roo.htmleditor.Block.prototype={friendly_name:'Image with caption',context:false,updateElement:function(A){Roo.DomHelper.update(A,this.toObject());},toHTML:function(){return Roo.DomHelper.markup(this.toObject());},getVal:function(A,B,C,D){var n=A;if(n.tagName!=B.toUpperCase()){n=A.getElementsByTagName(B).item(0);
+}if(C=='html'){return n.innerHTML;}if(C=='style'){return Roo.get(n).getStyle(D);}return Roo.get(n).attr(C);},toObject:function(){return {};},readElement:function(A){}};
// Roo/htmleditor/BlockFigure.js
Roo.htmleditor.BlockFigure=function(A){if(A.node){this.readElement(A.node);this.updateElement(A.node);}Roo.apply(this,A);};Roo.extend(Roo.htmleditor.BlockFigure,Roo.htmleditor.Block,{image_src:'',align:'left',caption:'',text_align:'left',image_width:'',image_height:'',friendly_name:'Image with caption',context:{image_width:{title:"Width",width:40}
-,image_height:{title:"Height",width:40},align:{title:"Align",opts:[[""],["left"],["right"],["center"],["top"]],width:80},text_align:{title:"Caption Align",opts:[[""],["left"],["right"],["center"],["top"]],width:80},image_src:{title:"Src",width:220}},toObject:function(){var A={tag:'img',src:this.image_src,alt:this.caption}
-;if((''+this.image_width).length){A.width=this.image_width;}if((''+this.height).length){A.height=this.image_height;}return {tag:'figure','data-block':'Figure',contenteditable:'false',style:'text-align:'+this.align,cn:[A,{tag:'figcaption',contenteditable:true,style:'text-align:left',html:this.caption}
-]};},readElement:function(A){this.image_src=this.getVal(A,'img','src');this.align=this.getVal(A,'figure','style','text-align');this.caption=this.getVal(A,'figcaption','html');this.text_align=this.getVal(A,'figcaption','style','text-align');}})
+,image_height:{title:"Height",width:40},align:{title:"Align",opts:[["left"],["right"]],width:80},text_align:{title:"Caption Align",opts:[["left"],["right"],["center"]],width:80},image_src:{title:"Src",width:220}},toObject:function(){var d=document.createElement('div');
+d.innerHTML=this.caption;var A={tag:'img',src:this.image_src,alt:d.innerText.replace(/\n/g," ")};if((''+this.image_width).length>0){A.width=this.image_width;}if((''+this.image_height).length>0){A.height=this.image_height;}return {tag:'figure','data-block':'Figure',contenteditable:'false',style:'display:table; float:'+this.align,cn:[A,{tag:'figcaption',contenteditable:true,style:'text-align:'+this.text_align,html:this.caption}
+]};},readElement:function(A){this.image_src=this.getVal(A,'img','src');this.align=this.getVal(A,'figure','style','float');this.caption=this.getVal(A,'figcaption','html');this.text_align=this.getVal(A,'figcaption','style','text-align');}})
// Roo/HtmlEditorCore.js
Roo.HtmlEditorCore=function(A){Roo.HtmlEditorCore.superclass.constructor.call(this,A);this.addEvents({initialize:true,activate:true,beforesync:true,beforepush:true,sync:true,push:true,editorevent:true});this.applyBlacklists();};Roo.extend(Roo.HtmlEditorCore,Roo.Component,{owner:false,resizable:false,height:300,width:500,stylesheets:false,allowComments:false,frameId:false,validationEvent:false,deferHeight:true,initialized:false,activated:false,sourceEditMode:false,onFocus:Roo.emptyFn,iframePad:3,hideMode:'offsets',clearUp:true,black:false,white:false,bodyCls:'',getDocMarkup:function(){var st='';
if(this.stylesheets===false){Roo.get(document.head).select('style').each(function(B){st+=B.dom.outerHTML||new XMLSerializer().serializeToString(B.dom);});Roo.get(document.head).select('link').each(function(B){st+=B.dom.outerHTML||new XMLSerializer().serializeToString(B.dom);
src : this.image_src,
alt : d.innerText.replace(/\n/g, " ") // removeHTML..
};
- if ((''+this.image_width).length) {
+ if ((''+this.image_width).length > 0) {
img.width = this.image_width;
}
- if ((''+ this.height).length) {
+ if ((''+ this.image_height).length > 0) {
img.height = this.image_height;
}
return {
src : this.image_src,
alt : d.innerText.replace(/\n/g, " ") // removeHTML..
};
- if ((''+this.image_width).length) {
+ if ((''+this.image_width).length > 0) {
img.width = this.image_width;
}
- if ((''+ this.height).length) {
+ if ((''+ this.image_height).length > 0) {
img.height = this.image_height;
}
return {
// Roo/htmleditor/BlockFigure.js
Roo.htmleditor.BlockFigure=function(A){if(A.node){this.readElement(A.node);this.updateElement(A.node);}Roo.apply(this,A);};Roo.extend(Roo.htmleditor.BlockFigure,Roo.htmleditor.Block,{image_src:'',align:'left',caption:'',text_align:'left',image_width:'',image_height:'',friendly_name:'Image with caption',context:{image_width:{title:"Width",width:40}
,image_height:{title:"Height",width:40},align:{title:"Align",opts:[["left"],["right"]],width:80},text_align:{title:"Caption Align",opts:[["left"],["right"],["center"]],width:80},image_src:{title:"Src",width:220}},toObject:function(){var d=document.createElement('div');
-d.innerHTML=this.caption;var A={tag:'img',src:this.image_src,alt:d.innerText.replace(/\n/g," ")};if((''+this.image_width).length){A.width=this.image_width;}if((''+this.height).length){A.height=this.image_height;}return {tag:'figure','data-block':'Figure',contenteditable:'false',style:'display:table; float:'+this.align,cn:[A,{tag:'figcaption',contenteditable:true,style:'text-align:'+this.text_align,html:this.caption}
+d.innerHTML=this.caption;var A={tag:'img',src:this.image_src,alt:d.innerText.replace(/\n/g," ")};if((''+this.image_width).length>0){A.width=this.image_width;}if((''+this.image_height).length>0){A.height=this.image_height;}return {tag:'figure','data-block':'Figure',contenteditable:'false',style:'display:table; float:'+this.align,cn:[A,{tag:'figcaption',contenteditable:true,style:'text-align:'+this.text_align,html:this.caption}
]};},readElement:function(A){this.image_src=this.getVal(A,'img','src');this.align=this.getVal(A,'figure','style','float');this.caption=this.getVal(A,'figcaption','html');this.text_align=this.getVal(A,'figcaption','style','text-align');}})
// Roo/HtmlEditorCore.js
Roo.HtmlEditorCore=function(A){Roo.HtmlEditorCore.superclass.constructor.call(this,A);this.addEvents({initialize:true,activate:true,beforesync:true,beforepush:true,sync:true,push:true,editorevent:true});this.applyBlacklists();};Roo.extend(Roo.HtmlEditorCore,Roo.Component,{owner:false,resizable:false,height:300,width:500,stylesheets:false,allowComments:false,frameId:false,validationEvent:false,deferHeight:true,initialized:false,activated:false,sourceEditMode:false,onFocus:Roo.emptyFn,iframePad:3,hideMode:'offsets',clearUp:true,black:false,white:false,bodyCls:'',getDocMarkup:function(){var st='';
projects / roojs1 / commitdiff