Customizzazione UI SPARQL (in progress)
This commit is contained in:
cesare
parent
fc2e887890
commit
e169fbc2e2
|
|
@ -1,23 +1,30 @@
|
||||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||||
<head>
|
<head>
|
||||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/css/bootstrap4-toggle.min.css">
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/css/bootstrap4-toggle.min.css"/>
|
||||||
<link rel="stylesheet" href="https://code.jquery.com/ui/1.13.1/themes/base/jquery-ui.css">
|
<link rel="stylesheet" href="https://code.jquery.com/ui/1.13.1/themes/base/jquery-ui.css"/>
|
||||||
<link rel="stylesheet" id="style2-Boot" href="../css/bootstrap.min.lida2.css">
|
<link rel="stylesheet" id="style2-Boot"
|
||||||
<link rel="stylesheet" id="style2-Custom" href="../css/custom2_4.3.css">
|
href="../css/bootstrap.min.lida2.css">
|
||||||
<link rel="stylesheet" href="../css/collapsemod.css">
|
<link rel="stylesheet" id="style2-Custom"
|
||||||
|
href="../css/custom2_4.3.css">
|
||||||
|
<link rel="stylesheet" href="../css/collapsemod.css">
|
||||||
|
|
||||||
<link href="yasgui.mio.css" rel="stylesheet" type="text/css" />
|
<link href="yasgui.mio.css" rel="stylesheet" type="text/css" />
|
||||||
|
|
||||||
<script src="https://code.jquery.com/jquery-3.6.0.js"></script>
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js"
|
|
||||||
integrity="sha384-fQybjgWLrvvRgtW6bFlB7jaZrFsaBXjsOMm/tB9LTS58ONXgqbR9W8oWht/amnpF"
|
|
||||||
crossorigin="anonymous"></script>
|
|
||||||
<script src="https://code.jquery.com/ui/1.13.1/jquery-ui.js" defer></script>
|
|
||||||
<script src="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/js/bootstrap4-toggle.min.js"></script>
|
|
||||||
<script src="yasgui.min.js"></script>
|
|
||||||
|
|
||||||
|
<script src="https://code.jquery.com/jquery-3.6.0.js"></script>
|
||||||
|
<script
|
||||||
|
src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js"
|
||||||
|
integrity="sha384-fQybjgWLrvvRgtW6bFlB7jaZrFsaBXjsOMm/tB9LTS58ONXgqbR9W8oWht/amnpF"
|
||||||
|
crossorigin="anonymous"></script>
|
||||||
|
<script src="https://code.jquery.com/ui/1.13.1/jquery-ui.js" defer></script>
|
||||||
|
<script
|
||||||
|
src="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/js/bootstrap4-toggle.min.js"></script>
|
||||||
|
<script src="yasgui.min.js"></script>
|
||||||
|
<style>
|
||||||
|
.yasgui .autocompleteWrapper {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body class="body-vis">
|
<body class="body-vis">
|
||||||
|
|
||||||
|
|
@ -25,32 +32,30 @@
|
||||||
<div>
|
<div>
|
||||||
<nav
|
<nav
|
||||||
class="navbar border navbar-expand-lg navbar-light bg-light justify-content-between fixed-top">
|
class="navbar border navbar-expand-lg navbar-light bg-light justify-content-between fixed-top">
|
||||||
<button class="navbar-toggler" type="button" data-toggle="collapse"
|
<button class="navbar-toggler" type="button" data-toggle="collapse"
|
||||||
data-target="#bs-example-navbar-collapse-1"
|
data-target="#bs-example-navbar-collapse-1"
|
||||||
aria-controls="bs-example-navbar-collapse-1" aria-expanded="false"
|
aria-controls="bs-example-navbar-collapse-1" aria-expanded="false"
|
||||||
aria-label="Toggle navigation">
|
aria-label="Toggle navigation">
|
||||||
<span class="navbar-toggler-icon"></span>
|
<span class="navbar-toggler-icon"></span>
|
||||||
</button>
|
</button>
|
||||||
<a class="navbar-brand font-weight-bold" href="#">LiDa</a>
|
<a class="navbar-brand font-weight-bold" href="#">LiDa</a>
|
||||||
<div class="collapse navbar-collapse"
|
<div class="collapse navbar-collapse"
|
||||||
id="bs-example-navbar-collapse-1">
|
id="bs-example-navbar-collapse-1">
|
||||||
<ul class="navbar-nav">
|
<ul class="navbar-nav">
|
||||||
<li class="nav-item">
|
<li class="nav-item"><a class="nav-link disabled" href="#">
|
||||||
<a class="nav-link disabled" href="#"> - SPARQL query editor - </a>
|
- SPARQL query editor - </a></li>
|
||||||
</li>
|
</ul>
|
||||||
</ul>
|
<ul class="navbar-nav ml-md-auto">
|
||||||
<ul class="navbar-nav ml-md-auto">
|
<li class="nav-item dropdown pt-1"><a
|
||||||
<li class="nav-item dropdown pt-1">
|
class="nav-link dropdown-toggle" href="#" id="navbarDropdown"
|
||||||
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
role="button" data-toggle="dropdown" aria-haspopup="true"
|
||||||
Info
|
aria-expanded="false"> Info </a>
|
||||||
</a>
|
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
|
||||||
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
|
<a class="dropdown-item disabled" href="#" id="visAiuto">Aiuto</a>
|
||||||
<a class="dropdown-item disabled" href="#" id="visAiuto">Aiuto</a>
|
<a class="dropdown-item" href="#" id="visAbout">About</a>
|
||||||
<a class="dropdown-item" href="#" id="visAbout">About</a>
|
</div></li>
|
||||||
</div>
|
</ul>
|
||||||
</li>
|
</div>
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
</nav>
|
</nav>
|
||||||
|
|
@ -59,9 +64,46 @@
|
||||||
<div id="rigaContenuti" class="row no-gutters">
|
<div id="rigaContenuti" class="row no-gutters">
|
||||||
|
|
||||||
<div class="d-table w-100 tableMain">
|
<div class="d-table w-100 tableMain">
|
||||||
<div id="colVisualizza" class="d-table-cell tableVis bg-lida-vis border-right border-bottom border-left align-top">
|
<div id="colVisualizza"
|
||||||
|
class="d-table-cell tableVis bg-lida-vis border-right border-bottom border-left align-top">
|
||||||
<div class="distanziatore"> </div>
|
<div class="distanziatore"> </div>
|
||||||
<div id="yasgui"></div>
|
<div id="yasgui"></div>
|
||||||
|
<script>
|
||||||
|
const defaultQuery=
|
||||||
|
`# ESEMPIO: i periodi della Commedia con una frase con funzione sintattica 'Subordinata Causale'
|
||||||
|
|
||||||
|
PREFIX ecrm: <http://erlangen-crm.org/current/>
|
||||||
|
PREFIX syntit: <https://dantenetwork.it/ontology/syntit/current/>
|
||||||
|
PREFIX olires: <https://dantenetwork.it/ontology/olires/current/>
|
||||||
|
SELECT ?Cantica ?Canto ?Periodo ?FraseSubordinata
|
||||||
|
WHERE {
|
||||||
|
?cl syntit:hasClauseType syntit:Causale ;
|
||||||
|
ecrm:P190_has_symbolic_content ?FraseSubordinata .
|
||||||
|
?sentence a syntit:Sentence ;
|
||||||
|
syntit:hasSyntacticalComponent ?cl;
|
||||||
|
ecrm:P190_has_symbolic_content ?Periodo ;
|
||||||
|
ecrm:P148i_is_component_of ?q_canto.
|
||||||
|
?q_canto ecrm:P102_has_title ?Canto .
|
||||||
|
?cantica ecrm:P102_has_title ?Cantica;
|
||||||
|
olires:hasStructuralComponent ?q_canto.
|
||||||
|
} order by ?Cantica ?Canto
|
||||||
|
`
|
||||||
|
const yasgui = new Yasgui(
|
||||||
|
document.getElementById("yasgui"),
|
||||||
|
{
|
||||||
|
yasqe : {
|
||||||
|
value: defaultQuery
|
||||||
|
},
|
||||||
|
requestConfig : {
|
||||||
|
endpoint : "https://hdnlab1.isti.cnr.it/fuseki/commedia/query"
|
||||||
|
},
|
||||||
|
copyEndpointOnNewTab : false,
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
console.log(yasgui.config);
|
||||||
|
|
||||||
|
</script>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -70,13 +112,8 @@
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div id="yasgui"></div>
|
<!-- <div id="yasgui"></div> -->
|
||||||
<script>
|
|
||||||
const yasgui = new Yasgui(document.getElementById("yasgui"), {
|
|
||||||
requestConfig: { endpoint: "https://hdnlab1.isti.cnr.it/fuseki/commedia/query" },
|
|
||||||
copyEndpointOnNewTab: false,
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue