$(document).ready(function(){
	$('#loading').hide()

	$('#info').click( function() {
		console.log("click");
		$('#info-search').toggle();
	});

	$('#search').submit(function(e) {
		e.preventDefault();
		args = $(this).serialize();	
		$('#results').empty();		
		// console.log('/search?'+ args)
		$('#loading').show()
		$.get('/search?'+ args + '&action=search', function(data) {
			$('#loading').hide()
			console.log(data);
			var term = data.keyword.replace(/['"]+/g, '');
			var id_str = term.replace(/\s/g, "").replace(/\*/g, "");
			console.log(id_str)
			$('<div/>', {
				id: id_str,
				class: "keyword-index",
			}).appendTo('#results');
			$('#' + id_str).prepend('<term>' + term + '</term>');
			$.each(data.results, function(i, item) {
				let end = (i == data.results.length - 1 ? "" : ", ")
				if (item.url != '') {
					$('#' + id_str).append('<ref data-url="' + item.url + '" data-nbr="' + item.nbr + '"><a href="' + item.url + '">' + item.nbr + '</a></ref>' + end);	
				} else {
					$('#' + id_str).append('<ref data-url="' + item.url + '" data-nbr="' + item.nbr + '">' + item.nbr + '</ref>' + end );	
				}				
			});
			$('#' + id_str).append('<button class="add">+</button>');
			$('.add').click(function(e) {				
				var indx = $(this).parent(".keyword-index");

				var term = indx.children("term")[0];
				var term_out = $(term).text();

				var refs_out = []
				var refs = indx.children("ref").each( function() {
					let url = $(this).data('url');
					let nbr = $(this).data('nbr');
					if (url == "") url = "n/a";
					refs_out.push({'url': url, 'nbr': nbr});
				});

				$.ajax ({
					type: "POST",
					contentType: 'application/json',
					url: '/search',
					data: JSON.stringify({'action': 'add', 'term': term_out, 'refs': refs_out}),
					success: function (d) {
						if(d === 'ok') {				
							location.reload();
						}	
					}
				});

				// $.post('/search', {'action': 'add', 'term': term_out, 'refs': refs_out}, function(d) {
				// 	if(d === 'ok') {				
				// 		location.reload();
				// 	}	
				// });
			});						
		});
	});

});