
var bslflag = Class.create();
// to dot: 
// - reset width resize window.!
bslflag.prototype = {
	Basewidth : 18,
	initialize : function(element) {
		this.element = $(element);
		this.options = Object.extend({}, arguments[1] || {});
		if(this.options.balk.borderWidth) this.options.balk.borderWidth = this.options.balk.borderWidth.split(" ");
		if(this.options.flag.borderWidth) this.options.flag.borderWidth = this.options.flag.borderWidth.split(" ");
		
		this.createBalk();
		this.createFlag();
	},
	
	createBalk : function(){
		//position
		this.element.setStyle({'position':'absolute'})
		// size
		this.element.setStyle({'width':(this.options.balk.width*this.Basewidth)+'px'})
		baseH = $('globalcontainer').getHeight()
		H = baseH - this.options.balk.borderWidth[0] - this.options.balk.borderWidth[2]
		this.element.setStyle({'height':H+'px'})

		//style
		this.element.setStyle({'border-style':this.options.balk.borderStyle})
		this.element.setStyle({'border-color':this.options.balk.borderColor})
		this.element.setStyle({'background-color':this.options.balk.backgroundColor})
		if(this.options.balk.borderWidth) {
			this.element.setStyle({'border-top-width':0+this.options.balk.borderWidth[0]+'px'})
			this.element.setStyle({'border-right-width':0+this.options.balk.borderWidth[1]+'px'})
			this.element.setStyle({'border-bottom-width':0+this.options.balk.borderWidth[2]+'px'})
			this.element.setStyle({'border-left-width':0+this.options.balk.borderWidth[3]+'px'})
			}

	},
	
	createFlag : function(){
		//position
		flag = $(this.options.flag.flagid); 
		flag.setStyle({'position':'absolute'})
		flag.setStyle({'top':this.options.flag.top+'px'})
		L = this.options.flag.left - this.options.balk.borderWidth[3]-1
		flag.setStyle({'left':L+'px'})
		
		// size
		flag.setStyle({'width':(this.options.flag.width*this.Basewidth)+'px'})
		flag.setStyle({'height':(this.options.flag.height*this.Basewidth)+'px'})

		//style
		flag.setStyle({'border-style':this.options.flag.borderStyle})
		flag.setStyle({'border-color':this.options.flag.borderColor})
		flag.setStyle({'background-color':this.options.flag.backgroundColor})
		if(this.options.flag.borderWidth) {
			flag.setStyle({'border-top-width':0+this.options.flag.borderWidth[0]+'px'})
			flag.setStyle({'border-right-width':0+this.options.flag.borderWidth[1]+'px'})
			flag.setStyle({'border-bottom-width':0+this.options.flag.borderWidth[2]+'px'})
			flag.setStyle({'border-left-width':0+this.options.flag.borderWidth[3]+'px'})
			}
		
	}
	
}


Event.observe(	window,'load',function(){ new bslflag('bslbalk',{
														balk:{
															backgroundColor:'#fff'
															,borderStyle:'solid'
															,borderColor:'#0082d6'
															,width:1
															,borderWidth:'0 1 1 1'},
														flag:{
															flagid:'bslflag'
															,top:128
															,left:18
															,backgroundColor:'#fff'
															,borderStyle:'solid'
															,borderColor:'#0082d6'
															,borderWidth:'0 1 0 0'
															,width:2
															,height:2
															}
														} 
														
														);},false);
								
