/**
 * @author rico
 */

function BannerBox(a_containment){
	
	//------------------------------------------------------------------------------------------------------------------------
	
	var _self;
	var containment;
	var boxes;
	var defZindex;
	var activeBox;
	var goToUrl;
	var arrangePosition;
	
	//------------------------------------------------------------------------------------------------------------------------
	/**
	 *
	 * @param {Object} a_containment
	 * @return void
	 */
	function __construct( a_containment ) {
		_self = this;
		containment = a_containment;
		boxes = new Array();
		defZindex = 100;
		activeBox = { box:null, y:50, x:0 };
		arrangePosition = { y: 230, x: 730, w: 210, h: 83, space: 5 }
		goToUrl = false;
	}
	
	//------------------------------------------------------------------------------------------------------------------------
	/**
	 *
	 * @param {String} a_url
	 * @param {String} a_src
	 * @param {String} a_slogan
	 * @param {Integer} a_x
	 * @param {Integer} a_y
	 * @return void
	 */
	this.attach = function(a_url, a_src, a_slogan, a_x, a_y){
		var box = document.createElement('div');
		$(box).className = 'bannerBox';
		box.dimension = { x:a_x, y:a_y, w:407, h:161 };
		box.style.zIndex = getZindex();
		box.setOpacity(0.001);
		
		box.url = a_url;
		
		box.image = document.createElement('img');
		$(box.image).className = 'bannerBoxImage';
		box.image.src = a_src;
		box.drager = document.createElement('div');
		$(box.drager).className = 'bannerBoxDrager';
		
		box.slogan = document.createElement('img');
		$(box.slogan).src = a_slogan;
		box.slogan.className = 'bannerBoxSlogan';
		
		containment.appendChild(box);
		box.appendChild(box.drager);
		box.appendChild(box.image);
		containment.appendChild(box.slogan);
		
		setEvents(box);
		boxes.push(box);
	}
	
	//------------------------------------------------------------------------------------------------------------------------
	/**
	 *
	 * @return {String} defZindex
	 */
	function getZindex(){
		defZindex++;
		return defZindex.toString();
	}
	
	//------------------------------------------------------------------------------------------------------------------------
	/**
	 *
	 * @param {Object} a_box
	 * @return void
	 */
	function setEvents(a_box) {
		
		//..........
		
		a_box.onmousedown = function(){
			this.style.zIndex = getZindex();
		}
		
		a_box.onmouseover = function(){
			fadeSlogan( this, true );
		}
		
		a_box.onmouseout = function(){
			fadeSlogan( this, false );
		}
		
		//..........
		
		a_box.image.onclick = function(){
			if (activeBox.box === null) {
				fadeSlogan(a_box, false);
			}
			activeBox.box = a_box;
			goToUrl = a_box.url;
			arrangeBoxes( true );
			
			//fadeContent();
		}
		
		//..........
		
		a_box.dragEvent = new Drag.Move(a_box, {
			'container': $('mainContainer'),
			onComplete: function(){
				a_box.dragEvent.detach();
			}
		}).detach();
		
		$(a_box.drager).addEvent('mousedown', function(){
			a_box.dragEvent.attach();
		});
		
		a_box.drager.onmouseover = function(){
			this.style.backgroundColor = '#000000';
			this.setOpacity(0.2);
		}
		
		a_box.drager.onmouseout = function(){
			this.style.backgroundColor = '';
		}
		
		//..........
		
	}
	
	//------------------------------------------------------------------------------------------------------------------------
	/**
	 * 
	 * @param {Object} a_box
	 * @param {Booleant} fadeIn
	 * @return void
	 */
	function fadeSlogan( a_box, fadeIn ) {
		if( activeBox.box != null ) { return; }
		var speed = 200;
		if( fadeIn === true ) {
			if (a_box.slogan.getOpacity() > 0.9) {
				speed = 1;
				a_box.slogan.setOpacity(1);
			} else {
				a_box.slogan.setOpacity(0.001);
			}
			a_box.slogan.style.display = 'block';
			a_box.slogan.set('morph', { duration: speed, transition: Fx.Transitions.Sine.easeOut });
			a_box.slogan.morph({ opacity: 1 });
		} else {
			a_box.slogan.set('morph', { duration: speed, transition: Fx.Transitions.Sine.easeOut, onComplete: function(){
				a_box.slogan.style.display = 'none';
			}});
			a_box.slogan.morph({ opacity: 0.001 });
		}
	}
	
	//------------------------------------------------------------------------------------------------------------------------
	/**
	 * 
	 * @param {Integer} a_animation
	 * @return void
	 */
	function arrangeBoxes( a_animation ) {
		
		var pos_top = arrangePosition.y;
		var speed = (a_animation === true) ? 750 : 0;
		for( i=0;i<boxes.length;i++ ) {
			var box = boxes[i];
			box.drager.style.display = 'none';
			
			if( box === activeBox.box ) {
				box.set('morph', { duration: speed, transition: Fx.Transitions.Sine.easeOut, onComplete:function(){
					if (goToUrl != false) {
						window.location.href = goToUrl;
					}
				}});
				box.morph({ top: activeBox.y, left: activeBox.x, opacity:1 });
				box.image.set('morph', { duration: speed, transition: Fx.Transitions.Sine.easeOut });
				box.image.morph({ width: box.dimension.w, height: box.dimension.h });
			} else {
				box.set('morph', { duration: speed, transition: Fx.Transitions.Sine.easeOut });
				box.morph({ top:pos_top, left: arrangePosition.x, opacity:1 });
				box.image.set('morph', { duration: speed, transition: Fx.Transitions.Sine.easeOut });
				box.image.morph({ width: arrangePosition.w, height: arrangePosition.h });
				pos_top = pos_top + arrangePosition.h + arrangePosition.space;
			}
		}
	}
	
	//------------------------------------------------------------------------------------------------------------------------
	/**
	 *
	 * @param {Integer} a_delay
	 * @return void
	 */
	this.reset = function() {
		var speed = 500;
		for ( i=0; i<boxes.length; i++) {
			var box = boxes[i];
			box.style.display = 'block';
			box.drager.style.display = 'block';
			box.set('morph', { duration: speed, transition: Fx.Transitions.Sine.easeOut });
			box.image.set('morph', { duration: speed, transition: Fx.Transitions.Sine.easeOut });
			box.morph({
				top: box.dimension.y,
				left: box.dimension.x,
				opacity: 1
			});
			box.image.morph({
				width: box.dimension.w,
				height: box.dimension.h
			});
		}
		activeBox.box = null;
	}
	
	//------------------------------------------------------------------------------------------------------------------------
	/**
	 * 
	 * @param {Object} a_id
	 * @return void
	 */
	this.setActiveBox = function( a_id ) {
		activeBox.box = boxes[a_id];
		var pos_top = arrangePosition.y;
		for (i = 0; i < boxes.length; i++) {
			var box = boxes[i];
			if( box === activeBox.box ) {
				box.style.top = activeBox.y + 'px';
				box.style.left = activeBox.x + 'px';
				box.image.style.width = box.dimension.w + 'px';
				box.image.style.height = box.dimension.h + 'px';
			} else {
				box.style.top = pos_top + 'px';
				box.style.left = arrangePosition.x + 'px';
				box.image.style.width = arrangePosition.w + 'px';
				box.image.style.height = arrangePosition.h + 'px';
				pos_top = pos_top + arrangePosition.h + arrangePosition.space;
			}
			box.style.display = 'block';
			box.setOpacity(1);
		}
		arrangeBoxes(false);
	}
	
	//------------------------------------------------------------------------------------------------------------------------
	
	__construct(a_containment);
	
	//------------------------------------------------------------------------------------------------------------------------
	
}