var volume = 0;
var camion = new Array();
var list_camion = new Array();
var interval;
var tab_start, tab_end, tab_now;
var tab_reste = 0;
var event = false;
var signe;
var compteur;
var urlcamion;

var img_width_max = 60;
var img_width_min = 45;
var img_height_max = 60;
var img_height_min = 45;

$(function(){

	$(window).load(function() {

		mulot_manager();

	});

});

function mulot_manager() {
	$('.compteur').compteur({animate:'fast', element:'volume'});
	$('.compteur').compteur('init', 0);
	
	init_menu();
	init_images();
	init_camion();
	
	check_camion();
	display_menu('0');
}

function init_menu() {
	$('.menuCamion li a').click(function (event) {
		event.preventDefault();
		$('.activated').removeClass('activated');
		var href = $(this).attr('href');
		$(this).addClass('activated');
		display_menu(href);
	});
}

function init_images() {
	$('.images li').each(function () {
		$('img', this).width(img_width_min);
		$('img', this).height(img_height_min);
		$(this).hover(imageIn, imageOut)
		$(this).hide();
	});
	
	var camion = new Array();
	$('.images ul li img').each(function () {
		var rel = $(this).attr('rel');
		rel = rel.split('|');
		camion[$(this).attr('id')] = [rel[1], '0', $(this).attr('src')];
	});
	list_camion = (camion);
}

function init_camion() {
	$('.the_camion').click(function () {
		$('#container').show();
	});
	$('#container #close').click(function () {
		$('#container').hide();
	});
	$('#clear').click(function () {
		$('.compteur').compteur('init', 0);
		volume = 0;
		delete camion;
		delete list_camion;
		$('#container ul li').remove();
		check_camion();
	});
	
	$('.images ul li').dblclick(function() {
		var img = $('img', this);
		var span = $('span', this);
		img.addClass('addItem');
		span.addClass('addItem');
		
		$('#change_number .addItem').remove();
		$('#change_number img#moins').hide();
		
		$('#change_number').prepend($(span).clone());
		$('#change_number').prepend($(img).clone());
		
		$('#change_number').show();
	});
	
	$('.images ul li').draggable({
		helper: "clone",
		zIndex: 2
	});
	
	$('.camion .the_camion').queue("fx")
	$('.camion .the_camion').droppable({
		accept: ".images ul li",
		drop: function( event, ui ) {
			if(volume < 70)
			{
				$('.camion .the_camion').animate({"margin-top": "+=2px"}, 50);
				$('.camion .the_camion').animate({"margin-top": "-=2px"}, 50);
				addItem($('img', ui.draggable).attr('id'), 1);

			}
		}
	});
	
	$('#container img#poubelle').hover(
		function () {
			$(this).attr('src', 'ouverte.jpg');
		}, 
		function () {
			$(this).attr('src', 'ferme.jpg');
		}
	);
	
	$('#container ul li').live('dblclick', function () {
		var img = $('img', this);
		var span = $('span', this);
		img.addClass('addItem');
		span.addClass('addItem');
		
		$('#change_number .addItem').remove();
		$('#change_number img#moins').show();
		$('#change_number').prepend($(span).clone());
		$('#change_number').prepend($(img).clone());
		
		$('#change_number').show();
	});
	
	$('#container #poubelle').droppable({
		accept: "#container ul li",
		drop: function( event, ui ) {
			removeAllItem($('img', ui.draggable).attr('id'));
		}
	});
	
	$('#change_number #plus').click(function () {
		if(volume < 70) {
			var number = parseInt($('#change_number span').html());
			$('#change_number span').html(number+1);
			var id = $('#change_number img').attr('id');
			addItem(id, 1);
		}
	});
	
	$('#change_number #moins').click(function () {
			var number = parseInt($('#change_number span').html());
		if(number > 0) {
			$('#change_number span').html(number-1);
			var id = $('#change_number img').attr('id');
			addItem(id, -1);
		}
	});
	
	$('#change_number #valid').click(function () {
		$('#change_number').hide();
	});
	
	$('#run').click(function() {
		run_car();
	});
	
	$('#infobulle').click(function() {
		$('.camion p#infobulle').fadeOut(2000);
	});
	
}

function imageIn() {
	$('img', this).width(img_width_max);
	$('img', this).height(img_height_max);
}

function imageOut() {
	$('img', this).width(img_width_min);
	$('img', this).height(img_height_min);
}

function display_menu(value) {
	$('.images li img').each(function () {
		$(this).parent().hide();
		var rel = $(this).attr('rel');
		rel = rel.split('|')[0].split(',');
		var pos = $.inArray(value, rel);
		if(pos > -1) {
			$(this).parent().show();
		}
	});
}

function check_camion() {
if(volume > 66) {
		$('.camion p#first').html('');
		$('.imgcamion').attr("src","camion3_grand.png");
		set_camion(419, 150);
		$('.camion p#infobulle').html('<img src="./appelez_nous.png" />');
		$('.camion p#infobulle').fadeIn(2000);
		urlcamion='http://www.garage-mullot.com/fr/contact';
	}
	else if(volume > 45) {
		$('.camion p#first').html('');
		$('.imgcamion').attr("src","camion3_grand.png");
		set_camion(419, 150);
		$('.camion p#infobulle').html('<img src="./permis_poids_lourds.png" />');
		$('.camion p#infobulle').fadeIn(2000);
		urlcamion='http://www.garage-mullot.com/fr/location/poids-lourds/50m3---66m3';
	}
	else if(volume > 35) {
		$('.camion p#first').html('');
		$('.imgcamion').attr("src","camion3_grand.png");
		set_camion(419, 150);
		$('.camion p#infobulle').html('<img src="./permis_poids_lourds.png" />');
		$('.camion p#infobulle').fadeIn(2000);
		urlcamion='http://www.garage-mullot.com/fr/location/poids-lourds/35m3---45m3';
	}
	else if(volume > 22) {
		$('.camion p#first').html('');
		$('.imgcamion').attr("src","camion3_moyen.png");
		set_camion(419, 150);
		$('.camion p#infobulle').html('<img src="./permis_poids_lourds.png" />');
		$('.camion p#infobulle').fadeIn(2000);
		urlcamion='http://www.garage-mullot.com/fr/location/poids-lourds/35m3---45m3';
	}
	else if(volume > 15) {
		$('.camion p#first').html('');
		$('.camion p#infobulle').hide();
		$('.camion p#infobulle').html('');
		$('.imgcamion').attr("src","camion3_moyen.png");
		set_camion(419, 150);
		urlcamion='http://www.garage-mullot.com/fr/location/utilitaires/22m3';
	}
	else if(volume > 12) {
		$('.camion p#first').html('');
		$('.camion p#infobulle').hide();
		$('.camion p#infobulle').html('');
		$('.imgcamion').attr("src","camion.png");
		set_camion(335, 120);
		urlcamion='http://www.garage-mullot.com/fr/location/utilitaires/15m3';
	}
	else if(volume > 10) {
		$('.camion p#first').html('');
		$('.camion p#infobulle').hide();
		$('.camion p#infobulle').html('');
		$('.imgcamion').attr("src","camion.png");
		set_camion(335, 120);
		urlcamion='http://www.garage-mullot.com/fr/location/utilitaires/12m3';
	}
	else if(volume > 6) {
		$('.camion p#first').html('');
		$('.camion p#infobulle').hide();
		$('.camion p#infobulle').html('');
		$('.imgcamion').attr("src","camion.png");
		set_camion(335, 120);
		urlcamion='http://www.garage-mullot.com/fr/location/utilitaires/8m3---10m3';
	}
	else if(volume > 4) {
		$('.camion p#first').html('');
		$('.camion p#infobulle').hide();
		$('.camion p#infobulle').html('');
		$('.imgcamion').attr("src","partner.png");
		set_camion(285, 100);
		urlcamion='http://www.garage-mullot.com/fr/location/utilitaires/4m3---6m3';
	}
	else{
		$('.camion p#first').html('');
		$('.camion p#infobulle').hide();
		$('.camion p#infobulle').html('');
		$('.imgcamion').attr("src","partner.png");
		set_camion(285, 100);
		urlcamion='http://www.garage-mullot.com/fr/location/utilitaires/2m3---4m3';
	}
	
}

function set_camion(width, height) {
	$('.camion > img.imgcamion').width(width);
}

function addItem(id, signe) {
	var item = list_camion[id];
	var camion_exist = camion[id];
	
	old_volume = volume;
	volume = Math.round((parseFloat(volume) + parseFloat(item[0]*signe))*100)/100;
	
	if(camion_exist == undefined)
	{
		camion[id] = ['1', item[2]];
		
		var img = $('.images ul li img[id='+id+']')[0];
		var li = document.createElement('li');
		li.setAttribute('id', id);
		$(li).append($(img).clone())
		$(li).append('<span>1</span>');
		$('#container ul').append(li);
		
		$($(li)).draggable({
			helper: "clone"
		});
		var new_qty = parseFloat(item[0]*signe);
		
		$('.compteur').compteur('add', new_qty);
	}
	else
	{
		var num = parseInt(camion_exist[0])+signe;
		if(num < 1) {
			removeAllItem(id, old_volume);
		}
		else {
			camion[id] = [num, item[2]];
			$('.compteur').compteur('add', parseFloat(item[0]*signe));
		}
		$('#container ul li[id='+id+'] span').text(num);
	}
	$('.camion #volume').text(volume);
	check_camion();
}

function removeAllItem(id, old_volume) {
	var volume_remove = camion[id][0]*list_camion[id][0];
	if(old_volume == undefined)
	{
		old_volume = volume;
		volume = volume - volume_remove;
	}
	$('.camion #volume').text(volume);
	$('.compteur').compteur('add', -volume_remove);
	
	$('#container ul li[id='+id+']').remove();
	delete camion[id];
	check_camion();
}


function run_car()
{
	$('.the_camion').animate({"margin-top":"1px"}, 50);
	$('.the_camion').animate({"margin-top":"0px"}, 50);
	$('.the_camion').animate({"margin-top":"1px"}, 50);
	$('.the_camion').animate({"margin-top":"0px"}, 50);
	$('.the_camion').animate({"margin-left":"500px"}, 2000, "easeInCirc");
	setTimeout('go_to_car()',1000);
}
function go_to_car()
{
	window.location.href=urlcamion;
}