var Box = function(){
	this.init();
}

Box.prototype = {
	mask : null,
	contentBox : null,
	project : null,
	number : null,
	max : null,
	href : null,
	nextBtn : null,
	previousBtn : null,
	
	init : function(){
		this.mask = $('<div id="bodymask"></div>');
		this.contentBox = $('<div id="worklightbox"></div>');
		$('body').append(this.mask);
		$('body').append(this.contentBox);
		this.contentBox.append($('#loader').tmpl());
	},
	
	setProject : function(){
		this.project = new Project();
		this.getData();
		
	},
	
	getData : function(){
		var me = this;
		$.ajax({
			url: me.href,
			success: function(data) {
				data = (jQuery.parseJSON(unescape(data)));
				me.project.addDatas(data);
				me.add();
			}
		});
	},

	add: function(){
		var me = this;
		this.contentBox.empty();
		this.contentBox.append($('#workbox').tmpl(me.project.datas));
		
		this.project.addWorkBox();
		$('#close').click(function(e){
			e.preventDefault();
			me.remove();
		});
		this.nextBtn = $('#nextproject');
		this.nextBtn.click(function(e){
			e.preventDefault();
			me.nextProject();
		});
		this.previousBtn = $('#previousproject');
		this.previousBtn.click(function(e){
			e.preventDefault();
			me.previousProject();
		});
		this.mask.click(function(){
			me.remove();
		});
		if(this.number == 1){
			this.previousBtn.hide();
		}
		if(this.number == this.max){
			this.nextBtn.hide();
		}
	},
	
	nextProject : function(){
		this.number++;
		this.loadProject();
	},
	
	previousProject : function(){
		this.number--;
		this.loadProject();
	},
	
	loadProject : function(){
		this.href = $('[rel='+this.number+']').attr('href')+'?type=json';
		this.contentBox.empty();
		this.contentBox.show();
		this.contentBox.append($('#loader').tmpl());
		this.setProject();
	},

	remove : function(){
		this.mask.remove();
		this.contentBox.remove();
	}
}