var eventHistory = []

function overlay_in() {
	$('.shadow').css({'display' : 'block'});
	$('.overlay').css({'display' : 'block'});
	$('.shadow').animate({'opacity' : 0.7});
	$('.overlay').animate({'top' : '10%'});
}

function overlay_out() {
	$('.shadow').animate({'opacity' : 0.0}, function () {
		$('.overlay').css({'display' : 'none'});
	});
	$('.overlay').animate({'top' : '-70%'}, function () {
		$('.shadow').css({'display' : 'none'});
	});
}

function save() {
	var name = $('#name').val();
	var cardID = $('.card-id').text();
	var authCode = 0;
	if ($('#fridge').is(':checked'))
		authCode += 1;
	if ($('#tools').is(':checked'))
		authCode += 2;
	$.getJSON('http://127.0.0.1:5000/addcard/' + cardID + '/' + name + '/' +  authCode, function(data) {

	});
	overlay_out();
}

$(document).ready(function() {
	jQuery.ajaxSetup({ cache: false });
	$.getJSON('http://127.0.0.1:5000/gethistory', function(data) {
		eventHistory = data;

		for (var i = 0; i < data.length; i++) {
			var dateString = (new Date(data[i].time*1000)).toLocaleString();
			var newElement = '<div class="event" card-id="' + data[i].cardID + '">\
					<div class="time">' + dateString + '</div>\
					<div class="name">';
			if (data[i].name == "")
				newElement += '<span class="unknown_card">' + data[i].cardID + '</span>';
			else
				newElement += data[i].name;
			newElement += '</div>\
				</div>';
			var toInsert = $(newElement);
			$('.search-bar').after(toInsert);
		}
	});
	$('.recent').on('click', '.event', function() {
		var cardID = $(this).attr('card-id');
		$('.card-id').text(cardID);
		$.getJSON('http://127.0.0.1:5000/getcardinfo/' + cardID, function(data) {
			$('#name').val(data.name);
			if (data.fridge)
				$('#fridge').prop('checked', true);
			else
				$('#fridge').prop('checked', false);
			if (data.secretTools)
				$('#tools').prop('checked', true);
			else
				$('#tools').prop('checked', false);
		})
		.fail(function() {
			$('#name').val('');
			$('#fridge').prop('checked', false);
			$('#tools').prop('checked', false);
		});
		overlay_in();
	});
	$('.search-bar').on('keyup', function() {
		if (eventHistory[1].name.match($('.search-bar').val())) {
			alert('match');
		}
	});
})