<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Rudf server</title>
    <link rel="stylesheet" href="//tools-static.wmflabs.org/cdnjs/ajax/libs/yasqe/2.11.22/yasqe.min.css"/>
    <link rel="stylesheet" href="//tools-static.wmflabs.org/cdnjs/ajax/libs/yasr/2.12.19/yasr.min.css"/>
</head>
<body>
<div id="yasqe"></div>
<div id="yasr"></div>
<script src="//tools-static.wmflabs.org/cdnjs/ajax/libs/yasr/2.12.19/yasr.bundled.min.js"></script>
<script src="//tools-static.wmflabs.org/cdnjs/ajax/libs/yasqe/2.11.22/yasqe.bundled.min.js"></script>
<script>
    var yasqe = YASQE(document.getElementById("yasqe"), {
        sparql: {
            showQueryButton: true,
            endpoint: "{{endpoint}}"
        }
    });
    var yasr = YASR(document.getElementById("yasr"), {
        getUsedPrefixes: yasqe.getPrefixesFromQuery,
        useGoogleCharts: false
    });
    yasqe.options.sparql.callbacks.complete = yasr.setResponse;
</script>
</body>