瀏覽代碼

Add custom pages

Alessia 2 年之前
父節點
當前提交
dbdce1576e
共有 4 個文件被更改,包括 390 次插入2 次删除
  1. 188 0
      customResults.html
  2. 11 2
      js/advanced_search.js
  3. 161 0
      js/customPages.js
  4. 30 0
      js/query/managerQuery.js

+ 188 - 0
customResults.html

@@ -0,0 +1,188 @@
+<!doctype html>
+<html>
+
+<head>
+	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
+	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+	<meta name="description" content="">
+	<meta name="author" content="">
+
+	<title>Restore - Visualizzazione Risultati</title>
+
+	<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="https://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css">
+
+	<link href="css/pages.css" rel="stylesheet">
+	<link href="css/evenTime.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.min.js"></script>
+
+	<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.4.4/leaflet.css" />
+	<script src="http://cdn.leafletjs.com/leaflet-0.4.4/leaflet.js"></script>
+
+	<link rel="stylesheet" href="js/dist/MarkerCluster.css" />
+	<link rel="stylesheet" href="js/dist/MarkerCluster.Default.css" />
+	<script src="js/dist/leaflet.markercluster-src.js"></script>
+
+	<link href="css/styles.min.css" rel="stylesheet">
+</head>
+
+<body>
+	<header class="sticky-top">
+		<nav class="navbar navbar-expand-lg navbar-light bg-white">
+			<div class="container-fluid">
+				<div class="navbar-brand">
+					<img src="img/Logo.png" width="100" alt="Restore" />
+				</div>
+				<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
+					<span class="navbar-toggler-icon"></span>
+				</button>
+				<div class="collapse navbar-collapse justify-content-end" id="navbarNavDropdown">
+					<ul class="navbar-nav">
+						<li class="nav-item">
+							<a class="nav-link" href="index.html">Home</a>
+						</li>
+						<li class="nav-item">
+							<a class="nav-link" href="http://restore.ovi.cnr.it/">Progetto</a>
+						</li>
+						<li class="nav-item active">
+							<a class="nav-link" href="ricerca.html">Ricerca</a>
+						</li>
+						<!--<li class="nav-item">
+							<a class="nav-link" href="#">Indici</a>
+						</li>
+						<li class="nav-item">
+							<a class="nav-link" href="#">Percorsi</a>
+						</li>-->
+						<li class="nav-item">
+							<a class="nav-link" href="standard.html">Standard</a>
+						</li>
+						<li class="nav-item dropdown">
+							<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Sparql</a>
+							<div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
+								<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>
+						</li>
+						<!--<li class="nav-item">
+							<a class="nav-link" href="download.html">Download</a>
+						</li>-->
+						<li class="nav-item dropdown">
+							<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink1" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Collegamenti esterni</a>
+							<div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink1">
+								<a class="dropdown-item" href="http://ckan.restore.ovi.cnr.it/" target="_blank">CKAN</a>
+								<a class="dropdown-item" href="http://dev.restore.ovi.cnr.it/lodlive/" target="_blank">LOD</a>
+							</div>
+						</li>
+					</ul>
+				</div>
+			</div>
+		</nav>
+	</header>
+
+	<main>
+		<section id="container_oggetto">
+			
+
+			<!-- Scheda -->
+			<div class="w-content section-small">
+				<div class="container-fluid">
+					<div class="col box-info">
+						<div class="container-fluid">
+							<div class="row box-info-title">
+								<div class="col">
+									<h1 id="results_title" class="box-info-main-title"></h1>
+								</div>
+							</div>
+
+                            <div class="row box-info-container container-fluid" id="res_container">
+                                <div class="col inner_results" id="results_table"></div>
+                            </div>
+								
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</section>
+	</main>
+
+	<!-- Modal -->
+	<div id="myModal" class="modal"></div>
+
+	<footer id="footer" class="footer">
+		<div class="container">
+			<div class="row">
+				<div class="col-lg-7 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="small mb-4 mb-lg-0">&copy; RESTORE 2021. All Rights Reserved.</p>
+				</div>
+				<div class="col-lg-5 h-100 text-center my-auto">
+					<ul class="partner-list 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 mr-3">
+							<a href="#">
+								<img class="img-logo" src="img/European-Union.png" />
+							</a>
+						</li>
+						<li class="list-inline-item mr-3">
+							<a href="#">
+								<img class="img-logo" src="img/RepubblicaItaliana.png" />
+							</a>
+						</li>
+						<li class="list-inline-item mr-3">
+							<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>
+
+	<script src="js/query/managerQuery.js"></script>
+	<script src="js/utilities.js"></script>
+	<script src="js/customPages.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>

+ 11 - 2
js/advanced_search.js

@@ -185,14 +185,23 @@ function populateOptions(selector, myArray) {
 			<option>Documenti diversi</option> \
 			</select>';
 		} else if (inputText == "Data") {
-			inp = '<div id="inputchoiceSelector_'+ numberId +'"><input type="date" id="start" value="1300-01-01"><input type="date" id="end" value="1300-12-31">';
-		}else {
+			var inp = '<div id="box_' + numberId + 'a" class="container_choice"><div class="choice_box"><select id ="choice_selector-' + numberId + '_a" value=' + numberId + '_a" name="sel-parent" class="advanced-form-select form-control" aria-label="Default select example"> \
+			  <option selected value="0">Da</option> \
+			  <input type="date" id="inputchoiceSelector_'+ numberId +'_a" name="start" value="1300-01-01"> \
+			</select></div></div> \
+			<div id="box_' + numberId + '_b" class="container_choice"><div class="choice_box"><select id ="choice_selector-' + numberId + '_b" value=' + numberId + '_b" name="sel-parent" class="advanced-form-select form-control" aria-label="Default select example"> \
+			  <option selected value="0">A</option> \
+			  <input type="date" id="inputchoiceSelector_'+ numberId +'_b" name="end" value="1300-12-31"> \
+			</select></div></div>';
+		} 
+		else {
 			inp = '<input type="text" id="inputchoiceSelector_'+ numberId +'" class="selected_option form-control" placeholder="Enter search terms" aria-label="Enter search terms" aria-describedby="button-addon2">';
 		
 		}
 		var sect = 'sect-' + String(numberId);
 		var inDiv = document.getElementById(sect);
 		inDiv.innerHTML = inp;
+		console.log(selector);
 		
 		
 		/*$('#inputchoiceSelector_' +  numberId).val(inputText);

+ 161 - 0
js/customPages.js

@@ -0,0 +1,161 @@
+var params = thisUrlParams.params;
+const pp = params.split("%");
+var tipo = pp[0];
+var val = pp[1];
+
+console.log([tipo, val]);
+
+prefixes = queryManager['prefixes']['all'];
+
+if ((tipo == "gettatelli") && (val == "contrassegni")) {
+	queryGettatelli = prefixes + (queryManager['queryCustom']['queryTipo']).replaceAll('{TYPE}', 'Contrassegno');
+	console.log(queryGettatelli);
+    doJsonQuery(queryGettatelli).done(function(r) { handle_contrassegni(r); });
+}
+else if (tipo == "occupazione") {
+	queryOccupazione = prefixes + (queryManager['queryCustom']['queryOccupazione']).replaceAll('{WORD}', val);
+	console.log(queryOccupazione);
+    doJsonQuery(queryOccupazione).done(function(r) { handle_occupation(r, val); });
+}
+else if (tipo == "opere") {
+	var grafo = "";
+	if (val == "Martini") {
+		grafo = "http://dev.restore.ovi.cnr.it:8890/mpp/martini";
+	}
+	else if (val == "Ospedale") {
+		grafo = "http://dev.restore.ovi.cnr.it:8890/mpp/ospedale";
+	}
+	else {
+		grafo = "http://dev.restore.ovi.cnr.it:8890/mpp/datini";
+	}
+	queryOpere = prefixes + (queryManager['queryCustom']['queryOpereGrafo']).replaceAll('{GRAPH}', grafo);
+	console.log(queryOpere);
+    doJsonQuery(queryOpere).done(function(r) { handle_artwork(r, val); });
+}
+else {
+	alert("Nessun parametro");
+}
+
+function handle_contrassegni(json){
+
+	console.log(json);
+
+	thead = '<div class="row def_res"> \
+				<div class="col">Contrassegni</div> \
+				<div class="col">Esplora</div> \
+			</div>';
+
+	var ContrassegniTable = thead;
+
+	$.each(
+		json['results']['bindings'],
+		function (index, value) {
+		  	var uri = value['subject']['value'];
+			var label = value['label']['value'];
+
+			ContrassegniTable += '<div class="row res"> \
+			<div class="col object" id="' + uri + '">' + label + '</div> \
+			<div class="col"><button title="Apri risorsa originale" class="btn btn-default" type="button" onclick="schedaASPO(\'' + uri + '\')"> \
+			<i class="fas fa-external-link-alt" aria-hidden="true"></i><p class="btn-text">Link</p></button> \
+			<button type="button" id="' + uri + 
+			'" class="object btn btn-default" alt="oggetto" title="' + label + 
+			'"><i class="fa fa-book"></i><p class="btn-text">Scheda Oggetto</p></button></div></div>' ;
+			
+
+	});
+		
+
+	document.getElementById("results_table").innerHTML = ContrassegniTable;
+	document.getElementById("results_title").innerHTML = "Contrassegni";
+		
+}
+
+function handle_occupation(json, occ) {
+	
+	thead = '<div class="row def_res"> \
+				<div class="col">Persona</div> \
+				<div class="col">Esplora</div> \
+			</div>';
+
+	var PeopleTable = thead;
+
+	$.each(
+		json['results']['bindings'],
+		function (index, value) {
+		  	var uri = value['subject']['value'];
+			var name = value['name']['value'];
+			var givenName = "";
+			var familyName = "";
+			var patronymic = "";
+			var provenienza = "";
+			var occupation = "";
+			var stringName = "";
+		
+			if(value.hasOwnProperty('givenName')) {
+				givenName = value['givenName']['value'];	
+			}
+			if(value.hasOwnProperty('familyName')) {
+				familyName = value['familyName']['value'];
+			}
+			if(value.hasOwnProperty('patronymic')) {
+				patronymic = value['patronymic']['value'];
+			}
+			if(value.hasOwnProperty('provenienza')) {
+				provenienza = value['provenienza']['value'];
+			}
+			if(value.hasOwnProperty('occupation')) {
+				occupation = value['occupation']['value'];
+			}
+			
+			if ((givenName != "") && (familyName != "")) {
+				stringName = givenName + " " + patronymic + " " + familyName + " " + provenienza;
+			} else {
+				stringName = name;
+			}
+
+			stringName = titleCase(stringName);
+
+			PeopleTable += '<div class="row res"> \
+			<div class="col persona" id="' + uri + '">' + stringName + '</div> \
+			<div class="col"><button title="Apri risorsa originale" class="btn btn-default" type="button" onclick="schedaASPO(\'' + uri + '\')"> \
+			<i class="fas fa-external-link-alt" aria-hidden="true"></i><p class="btn-text">Link</p></button> \
+			<button type="button" id="' + uri + 
+			'" class="persona btn btn-default" alt="oggetto" title="' + stringName + 
+			'"><i class="fa fa-user"></i><p class="btn-text">Persona</p></button></div></div>' ;
+
+	});
+
+	document.getElementById("results_table").innerHTML = PeopleTable;
+	document.getElementById("results_title").innerHTML = titleCase(occ);
+
+}
+
+function handle_artwork(json, gg) {
+	
+	thead = '<div class="row def_res"> \
+				<div class="col">Opera</div> \
+				<div class="col">Esplora</div> \
+			</div>';
+
+	var ArtworkTable = thead;
+
+	$.each(
+		json['results']['bindings'],
+		function (index, value) {
+		  	var uri = value['subject']['value'];
+			var label = value['label']['value'];
+			
+			ArtworkTable += '<div class="row res"> \
+			<div class="col artwork" id="' + uri + '">' + label + '</div> \
+			<div class="col"><button title="Apri risorsa originale" class="btn btn-default" type="button" onclick="schedaASPO(\'' + uri + '\')"> \
+			<i class="fas fa-external-link-alt" aria-hidden="true"></i><p class="btn-text">Link</p></button> \
+			<button type="button" id="' + uri + 
+			'" class="artwork btn btn-default" alt="oggetto" title="' + label + 
+			'"><i class="fas fa-paint-brush"></i><p class="btn-text">Opera</p></button></div></div>' ;
+
+	});
+
+	document.getElementById("results_table").innerHTML = ArtworkTable;
+	document.getElementById("results_title").innerHTML = "Collezione " + gg;
+
+}

+ 30 - 0
js/query/managerQuery.js

@@ -1092,6 +1092,36 @@ var queryManager = {
         ?uri crm:P67_refers_to ?uri_lemma . \
         ?uri_lemma rdfs:label ?lemma . \
         }"
+    },
+
+    queryCustom : {
+
+        queryTipo : " SELECT DISTINCT ?subject ?label \
+        WHERE {GRAPH ?g {?subject rdf:type crm:E22_Man-Made_Object} \
+        ?subject crm:P2_has_type '{TYPE}' ; \
+        rdfs:label ?label . \
+        }",
+
+        queryOccupazione : "SELECT DISTINCT ?subject ?name ?id ?givenName ?familyName ?patronymic ?provenienza SAMPLE(?occupation) AS ?occupation \
+        WHERE {GRAPH ?g {?subject rdf:type crm:E21_Person} \
+        ?subject foaf:name ?name . \
+        OPTIONAL {?subject crm:P1_is_identified_by ?id . \
+        ?id rdfs:label ?identifier } \
+        OPTIONAL {?subject foaf:givenName ?givenName} \
+        OPTIONAL {?subject foaf:familyName ?familyName} \
+        OPTIONAL {?subject person:patronymicName ?patronymic } \
+        OPTIONAL {?subject crm:P74_has_current_or_former_residence ?uri_provenienza . \
+        ?uri_provenienza crm:P2_has_type 'Provenienza'; \
+        rdfs:label ?provenienza . } \
+        ?subject schema:hasOccupation ?uri_occupation . \
+        ?uri_occupation rdfs:label ?occupation . \
+        ?occupation bif:contains '\"{WORD}\"' \
+        }",
+
+        queryOpereGrafo : "SELECT DISTINCT ?subject ?label \
+        WHERE {GRAPH <{GRAPH}> {?subject rdf:type crm:E22_Man-Made_Object } \
+        ?subject rdfs:label ?label} "
+
     }
 };