Results 1 to 4 of 4

Thread: htmleditor bbcode support

  1. #1
    Sencha User
    Join Date
    Oct 2007
    Location
    Iran
    Posts
    167

    Default htmleditor bbcode support

    Just in htmleditr
    set getBBCode true to get value in bbocde
    set setBBCode true to convert input value from bbcode to html
    Code:
    Ext.override(Ext.form.HtmlEditor,{
    	getBBCode:false,
    	setBBCode:false,
    	HelpBBCode:false,
    	h2bItems:{
    			//tags
    			br : function (node){
    				return {start:"\n",end:""}
    			},
    			div : function (node){
    				return {start:"\n",end:""}
    			},
    			a : function (node){
    				return {start:"",end:""}
    			},
    			img : function (node){
    				return {start:"[img]"+node.src,end:"[/img]"}
    			},
    			b : function (node){
    				return {start:"",end:""}
    			},
    			strong : function (node){
    				return {start:"",end:""}
    			},
    			i : function (node){
    				return {start:"",end:""}
    			},
    			em : function (node){
    				return {start:"",end:""}
    			},
    			u : function (node){
    				return {start:"",end:""}
    			},
    			s : function (node){
    				return {start:"",end:""}
    			},
    			p : function (node){
    				return {start:"\n\n",end:""}
    			},
    			ul : function (node){
    				return {start:"[ul]",end:"[/ul]"}
    			},
    			li : function (node){
    				return {start:"[li]",end:"[/li]"}
    			},
    			blockquote : function (node){
    				return {start:"
    ",end:"
    "} }, pre : function (node){ return {start:"
    Code:
    ",end:"
    "} }, }, getValue : function() { this[this.sourceEditMode ? 'pushValue' : 'syncValue'](); var value=Ext.form.HtmlEditor.superclass.getValue.call(this); value=this.convertBBCode(value); return value; }, setValue : function(v){ if(this.setBBCode) v=this.convertHTML(v); Ext.form.HtmlEditor.superclass.setValue.call(this, v); this.pushValue(); return this; }, createHelpBBCode : function(){ this.HelpBBCode=Ext.getBody().createChild({tag:"span",style:"display:none"}); }, convertHTML : function (value){ value=value.replace(/\n/gi,"<br />"); value=value.replace(/\[b\]/gi,"<b>"); value=value.replace(/\[\/b\]/gi,"</b>"); value=value.replace(/\[i\]/gi,"<i>"); value=value.replace(/\[\/i\]/gi,"</i>"); value=value.replace(/\[u\]/gi,"<u>"); value=value.replace(/\[\/u\]/gi,"</u>"); value=value.replace(/\[url=([^\]]+)\](.*?)\[\/url\]/gi,"<a href=\"$1\">$2</a>"); value=value.replace(/\[url\](.*?)\[\/url\]/gi,"<a href=\"$1\">$1</a>"); value=value.replace(/\[img\](.*?)\[\/img\]/gi,"<img src=\"$1\" />"); value=value.replace(/\[color=(.*?)\](.*?)\[\/color\]/gi,"<font color=\"$1\">$2</font>"); value=value.replace(/\[code\](.*?)\[\/code\]/gi,"<pre>$1</pre>"); value=value.replace(/\[quote\](.*?)\[\/quote\]/gi,"<blockquote>$1</blockquote>&nbsp;"); }, convertBBCode : function(value){ if(!this.HelpBBCode){ this.createHelpBBCode() } this.HelpBBCode.update(value); var dom=this.HelpBBCode.dom; while(node=Ext.DomQuery.selectNode("*:first",dom)){ var s={start:"",end:""} if(this.h2bItems[node.nodeName.toLowerCase()]){ s=this.h2bItems[node.nodeName.toLowerCase()](node); } else{ s={start:"",end:""}; } text=s.start+style.start+node.innerHTML+style.end+s.end; dom.innerHTML=dom.innerHTML.replace(this.getOuterHTML(node),text); } var t=dom.innerHTML; t=t.replace(/&nbsp;/gi," "); t=t.replace(/&quot;/gi,"\""); t=t.replace(/&lt;/gi,"<"); t=t.replace(/&gt;/gi,">"); t=t.replace(/&amp;/gi,"&"); return t; }, getOuterHTML: function (object) { var element; if (!object) return null; element = document.createElement("div"); element.appendChild(object.cloneNode(true)); return element.innerHTML; }, geBBCodeStyle:function (dom){ el=Ext.get(dom); style=el.getAttribute("style"); fontFamily=((/font-family/gi.test(style))?el.getStyle("font-family"):false) || el.getAttribute("face"); fontSize=((/font-size/gi.test(style))? el.getStyle("font-size"):false) || (dom.nodeName.toLowerCase()=="font")?el.getAttribute("size"):""; isBold=(el.getStyle("font-weight")=="bold" && /font-weight/gi.test(style))?true:false isItalic=(el.getStyle("font-style")=="italic" && /font-style/gi.test(style))?true:false; isUnderline=(el.getStyle("text-decoration")=="underline" && /text-decoration/gi.test(style))?true:false; isLinethrough=(el.getStyle("text-decoration")=="line-through" && /text-decoration/gi.test(style))?true:false; align=el.getAttribute("align"); color=el.getStyles("color")|| (dom.nodeName=="font")?el.getAttribute("color"):""; s=[]; e=[]; if(fontFamily){ s.push(""); e.push("") } if(fontSize){ s.push("[size="+fontSize+"]"); e.push("[/size]") } if(isBold){ s.push(""); e.push("") } if(isItalic){ s.push(""); e.push("") } if(isUnderline){ s.push(""); e.push("") } if(isLinethrough){ s.push("[s"); e.push("[/s]"); } if(align){ s.push("[align="+align+"]"); e.push("[/align]") } if(color){ s.push("[color="+align+"]"); e.push("[/color]"); } return {start:s.join(""),end:e.reverse().join("")} } });
    No honor is like knowledge

  2. #2
    Sencha User
    Join Date
    Oct 2007
    Location
    Iran
    Posts
    167

    Default

    beacuse conflict my code and forum bbcode attachment js file
    Attached Files Attached Files
    No honor is like knowledge

  3. #3

    Default

    Hello i want to use this modification but when i insert the code i've got error:
    dom is undefined


    in this line:
    dom.innerHTML=dom.innerHTML.replace(this.getOuterHTML(node),text);

    pls help me to make this work

  4. #4
    Sencha User
    Join Date
    Oct 2007
    Location
    Iran
    Posts
    167

    Default

    this line
    createHelpBBCode : function(){
    this.HelpBBCode=Ext.getBody().createChild({tag:"span",style:"display:none"});
    },

    must create this dom
    No honor is like knowledge

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •