ripristinata versione vecchia

js/cesareBrowse.js

@@ -12,38 +12,57 @@ $(document).ready(function() {
 	var primaCanticaLoaded = false;
 	var secondaCanticaLoaded = false;
 	var terzaCanticaLoaded = false;
+	var listaVersi = new Set()
+	const ddmenus={"Inferno":"#dmc1",
+					"Purgatorio": "#dmc2",
+					"Paradiso": "#dmc3"}
 	
 	var currentMinimap=''
 	
+
 	//caricamento prima cantica
 	$('#cantica1').on('click', function() {
 		hideMinimap();
-
+		activateMenuItem('#cantica1')
 		if (!(primaCanticaLoaded)) {
 			
+			//jsonQuery = versiCantica("Inferno");
+			//execQuery = new sparqlGenerator().stringify(jsonQuery);
+			//executeQueryVersi(execQuery);
 			showCantica('Inferno')
 			primaCanticaLoaded = true;
 			$(".labelCantica").attr('style', "display: block;");
 		}
 		else {
+			//$("#InfernoCanto_1").attr('style', 'display:block')
 			$("#CantiInferno").attr('style', 'display:block')
+
 		}
 		
+		
+
 	});
 
 	//caricamento seconda cantica
 	$('#cantica2').on('click', function() {
 		hideMinimap();
-
+		activateMenuItem('#cantica2')
 		if (!(secondaCanticaLoaded)) {
 			
+			//jsonQuery = versiCantica("Purgatorio");
+			//execQuery = new sparqlGenerator().stringify(jsonQuery);
+			//executeQueryVersi(execQuery);
 			showCantica('Purgatorio')
 			secondaCanticaLoaded = true;
 			$(".labelCantica").attr('style', "display: block;");
 		}
 		else {
+			//$("#PurgatorioCanto_1").attr('style', 'display:block')
 			$("#CantiPurgatorio").attr('style', 'display:block')
+
 		}
+		
+
 	});
 
 	//caricamento terza cantica
@@ -56,7 +75,9 @@ $(document).ready(function() {
 			$(".labelCantica").attr('style', "display: block;");
 		}
 		else {
+			//$("#ParadisoCanto_1").attr('style', 'display:block')
 			$("#CantiParadiso").attr('style', 'display:block')
+
 		}
 		
 
@@ -80,7 +101,6 @@ $(document).ready(function() {
 		});
 	
 	
-
 	jQuery(document).delegate('.navig-canto', 'click', function(e) {
 		$('.canto').each(function() {
 			$(this).attr("style", 'display:none');
@@ -113,11 +133,14 @@ $(document).ready(function() {
   							}
 			});
 		
+		//$('#minimapviewer').on('drag', trackScrollViewer)
 
 	});
 
 	//Query
 	
+ 
+  //$('#searchcomm').on('click', function() {
   jQuery(document).delegate('#searchcomm', 'click', function(e) {
   	
     cleanSearchResult()
@@ -137,6 +160,8 @@ $(document).ready(function() {
     
     executeQuerySearch(myquery)
     
+    
+			
 });
 
 //Reset
@@ -153,11 +178,33 @@ $(document).ready(function() {
 
 	//activate navigation menu items
 
+	function activateMenuItem(menuItem) {
+		//$('.blog-nav-item').each(function() {
+		//	$(this).attr("class", $(this).attr("class").replace(' active', ''));
+		//});
+		//$(menuItem).attr("class", $(menuItem).attr("class") + ' active');
+	}
+
+	
+
+	
+	function managePunctuation(stringa) {
+		var tempstringa=stringa.replaceAll(" ,", ",")
+		tempstringa=tempstringa.replaceAll(" .", ".")
+		tempstringa=tempstringa.replaceAll(" :", ":")
+		tempstringa=tempstringa.replaceAll(" !", "!")
+		tempstringa=tempstringa.replaceAll(" ?", "?")
+		tempstringa=tempstringa.replaceAll(" ;", ";")
+		tempstringa=tempstringa.replaceAll("%20", " ")
+		return tempstringa
+	}
+
 	function cleanSearchResult(){
 		
 		for (verso of listarisultati){
 				idverso='#'+verso
 				//console.log(idverso)
+				//$(idverso).attr('class', 'f6 font-weight-lighter')
 				$(idverso).attr('class', 'f6text-secondary text-nowrap font-weight-lighter')
 			}
 		$( ".badge" ).remove();
@@ -166,8 +213,8 @@ $(document).ready(function() {
     		showMinimap(currentMinimap)
 	}
 
-	//START minimap management
 	
+	//minimap management
 	let minimap = document.createElement('div');
 	let minimapSize = document.createElement('div');
 	let viewer = document.createElement('div');
@@ -178,24 +225,25 @@ $(document).ready(function() {
 	
 	function showMinimap(element) {
 		
+
 		mmplace=document.getElementById('displayminimap')
+		//mmplace=document.getElementById('displaycanto')
 		
 		minimap.className = 'minimap__container'
-		minimap.id = 'minimapcontainer'
 		minimapSize.className = 'minimap__size'
-		minimapSize.id = 'minimapsize'
 		viewer.className = 'minimap__viewer'
 		viewer.id='minimapviewer'
 		minimapContent.className = 'minimap__content'
 		//class="col-3 px-0"
 		minimap.append(minimapSize, viewer, minimapContent);
 		
+		//document.body.appendChild(minimap)
 		mmplace.appendChild(minimap)
 		
 		
 		let html = document.getElementById(element).outerHTML//innerHTML
 		//console.log(html)
-		if (html == null || html == '')
+		if (html==null | html=='')
 			return;
 		
 		let iFrameDoc = minimapContent.contentWindow.document;
@@ -231,40 +279,67 @@ $(document).ready(function() {
 	}
 	
 	
-	function getInnerHeight(elm) {
-		var computed = getComputedStyle(elm),
-			padding = parseInt(computed.paddingTop) + parseInt(computed.paddingBottom);
-
-		return elm.clientHeight - padding
-	}
-
-	function getDimensionsDiv() {
 	
+	function getDimensions(){
 		cantoplace=document.getElementById(displayId)
-
+		let bodyWidth= cantoplace.clientWidth;
-		elementplace = document.getElementById(mappedElement)
+		let bodyRatio=  bodyWidth/cantoplace.clientHeight
-
+		//let winRatio=cantoplace.clientWidth / getInnerHeight(cantoplace)
-		bodyWidth = elementplace.clientWidth;
+		let winRatio= window.innerHeight / window.innerWidth;
-		let bodyRatio = elementplace.clientHeight / bodyWidth;
-		let winRatio = getInnerHeight(cantoplace) / (cantoplace.clientWidth);
 		
 		
-		minimap.style.width = '100%';
+		minimap.style.width='55%';
-
+		viewer.style.width='55%'
 		
 		realScale=minimap.clientWidth / bodyWidth;
 		
 		minimapSize.style.paddingTop=`${bodyRatio * 100}%`
-
 		viewer.style.paddingTop=`${winRatio * 100}%`;
 		minimapContent.style.transform=`scale(${realScale})`;
 		minimapContent.style.width=`${(100/realScale)}%`;
 		minimapContent.style.height=`${(100 / realScale)}%`;
 		
+		}
+	 function getInnerHeight( elm ){
+  		var computed = getComputedStyle(elm),
+      		padding = parseInt(computed.paddingTop) + parseInt(computed.paddingBottom);
+
+  		return elm.clientHeight - padding
+	}
+	 function getDimensionsDiv(){
+		
+		
+		cantoplace=document.getElementById(displayId)
+		
+		elementplace=document.getElementById(mappedElement)
+		
+		bodyWidth= elementplace.clientWidth;
+		bodyRatio= elementplace.clientHeight / bodyWidth;
+		//let bodyWidth= cantoplace.clientWidth;
+		//let bodyRatio= cantoplace.clientHeight / bodyWidth;
+		//let winRatio= window.innerHeight / (window.innerWidth); 
+		let winRatio= getInnerHeight(cantoplace) / (cantoplace.clientWidth);
+		
+	
+		//minimap.style.width='15%';
+		minimap.style.width='100%';
+		
+	
+		realScale=minimap.clientWidth / bodyWidth;
+	
+		minimapSize.style.paddingTop=`${bodyRatio * 100}%`
+		viewer.style.paddingTop=`${winRatio * 100}%`;
+		minimapContent.style.transform=`scale(${realScale})`;
+		minimapContent.style.width=`${(100/realScale)}%`;
+		minimapContent.style.height=`${(100 / realScale)}%`;
+		//minimapContent.style.height=`100%`;
+		minimapContent.style.float='right';
+	    
+
 	 }
 
 	function trackScroll(){
-
+		//console.log(window.scrollY)
 		viewer.style.transform=`translateY(${window.scrollY * realScale}px)`
 	}
 	function trackScrollCanto(){
@@ -278,6 +353,7 @@ $(document).ready(function() {
 		
 		did.scrollTop=(toppos*(1/realScale))
 		
+		
 	}
 	
 	function hideMinimap(){
@@ -288,13 +364,17 @@ $(document).ready(function() {
 		currentMinimap=''
 	}
 
-	//END minimap management
+	// fa diventare draggable il minimapviewer
 	
+		
+	//end minimap management
 	//Cantica management functions
 	
 	function showCantica(cantica){
 		var listaCanti = new Set()
 		var setVersi = new Set()
+		var listaVersi = []
+		var listaForme =[]
 		containerForme=formeterza
 		if(cantica=='Inferno')
 			containerForme=formeprima
@@ -307,6 +387,13 @@ $(document).ready(function() {
 			var obj = new Object();
 			var forma=new Object()
 			setVersi=createDivVersi(setVersi, cantica, formaItem[3], 'Canto '+formaItem[1])
+			/*
+			obj.numverso = formaItem[3];
+
+			obj.canto = 'Canto '+formaItem[1];
+			obj.cantica = cantica;
+			listaVersi.push(obj)
+			*/
 			
 			forma.numverso = formaItem[3];
 			forma.canto = 'Canto '+formaItem[1];
@@ -316,9 +403,9 @@ $(document).ready(function() {
 			createSpanForme(forma)
 			//listaForme.push(forma)
 		}
+		//renderData(cantica, listaCanti, listaVersi, listaForme);
 		return
 	}
-
 	function createSpanForme(element){
 		var spanoccorrenza=$('<span />')
 		var pos=parseInt(element.pos)
@@ -331,14 +418,15 @@ $(document).ready(function() {
 		elementoverso.append('&nbsp;')
 		
 	}
-
 	function createDivVersi(setVersi, cantica, num, canto){
 		if(setVersi.has(cantica+"_"+num+"_"+canto))
 			return setVersi
 		else{
 			var elementoverso = $('<p />')
+
 			elementoverso.append(num + ". ")
 			elementoverso.attr("style", "line-height: 0.5em")
+			
 			elementoverso.attr('class', 'f6 text-secondary text-nowrap font-weight-lighter')
 
 			elementoverso.attr('id', cantica+"_"+ canto.replace(" ", "_")+"_"+num)
@@ -365,10 +453,214 @@ $(document).ready(function() {
 		return orderedListaCanti
 	}
 	
-	// SEARCH
+	function renderData(cantica, listaCanti, listaVersi, listaForme){
+		//var orderedListaCanti = Array.from(listaCanti)
+		//orderedListaCanti = orderedListaCanti.sort((a, b) => {
+		//	return parseInt(a.split(" ")[1], 10)-parseInt(b.split(" ")[1], 10)
+		//});
+		//var orderedListaVersi = Array.from(listaVersi)
+		//orderedListaVersi = orderedListaVersi.sort((a, b) => {
+		//	return parseInt(a.numverso, 10)-parseInt(b.numverso, 10)	
+						
+		//});
+		
+		/*
+		listaVersi = listaVersi.filter((value, index, self) =>
+  			index === self.findIndex((t) => (
+    		t.numverso === value.numverso && t.canto === value.canto && t.cantica===value.cantica
+  			))
+		)*/
+		
+		//var orderedListaForme = Array.from(listaForme)
+		//orderedListaForme = orderedListaForme.sort((a, b) => {
+		//	return parseInt(a.pos, 10)-parseInt(b.pos, 10)
+						
+		//});
+	
+		//var divListaCanti = $('<DIV id="Canti' + cantica + '" />')
+		/*
+		for (canto of orderedListaCanti) {
+			
+			
+			var divcanto = $('<div />')
+			var titolocanto = $('<h4 class="titolo-canto pb-2" />')
+			titolocanto.append(cantica+", "+canto)
+			divcanto.attr('class', 'canto')
+			divcanto.attr('style', 'display:none')
+			divcanto.attr('id', (cantica + canto).replace(" ", "_"))
+			titolocanto.appendTo(divcanto)
+			divcanto.appendTo(' .blog-main')
+		}
+		*/
+		//divListaCanti.appendTo('#listacanti')
+		//divListaCanti.appendTo(ddmenus[cantica])
+		/*
+		for (verso of listaVersi) {
+						
+						
+			var elementoverso = $('<p />')
+			//vartestoverso=verso.numverso;
+			elementoverso.append(verso.numverso + ". ")
+			elementoverso.attr("style", "line-height: 0.5em")
+			
+			elementoverso.attr('class', 'f6 text-secondary text-nowrap font-weight-lighter')
+			//elementoverso.attr('class', 'f6 font-weight-lighter nowrap')
+			elementoverso.attr('id', verso.cantica+"_"+ verso.canto.replace(" ", "_")+"_"+verso.numverso)
+			elementoverso.appendTo('#' + cantica + verso.canto.replace(" ", "_"))
+						
+		}
+				*/	
+		listaForme.forEach((element) => {
+			var spanoccorrenza=$('<span />')
+			var pos=parseInt(element.pos)
+			spanoccorrenza.attr('id', element.cantica+"_"+ element.canto.replace(" ", "_")+"_"+element.numverso+"_"+pos)
+			if (listarisultati.length>0 && listarisultati.includes(spanoccorrenza.attr('id')))
+				spanoccorrenza.attr('class', "f6 mark ")
+			spanoccorrenza.append(element.form)
+			elementoverso=$('#'+element.cantica+"_"+ element.canto.replace(" ", "_")+"_"+element.numverso)	
+			spanoccorrenza.appendTo(elementoverso)
+			elementoverso.append('&nbsp;')
+		})
+		
+	}
+	// Search functions
+	 
+	async function executeQueryVersi(query) {
+		bindingsStream = await myEngine.queryBindings(query, { sources: [{ type: 'sparql', value: sparqlEndpoint },], });
+		alert(query)
+		try {
+
+			var listaCanti = new Set()
+			
+			listaVersi = new Set()
+			listaForme = new Set()
+			let cantica = 0;
+			bindingsStream.on('data', (binding) => {
+					//cantica
+					cantica = binding.get('Cantica').value;
+					//la lista dei canti
+					listaCanti.add(binding.get('Canto').value)
+					//la lista dei versi
+					var obj = new Object();
+					var forma=new Object()
+					obj.numverso = binding.get('NumeroVerso').value;
+					obj.verso = binding.get('Verso').value;
+					obj.canto = binding.get('Canto').value;
+					//obj.pos = binding.get('pos').value;
+					//obj.form = binding.get('textform').value;
+					obj.cantica = cantica;
+					listaVersi.add(obj)
+					forma.numverso = binding.get('NumeroVerso').value;
+					forma.canto = binding.get('Canto').value;
+					forma.pos = binding.get('pos').value;
+					forma.form = binding.get('textform').value;
+					forma.cantica = cantica;
+				   
+					listaForme.add(forma)
+				
+
+			});
+			bindingsStream.on('end', () => {
+				
+				
+
+					var orderedListaCanti = Array.from(listaCanti)
+					orderedListaCanti = orderedListaCanti.sort((a, b) => {
+						return parseInt(a.split(" ")[1], 10)-parseInt(b.split(" ")[1], 10)
+						//if (parseInt(a.split(" ")[1], 10) < parseInt(b.split(" ")[1]), 10) {
+						//	return -1;
+						//}
+					});
+					
+					var orderedListaVersi = Array.from(listaVersi)
+					
+					orderedListaVersi = orderedListaVersi.sort((a, b) => {
+						return parseInt(a.numverso, 10)-parseInt(b.numverso, 10)
+						//if (parseInt(a.numverso, 10) < parseInt(b.numverso, 10)) {
+						//	console.log(parseInt(a.numverso, 10)+' '+parseInt(b.numverso, 10))
+						//	return -1;
+						//}
+						
+					});
+					
+					
+					orderedListaVersi = orderedListaVersi.filter((value, index, self) =>
+  						index === self.findIndex((t) => (
+    					t.numverso === value.numverso && t.canto === value.canto && t.cantica===value.cantica
+  						))
+					)
+					
+					
+
+					
+					var orderedListaForme = Array.from(listaForme)
+					orderedListaForme = orderedListaForme.sort((a, b) => {
+						return parseInt(a.pos, 10)-parseInt(b.pos, 10)
+						//if (parseInt(a.pos) < parseInt(b.pos)) {
+						//	return -1;
+						//}
+						
+					});
+	
+					var divListaCanti = $('<DIV id="Canti' + cantica + '" />')
+					for (canto of orderedListaCanti) {
+						var licanto = $('<li class="navig-canto"/>')
+						licanto.attr('name', cantica + canto)
+						licanto.attr('href', "#")
+						licanto.attr("style", "line-height: 1.2em")
+						numcanto=canto.split(" ")[1]
+						licanto.append(numcanto)
+	
+						//licanto.appendTo('#listacanti')
+						licanto.appendTo(divListaCanti)
+						var divcanto = $('<div />')
+						var titolocanto = $('<h1 class="f3 titolo-canto" />')
+						titolocanto.append(cantica+", "+canto)
+						divcanto.attr('class', 'canto')
+						divcanto.attr('style', 'display:none')
+						divcanto.attr('id', (cantica + canto).replace(" ", "_"))
+						titolocanto.appendTo(divcanto)
+						divcanto.appendTo(' .blog-main')
+					}
+					//divListaCanti.appendTo('#listacanti')
+					divListaCanti.appendTo(ddmenus[cantica])
+					for (verso of orderedListaVersi) {
+						
+						
+						var elementoverso = $('<p />')
+						vartestoverso=verso.numverso;
+						elementoverso.append(verso.numverso + ". ")
+						//elementoverso.append(verso.numverso + ". " + managePunctuation(verso.verso))
+						elementoverso.attr("style", "line-height: 0.5em")
+						elementoverso.attr('class', 'f6 font-weight-lighter nowrap')
+						elementoverso.attr('id', verso.cantica+"_"+ verso.canto.replace(" ", "_")+"_"+verso.numverso)
+						elementoverso.appendTo('#' + cantica + verso.canto.replace(" ", "_"))
+						
+					}
+					
+					orderedListaForme.forEach((element) => {
+						var spanoccorrenza=$('<span />')
+						var pos=parseInt(element.pos)
+						spanoccorrenza.attr('id', element.cantica+"_"+ element.canto.replace(" ", "_")+"_"+element.numverso+"_"+pos)
+						if (listarisultati.length>0 && listarisultati.includes(spanoccorrenza.attr('id')))
+							spanoccorrenza.attr('class', "f6 b dark-blue ")
+						spanoccorrenza.append(managePunctuation(element.form))
+						elementoverso=$('#'+element.cantica+"_"+ element.canto.replace(" ", "_")+"_"+element.numverso)	
+						spanoccorrenza.appendTo(elementoverso)
+						elementoverso.append('&nbsp;')
+					})
+				
+
+
+			});
+		}
+		catch (err) {
+			console.log(err.message);
+			$("#loader").hide();
+		};
+	};
 	
 	//execute query
-	
 	var listarisultati=[];
 	async function executeQuerySearch(query) {
 		seachbBindingsStream = await myEngine.queryBindings(query, { sources: [{ type: 'sparql', value: sparqlEndpoint },], });