Pārlūkot izejas kodu

Carica file su ''

Alessia 2 gadi atpakaļ
vecāks
revīzija
3d0eaac50e
2 mainītis faili ar 787 papildinājumiem un 0 dzēšanām
  1. 444 0
      Luogo.html
  2. 343 0
      lettera.html

+ 444 - 0
Luogo.html

@@ -0,0 +1,444 @@
+<!doctype html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>MOCKY - Il mockup di RESTORE</title>
+<link href="Untitled1.css" rel="stylesheet">
+<link href="index.css" rel="stylesheet">
+<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
+<link href="vendor/fontawesome-free/css/all.min.css" rel="stylesheet">
+<link href="vendor/simple-line-icons/css/simple-line-icons.css" rel="stylesheet" type="text/css">
+<link href="css/place_people.css" rel="stylesheet">
+<link href="css/datafilter.css" rel="stylesheet">
+<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
+<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.min.js"></script>
+<script src="https://d3js.org/d3.v4.js"></script>
+
+<link rel="shortcut icon" type="image/x-icon" href="docs/images/favicon.ico" />
+
+    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A==" crossorigin=""/>
+    <script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js" integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA==" crossorigin=""></script>
+
+</head>
+<body>
+
+	<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
+	  <div class="container-fluid">
+	    <img src="img/Logo.png" style="width:100px;">
+	    <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
+	      <span class="navbar-toggler-icon"></span>
+	    </button>
+	    <div class="navbar-nav" style="margin-left:auto;">
+	        <a class="button-link" href="index.html"><button class="btn btn-menu" type="button">Home</button></a>
+	        <a class="button-link" href="http://restore.ovi.cnr.it/"><button class="btn btn-menu" type="button">Progetto</button></a>
+	        <a class="button-link" href="ricerca.html"><button class="btn btn-menu" type="button">Ricerca</button></a>
+	        <a class="button-link" href="#"><button class="btn btn-menu" type="button">Indici</button></a>
+	        <a class="button-link" href="#"><button class="btn btn-menu" type="button">Percorsi</button></a>
+	        <a class="button-link" href="standard.html"><button class="btn btn-menu" type="button">Standard</button></a>
+	        <div class="dropdown">
+	          <button class="btn btn-menu dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Sparql
+	          </button>
+	          <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+	            <a class="dropdown-item" href="http://dev.restore.ovi.cnr.it:8890/sparql/">Endpoint Sparql</a>
+	            <a class="dropdown-item" href="sparql.html">Query</a>
+	          </div>
+	        </div>
+	        <a class="button-link" href="download.html"><button class="btn btn-menu" type="button">Download</button></a>
+	        <div class="dropdown">
+	          <button class="btn btn-menu dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Collegamenti esterni
+	          </button>
+	          <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+	            <a class="dropdown-item" href="http://ckan.restore.ovi.cnr.it/">CKAN</a>
+	            <a class="dropdown-item" href="http://dev.restore.ovi.cnr.it/lodlive/">LOD</a>
+	          </div>
+	        </div>
+	      </div>
+	  </div>
+	</nav>
+
+	<div id="container_luogo">
+
+		<div class="row" id="col_graph">
+		    <div class="col-2">
+		      dataset: 
+		    </div>  
+		    <div class="col-10" id="grafo"></div>
+		</div>
+
+
+		<div class="row">
+		    <div class="col"> <h2 id="nome_luogo"></h2>
+		      
+		    </div>  
+		 </div>
+
+		 <div class="row btn-group" id="map_buttons">
+		 	<button type="button" id="btn_info" class="btn btn-outline-dark" onClick="open_info();">Info</button>
+		 	<button type="button" id="btn_toponimi" class="btn btn-outline-dark" onClick="open_toponimi();">Toponimi associati</button>
+		 	<button type="button" id="btn_riferimenti" class="btn btn-outline-dark"onClick="open_riferimenti();">Riferimenti</button>
+		 	<button type="button" id="btn_dettagli" class="btn btn-outline-dark">Dettagli</button>
+		 </div>
+
+		<div class="row" id="geo_info">
+
+			<div class=col-4 id="info_luogo">
+				<div class="box_info" id="place_info">
+					<p style="width:100%;" class="head_box"><b>Informazioni</b></p>
+					<div class="row">
+					 	<div class="ind" class="col-4">
+					      <b>Place id:</b>
+					    </div>
+					    <div class="col-8" id="aspo_id">
+					       
+					    </div>  
+					 </div>
+
+					 <div class="row">
+					 	<div class="ind" class="col-4">
+					      <b>Varianti nome:</b>
+					    </div>
+					    <div class="col-8" id="variants">
+					       
+					    </div>  
+					 </div>
+
+					 <div class="row">
+					 	<div class="ind" class="col-4">
+					      <b>Altre indicazioni geografiche (da definire):</b>
+					    </div>
+					    <div class="col-8" id="other">
+					       
+					    </div>  
+					 </div>
+
+					 <div class="row">
+					 	<div class="ind" class="col-4">
+					      <b>Note:</b> 
+					    </div>
+					    <div class="col-8" id="note">
+					      
+					    </div>  
+					 </div>
+				</div>
+
+				<div class="box_info" id="topo">
+					<div class="row">
+					      <p style="width:100%;" class="head_box"><b>Toponimi associati</b></p>
+					    <div class="row" id="toponimi">
+					       
+					    </div>  
+			 		</div>
+				</div>
+
+				<div class="box_info" id="rif">
+					<div class="row">
+						<div class="col">
+					      <p style="width:100%;" class="head_box"><b>Links</b></p>
+						</div>
+					</div>
+					<div class="row">
+						 <div class="col" id="riferimenti">
+						       
+						 </div> 
+					</div> 
+				</div>
+
+
+			</div>
+
+			<div class="col" id="place_map">
+				<div id="map"></div>
+			</div>
+		</div>
+	</div>
+
+	<!-- NEW CODE HERE Added function on Associazioni button-->
+
+	<div id="container_references">
+		<div class="row btn-group" id="ref_buttons" role="group">
+			<button type="button" id="btn_collegamenti" class="btn btn-outline-dark active" onClick="open_collegamenti();">Collegamenti</button>
+			<button type="button" id="btn_statistiche" class="btn btn-outline-dark" onClick="open_statistiche();">Statistiche</button>
+			<button type="button" id="btn_correlazioni" class="btn btn-outline-dark" onClick="open_correlazioni();">Associazioni</button>
+		</div>
+
+	<!-- END NEW CODE -->
+
+		<div class="row" id="references">
+			
+				<div class="box_results" id="sent">
+			    	<div class="inner_results left">
+				    	<div class="def_res">
+				    		<p><b>Oggetti realizzati a <span id="nome_lu"></span> (<span id="n_send"></span> risultati)</b></p>
+				    	</div>
+				    	<div class="results_rows" id="object_send">
+				    	</div>
+				    </div>
+			    </div>
+		    
+			    <div class="box_results" id="receive">
+			    	<div class="inner_results right">
+				    	<div class="def_res">
+				    		<p><b>Oggetti arrivati a <span id="nome_lp"></span> (<span id="n_receive"></span> risultati)</b></p>
+				    	</div>
+				    	<div class="results_rows" id="object_receive">
+				    	</div>
+			    	</div>
+			    </div>
+
+			    <div class="box_results" id="citations">
+			    	<div class="inner_results left">
+				    	<div class="def_res">
+				    		<p><b>Documenti con citazione di <span id="nome_ll"></span> (<span id="n_cit"></span> risultati)</b></p>
+				    	</div>
+				    	<div class="results_rows" id="object_cit">
+				    	</div>
+				    </div>
+			    </div>
+
+			    <div class="box_results" id="ref_people">
+			    	<div class="inner_results right">
+				    	<div class="def_res">
+				    		<p><b>Persone collegate a <span id="nome_lg"></span> (<span id="n_per"></span> risultati)</b></p>
+				    	</div>
+				    	<div class="results_rows" id="object_per">
+				    	</div>
+				    </div>
+			    </div>
+			</div>
+
+			<div class="row" id="statistiche">
+			
+			    <div class="box_results" id="stat1">
+			    	<div class="inner_results left">
+				    	<div class="def_res">
+				    		<p>Luoghi di partenza degli oggetti in arrivo a <span id="nome_st1"></span> con numero di documenti</p>
+				    	</div>
+				    	<div id="my_dataviz">
+				    	</div>
+				    </div>
+			    </div>
+
+			    <div class="box_results" id="stat2">
+			    	<div class="inner_results right">
+				    	<div class="def_res">
+				    		<p>Luoghi di arrivo degli oggetti in partenza da <span id="nome_st2"></span> con numero di documenti</p>
+				    	</div>
+				    	<div id="my_dataviz2">
+				    	</div>
+				    </div>
+			    </div>
+			
+
+		</div>
+
+		<!-- NEW CODE HERE -->
+
+		<div class="row" id="regole_associazione" style="display:none;">
+			
+			    <div class="box_results" id="assoc2">
+			    	<div class="inner_results right">
+				    	<div class="def_res">
+				    		<p>Supporto e confidenza per <span id="nome_ass2"></span> e lemmi associati</p>
+				    	</div>
+				    	<div class="results_rows" id="my_supportList2">
+				    	</div>
+				    </div>
+					</div>
+
+			    <div class="box_results" id="assoc1">
+			    	<div class="inner_results left">
+				    	<div class="def_res">
+				    		<p>Supporto e confidenza per <span id="nome_ass1"></span> e antroponimi associati</p>
+				    	</div>
+				    	<div class="results_rows" id="my_supportList">
+				    	</div>
+				    </div>
+			    </div>
+
+		</div>
+
+
+		<div id="FrequenzaModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+		 <div class="modal-dialog">
+		    <div class="modal-content">
+		      <div class="modal-header">
+		      	<h4 class="modal-title" id="myModalLabel">Frequenza assoluta</h4>
+		        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;  </button>
+		      </div>
+		      <div class="modal-body">
+		        <p>La <b>frequenza assoluta</b> è il numero di volte in cui si verifica un evento in un'indagine statistica, quindi il numero di occorrenze dell'evento stesso all'interno del dataset di riferimento.</p>
+		      </div>
+		    </div>
+		  </div>
+		</div>
+
+
+		<div id="ProbabilityModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+		 <div class="modal-dialog">
+		    <div class="modal-content">
+		      <div class="modal-header">
+		      	<h4 class="modal-title" id="myModalLabel">Probabilità di un evento</h4>
+		        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;  </button>
+		      </div>
+		      <div class="modal-body">
+		        <p>La <b>probabilità</b> di un evento singolo è la probabilità che esso si verifichi in un determinato contesto formato dal dataset. La <b>probabilità</b> è data dal rapporto tra la frequenza assoluta dell'evento e la totalità del dataset.
+		      </div>
+		    </div>
+		  </div>
+		</div>
+
+
+		<div id="SupportCountModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+		 <div class="modal-dialog">
+		    <div class="modal-content">
+		      <div class="modal-header">
+		      	<h4 class="modal-title" id="myModalLabel">Support Count (&#x03c3;)</h4>
+		        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;  </button>
+		      </div>
+		      <div class="modal-body">
+		        <p>Il <b>Support Count</b> è la frequenza di un'occorrenza nel dataset. Si tratta del numero di volte in cui il luogo selezionato appare insieme al parametro descritto in ciascuna riga</p>
+		      </div>
+		    </div>
+		  </div>
+		</div>
+
+
+		<div id="SupportModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+		 <div class="modal-dialog">
+		    <div class="modal-content">
+		      <div class="modal-header">
+		      	<h4 class="modal-title" id="myModalLabel">Supporto</h4>
+		        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;  </button>
+		      </div>
+		      <div class="modal-body">
+		        <p>Il <b>supporto</b> indica la frequenza della regola all'interno di una serie di associazioni. Un valore alto significa che la regola viene applicata ad ampia parte del database. Il <b>supporto</b> è dato dal rapporto tra la frequenza della regola e la totalità del dataset.</p>
+		      </div>
+		    </div>
+		  </div>
+		</div>
+
+
+		<div id="ConfidenzaModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+		 <div class="modal-dialog">
+		    <div class="modal-content">
+		      <div class="modal-header">
+		      	<h4 class="modal-title" id="myModalLabel">Confidenza</h4>
+		        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;  </button>
+		      </div>
+		      <div class="modal-body">
+		        <p>La <b>confidenza</b> indica la percentuale di eventi che riguardano A contemporaneamente a B. Si tratta di una stima della probabilità condizionata. La <b>confidenza</b> è data dal rapporto tra la frequenza della comparsa di A e B nello stesso contesto e la frequenza assoluta di comparsa di B (o A a seconda del parametro di confronto)</p> 
+		      </div>
+		    </div>
+		  </div>
+		</div>
+
+
+		<div id="InteresseModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+		 <div class="modal-dialog">
+		    <div class="modal-content">
+		      <div class="modal-header">
+		      	<h4 class="modal-title" id="myModalLabel">Interesse</h4>
+		        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;  </button>
+		      </div>
+		      <div class="modal-body">
+		        <p>L'<b>interesse</b> esprime una misura della correlazione. L'<b>interesse</b> è dato dal rapporto tra la probabilità che A e B si verifichino insieme e la probabilità di A unita alla probabilità di B. Il risultato aiuta a capire se due eventi sono correlati positivamente, negativamente o sono indipendenti.<br />
+		        <b>Interesse</b> = P(A and B) / P(A)*P(B)</p>
+		      </div>
+		    </div>
+		  </div>
+		</div>
+
+		<div id="CorrelazioneModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+		 <div class="modal-dialog">
+		    <div class="modal-content">
+		      <div class="modal-header">
+		      	<h4 class="modal-title" id="myModalLabel">Correlazione</h4>
+		        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;  </button>
+		      </div>
+		      <div class="modal-body">
+		        <p>La <b>correlazione</b> esprime la relazione tra due variabili. In questo caso la correlazione è basata sull'interesse. I casi che possono verificarsi sono i seguenti: 
+		        	<ul>
+		        		<li><b>Indipendenza</b> (Interesse = 1) &#8594; A e B sono statisticamente indipendenti. La probabilità del verificarsi di A non inficia la probabilità di verificarsi di B.</li>
+		        		<li><b>Negativa</b> (Interesse < 1) &#8594; A e B sono correlati negativamente. Se si verifica A la probabilità di verificarsi di B scende</li>
+		        		<li><b>Positiva</b> (Interesse > 1) &#8594; A e B sono correlati positivamente. Se si verifica A probabilmente si verificherà anche B.</li>
+		        	</ul>
+		        </p>
+		      </div>
+		    </div>
+		  </div>
+		</div>
+
+		<!-- END NEW CODE -->
+
+	</div>
+
+
+<div id="footer">
+    <footer class="footer bg-dark">
+    <div class="container">
+      <div class="row">
+        <div class="col-lg-6 h-100 text-center text-lg-left my-auto">
+          <ul class="list-inline mb-2">
+            <li class="list-inline-item">
+              <a href="#">About</a>
+            </li>
+            <li class="list-inline-item">&sdot;</li>
+            <li class="list-inline-item">
+              <a href="#">Contact</a>
+            </li>
+            <li class="list-inline-item">&sdot;</li>
+            <li class="list-inline-item">
+              <a href="#">Terms of Use</a>
+            </li>
+            <li class="list-inline-item">&sdot;</li>
+            <li class="list-inline-item">
+              <a href="#">Privacy Policy</a>
+            </li>
+          </ul>
+          <p class="text-muted small mb-4 mb-lg-0">&copy; RESTORE 2021. All Rights Reserved.</p>
+        </div>
+        <div class="col-lg-6 h-100 text-center text-lg-right my-auto">
+          <ul class="list-inline mb-0">
+            <li class="list-inline-item mr-3">
+              <a href="#">
+                <img class="img-logo" src="img/CNR.png" />
+              </a>
+            </li>
+            <li class="list-inline-item mr-3">
+              <a href="#">
+                <img class="img-logo" src="img/RegioneToscana.jpg" />
+              </a>
+            </li>
+            <li class="list-inline-item">
+              <a href="#">
+                <img class="img-logo" src="img/European-Union.png" />
+              </a>
+            </li>
+			<li class="list-inline-item">
+              <a href="#">
+                <img class="img-logo" src="img/RepubblicaItaliana.png" />
+              </a>
+            </li>
+			<li class="list-inline-item">
+              <a href="#">
+                <img class="img-logo" src="img/POR-FSE-Regione-Toscana.png" />
+              </a>
+            </li>
+			<li class="list-inline-item">
+              <a href="#">
+                <img class="img-logo" src="img/GiovaniSi.png" />
+              </a>
+            </li>
+          </ul>
+        </div>
+      </div>
+    </div>
+  </footer>
+</div>
+<script src="js\map.js"></script>
+<!--<script src="js\association.js"></script>-->
+<!-- Bootstrap core JavaScript -->
+  <script src="vendor/jquery/jquery.min.js"></script>
+  <script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
+</body>
+</html>

+ 343 - 0
lettera.html

@@ -0,0 +1,343 @@
+<!doctype html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>MOCKY - Il mockup di RESTORE</title>
+<link href="Untitled1.css" rel="stylesheet">
+<link href="index.css" rel="stylesheet">
+<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
+<link href="vendor/fontawesome-free/css/all.min.css" rel="stylesheet">
+<link href="vendor/simple-line-icons/css/simple-line-icons.css" rel="stylesheet" type="text/css">
+<link href="css/lettera.css" rel="stylesheet">
+<link href="css/datafilter.css" rel="stylesheet">
+<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
+<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.min.js"></script>
+<script src="js/lettera_query.js"></script>
+
+
+</head>
+<body>
+
+	<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
+	  <div class="container-fluid">
+	    <img src="img/Logo.png" style="width:100px;">
+	    <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
+	      <span class="navbar-toggler-icon"></span>
+	    </button>
+	    <div class="navbar-nav" style="margin-left:auto;">
+	        <a class="button-link" href="index.html"><button class="btn btn-menu" type="button">Home</button></a>
+	        <a class="button-link" href="http://restore.ovi.cnr.it/"><button class="btn btn-menu" type="button">Progetto</button></a>
+	        <a class="button-link" href="ricerca.html"><button class="btn btn-menu" type="button">Ricerca</button></a>
+	        <a class="button-link" href="#"><button class="btn btn-menu" type="button">Indici</button></a>
+	        <a class="button-link" href="#"><button class="btn btn-menu" type="button">Percorsi</button></a>
+	        <a class="button-link" href="standard.html"><button class="btn btn-menu" type="button">Standard</button></a>
+	        <div class="dropdown">
+	          <button class="btn btn-menu dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Sparql
+	          </button>
+	          <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+	            <a class="dropdown-item" href="http://dev.restore.ovi.cnr.it:8890/sparql/">Endpoint Sparql</a>
+	            <a class="dropdown-item" href="sparql.html">Query</a>
+	          </div>
+	        </div>
+	        <a class="button-link" href="download.html"><button class="btn btn-menu" type="button">Download</button></a>
+	        <div class="dropdown">
+	          <button class="btn btn-menu dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Collegamenti esterni
+	          </button>
+	          <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+	            <a class="dropdown-item" href="http://ckan.restore.ovi.cnr.it/">CKAN</a>
+	            <a class="dropdown-item" href="http://dev.restore.ovi.cnr.it/lodlive/">LOD</a>
+	          </div>
+	        </div>
+	      </div>
+	  </div>
+	</nav>
+
+<div id="title">
+</div>
+
+<div class = "row" id="container_lettera">
+  <div class = "col-5 container">
+  	<div class="row headInfo">
+  		<div class="col" id="infoBox"> 
+	  			Informazioni
+	  	</div>
+  	</div>
+  	
+		<div class="row btn-group" id="choice_buttons" role="group">
+  		<div class="col infoChoice"> 
+	  			<button type="button" class="btn btn-outline-secondary active" onClick="show_OVI()">OVI</button>
+	  	</div>
+	  	<div class="col infoChoice"> 
+	  			<button type="button" class="btn btn-outline-secondary" onClick="show_ASPO()">ASPO</button>
+	  	</div>
+	  </div>
+		  
+  	<div class="row">
+  		<div class="col" id="info_lettera">
+  			<div id="OVI_info">
+				  	<div class="row">
+				  		<div class="col">
+				  			Mittente: 
+				  		</div>
+						<div id="mittente_id" class="col-6"></div>
+						<div id="mittente_btn" class="col-2"></div>
+				  	</div>
+				  	<div class="row">
+				  		<div class="col">
+				  			Destinatario: 
+				  		</div>
+						<div id="destinatario_id" class="col-6"></div>
+						<div id="destinatario_btn" class="col-2"></div>
+				  	</div>
+				  	<div class="row">
+				  		<div class="col">
+				  			Descrizione: 
+				  		</div>
+				  		<div id="descrizione_id" class="col-8"></div>
+				  	</div>
+				  	<div class="row">
+				  		<div class="col">
+				  			Luogo di partenza: 
+				  		</div>
+						<div id="luogo_partenza_id" class="col-6"></div>
+						<div id="luogo_partenza_btn" class="col-2"></div>
+				  	</div>
+				  	<div class="row">
+				  		<div class="col">
+				  			Luogo di arrivo: 
+				  		</div>
+						<div id="luogo_arrivo_id" class="col-6"></div>
+						<div id="luogo_arrivo_btn" class="col-2"></div>
+					</div>
+				  	<div class="row">
+				  		<div class="col">
+				  			Data di partenza: 
+				  		</div>
+				  		<div id="data_partenza_id" class="col-8"></div>
+				  	</div>
+				  	<div class="row">
+				  		<div class="col">
+				  			Data di arrivo: 
+				  		</div>
+				  		<div id="data_arrivo_id" class="col-8"></div>
+				  	</div>
+				  	<div class="row">
+				  		<div class="col">
+				  			Sigla OVI: 
+				  		</div>
+				  		<div id="sigla_OVI" class="col-8"></div>
+				  	</div>
+				  	<div class="row">
+				  		<div class="col">
+				  			Segnatura: 
+				  		</div>
+						<div id="segnatura_id" class="col-6"></div>
+						<div id="segnatura_btn" class="col-2"></div>
+				  	</div>
+				  	<div class="row">
+				  		<div class="col">
+				  			Lingua: 
+				  		</div>
+				  		<div id="lingua_id" class="col-8"></div>
+				  	</div>
+				  	<div class="row">
+				  		<div class="col">
+				  			Area linguistica: 
+				  		</div>
+				  		<div id="area_linguistica_id" class="col-8"></div>
+				  	</div>
+				  	<div class="row">
+				  		<div class="col">
+				  			Edizione: 
+				  		</div>
+						<div id="edizione_id" class="col-6"></div>
+						<div id="edizione_btn" class="col-2"></div>
+				  	</div>
+				  </div>
+
+				  <div id="ASPO_info" style="display:none;">
+				  	<div class="row">
+				  		<div class="col">
+				  			Mittente: 
+				  		</div>
+						<div id="mittente_id_ASPO" class="col-6"></div>
+						<div id="mittente_btn_ASPO" class="col-2"></div>
+				  	</div>
+				  	<div class="row">
+				  		<div class="col">
+				  			Destinatario: 
+				  		</div>
+						<div id="destinatario_id_ASPO" class="col-6"></div>
+						<div id="destinatario_btn_ASPO" class="col-2"></div>
+				  	</div>
+				  	<div class="row">
+				  		<div class="col">
+				  			Luogo di partenza: 
+				  		</div>
+						<div id="luogo_partenza_id_ASPO" class="col-6"></div>
+						<div id="luogo_partenza_btn_ASPO" class="col-2"></div>
+				  	</div>
+				  	<div class="row">
+				  		<div class="col">
+				  			Luogo di arrivo: 
+				  		</div>
+						<div id="luogo_arrivo_id_ASPO" class="col-6"></div>
+						<div id="luogo_arrivo_btn_ASPO" class="col-2"></div>
+					</div>
+				  	<div class="row">
+				  		<div class="col">
+				  			Data di partenza: 
+				  		</div>
+				  		<div id="data_partenza_id_ASPO" class="col-8"></div>
+				  	</div>
+				  	<div class="row">
+				  		<div class="col">
+				  			Data di arrivo: 
+				  		</div>
+				  		<div id="data_arrivo_id_ASPO" class="col-8"></div>
+				  	</div>
+				  	<div class="row">
+				  		<div class="col">
+				  			Segnatura: 
+				  		</div>
+						<div id="segnatura_id_ASPO" class="col-8"></div>
+				  	</div>
+				  	<div class="row">
+				  		<div class="col">
+				  			Materiale: 
+				  		</div>
+						<div id="consistenzaASPO" class="col-8"></div>
+				  	</div>
+				  	<div class="row">
+				  		<div class="col">
+				  			Dimensione: 
+				  		</div>
+						<div id="dimensioneASPO" class="col-8"></div>
+				  	</div>
+				  	<div class="row">
+				  		<div class="col">
+				  			Ente responsabile: 
+				  		</div>
+						<div id="ownerASPO" class="col-8"></div>
+				  	</div>
+				  </div>
+
+			  </div>
+			</div>
+  </div>
+
+  <div class = "col container" id="info_trascrizione">
+  		<div class="row" id="head_trascrizione">
+	  		<div class="col box_title" id="trascrizione_titolo"> 
+	  			Trascrizione
+	  		</div>
+	  	</div>
+  		<div class="row">
+	  		<div class="col" id="trascrizione_id"> 
+	  		</div>
+	  	</div>
+	  	<div class="row align-items-center" id="row_evt">
+	  		<div id="evt_button" class="col" style="text-align:center;">
+	  			
+	  		</div>
+	  		<div class="col" style="text-align:center;">
+	  			<button type="button" class="btn btn-secondary" onclick="loadPageLOD()">Button LOD</button> 
+	  		</div>
+	  	</div>
+	  	<div class="row" id="row_pl">
+	  		<div class="col" id="col_antroponimi">
+	  			<p>Antroponimi</p>
+	  			<ul id="antroponimi">
+	  			</ul>
+	  		</div>
+	  		<div class="col" id="col_toponimi">
+	  			<p>Toponimi</p>
+	  			<ul id="toponimi">
+	  			</ul>
+	  		</div>
+	  	</div>
+  </div>
+</div>
+
+<!-- Modal -->
+<div id="myModal" class="modal">
+
+</div>
+
+
+<div class="row" id="form_aspo">
+	<div id="imageASPO" class="col">
+		<!--<embed id="imageEmb" src="http://datini.archiviodistato.prato.it/la-ricerca/imageView/ASPO00000277/">-->
+	</div>
+</div>
+
+
+<div id="footer">
+    <footer class="footer bg-dark">
+    <div class="container">
+      <div class="row">
+        <div class="col-lg-6 h-100 text-center text-lg-left my-auto">
+          <ul class="list-inline mb-2">
+            <li class="list-inline-item">
+              <a href="#">About</a>
+            </li>
+            <li class="list-inline-item">&sdot;</li>
+            <li class="list-inline-item">
+              <a href="#">Contact</a>
+            </li>
+            <li class="list-inline-item">&sdot;</li>
+            <li class="list-inline-item">
+              <a href="#">Terms of Use</a>
+            </li>
+            <li class="list-inline-item">&sdot;</li>
+            <li class="list-inline-item">
+              <a href="#">Privacy Policy</a>
+            </li>
+          </ul>
+          <p class="text-muted small mb-4 mb-lg-0">&copy; RESTORE 2021. All Rights Reserved.</p>
+        </div>
+        <div class="col-lg-6 h-100 text-center text-lg-right my-auto">
+          <ul class="list-inline mb-0">
+            <li class="list-inline-item mr-3">
+              <a href="#">
+                <img class="img-logo" src="img/CNR.png" />
+              </a>
+            </li>
+            <li class="list-inline-item mr-3">
+              <a href="#">
+                <img class="img-logo" src="img/RegioneToscana.jpg" />
+              </a>
+            </li>
+            <li class="list-inline-item">
+              <a href="#">
+                <img class="img-logo" src="img/European-Union.png" />
+              </a>
+            </li>
+			<li class="list-inline-item">
+              <a href="#">
+                <img class="img-logo" src="img/RepubblicaItaliana.png" />
+              </a>
+            </li>
+			<li class="list-inline-item">
+              <a href="#">
+                <img class="img-logo" src="img/POR-FSE-Regione-Toscana.png" />
+              </a>
+            </li>
+			<li class="list-inline-item">
+              <a href="#">
+                <img class="img-logo" src="img/GiovaniSi.png" />
+              </a>
+            </li>
+          </ul>
+        </div>
+      </div>
+    </div>
+  </footer>
+</div>
+<script src="js\lettera.js"></script>
+<!-- Bootstrap core JavaScript -->
+  <script src="vendor/jquery/jquery.min.js"></script>
+  <script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
+
+</body>
+</html>