inline templating class for javascript - JavaScript Snipplr Social Repository

Revision: 15346

at July 1, 2009 10:45 by leonardreinders

Updated Code

var Html=function(lijst2){
		this.taglijst=[["a"],["b"],["i"],["u"],["br"],["img","border=0"],["table","border=0 cellpadding=0 cellspacing=0"],["td"],["tr"],["span"],["div"],["p"],["form"],["option"],["select"],["input"],["button"],["textarea"],["li"],["ol"],["ul"],["dl"],["dd"],["dt"],["sub"],["sup"],["script","language=javascript"],["xmp"],["link"],["style","type=text/css"],["frame"],["frameset"],["iframe"],["body"],["html"],["head"],["title"],["hr"],["map"],["area"],["h1"]]
		if(lijst2){this.taglijst=this.taglijst.concat(lijst2)}
		this.toevoeglijst = lijst2 
		this.uitvoeren=function(obj,str){
			var u ="",param
			if(str){
			var arr=str.match(/\$\w+/g)
				if(arr){
					for(var i=0;i<arr.length;i++){
						param=arr[i].substr(1)
						try{
						str = str.replace(eval("/\\\$"+param+"/g"),obj(param))
						} catch(e){}
					}
				}
			return str
			}
		return ""
		}
		this.tag=function(id,a){
			var str = "<"+id+(a[0]?" "+a[0]:"")+">"
			if(!id.match(/^img|br|input$/&&!id.match(/^area$/))){str+=(a[1]||"")+"<"+"/"+id+">"}
			return str
		}
		this.param=[]
		this.addparam=function(a,ispreset){
			a=ispreset?a.replace(/(=)([^ ]+)?/gi,'$1"$2"'):a.replace(/(=)(.+)/gi,'$1"$2"')
			this.param[this.param.length]=a
		}
		this.getparam=function(){var a=this.param.join(" ");this.param=[];return a}
		this.read=function(args,presets){
			var temp,content="",key,naam,size,quot="'",temp2
			var re=/^\w+\s*=\s*[^<>=]+|^nowrap/
			for(var i=0;i<args.length;i++){
				args[i]=String(args[i]).replace(/\s*=\s*/g,"=")
				if(String(args[i]).match(re)){/*het is een parameter*/
					temp=args[i].split(/&&/)// was ;|&
					inner:for(var j=0;j<temp.length;j++){
						if(presets){
							if(presets.indexOf(naam=temp[j].match(/^\w+=/))!=-1){
								presets=presets.replace(eval("/"+naam+"\\w+/"),temp[j])
								continue inner
							}
						}
						this.addparam(temp[j])
					}
				}
				else {content+=args[i]}
			}
			if(presets){this.addparam(presets,true)}
			return [this.getparam(),content]
		}
		for(var i=0;i<this.taglijst.length;i++){var a=this.taglijst[i]
			this[a[0]]=Function("return this.tag('"+a[0]+"',this.read(arguments,'"+(a[1]||"")+"'))")
		}	
	}
var ClsHtml = new Html()


// e.g.: now you could make an imagetag inside a href:

with(ClsHtml){

var output = a("class=mylink","href=http://www.example.com/",img("src=/images/myimg.jpg","width=20px"))

}

Revision: 15345

at July 1, 2009 10:44 by leonardreinders

Updated Code

var Html=function(lijst2){
		this.taglijst=[["a"],["b"],["i"],["u"],["br"],["img","border=0"],["table","border=0 cellpadding=0 cellspacing=0"],["td"],["tr"],["span"],["div"],["p"],["form"],["option"],["select"],["input"],["button"],["textarea"],["li"],["ol"],["ul"],["dl"],["dd"],["dt"],["sub"],["sup"],["script","language=javascript"],["xmp"],["link"],["style","type=text/css"],["frame"],["frameset"],["iframe"],["body"],["html"],["head"],["title"],["hr"],["map"],["area"],["h1"]]
		if(lijst2){this.taglijst=this.taglijst.concat(lijst2)}
		this.toevoeglijst = lijst2 
		this.uitvoeren=function(obj,str){
			var u ="",param
			if(str){
			var arr=str.match(/\$\w+/g)
				if(arr){
					for(var i=0;i<arr.length;i++){
						param=arr[i].substr(1)
						try{
						str = str.replace(eval("/\\\$"+param+"/g"),obj(param))
						} catch(e){}
					}
				}
			return str
			}
		return ""
		}
		this.tag=function(id,a){
			var str = "<"+id+(a[0]?" "+a[0]:"")+">"
			if(!id.match(/^img|br|input$/&&!id.match(/^area$/))){str+=(a[1]||"")+"<"+"/"+id+">"}
			return str
		}
		this.param=[]
		this.addparam=function(a,ispreset){
			a=ispreset?a.replace(/(=)([^ ]+)?/gi,'$1"$2"'):a.replace(/(=)(.+)/gi,'$1"$2"')
			this.param[this.param.length]=a
		}
		this.getparam=function(){var a=this.param.join(" ");this.param=[];return a}
		this.read=function(args,presets){
			var temp,content="",key,naam,size,quot="'",temp2
			var re=/^\w+\s*=\s*[^<>=]+|^nowrap/
			for(var i=0;i<args.length;i++){
				args[i]=String(args[i]).replace(/\s*=\s*/g,"=")
				if(String(args[i]).match(re)){/*het is een parameter*/
					temp=args[i].split(/&&/)// was ;|&
					inner:for(var j=0;j<temp.length;j++){
						if(presets){
							if(presets.indexOf(naam=temp[j].match(/^\w+=/))!=-1){
								presets=presets.replace(eval("/"+naam+"\\w+/"),temp[j])
								continue inner
							}
						}
						this.addparam(temp[j])
					}
				}
				else {content+=args[i]}
			}
			if(presets){this.addparam(presets,true)}
			return [this.getparam(),content]
		}
		for(var i=0;i<this.taglijst.length;i++){var a=this.taglijst[i]
			this[a[0]]=Function("return this.tag('"+a[0]+"',this.read(arguments,'"+(a[1]||"")+"'))")
		}	
	}
var ClsHtml = new Html()


// e.g.: now you could make an imagetag inside a href:

with(ClsHtml){

var output = a("class=mylink","href=http://www.example.com/",img("src=/images/myimg.jpg"))

}

Revision: 15344

at July 1, 2009 10:36 by leonardreinders

Initial Code

var Html=function(lijst2){
		this.taglijst=[["a"],["b"],["i"],["u"],["br"],["img","border=0"],["table","border=0 cellpadding=0 cellspacing=0"],["td"],["tr"],["span"],["div"],["p"],["form"],["option"],["select"],["input"],["button"],["textarea"],["li"],["ol"],["ul"],["dl"],["dd"],["dt"],["sub"],["sup"],["script","language=javascript"],["xmp"],["link"],["style","type=text/css"],["frame"],["frameset"],["iframe"],["body"],["html"],["head"],["title"],["hr"],["map"],["area"],["h1"]]
		if(lijst2){this.taglijst=this.taglijst.concat(lijst2)}
		this.toevoeglijst = lijst2 
		this.uitvoeren=function(obj,str){
			var u ="",param
			if(str){
			var arr=str.match(/\$\w+/g)
				if(arr){
					for(var i=0;i<arr.length;i++){
						param=arr[i].substr(1)
						try{
						str = str.replace(eval("/\\\$"+param+"/g"),obj(param))
						} catch(e){}
					}
				}
			return str
			}
		return ""
		}
		this.tag=function(id,a){
			var str = "<"+id+(a[0]?" "+a[0]:"")+">"
			if(!id.match(/^img|br|input$/&&!id.match(/^area$/))){str+=(a[1]||"")+"<"+"/"+id+">"}
			return str
		}
		this.param=[]
		this.addparam=function(a,ispreset){
			a=ispreset?a.replace(/(=)([^ ]+)?/gi,'$1"$2"'):a.replace(/(=)(.+)/gi,'$1"$2"')
			this.param[this.param.length]=a
		}
		this.getparam=function(){var a=this.param.join(" ");this.param=[];return a}
		this.read=function(args,presets){
			var temp,content="",key,naam,size,quot="'",temp2
			var re=/^\w+\s*=\s*[^<>=]+|^nowrap/
			for(var i=0;i<args.length;i++){
				args[i]=String(args[i]).replace(/\s*=\s*/g,"=")
				if(String(args[i]).match(re)){/*het is een parameter*/
					temp=args[i].split(/&&/)// was ;|&
					inner:for(var j=0;j<temp.length;j++){
						if(presets){
							if(presets.indexOf(naam=temp[j].match(/^\w+=/))!=-1){
								presets=presets.replace(eval("/"+naam+"\\w+/"),temp[j])
								continue inner
							}
						}
						this.addparam(temp[j])
					}
				}
				else {content+=args[i]}
			}
			if(presets){this.addparam(presets,true)}
			return [this.getparam(),content]
		}
		for(var i=0;i<this.taglijst.length;i++){var a=this.taglijst[i]
			this[a[0]]=Function("return this.tag('"+a[0]+"',this.read(arguments,'"+(a[1]||"")+"'))")
		}	
	}
var ClsHtml = new Html()

Initial URL

Initial Description

I made this class because is was fed up with all those strings with escaped quotes with when building html into an output-string. You could also build a php-version of it.

Initial Title

inline templating class for javascript

Initial Tags

javascript, template, html

Initial Language

JavaScript

Choose a language for easy browsing: