var LootPicker = {
	init: function() {
		var stage = $("loot_stage");
		stage.currentapp = 0;
		stage.positions = [-270,20,270,580,1000];
		stage.sizes = [100,100,168,100,100];
		
		stage.showApp = function(app_to_show) {
			$("details_"+stage.apps[stage.currentapp]).crossfade_fx.stop();
			$("details_"+stage.apps[stage.currentapp]).crossfade_fx.start(0);
		
			stage.currentapp = app_to_show;
						
			stage.apps.forEach(function(app, app_i) {
				$("icon_"+app).position = 99;
			});
			
			for(var i = -2; i <= 2; i++) {
				var appnumber = stage.currentapp+i;
				if (appnumber >= 0 && appnumber < stage.apps.length)
					$("icon_"+stage.apps[appnumber]).position = i;
			}
			
			stage.apps.forEach(function(app, app_i) {
				var icon_img = $("icon_"+app);
				
				if (icon_img.oldposition == 99 && icon_img.position == 99) {
					//do nothing
				} else if (icon_img.oldposition == 99 && icon_img.position != 99) {
					// slide in
					icon_img.size_fx.set({
						'height': stage.sizes[icon_img.position+2],
						'width': stage.sizes[icon_img.position+2]
					});
					
					if (icon_img.position < 0) {
						icon_img.position_fx.set(stage.positions[0]-120);
						icon_img.position_fx.start(stage.positions[0]-120,stage.positions[icon_img.position+2]);
					} else if (icon_img.position >0) {
						icon_img.position_fx.set(stage.positions[4]+120);
						icon_img.position_fx.start(stage.positions[4]+120,stage.positions[icon_img.position+2]);
					} else 
						icon_img.position_fx.set(stage.positions[icon_img.position+2]);

					icon_img.className = "icon";

				} else if (icon_img.oldposition != 99 && icon_img.position == 99) {
					// slide out
					
					if (icon_img.oldposition < 0)
						icon_img.position_fx.start(stage.positions[icon_img.oldposition+2],stage.positions[0]-120);
					if (icon_img.oldposition > 0)
						icon_img.position_fx.start(stage.positions[icon_img.oldposition+2],stage.positions[4]+120);
					
				} else { // move
					icon_img.size_fx.stop();
					icon_img.position_fx.stop();
					
					icon_img.size_fx.start({
						'height': [stage.sizes[icon_img.oldposition+2],stage.sizes[icon_img.position+2]],
						'width': [stage.sizes[icon_img.oldposition+2],stage.sizes[icon_img.position+2]]
					});
					
					icon_img.position_fx.start(stage.positions[icon_img.oldposition+2],stage.positions[icon_img.position+2]);
				}
				
				icon_img.oldposition = icon_img.position;
			});

		};
		
		stage.apps.forEach(function(app, app_i) {
			var img = new Image();
			img.id = "icon_"+app;
			img.num = app_i;
			img.src = "/img/icons/"+app+".png";
			img.className = "icon hidden";
			img.onclick = function() {stage.showApp(img.num);};
			img.size_fx = new Fx.Styles(img, {duration:750})
			img.position_fx = new Fx.Style(img, 'left' ,{duration:750});
			img.position_fx.addEvent('onComplete', function(){
				if (img.position == 99) {
					img.className = "icon hidden";
				}
			});

			img.oldposition = 99;
			img.position = 99;
			stage.appendChild(img);
			
			var panel = $("details_"+app);
			panel.crossfade_fx = new Fx.Style(panel, 'opacity' ,{duration:375});
			panel.crossfade_fx.addEvent('onComplete', function(){
				if (panel.style.opacity == 0) {
					panel.className = "details hidden";
					$("details_"+stage.apps[stage.currentapp]).className = "details";
					$("details_"+stage.apps[stage.currentapp]).crossfade_fx.set(0);
					$("details_"+stage.apps[stage.currentapp]).crossfade_fx.start(1);
				} else {
					panel.className = "details";
				}
			});
		});
		
		
		if (stage.firstApp)
			stage.showApp(stage.firstApp);
		else
			stage.showApp(0);
		
		$("switch_left").onclick = function() {
			var stage = $("loot_stage");
			if (stage.currentapp > 0)
				stage.showApp(stage.currentapp-1);
		};
		$("switch_right").onclick = function() {
			var stage = $("loot_stage");
			if (stage.currentapp < stage.apps.length-1)
				stage.showApp(stage.currentapp+1);
		};
	}
}