A declarative Linked Data Fragments client in the form of a Web Component.
Simply insert the <ldf-client> in your page, fill in the required attribute values,
and you are ready to go.
You can see a live demo of the Web Component in action hosted on GitHub pages.
This assumes that you have bower and polyserve installed.
$ mkdir web-components
$ cd web-components
$ git clone git@github.com:tomayac/ldf-client.git
$ cd ldf-client
$ bower install
$ polyserveFinally visit http://localhost:8080/components/ldf-client/ and click the demo link in the upper right corner.
The example below shows basic usage instructions for the element.
<!doctype html>
<html>
<head>
<script src="../webcomponentsjs/webcomponents-lite.min.js"></script>
<link rel="import" href="ldf-client.html">
</head>
<body>
<!-- Streaming example -->
<ldf-client
id="ldf-client-streaming"
response-format="streaming"
query="SELECT DISTINCT ?frag WHERE {
?a a <http://advene.org/ns/cinelab/ld#Annotation> ;
<http://advene.org/ns/cinelab/ld#hasFragment> ?frag ;
<http://advene.org/ns/cinelab/ld#taggedWith>
[ <http://purl.org/dc/elements/1.1/title> 'personnages: Margaret'],
[ <http://purl.org/dc/elements/1.1/title> 'personnages: Grand Papa Pollitt'];
.
}"
start-fragment="http://spectacleenlignes.fr/ldf/spectacle_en_lignes">
</ldf-client>
<!-- Polling example -->
<ldf-client
id="ldf-client-polling"
response-format="polling"
query="SELECT DISTINCT ?tag WHERE {
[ a <http://advene.org/ns/cinelab/ld#Annotation> ;
<http://advene.org/ns/cinelab/ld#taggedWith>
[ <http://purl.org/dc/elements/1.1/title> ?tag ]
]
}"
start-fragment="http://spectacleenlignes.fr/ldf/spectacle_en_lignes">
</ldf-client>
<button value="Poll" id="button">Poll</button>
<script>
document.addEventListener('polymer-ready', function() {
/* Streaming example */
var ldfClientStreaming = document.querySelector('#ldf-client-streaming');
// Process data as it appears
ldfClientStreaming.addEventListener('ldf-query-streaming-response-partial',
function(e) {
var pre = document.createElement('pre');
pre.textContent = JSON.stringify(e.detail.response);
document.body.appendChild(pre);
});
// Get notified once all data is received
ldfClientStreaming.addEventListener('ldf-query-streaming-response-end', function() {
alert('Received all data');
});
/* Polling example */
var ldfClientPolling = document.querySelector('#ldf-client-polling');
// Poll for data
ldfClientPolling.addEventListener('ldf-query-polling-response', function(e) {
var pre = document.createElement('pre');
pre.textContent = JSON.stringify(e.detail.response);
document.body.appendChild(pre);
});
// Manually trigger polling
var button = document.querySelector('#button');
button.addEventListener('click', function() {
ldfClientPolling.showNext();
});
});
</script>
</body>
</html>The Web is full of high-quality Linked Data, but we can't reliably query it. Public SPARQL endpoints are often unavailable, because they need to answer many unique queries. One could set up a local endpoint using data dumps, but that's not Web querying and the data is never up-to-date.
Linked Data Fragments offer interfaces to solve queries at the client side with server data. Servers can offer data at low processing cost in a way that enables client-side querying. You can read more about the concept of Linked Data Fragments and learn about available Linked Data Fragments software.
Building this Web Component was pretty straight-forward thanks to Ruben Verborgh's Linked Data Fragments browser client Browser.js.
Copyright 2015 Thomas Steiner (tomac@google.com)
Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.