/**************************************************************

	Script		: Rounded Corners
	Version		: 1.2
	Authors		: Samuel Birch
	Desc		: Image based rounded corners for divs and images

**************************************************************/

var RoundedCorners = new Class({
							  
	getOptions: function(){
		return {
			radius: 20,
			cls: 'box',
			overlay: false
		};
	},

	initialize: function(className, options){
		this.setOptions(this.getOptions(), options);
		
		this.boxes = $$(className);
		this.boxes.each(function(el){
			this.setup(el);
		}, this);
		
	},
	
	setup: function(box){
		
		var container = new Element('div').addClass(this.options.cls+'Container').setStyles({
			position: 'relative',
			width: box.getStyle('width').toInt()+box.getStyle('paddingLeft').toInt()+box.getStyle('paddingRight').toInt()+'px',
			height: box.getStyle('height').toInt()+box.getStyle('paddingTop').toInt()+box.getStyle('paddingBottom').toInt()+'px',
			margin: box.getStyle('margin')
		}).injectBefore(box).adopt(box);
		
		if(window.ie){
			container.setStyle('height', box.getStyle('height'));
		}
		
		box.setStyles({
			position: 'absolute',
			top: '0px',
			left: '0px',
			margin: '0px',
			border: 'none',
			background: 'none',
			zIndex: 2
		});
		
		var cornerContainer = new Element('div').setStyles({
			position: 'absolute',
			top: '0px',
			left: '0px',
			zIndex: 1
		}).injectAfter(box);
		
		if(this.options.overlay){
			cornerContainer.setStyle('zIndex', 3);
		}
		
		var num = 0;
		
		//top
		var topLeft = new Element('div').addClass(this.options.cls+'TopLeft').addClass(this.options.cls+'Float').setStyles({
			width: this.options.radius+'px',
			height: this.options.radius+'px'
		}).injectInside(cornerContainer);
		
		var top = new Element('div').addClass(this.options.cls+'Top').addClass(this.options.cls+'Float').setStyles({
			width: container.getStyle('width').toInt()-(this.options.radius*2)+'px'
		}).injectInside(cornerContainer);
		top.setStyle('height', (this.options.radius-top.getStyle('borderTopWidth').toInt())+'px');
		
		var topRight = new Element('div').addClass(this.options.cls+'TopRight').addClass(this.options.cls+'Float').setStyles({
			width: this.options.radius+'px',
			height: this.options.radius+'px'
		}).injectInside(cornerContainer);
		
		//middle
		num = container.getStyle('height').toInt()-(this.options.radius*2);
		if(num < 0){num=0}
		
		var middleLeft = new Element('div').addClass(this.options.cls+'MiddleLeft').addClass(this.options.cls+'Float').setStyles({
			height: num+'px'
		}).injectInside(cornerContainer);
		middleLeft.setStyle('width', (this.options.radius-middleLeft.getStyle('borderLeftWidth').toInt())+'px');
		
		var middle = new Element('div').addClass(this.options.cls+'Middle').addClass(this.options.cls+'Float').setStyles({
			width: container.getStyle('width').toInt()-(this.options.radius*2)+'px',
			height: num+'px'
		}).injectInside(cornerContainer);
		
		var middleRight = new Element('div').addClass(this.options.cls+'MiddleRight').addClass(this.options.cls+'Float').setStyles({
			height: num+'px'
		}).injectInside(cornerContainer);
		middleRight.setStyle('width', (this.options.radius-middleRight.getStyle('borderRightWidth').toInt())+'px');
		
		//bottom
		var bottomLeft = new Element('div').addClass(this.options.cls+'BottomLeft').addClass(this.options.cls+'Float').setStyles({
			width: this.options.radius+'px',
			height: this.options.radius+'px'
		}).injectInside(cornerContainer);
		
		var bottom = new Element('div').addClass(this.options.cls+'Bottom').addClass(this.options.cls+'Float').setStyles({
			width: container.getStyle('width').toInt()-(this.options.radius*2)+'px'
		}).injectInside(cornerContainer);
		bottom.setStyle('height', (this.options.radius-bottom.getStyle('borderBottomWidth').toInt())+'px');
		
		var bottomRight = new Element('div').addClass(this.options.cls+'BottomRight').addClass(this.options.cls+'Float').setStyles({
			width: this.options.radius+'px',
			height: this.options.radius+'px'
		}).injectInside(cornerContainer);
		
	},
	
	resize: function(){
		this.boxes.each(function(el){
			this.doResize(el);
		}, this);
	},
	
	doResize: function(box){
		
		var container = box.getParent();
		container.setStyle('height', box.getStyle('height').toInt()+box.getStyle('paddingTop').toInt()+box.getStyle('paddingBottom').toInt()+'px');
		
		var num = container.getStyle('height').toInt()-(this.options.radius*2);
		if(num < 0){num=0}
		
		container.getElement('.'+this.options.cls+'MiddleLeft').setStyle('height',num+'px');
		container.getElement('.'+this.options.cls+'Middle').setStyle('height',num+'px');
		container.getElement('.'+this.options.cls+'MiddleRight').setStyle('height',num+'px');
	}

});
RoundedCorners.implement(new Events);
RoundedCorners.implement(new Options);

/*************************************************************/