RESTORE_FE/js/results.js

function handle_Letters(json, mittente, destinatario){

	thead = '<div class="row def_res"> \
				<div class="col-4">Documento</div> \
				<div class="col-2">Data di partenza</div> \
				<div class="col-2">Data di arrivo</div> \
				<div class="col-2">Luogo di partenza</div> \
				<div class="col-2">Luogo di arrivo</div> \
				</div>';

	var EventsTable = thead;

	$.each(
		json['results']['bindings'],
		function (index, value) {
		  	var uri_document = "";
			var doc = "";
			var time_span_from = "";
			var time_span_to = "";
			var uri_place_from = "";
			var place_from = "";
			var uri_place_to = "";
			var place_to = "";
		
			if(value.hasOwnProperty('uri_document')) {
				uri_document = value['uri_document']['value'];	
			}
			if(value.hasOwnProperty('document')) {
				doc = value['document']['value'];
			}
			if(value.hasOwnProperty('time_span_from')) {
				time_span_from = value['time_span_from']['value'];
			}
			if(value.hasOwnProperty('time_span_to')) {
				time_span_to = value['time_span_to']['value'];
			}
			if(value.hasOwnProperty('uri_place_from')) {
				uri_place_from = value['uri_place_from']['value'];
			}
			if(value.hasOwnProperty('place_from')) {
				place_from = value['place_from']['value'];
			}
			if(value.hasOwnProperty('uri_place_to')) {
				uri_place_to = value['uri_place_to']['value'];
			}
			if(value.hasOwnProperty('place_to')) {
				place_to = value['place_to']['value'];
			}

			EventsTable += '<div class="row res">' +
			'<div id="' + uri_document + '" class="col-4 object">' + doc + '</div>' +
			'<div class="col-2">' + time_span_from + '</div>' +
			'<div class="col-2">' + time_span_to + '</div>' +
			'<div id="' + uri_place_from + '" class="col-2 luogo">' + place_from + '</div>' +
			'<div id="' + uri_place_to + '" class="col-2 luogo">' + place_to + '</div>' +
			'</div>';

	});
		

	document.getElementById("results_table").innerHTML = EventsTable;
	document.getElementById("results_title").innerHTML = "Lettere da " + mittente + " a " + destinatario;
		
}

function handleLemma(json, lemma) {

	let anni = [];
	
	thead = '<div class="row def_res"> \
				<div class="col-10">Documento</div> \
				<div class="col-2">Esplora</div> \
			</div>';

	var DocumentsTable = thead;

	var i = 0;
	var anno = "";

	$.each(
		json['results']['bindings'],
		function (index, value) {
		  	var document = value['document']['value'];
			var uri_document = value['uri_document']['value'];
			var uri_info = "";
			var type = "";
			var date = "";
			var year = "";
			var month = "";
			var day = "";
			var sigla = "";
			var text = "Nessun testo trovato";
			var object_button = "";
		
			if(value.hasOwnProperty('uri_infObj')) {
				uri_info = value['uri_infObj']['value'];	
			}
			if(value.hasOwnProperty('types')) {
				type = value['types']['value'];
			}
			if(value.hasOwnProperty('time_span')) {
				date = value['time_span']['value'];
			}
			if(value.hasOwnProperty('year')) {
				year = value['year']['value'];
			}
			if(value.hasOwnProperty('month')) {
				month = value['month']['value'];
			}
			if(value.hasOwnProperty('day')) {
				day = value['day']['value'];
			}
			if(value.hasOwnProperty('text')) {
				text = value['text']['value'];
			}
			if(value.hasOwnProperty('sigla')) {
				sigla = value['sigla']['value'];
			}

			if (type.includes("lettera")) {
				object_button  = '<button type="button" id="' + uri_info + 
				'" class="lettera btn btn-default" alt="opera d\'arte" title="' + document + 
				'"><i class="fa fa-envelope"></i><p class="btn-text">Lettera</p></button>';
			} else {
				object_button  = '<button type="button" id="' + uri_document + 
				'" class="object btn btn-default" alt="oggetto" title="' + document + 
				'"><i class="fa fa-book"></i><p class="btn-text">Bene Culturale</p></button>';
			}
			

			DocumentsTable += '<div class="row res">' +
			'<div id="' + uri_document + '" class="col-10 object">' + document + '</div>' +
			'<div class="col-2">' + object_button + '</div>' +
			'</div>';

			var aaaa = "";

			if (anno != year) {
				anno = year;
				aaaa = year;
				createYearPoint(aaaa);
			}

			anni.push(year);

			querySigla = prefixes + (queryManager['queryRES']['queryTrovaSigla']).replace('<{SIGLA}>', sigla).replace('<{LEMMA}>', lemma);
    		doJsonQuery(querySigla).done(function(r) { manageTimeline(r, date, aaaa, month, day, document, uri_document, text); });

			let element = [date, year, month, day, document, uri_document, text, uri_info];

			createTimelineNode(element);

			i++;

	});

	let uniqueyears = [...new Set(anni)];

	var AnniList = "<h3>Anni</h3><ul>";

	for (var i=0; i<uniqueyears.length; i++) {
		if (uniqueyears[i] != "") {
			AnniList += "<li><button class='btn btn-default anno' id=\""+ uniqueyears[i] + "\">" + uniqueyears[i] + "</button></li>";
		}
	}

	AnniList += "</ul>";

	document.getElementById("lemma_buttons").style.display = "flex";
	document.getElementById("anni").innerHTML = AnniList;
	document.getElementById("results_table").innerHTML = DocumentsTable;
	document.getElementById("results_title").innerHTML = titleCase(lemma);

}

function manageTimeline(json, date, year, month, day, document, uri_document, text) {

	num = "";
	
	$.each(
		json['results']['bindings'],
		function (index, value) {
		  	
			if(value.hasOwnProperty('id')) {
				num = value['id']['value'];	
			}
		});
	
	var testo = text;

	/*if (num != "") {
		var toReplace = "n='" + num + "'";
		var toSearch = "<lem n='numero'\.* />[a-z]+";
		testo = text.replaceAll(toReplace, "class='highlight'");
		let rr = toSearch.replace("numero", num)
		let rer = new RegExp(rr);
		var pos = text.search(rer);
		var searchedString = text.match(rer);
		const regex = new RegExp(/<lem n=${testVar}.*>/);
		text.replace(regex, num);
		let regE = new RegExp("[0-9]+[]a$|[0-9]+[]" , 'g') 
		var result = String("la tua stringa").match(regE );
		var ss = pos-150;
		var ee = pos+150;
		var start = 0;
		var end = ee;
		if (ss<0) {
			start = 0;
		} else {
			start = ss;
		}

		testo = text.substring(start, end)

		console.log([start, end, testo]);
	} else {
		testo = text;
	}*/

}

function createTimelineNode(array) {

	var data = array[0];
	var anno = array[1];
	var mese = array[2];
	var giorno = array[3];
	var titolo = array[4];
	var testo = array[6];
	var link = array[5];
	var infObj = array[7]


	var TimelineNode = '<li>' +
	'<div class="timeline-time">' +
		'<span class="time">'+ data +'</span>' +
	'</div>' +
	'<div class="timeline-icon">' +
        '<a href="javascript:;">&nbsp;</a>' +
    '</div>' +
	'<div class="timeline-body">' +
        '<div class="timeline-header">' +
            '<span id="' + infObj + '" class="lettera username">' + titolo + '</span>' +
        '</div>' +
        '<div class="timeline-content">' +
            '<p>' + testo + '</p>' +
        '</div>' +
    '</div></li>';

	document.getElementById("docTimeline").innerHTML += TimelineNode;

}

function createYearPoint(anno) {

	var TimelineNode = '<li>' +
	'<div class="timeline-icon">' +
		'<span id="anno_' + anno + '">' + anno + '</span>' +
    '</div></li>';

	document.getElementById("docTimeline").innerHTML += TimelineNode;

}

function handle_map(json) {
	console.log(json);
  
	const locations = [];
	const place_names = [];
  
	var lat = 0;
	var long = 0;
	var i=0;
	var myPlaces = "";
  
	$.each(
		json['results']['bindings'],
		function (index, value) {
		  const loc = []
		  var uri = value['place']['value'];
		  var label = value['label']['value'];
		  var coord = value['coordinates']['value'];
		  const coordinates = coord.split(", ");
		  loc.push(label);
		  //myPlaces += "<div class='row'><div class='clickPlace col-10' data-point='"+ coordinates + "'>" + label + "</div><div class='luogo col' id='" + 
	  //uri + "'><i class='far fa-map' style='cursor:pointer'></i></div></div>";
		  loc.push(coordinates[0]);
		  lat += parseInt(coordinates[0]);
		  loc.push(coordinates[1]);
		  long += parseInt(coordinates[1].replace(/^(\.)/,"0.").replace("-.", "-0."));
		  locations.push(loc);
		  i++;
		  
		});

	console.log(locations);
  
	var latitude = lat/i;
	var longitude = long/i;
  
	//document.getElementById("list_places_person").innerHTML = myPlaces;
  
  
	var cloudmadeUrl = 'http://{s}.tile.cloudmade.com/BC9A493B41014CAABB98F0471D759707/997/256/{z}/{x}/{y}.png',
		  cloudmadeAttribution = 'Map data &copy; 2011 OpenStreetMap contributors, Imagery &copy; 2011 CloudMade, Points &copy 2012 LINZ',
		  cloudmade = new L.TileLayer(cloudmadeUrl, {maxZoom: 17, attribution: cloudmadeAttribution}),
		  latlng = new L.LatLng(latitude, longitude);
  
	  
	var map = new L.Map('map', {center: latlng, zoom: 5, layers: [cloudmade]});
	mapLink = '<a href="https://openstreetmap.org">OpenStreetMap</a>';
  
	var markers = new L.MarkerClusterGroup();
	var markerList = [];
  
	var geo = new L.tileLayer(
	  'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
		attribution: '&copy; ' + mapLink + ' Contributors',
		maxZoom: 18,
	  }).addTo(map);
  
	function populate() {
	  for (var i = 0; i < locations.length; i++) {
		var a = locations[i];
		var title = a[0];
		var marker = new L.Marker(new L.LatLng(a[1], a[2]), { title: title });
		marker.bindPopup(title);
		markers.addLayer(marker);
		markerList.push(marker);
	  }
	}
  
	populate();
  
	map.addLayer(markers);
  
	$('.clickPlace').on('click', function(){
	  // parse lat and lng from the divs data attribute
	  var latlng = $(this).data().point.split(',');
	  var lat = latlng[0];
	  var lng = latlng[1];
	  var zoom = 10;
  
	  // set the view
	  map.setView([lat, lng], zoom);
  });
}

// Mini-utility per formattare liste
function formatListAsLi(thisList){
	toRet = "";
	thisList.forEach(value => toRet += "<li>" + value + "</li>");
	return toRet;
}

// Buttons
function createButton(buttonClass, text, onClickFunction){
	htmlCode = '\
		<button class="btn btn-default" type="button" onclick="<FUNCTION>">\
		<i class="<CLASS>" aria-hidden="true">\
			<p class="btn-text"><TEXT></p>\
		</i>\
		</button>\
		'.replace("<CLASS>", buttonClass).replace("<TEXT>", text).replace("<FUNCTION>", onClickFunction);
	return htmlCode;
}

function createButtonEVT(sigla){
	htmlCode = '\
		<button type="button" class="btn btn-secondary" onclick="loadPageEVT(\'<SIGLA>\')">\
		Button EVT</button>\
		'.replace("<SIGLA>", sigla);
	return htmlCode;
}
//<button type="button" class="btn btn-secondary" onclick="loadPageLOD()">Button LOD</button> 

function loadPageEVT(sigla)
{
     window.location="http://restore.ovi.cnr.it/mockup/evt/#/imageText?p=" + sigla + "_01&el=diplomatic";
}  		 

function createEmbed(link) {
	image = link.replace("scheda", "imageView") + "/#main";
	htmlCode = '\
		<embed id="imageEmb" src="<LINK>"> \
		'.replace("<LINK", image);
	return htmlCode;
}

function schedaPersona(info){
	window.open("Persona.html?link="+info);
}

function schedaMappa(info){
	window.open("Luogo.html?link="+info);
}

function schedaASPO(info){
	window.open(info);
}

function schedaEdizione(info){
	$("#myModal").empty();
	$("#myModal").css("display", "block");
	$('#myModal').append("<div class='modal-content'><div class='modal-close'><span class='close'>&times;</span></div><div id='myInput'>" + 
		info + "</div><button id='copy_btn' class='btn btn-theme-primary btn-md' onclick='myFunction()'>Copia</button>");

		
}

function show_OVI(){
	document.getElementById("OVI_info").style.display = "block";
  document.getElementById("ASPO_info").style.display = "none";
}

function show_ASPO(){
	document.getElementById("OVI_info").style.display = "none";
  document.getElementById("ASPO_info").style.display = "block";
}

$(document).on("click", ".close", function (ev) {

		var link = this.id;
		//alert(nome_autore);
		//$('#myModal').text("");
		$("#myModal").css("display", "none");

	});

$(document).on("click", ".hyp", function (ev) {

	var baseurl = window.location.origin+window.location.pathname;
	let slash = baseurl.lastIndexOf("/");
	var type = $(this).val() + '.html';
	var link = this.id;
	var url = baseurl.substr(0, slash+1) + type + "?link="+link;
	var link = this.id;
	$("#myModal").empty();
	$("#myModal").css("display", "block");
	$('#myModal').append("<div class='modal-content'><div class='modal-close'><span class='close'>&times;</span></div><div id='myInput'>" +
		url + "</div><button id='copy_btn' class='btn btn-theme-primary btn-md' onclick='myFunction()'>Copia</button>");
	
	});

$(document).on("click", ".cit", function (ev) {

	var author ="RESTORE. smart access to digital heritage and memory"
	
	var year = new Date().getFullYear()
	
	var today = new Date();
	var dd = String(today.getDate()).padStart(2, '0');
	var mm = String(today.getMonth() + 1).padStart(2, '0'); //January is 0!
	var yyyy = today.getFullYear();
	
	today = dd + '/' + mm + '/' + yyyy;
	
	var baseurl = window.location.origin+window.location.pathname;
	let slash = baseurl.lastIndexOf("/");
	var type = $(this).val() + '.html';
	var link = this.id;
	var url = baseurl.substr(0, slash+1) + type + "?link="+link;
	//alert(nome_autore);
	//$('#myModal').text("");
	$("#myModal").empty();
	$("#myModal").css("display", "block");
	$('#myModal').append("<div class='modal-content'><div class='modal-close'><span class='close'>&times;</span></div><div id='myInput'>" + 
		author + " " + year + ", accesso effettuato: " + today + ", &lt;" + url + "&gt;</div><button id='copy_btn' class='btn btn-theme-primary btn-md' onclick='myFunction()'>Copia</button>");
	
	});

function copyToClipboard(text) {
    var sampleTextarea = document.createElement("textarea");
    document.body.appendChild(sampleTextarea);
    sampleTextarea.value = text; //save main text in it
    sampleTextarea.select(); //select textarea contenrs
    document.execCommand("copy");
    document.body.removeChild(sampleTextarea);
}

function myFunction(){
    var copy = document.getElementById("myInput");
    copyText = copy.textContent;
    copyToClipboard(copyText);

    //copyToClipboard(copyText.value);
}

$(document).on("click", ".luogo", function (ev) {

    var link = this.id;
    //alert(nome_autore);
    //$('#myModal').text("");
    window.open("Luogo.html?link="+this.id);
    

  });

$(document).on("click", ".persona", function (ev) {

    var link = this.id;
    window.open("Persona.html?link="+this.id);
    

  });

$(document).on("click", ".lettera", function (ev) {

  var link = this.id;
  //alert(nome_autore);
  //$('#myModal').text("");
  window.open("lettera.html?link="+this.id);
  

});

$(document).on("click", ".object", function (ev) {

  var link = this.id;
  //alert(nome_autore);
  //$('#myModal').text("");
  window.open("object.html?link="+this.id);
  
});

function scrollPos(point) {
	alert("helo");
	var div = document.getElementById(point).scrollTop;
	document.getElementById("pos").innerHTML = div;
}

$(document).on("click", ".anno", function (ev) {
	var link = this.id;
	var point = "#anno_" + link;
	$('html, body').animate({
		scrollTop: $(point).offset().top
	}, 2000);

});

function titleCase(str) {
	var splitStr = str.toLowerCase().split(' ');
	for (var i = 0; i < splitStr.length; i++) {
		// You do not need to check if i is larger than splitStr length, as your for does that for you
		// Assign it back to the array
		splitStr[i] = splitStr[i].charAt(0).toUpperCase() + splitStr[i].substring(1);     
	}
	// Directly return the joined string
	return splitStr.join(' '); 
  }

function show_list(){
	document.getElementById("res_container").style.display = "block";
	document.getElementById("lemmiMappa").style.display = "none";
	document.getElementById("lemmiTimeline").style.display = "none";
}


function show_timeline(){
	document.getElementById("res_container").style.display = "none";
	document.getElementById("lemmiMappa").style.display = "none";
	document.getElementById("lemmiTimeline").style.display = "block";
}

function show_map(){
	document.getElementById("res_container").style.display = "none";
	document.getElementById("lemmiMappa").style.display = "block";
	document.getElementById("lemmiTimeline").style.display = "none";
}