sparna-git / Sparnatural

Sparnatural : visual knowledge graph explorer with SPARQL, in the browser, configurable with SHACL
http://sparnatural.eu
GNU Lesser General Public License v3.0
225 stars 41 forks source link

Import/Export JSON #647

Closed ch-sander closed 1 month ago

ch-sander commented 1 month ago

https://sparnatural.eu/demos/demo-dbpedia-en/index.html?lang=en#

I do like the possibility to import/export JSON via the UI. Is this still supported?

My trial to use the code of the demo in https://github.com/sparna-git/Sparnatural/blob/master/hello-sparnatural/index.html failed, but I might have done it wrong. Before I start digging deeper, I wanted to double check that there is not a deeper incompatibility (as for jQuery, bindings etc.)

ch-sander commented 1 month ago

This worked for the Export

sparnatural.addEventListener("queryUpdated", (event) => {
    // get the SPARQL query string, and pass it to yasQE
    queryString = sparnatural.expandSparql(event.detail.queryString);
    yasqe.setValue(queryString);
    // display the JSON query on the console
    console.log("Sparnatural JSON query structure:");
    console.dir(event.detail.queryJson);
    const queryJsonElement = document.getElementById('query-json');
    if (queryJsonElement) {
        queryJsonElement.value = JSON.stringify(event.detail.queryJson);
    } else {
        console.error('no "query-json" field.');
    }
});

document.getElementById('export').onclick = function(event) {
    event.preventDefault();
    const jsonString = JSON.stringify(JSON.parse(document.getElementById('query-json').value), null, 2);
    document.getElementById('export-json').value = jsonString;
    new bootstrap.Modal(document.getElementById('exportModal')).show();
};
tfrancart commented 1 month ago

I don't exactly know what is your question but you seem to have found the answer :-) indeed our demo page rely on bootstrap and I think JQuery, and a hidden input to store the JSON and retrieve it.

ch-sander commented 1 month ago

It worked but the code from the demo needed some adjustments.