Scale9Grid = new Class({
	initialize: function(options){
		// Element can't be directly extended because of it's nativity, so there is a work around.
		var ret = new Element('div');
		ret.extend(this);
		ret.setup(options);
		return ret;
	},
    setup: function(options) {
        Utilities.update(this, options);
		
		this.partContainer = new Element('div');
		this.partContainer.setStyle("position","relative");
		this.partContainer.injectInside(this);
		
		this.tl_div = new Element('div');
		this.t_div = new Element('div');
		this.tr_div = new Element('div');
		this.r_div = new Element('div');
		this.br_div = new Element('div');
		this.b_div = new Element('div');
		this.bl_div = new Element('div');
		this.l_div = new Element('div');
		this.c_div = new Element('div');
		
		this.tl_div.setProperty("class","TL");
		this.t_div.setProperty("class","T");
		this.tr_div.setProperty("class","TR");
		this.r_div.setProperty("class","R");
		this.br_div.setProperty("class","BR");
		this.b_div.setProperty("class","B");
		this.bl_div.setProperty("class","BL");
		this.l_div.setProperty("class","L");
		this.c_div.setProperty("class","C");
		
		this.parts = [this.tl_div,this.t_div,this.tr_div,this.r_div,this.br_div,this.b_div,this.bl_div,this.l_div,this.c_div];
		
		for(var i=0; i<this.parts.length; i++){
			var part = this.parts[i];
			part.injectInside(this.partContainer);
			part.setStyle("position","absolute");
			part.setStyle("margin","0px");
			part.setStyle("padding","0px");
		}
		
		this.contents;
		this.draw();
	},
	setContents: function(to){
		this.contents = to;
		this.contents.addClass("contents");
		this.contents.injectInside(this.partContainer);
		this.draw();
	},
	setHTML: function(to){
		var contents = new Element('div');
		contents.setHTML(to);
		this.setContents(contents);
	},
	draw: function(){
		var topSize = this.getMaxBetween(parseInt(this.tl_div.getStyle('height')),parseInt(this.t_div.getStyle('height')),parseInt(this.tr_div.getStyle('height')));
		var leftSize = this.getMaxBetween(parseInt(this.tl_div.getStyle('width')),parseInt(this.l_div.getStyle('width')),parseInt(this.bl_div.getStyle('width')));
		var bottomSize = this.getMaxBetween(parseInt(this.bl_div.getStyle('height')),parseInt(this.b_div.getStyle('height')),parseInt(this.br_div.getStyle('height')));
		var rightSize = this.getMaxBetween(parseInt(this.tr_div.getStyle('width')),parseInt(this.r_div.getStyle('width')),parseInt(this.br_div.getStyle('width')));
		var width;
		var height;
		
		if(this.contents){
			var metrics = (!window.ie)?this.contents.getCoordinates():{};
			var size = this.contents.getSize();
			width = this.getMaxBetween(size.x,metrics.width, this.contents.offsetWidth)+leftSize+rightSize;
			height = this.getMaxBetween(size.y,metrics.height, this.contents.offsetHeight)+topSize+bottomSize;
		}
		width = this.getMaxBetween(parseInt(this.getStyle("width")),leftSize+rightSize,width);
		height = this.getMaxBetween(parseInt(this.getStyle("height")),topSize+bottomSize,height);
		// Corners
		var metrics = {width:parseInt(this.tl_div.getStyle('width')),height:parseInt(this.tl_div.getStyle('height'))};
		this.tl_div.setStyle("top",(topSize-metrics.height)+"px");
		this.tl_div.setStyle("left",(leftSize-metrics.width)+"px");
		
		metrics = {width:parseInt(this.tr_div.getStyle('width')),height:parseInt(this.tr_div.getStyle('height'))};
		this.tr_div.setStyle("top",(topSize-metrics.height)+"px");
		this.tr_div.setStyle("left",(width-rightSize)+"px");
		
		this.br_div.setStyle("top",(height-bottomSize)+"px");
		this.br_div.setStyle("left",(width-rightSize)+"px");
		
		metrics = {width:parseInt(this.bl_div.getStyle('width')),height:parseInt(this.bl_div.getStyle('height'))};
		this.bl_div.setStyle("top",(height-bottomSize)+"px");
		this.bl_div.setStyle("left",(leftSize-metrics.width)+"px");
		
		// Edges
		metrics = {width:parseInt(this.t_div.getStyle('width')),height:parseInt(this.t_div.getStyle('height'))};
		this.t_div.setStyle("top",(topSize-metrics.height)+"px");
		this.t_div.setStyle("left",leftSize+"px");
		this.t_div.setStyle("width",(width-leftSize-rightSize)+"px");
		
		this.r_div.setStyle("top",topSize+"px");
		this.r_div.setStyle("left",(width-rightSize)+"px");
		this.r_div.setStyle("height",(height-topSize-bottomSize)+"px");
		
		this.b_div.setStyle("top",(height-bottomSize)+"px");
		this.b_div.setStyle("left",leftSize+"px");
		this.b_div.setStyle("width",(width-leftSize-rightSize)+"px");
		
		metrics = {width:parseInt(this.l_div.getStyle('width')),height:parseInt(this.l_div.getStyle('height'))};
		this.l_div.setStyle("top",topSize+"px");
		this.l_div.setStyle("left",(rightSize-metrics.width)+"px");
		this.l_div.setStyle("height",(height-topSize-bottomSize)+"px");
		
		// Centre
		this.c_div.setStyle("top",topSize+"px");
		this.c_div.setStyle("left",leftSize+"px");
		this.c_div.setStyle("width",(width-leftSize-rightSize)+"px");
		this.c_div.setStyle("height",(height-topSize-bottomSize)+"px");
		
		
		// Contents
		if(this.contents && this.contents.getStyle("position")=="absolute"){
			this.contents.setStyle("top",topSize+"px");
			this.contents.setStyle("left",leftSize+"px");
			this.contents.setStyle("width",(width-leftSize-rightSize)+"px");
			this.contents.setStyle("height",(height-topSize-bottomSize)+"px");
		}
	},
	getMaxBetween: function(val1,val2,val3){
		var ret = 0;
		if(val1!=null && !isNaN(val1)){
			ret = val1;	
		}
		if(val2!=null && !isNaN(val2)){
			ret = Math.max(ret,val2);	
		}
		if(val3!=null && !isNaN(val3)){
			ret = Math.max(ret,val3);	
		}
		return ret;
	}
});