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">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<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://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-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 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" id="style2-Boot"
|
||||
href="../css/bootstrap.min.lida2.css">
|
||||
<link rel="stylesheet" id="style2-Custom"
|
||||
href="../css/custom2_4.3.css">
|
||||
<link rel="stylesheet" href="../css/collapsemod.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>
|
||||
<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>
|
||||
<style>
|
||||
.yasgui .autocompleteWrapper {
|
||||
display: none !important;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body class="body-vis">
|
||||
|
||||
|
|
@ -25,32 +32,30 @@
|
|||
<div>
|
||||
<nav
|
||||
class="navbar border navbar-expand-lg navbar-light bg-light justify-content-between fixed-top">
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse"
|
||||
data-target="#bs-example-navbar-collapse-1"
|
||||
aria-controls="bs-example-navbar-collapse-1" aria-expanded="false"
|
||||
aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<a class="navbar-brand font-weight-bold" href="#">LiDa</a>
|
||||
<div class="collapse navbar-collapse"
|
||||
id="bs-example-navbar-collapse-1">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link disabled" href="#"> - SPARQL query editor - </a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="navbar-nav ml-md-auto">
|
||||
<li class="nav-item dropdown pt-1">
|
||||
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
Info
|
||||
</a>
|
||||
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
|
||||
<a class="dropdown-item disabled" href="#" id="visAiuto">Aiuto</a>
|
||||
<a class="dropdown-item" href="#" id="visAbout">About</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse"
|
||||
data-target="#bs-example-navbar-collapse-1"
|
||||
aria-controls="bs-example-navbar-collapse-1" aria-expanded="false"
|
||||
aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<a class="navbar-brand font-weight-bold" href="#">LiDa</a>
|
||||
<div class="collapse navbar-collapse"
|
||||
id="bs-example-navbar-collapse-1">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item"><a class="nav-link disabled" href="#">
|
||||
- SPARQL query editor - </a></li>
|
||||
</ul>
|
||||
<ul class="navbar-nav ml-md-auto">
|
||||
<li class="nav-item dropdown pt-1"><a
|
||||
class="nav-link dropdown-toggle" href="#" id="navbarDropdown"
|
||||
role="button" data-toggle="dropdown" aria-haspopup="true"
|
||||
aria-expanded="false"> Info </a>
|
||||
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
|
||||
<a class="dropdown-item disabled" href="#" id="visAiuto">Aiuto</a>
|
||||
<a class="dropdown-item" href="#" id="visAbout">About</a>
|
||||
</div></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
</nav>
|
||||
|
|
@ -59,24 +64,56 @@
|
|||
<div id="rigaContenuti" class="row no-gutters">
|
||||
|
||||
<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 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>
|
||||
|
||||
|
||||
|
||||
<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>
|
||||
|
||||
|
||||
<!-- <div id="yasgui"></div> -->
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue