$(function(){
	window.addEventListener('message', function(event) {
		$('#health .bg').css('height', event.data.health+'%')
		$('#armor .bg').css('height', event.data.armor+'%')

		if (event.data.action == "setValue"){
			if (event.data.key == "job"){
				setJobIcon(event.data.icon)
			}
			setValue(event.data.key, event.data.value)

		}else if (event.data.action == "updateStatus"){
			updateStatus(event.data.status)
		}else if (event.data.action == "setTalking"){

			setTalking(event.data.value)
		}else if (event.data.action == "setProximity"){
			setProximity(event.data.value)
		}else if (event.data.action == "toggle"){
			if (event.data.show){
				$('#ui').show();
			} else{
				$('#ui').hide();
			}
		} else if (event.data.action == "toggleCar"){
			if (event.data.show){
				$('.carStats').show();
			} else{
				$('.carStats').hide();
			}
		}else if (event.data.action == "updateCarStatus"){
			updateCarStatus(event.data.status)
		}else if (event.data.action == "updateWeight"){
			updateWeight(event.data.weight)
		}
	});

});

function updateCarStatus(status){
	var fuel = status[0]
	var damage = status[1]
	var lock = status[2]
	var engine = status[3]
	$('#fuel .bg').css('height', fuel.percent+'%')
	$('#damage .bg').css('height', damage.percent+'%')
	$('#lock .bg').css('height', lock.status)
	if (lock.status == 0){
		color = "#f44336";
	}else{
		color = "#d65600";
	}
	$('#engine .bg').css('height', engine.status)
	if (engine.status == 0){
		color = "#f44336";
	}else{
		color = "#d65600";
	}
}