var Kamer = new Class({
	initialize:function() {
		this.initBlocks();
		this.initLinks();
	}
	
	,initBlocks: function() {
		this.blocks = new Blocks();
		var me = this;
		window.addEvent('resize', this.blocks.onResize.bind(this.blocks));
		this.blocks.onResize();
	}
	
	,initRollovers: function() {
		$$('img.rollover').each(function(el,dx) {
			el.set({'width':el.getSize().x, 'height':el.getSize().y});
			el.store('orig_url',el.get('src'));
			el.addEvents({
				'mouseenter':function() { this.set('src','/assets/images/kamer465.gif');	}
				,'mouseleave':function() {	this.set('src',this.retrieve('orig_url')); }
			});
		});
	}
	
	,initLinks:function() {
		// Set active link
		var url = document.location.href.split("/");
		if(url.contains("tag")) {
			var curr_tag = url[url.indexOf("tag")+1];
		}
		$$('a').each(function(el,dx){
			url = el.get('href').split('/');
			if(el.get('href') == document.location.pathname) {
				el.addClass('active_link');
			}
			else {
				if(url.contains("tag") && !url.contains("page")) {
					if(url[url.indexOf("tag")+1] == curr_tag) {
						el.addClass("active_link");
					}
				}
				else {
					el.removeClass('active_link');
				}
			}
		});
		
		// Handle more links.
		$$('a.clicker').each(function(el, dx){
			
			el.getParent('div.block').addClass("has_more").addEvent('click',function(){
				document.location=this.getElement('a.clicker').get('href');
			});
		});
	}
});

var Blocks = new Class({
	initialize: function() {
		var me = this;
		this.min_cols = 3;
		this.old_num_cols = 0;
		this.col_width = 100;
		this.widths = [0,100, 200, 300, 400];
		this.gutter = 5;
		this.content = document.getElements('.block'); // html
		this.data = new Array(); // keeps track of size per block
	
		// keep track of each block width.
		this.content.each(function(el, dx) {
			 var w = el.get('class').match(/w[0-9]/)[0].replace('w','');
			 me.data.push({width:Number(w)});
		});
		this.forceResize.periodical(50,this);
	}	
	,forceResize: function() {
		this.old_num_cols = -1;
		this.onResize();
	}
	
	,onResize: function() {
		// get number of usable columns.
		var width = window.getSize().x;
		this.num_cols = Math.max(Math.floor(width/(this.col_width + this.gutter)),this.min_cols);
		if(this.old_num_cols == this.num_cols) {
			return;
		}
		this.old_num_cols = this.num_cols;
	
		// Layout the content blocks.
		this.layout();
	}
	
	,layout: function() {
		var me = this;
		this.cols = new Array();
		var i = 0; 
		while(i < this.num_cols) {
			this.cols.push({x:i++, y:0, width:0});
		}
		
		this.content.each(function(node, dx) {
			me.cols.sort(me.ySort); 
			me.layoutWide(me.data[dx], dx);
		});
		
		this.cols.sort(this.ySort);
		var max_y = this.cols[this.cols.length-1].y;
		$('paging_bottom').setStyle('top',max_y +"px");
		
	}
	
	,layoutWide: function(node, dx) {
		this.cols.sort(this.xSort);
		var i,j;
		var last_col = this.num_cols - node.width +1; // which col to place
		var max_y, spanned_y, possible_places = [];
		for(i = 0; i < last_col; ++i) {
			max_y = 0;
			for(j = 0; j < node.width; ++j) {
				spanned_y = Number(this.cols[i+j].y);
				max_y = Math.max(spanned_y, max_y);
			}
			possible_places.push({x:this.cols[i].x, y:max_y,width:this.cols[i].width});
		}
		
		possible_places.sort(this.ySort);
		this.attachItem(this.content[dx], possible_places[0].x * (this.col_width + this.gutter), possible_places[0].y);
		// update spanned columns.
		for(i = possible_places[0].x; i < Number(possible_places[0].x) + Number(node.width); ++i) {
			this.cols[i].y = possible_places[0].y + this.content[dx].getSize().y ;
			
		}
		this.cols.sort(this.xSort);
	}
	
	,attachItem: function(node, x, y) {
		node.setStyles({
			top:y +"px"
			,left:x +"px"
		});
	}
	
	,xSort: function(a,b) {
		return (a.x - b.x);
	}
	
	,ySort: function(a,b) {
		if(a.y == b.y) { // if same y position...
			return (a.x -b.x); // ...when a.x less then b.x: place a above b 
		}
		else {
			return (a.y-b.y); // a.y less then b.y, place a above b
		}
	}
});


var room;
document.addEvent('domready', function() {
	room = new Kamer();
});
window.addEvent('load',function() {
	room.initRollovers();	
});