);};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',width:'45%',margin:'2%',friendly_name:'Image with caption',context:{width:{title:"Width",width:40}
+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',width:'46%',margin:'2%',friendly_name:'Image with caption',context:{width:{title:"Width",width:40}
,margin:{title:"Margin",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;return {tag:'figure','data-block':'Figure',contenteditable:'false',style:{display:'table',float:this.align,width:this.width,margin:this.margin},cn:[{tag:'img',src:this.image_src,alt:d.innerText.replace(/\n/g," "),style:{width:'100%'}
},{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');
}
-/**
- *
- * <figure data-block="BlockFigure" contenteditable="false" role="group" style="text-align:left">' +
- <img data-name="image" src="{SRC}">' +
- <figcaption data-name="caption" contenteditable="true" style="text-align:left">XXXX</figcaption>
- </figure>
- <br/>
-
- usage:
- -- add to document..
- new Roo.htmleditor.BlockFigure{
- image_src : 'http://www.google.com',
- caption : 'test',
- }
- -- load document, and search for elements of this...
- Roo.DomQuery.select('*[data-block])
- // loop each and call ctor ({node : xxx})
- -- html editor click
- ** see if parent has Element.findParent(*[data-block]);
- use ?? to
-
- */
+
/**
* @class Roo.htmleditor.BlockFigure
caption : '',
text_align: 'left',
- width : '100',
+ width : '46%',
+ margin: '2%',
// used by context menu
friendly_name : 'Image with caption',
context : { // ?? static really
width : {
- title: "Width %",
+ title: "Width",
+ width: 40
+ // ?? number
+ },
+ margin : {
+ title: "Margin",
width: 40
// ?? number
},
-
align: {
title: "Align",
opts : [[ "left"],[ "right"]],
style : {
display: 'table',
float : this.align ,
- width : this.width + '%'
+ width : this.width,
+ margin: this.margin
},
cn : [
{
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');
- this.image_width = this.getVal(node, 'img', 'width');
- this.image_height = this.getVal(node, 'img', 'height');
+ this.width = this.getVal(node, 'figure', 'style', 'width');
+ this.margin = this.getVal(node, 'figure', 'style', 'margin');
}
var lc = this.doc.body.lastChild;
if (lc && lc.nodeType == 1 && lc.getAttribute("contenteditable") == "false") {
// add an extra line at the end.
- this.doc.body.appendChild(this.doc.createChild('br'));
+ this.doc.body.appendChild(this.doc.createElement('br'));
}
this.assignDocWin();
return Roo.isIE ? this.doc.selection : this.win.getSelection();
},
+ /**
+ * Select a dom node
+ * @param {DomElement} node the node to select
+ */
+ selectNode : function(node)
+ {
+
+ var nodeRange = node.ownerDocument.createRange();
+ try {
+ nodeRange.selectNode(node);
+ } catch (e) {
+ nodeRange.selectNodeContents(node);
+ }
+ //nodeRange.collapse(true);
+ var s = this.win.getSelection();
+ s.removeAllRanges();
+ s.addRange(nodeRange);
+ },
getSelectedNode: function()
{
);};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',width:'100',friendly_name:'Image with caption',context:{width:{title:"Width %",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;
-return {tag:'figure','data-block':'Figure',contenteditable:'false',style:{display:'table',float:this.align,width:this.width+'%'},cn:[{tag:'img',src:this.image_src,alt:d.innerText.replace(/\n/g," "),style:{width:'100%'}},{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');this.image_width=this.getVal(A,'img','width');
-this.image_height=this.getVal(A,'img','height');}})
+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',width:'46%',margin:'2%',friendly_name:'Image with caption',context:{width:{title:"Width",width:40}
+,margin:{title:"Margin",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;return {tag:'figure','data-block':'Figure',contenteditable:'false',style:{display:'table',float:this.align,width:this.width,margin:this.margin},cn:[{tag:'img',src:this.image_src,alt:d.innerText.replace(/\n/g," "),style:{width:'100%'}
+},{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');this.width=this.getVal(A,'figure','style','width');this.margin=this.getVal(A,'figure','style','margin');}})
// 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);
if(Roo.isSafari){var bs=bd.getAttribute('style');var m=bs?bs.match(/text-align:(.*?);/i):false;if(m&&m[1]){B='<div style="'+m[0]+'">'+B+'</div>';}}B=this.cleanHtml(B);B=B.replace(/[\uD800-\uDBFF][\uDC00-\uDFFF]|[\u0080-\uFFFF]/g,function(C){var cc=C.charCodeAt();
if(C.length==2){var D=C.charCodeAt(0)-0xD800;var E=C.charCodeAt(1)-0xDC00;cc=(D*0x400)+E+0x10000;}else if((cc>=0x4E00&&cc<0xA000)||(cc>=0x3400&&cc<0x4E00)||(cc>=0xf900&&cc<0xfb00)){return C;}return "&#"+cc+";";});if(this.owner.fireEvent('beforesync',this,B)!==false){this.el.dom.value=B;
this.owner.fireEvent('sync',this,B);}}},pushValue:function(){Roo.log("HtmlEditorCore:pushValue (TEXT->EDITOR)");if(this.initialized){var v=this.el.dom.value.trim();if(this.owner.fireEvent('beforepush',this,v)!==false){var d=(this.doc.body||this.doc.documentElement);
-d.innerHTML=v;this.el.dom.value=d.innerHTML;this.owner.fireEvent('push',this,v);}Roo.each(Roo.get(this.doc.body).query('*[data-block]'),function(e){Roo.htmleditor.Block.factory(e);},this);var lc=this.doc.body.lastChild;if(lc&&lc.nodeType==1&&lc.getAttribute("contenteditable")=="false"){this.doc.body.appendChild(this.doc.createChild('br'));
+d.innerHTML=v;this.el.dom.value=d.innerHTML;this.owner.fireEvent('push',this,v);}Roo.each(Roo.get(this.doc.body).query('*[data-block]'),function(e){Roo.htmleditor.Block.factory(e);},this);var lc=this.doc.body.lastChild;if(lc&&lc.nodeType==1&&lc.getAttribute("contenteditable")=="false"){this.doc.body.appendChild(this.doc.createElement('br'));
}}},deferFocus:function(){this.focus.defer(10,this);},focus:function(){if(this.win&&!this.sourceEditMode){this.win.focus();}else{this.el.focus();}},assignDocWin:function(){var A=this.iframe;if(Roo.isIE){this.doc=A.contentWindow.document;this.win=A.contentWindow;
}else{if(!Roo.get(this.frameId)&&!A.contentDocument){return;}this.doc=(A.contentDocument||Roo.get(this.frameId).dom.document);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';Roo.EventManager.on(this.doc,{'mouseup':this.onEditorEvent,'dblclick':this.onEditorEvent,'click':this.onEditorEvent,'keyup':this.onEditorEvent,'paste':this.onPasteEvent,buffer:100,scope:this}
r=this.doc.selection.createRange();if(r){r.collapse(true);r.pasteHTML('    ');this.deferFocus();}return;}if(k==e.ENTER){r=this.doc.selection.createRange();if(r){var A=r.parentElement();if(!A||A.tagName.toLowerCase()!='li'){e.stopEvent();
r.pasteHTML('<br/>');r.collapse(false);r.select();}}}};}else if(Roo.isOpera){return function(e){var k=e.getKey();if(k==e.TAB){e.stopEvent();this.win.focus();this.execCmd('InsertHTML','    ');this.deferFocus();}};}else if(Roo.isSafari){return function(e){var k=e.getKey();
if(k==e.TAB){e.stopEvent();this.execCmd('InsertText','\t');this.deferFocus();return;}};}}(),getAllAncestors:function(){var p=this.getSelectedNode();var a=[];if(!p){a.push(p);p=this.getParentElement();}while(p&&(p.nodeType==1)&&(p.tagName.toLowerCase()!='body')){a.push(p);
-p=p.parentNode;}a.push(this.doc.body);return a;},lastSel:false,lastSelNode:false,getSelection:function(){this.assignDocWin();return Roo.isIE?this.doc.selection:this.win.getSelection();},getSelectedNode:function(){var A=this.createRange(this.getSelection()).cloneRange();
-if(Roo.isIE){var B=A.parentElement();while(true){var C=A.duplicate();C.moveToElementText(B);if(C.inRange(A)){break;}if((B.nodeType!=1)||(B.tagName.toLowerCase()=='body')){break;}B=B.parentElement;}return B;}var ac=A.commonAncestorContainer;if(ac.nodeType==3){ac=ac.parentNode;
-}var ar=ac.childNodes;var D=[];var E=[];var F=false;for(var i=0;i<ar.length;i++){if((ar[i].nodeType==3)&&(!ar[i].data.length)){continue;}if(this.rangeIntersectsNode(A,ar[i])&&this.rangeCompareNode(A,ar[i])==3){D.push(ar[i]);continue;}if((ar[i].nodeType==1)&&this.rangeIntersectsNode(A,ar[i])&&(this.rangeCompareNode(A,ar[i])>0)){E.push(ar[i]);
+p=p.parentNode;}a.push(this.doc.body);return a;},lastSel:false,lastSelNode:false,getSelection:function(){this.assignDocWin();return Roo.isIE?this.doc.selection:this.win.getSelection();},selectNode:function(A){var B=A.ownerDocument.createRange();try{B.selectNode(A);
+}catch(e){B.selectNodeContents(A);}var s=this.win.getSelection();s.removeAllRanges();s.addRange(B);},getSelectedNode:function(){var A=this.createRange(this.getSelection()).cloneRange();if(Roo.isIE){var B=A.parentElement();while(true){var C=A.duplicate();C.moveToElementText(B);
+if(C.inRange(A)){break;}if((B.nodeType!=1)||(B.tagName.toLowerCase()=='body')){break;}B=B.parentElement;}return B;}var ac=A.commonAncestorContainer;if(ac.nodeType==3){ac=ac.parentNode;}var ar=ac.childNodes;var D=[];var E=[];var F=false;for(var i=0;i<ar.length;
+i++){if((ar[i].nodeType==3)&&(!ar[i].data.length)){continue;}if(this.rangeIntersectsNode(A,ar[i])&&this.rangeCompareNode(A,ar[i])==3){D.push(ar[i]);continue;}if((ar[i].nodeType==1)&&this.rangeIntersectsNode(A,ar[i])&&(this.rangeCompareNode(A,ar[i])>0)){E.push(ar[i]);
continue;}if(!this.rangeIntersectsNode(A,ar[i])||(this.rangeCompareNode(A,ar[i])==0)){continue;}F=true;}if(!D.length&&E.length){D=E;}if(F||!D.length||(D.length>1)){return false;}return D[0];},createRange:function(A){if(typeof A!="undefined"){try{return A.getRangeAt?A.getRangeAt(0):A.createRange();
}catch(e){return this.doc.createRange();}}else{return this.doc.createRange();}},getParentElement:function(){this.assignDocWin();var A=Roo.isIE?this.doc.selection:this.win.getSelection();var B=this.createRange(A);try{var p=B.commonAncestorContainer;while(p.nodeType==3){p=p.parentNode;
}return p;}catch(e){return null;}},rangeIntersectsNode:function(A,B){var C=B.ownerDocument.createRange();try{C.selectNode(B);}catch(e){C.selectNodeContents(B);}var D=A.cloneRange();D.collapse(true);var E=A.cloneRange();E.collapse(false);var F=C.cloneRange();
);};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',width:'45%',margin:'2%',friendly_name:'Image with caption',context:{width:{title:"Width",width:40}
+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',width:'46%',margin:'2%',friendly_name:'Image with caption',context:{width:{title:"Width",width:40}
,margin:{title:"Margin",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;return {tag:'figure','data-block':'Figure',contenteditable:'false',style:{display:'table',float:this.align,width:this.width,margin:this.margin},cn:[{tag:'img',src:this.image_src,alt:d.innerText.replace(/\n/g," "),style:{width:'100%'}
},{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');