1. installer fuseki pour qu'il soit accessible sur http://127.0.0.1:3030
2. creer un fichier smag.html dans le repertoire webapp du serveur fuseki, avec le contenu qui suit et y accéder via http://127.0.0.1:3030/smag.html
<!DOCTYPE html>
<!-- https://github.com/scenaristeur/coolitude4/blob/master/Coolitude4/src/org/favedave/smag0/coolitude4/projet/Projet.java -->
<html>
<body>
</body>
<script>
var debutRequete = "INSERT DATA { GRAPH <http://example/bookStore> {";
var finRequete = "} }";
var data="test";
</script>
<script>
function post(path, params, method) {
method = method || "post"; // Set method to post by default if not specified.
// The rest of this code assumes you are not using a library.
// It can be made less wordy if you use one.
var form = document.createElement("form");
form.setAttribute("method", method);
form.setAttribute("action", path);
console.log(params);
for(var key in params) {
if(params.hasOwnProperty(key)) {
var hiddenField = document.createElement("input");
hiddenField.setAttribute("type", "hidden");
hiddenField.setAttribute("name", key);
hiddenField.setAttribute("value", params[key]);
form.appendChild(hiddenField);
}
}
document.body.appendChild(form);
form.submit();
}
<!--post('/contact/', {name: 'Johnny Bravo'}); -->
//post('http://127.0.0.1:3030/test/update', {"update" : update});
function constructRequete(){
var update = "PREFIX rdf: <http://www.w3.org/1999/02/22-rdf-syntax-ns#> ";
update += "PREFIX rdfs: <http://www.w3.org/2000/01/rdf-schema#>";
update += "PREFIX smag: <http://smag0.blogspot.fr/NS#>";
update += "PREFIX zoo: <http://example.org/zoo#>";
update += "PREFIX owl: <http://www.w3.org/2002/07/owl#>";
update += "PREFIX ex: <http://example.org#>";
update+= "INSERT DATA {";
//update += "GRAPH <http://smag0.blogspot.fr/GraphTest>{";
//update += "smag:RobokIze rdf:type smag:Site .";
//update +="smag:RobokIze smag:objectif 'un site de vente revente piece detachees , pour robots, et objets connectes' ." ;
// update += "ex:cat rdfs:subClassOf ex:animal .";
// update += "zoo:host rdfs:range ex:animal .";
// update += "ex:zoo1 zoo:host ex:cat2 .";
// update += "ex:cat3 owl:sameAs ex:cat2 .";
// update += "ex:cat3 owl:sameAs ex:cat2 .";
var sujet=document.getElementById("sujet").value;
var propriete=document.getElementById("propriete").value;
var objet=document.getElementById("objet").value;
update += "smag:"+sujet+" smag:"+propriete+" smag:"+objet+" .";
// fin requete avec graphe var finRequete = "} }";
var finRequete = "}"; // fin requete sans graphe
update+=finRequete;
console.log(update);
post('http://127.0.0.1:3030/test/update', {"update" : update});
//console.log(update);
//console.log(document.getElementById("sujet").value);
//window.location.assign('http://127.0.0.1:3030/smag.html');
//modifier la pause créée par l'alerte --> ceci permet la mise à jour par la fonction post
alert(update);
maj();
}
function httpGetAsync(theUrl, callback)
{
var xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4 && xmlHttp.status == 200)
callback(xmlHttp.responseText);
//console.log(xmlHttp.responseText);
//document.getElementById("result").innerHTML = xhttp.responseText;
}
xmlHttp.open("GET", theUrl, true); // true for asynchronous
xmlHttp.send(null);
}
function updateDiv(data){
var myJSONOBJECT= eval('(' + data+ ')');
// ou var myJSONOBJECT= JSON.parse(data, reviver);
var bindings = myJSONOBJECT.results.bindings;
//console.log("update");
//var resultat="";
var list = document.getElementById('resultats');
while (list.firstChild) {
list.removeChild(list.firstChild);
}
for(i in bindings) {
var binding = bindings[i];
//alert(binding); // a for-loop to print all the bindings
sujet=binding.s.value.split("#")[1];
propriete=binding.p.value.split("#")[1];
objet=binding.o.value.split("#")[1];
// resultat=sujet +" "+propriete+" "+objet;
// console.log("resultat :"+resultat);
var entry = document.createElement('li');
entry.appendChild(document.createTextNode(sujet));
entry.appendChild(document.createTextNode(" -> "));
entry.appendChild(document.createTextNode(propriete));
entry.appendChild(document.createTextNode(" -> "));
entry.appendChild(document.createTextNode(objet));
list.appendChild(entry);
}
//document.getElementById("result").innerHTML = resultat;
//var bindings = sr.results.bindings;
// JavaScript for...in loop iterates
// through the properties of bindings array
// which are [0,1,length-1] as opposed to the
// array item.
//for(i in bindings) {
// var binding = bindings[i];
// alert(binding); // a for-loop to print all the bindings
//}
// The only difference here (a subtle one) is
// that the iterator variable is n as opposed to r
// n=name, r=row index
//for(i in bindings) {
//var binding = bindings[i];
//for(n in binding) {
// alert(binding[n].value); // a nested for-loop to print binding values
// }
//}
}
function maj(){
//console.log('maj');
httpGetAsync('http://127.0.0.1:3030/test/query?query=select+*+where{%0D%0A%0D%0A%3Fs+%3Fp+%3Fo}%0D%0A&output=json',updateDiv);
}
</script>
<form name="form1" onsubmit="constructRequete()">
<input type="texte" name="q" value="a">
<input type="submit">
</form>
<ul id="resultats"></ul>
<div id="result">
</div>
<script>
setInterval(function(){ maj(); }, 3000);
//maj();
var inputSujet = document.createElement("input");
inputSujet.setAttribute("type", "text");
inputSujet.setAttribute("name", "sujet");
inputSujet.setAttribute("id", "sujet");
inputSujet.setAttribute("placeholder", "Sujet");
form1.appendChild(inputSujet);
var inputPropriete = document.createElement("input");
inputPropriete.setAttribute("type", "text");
inputPropriete.setAttribute("name", "propriete");
inputPropriete.setAttribute("id", "propriete");
inputPropriete.setAttribute("placeholder", "propriete");
form1.appendChild(inputPropriete);
var inputObjet = document.createElement("input");
inputObjet.setAttribute("type", "text");
inputObjet.setAttribute("name", "objet");
inputObjet.setAttribute("id", "objet");
inputObjet.setAttribute("placeholder", "Objet");
form1.appendChild(inputObjet);
// console.log(document.getElementById("sujet").value);
</script>
</html>
2. creer un fichier smag.html dans le repertoire webapp du serveur fuseki, avec le contenu qui suit et y accéder via http://127.0.0.1:3030/smag.html
<!DOCTYPE html>
<!-- https://github.com/scenaristeur/coolitude4/blob/master/Coolitude4/src/org/favedave/smag0/coolitude4/projet/Projet.java -->
<html>
<body>
</body>
<script>
var debutRequete = "INSERT DATA { GRAPH <http://example/bookStore> {";
var finRequete = "} }";
var data="test";
</script>
<script>
function post(path, params, method) {
method = method || "post"; // Set method to post by default if not specified.
// The rest of this code assumes you are not using a library.
// It can be made less wordy if you use one.
var form = document.createElement("form");
form.setAttribute("method", method);
form.setAttribute("action", path);
console.log(params);
for(var key in params) {
if(params.hasOwnProperty(key)) {
var hiddenField = document.createElement("input");
hiddenField.setAttribute("type", "hidden");
hiddenField.setAttribute("name", key);
hiddenField.setAttribute("value", params[key]);
form.appendChild(hiddenField);
}
}
document.body.appendChild(form);
form.submit();
}
<!--post('/contact/', {name: 'Johnny Bravo'}); -->
//post('http://127.0.0.1:3030/test/update', {"update" : update});
function constructRequete(){
var update = "PREFIX rdf: <http://www.w3.org/1999/02/22-rdf-syntax-ns#> ";
update += "PREFIX rdfs: <http://www.w3.org/2000/01/rdf-schema#>";
update += "PREFIX smag: <http://smag0.blogspot.fr/NS#>";
update += "PREFIX zoo: <http://example.org/zoo#>";
update += "PREFIX owl: <http://www.w3.org/2002/07/owl#>";
update += "PREFIX ex: <http://example.org#>";
update+= "INSERT DATA {";
//update += "GRAPH <http://smag0.blogspot.fr/GraphTest>{";
//update += "smag:RobokIze rdf:type smag:Site .";
//update +="smag:RobokIze smag:objectif 'un site de vente revente piece detachees , pour robots, et objets connectes' ." ;
// update += "ex:cat rdfs:subClassOf ex:animal .";
// update += "zoo:host rdfs:range ex:animal .";
// update += "ex:zoo1 zoo:host ex:cat2 .";
// update += "ex:cat3 owl:sameAs ex:cat2 .";
// update += "ex:cat3 owl:sameAs ex:cat2 .";
var sujet=document.getElementById("sujet").value;
var propriete=document.getElementById("propriete").value;
var objet=document.getElementById("objet").value;
update += "smag:"+sujet+" smag:"+propriete+" smag:"+objet+" .";
// fin requete avec graphe var finRequete = "} }";
var finRequete = "}"; // fin requete sans graphe
update+=finRequete;
console.log(update);
post('http://127.0.0.1:3030/test/update', {"update" : update});
//console.log(update);
//console.log(document.getElementById("sujet").value);
//window.location.assign('http://127.0.0.1:3030/smag.html');
//modifier la pause créée par l'alerte --> ceci permet la mise à jour par la fonction post
alert(update);
maj();
}
function httpGetAsync(theUrl, callback)
{
var xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4 && xmlHttp.status == 200)
callback(xmlHttp.responseText);
//console.log(xmlHttp.responseText);
//document.getElementById("result").innerHTML = xhttp.responseText;
}
xmlHttp.open("GET", theUrl, true); // true for asynchronous
xmlHttp.send(null);
}
function updateDiv(data){
var myJSONOBJECT= eval('(' + data+ ')');
// ou var myJSONOBJECT= JSON.parse(data, reviver);
var bindings = myJSONOBJECT.results.bindings;
//console.log("update");
//var resultat="";
var list = document.getElementById('resultats');
while (list.firstChild) {
list.removeChild(list.firstChild);
}
for(i in bindings) {
var binding = bindings[i];
//alert(binding); // a for-loop to print all the bindings
sujet=binding.s.value.split("#")[1];
propriete=binding.p.value.split("#")[1];
objet=binding.o.value.split("#")[1];
// resultat=sujet +" "+propriete+" "+objet;
// console.log("resultat :"+resultat);
var entry = document.createElement('li');
entry.appendChild(document.createTextNode(sujet));
entry.appendChild(document.createTextNode(" -> "));
entry.appendChild(document.createTextNode(propriete));
entry.appendChild(document.createTextNode(" -> "));
entry.appendChild(document.createTextNode(objet));
list.appendChild(entry);
}
//document.getElementById("result").innerHTML = resultat;
//var bindings = sr.results.bindings;
// JavaScript for...in loop iterates
// through the properties of bindings array
// which are [0,1,length-1] as opposed to the
// array item.
//for(i in bindings) {
// var binding = bindings[i];
// alert(binding); // a for-loop to print all the bindings
//}
// The only difference here (a subtle one) is
// that the iterator variable is n as opposed to r
// n=name, r=row index
//for(i in bindings) {
//var binding = bindings[i];
//for(n in binding) {
// alert(binding[n].value); // a nested for-loop to print binding values
// }
//}
}
function maj(){
//console.log('maj');
httpGetAsync('http://127.0.0.1:3030/test/query?query=select+*+where{%0D%0A%0D%0A%3Fs+%3Fp+%3Fo}%0D%0A&output=json',updateDiv);
}
</script>
<form name="form1" onsubmit="constructRequete()">
<input type="texte" name="q" value="a">
<input type="submit">
</form>
<ul id="resultats"></ul>
<div id="result">
</div>
<script>
setInterval(function(){ maj(); }, 3000);
//maj();
var inputSujet = document.createElement("input");
inputSujet.setAttribute("type", "text");
inputSujet.setAttribute("name", "sujet");
inputSujet.setAttribute("id", "sujet");
inputSujet.setAttribute("placeholder", "Sujet");
form1.appendChild(inputSujet);
var inputPropriete = document.createElement("input");
inputPropriete.setAttribute("type", "text");
inputPropriete.setAttribute("name", "propriete");
inputPropriete.setAttribute("id", "propriete");
inputPropriete.setAttribute("placeholder", "propriete");
form1.appendChild(inputPropriete);
var inputObjet = document.createElement("input");
inputObjet.setAttribute("type", "text");
inputObjet.setAttribute("name", "objet");
inputObjet.setAttribute("id", "objet");
inputObjet.setAttribute("placeholder", "Objet");
form1.appendChild(inputObjet);
// console.log(document.getElementById("sujet").value);
</script>
</html>
Aucun commentaire:
Enregistrer un commentaire