<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>YASQE</title>
<link rel="icon" type="image/png" href="doc/imgs/favicon.png">
<link href="dist/yasqe.min.css" rel="stylesheet" type="text/css" />
<link href="doc/doc.min.css" rel="stylesheet" type="text/css" />
</head>
<body>
<a href="https://github.com/YASGUI/YASQE" target="_blank"><img style="z-index: 1; position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_gray_6d6d6d.png" alt="Fork me on GitHub"></a>
<!-- Fixed navbar -->
<div class="navbar navbar-inverse" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">YASQE</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">About</a></li>
<li><a href="doc/">Documentation</a></li>
<li><a target="_blank" href="http://laurensrietveld.nl">About me</a></li>
</ul>
</div><!--/.nav-collapse -->
</div>
</div>
<div class="container" role="main">
<div class="jumbotron ">
<div class="row">
<div class="col-md-3">
<img class="img-responsive" src="doc/imgs/yasqe.png">
</div>
<div class="col-md-9">
<h1>Yet Another Sparql Query Editor</h1>
<div style="text-align:right">Funded by <a href="http://data2semantics.org" target="_blank"><img width="30%" src="doc/imgs/data2semantics.png"></a></div>
</div>
</div>
</div>
<div class="row" id="aboutYQuery">
<div class="col-md-12">
<h1>About YASQE</h1>
YASQE is part of the regular <a target="_blank" href='http://about.yasgui.org'>YASGUI</a> web application. YASQE provides a simple syntax highlighted text area, bundled with features such as autocompletion, and the option to query SPARQL endpoints.
<div id="showcase"></div>
<code>var yasqe = YASQE(document.getElementById("showcase"));</code> <br>
(or, if you would like to instantiate YASQE from an existing text area, use <code>var yasqe = YASQE.fromTextArea(document.getElementById('textAreaItem'));</code>
</div>
</div>
<div class="row" id="features">
<div class="col-md-12">
<h1>Features</h1>
YASQE features:
<ul>
<li>Completely client-side</li>
<li>SPARQL syntax highlighting and error checking </li>
<li>Extremely customizable: All functions and handlers from the <a href="http://codemirror.net" target="_blank">CodeMirror library</a> are accessible</li>
<li>Persistent values (optional): your query is stored for easier reuse between browser sessions
<li>Prefix autocompletion (using <a href="http://prefix.cc" target="_blank">prefix.cc</a>)</li>
<li>Property and class autocompletion (using the <a href="http://lov.okfn.org/" target="_blank">Linked Open Vocabularies API</a>)</li>
<li>Easily add your own property and class autocompletions if you have them</li>
<li>Handy <a href="doc/#keyboardShortcuts">keyboard shortcuts</a></li>
<li>Possible to execute the query directly</li>
</ul>
Combining YASQE with the YASR library (which visualizes SPARQL results) is easy: all you need to do is define YASR as a handler to the YASQE query method.
See <a href="https://gist.github.com/LaurensRietveld/7d8beca5dbeb6b909b6f" target="_blank">this example gist</a>.
</div>
</div>
<div class="row" id="releases">
<div class="col-md-12">
<h1>Download the latest release</h1>
<p>We provide a <i>bundled</i> release containing all external dependencies, and we provide a release containing just the YASQE core. If you choose to use the regular release, make sure to include <a href="http://jquery.com" target="_blank">jQuery</a> and <a href="http://codemirror.net" target="_blank">CodeMirror</a> in your page as well.</p>
</div>
</div>
<div id="downloads">
<div class="row">
<div id="cdnDownload" class="row">
<div class="well col-md-12" style="margin-bottom: 0px">
<h3>CDN</h3>
<p>The YASQE files are hosted via <a href="http://www.jsdelivr.com/#!yasqe" target="_blank">JsDelivr</a>. This CDN is the easiest way to include YASQE in your website.</p>
<strong>CSS</strong>
<div><code id="yasqeCss"></code></div>
<strong>JS</strong> <small>Choose either the bundled or the core version</small>
<div><code id="yasqeJsBundled"></code></div>
<div><code id="yasqeJs"></code></div>
</div>
</div>
<div class="row">
<div class="well col-md-6">
<h3>GitHub</h3>
<p>Visit the GitHub repository to download the YASQE .css and .js files (find them in the <code>dist</code> directory).</p>
<a class="btn btn-large btn-info" href="https://github.com/YASGUI/YASQE" target="_blank">Download latest release from GitHub <img style="height: 22px;" src="doc/imgs/blacktocat.png"></a>
</div>
<div class="well col-md-6">
<h3><img style="height: 26px;" src="doc/imgs/npm.png"></h3>
<p>YASQE is registered as a node package as well, so you'll be able to use the node package manager to keep your version of YASQE up to date.</p>
<a class="btn btn-large btn-info" href="https://www.npmjs.org/package/yasgui-yasqe" target="_blank">Show NPM Package</a>
</div>
</div>
</div>
</div>
<div class="row" id="used">
<div class="col-md-12">
<h1>Used by</h1>
<p><a href="http://doc.yasgui.org" target="_blank">YASGUI</a> (or one of its components, <a href="http://yasqe.yasgui.org" target="_blank">YASQE</a>/<a href="http://yasr.yasgui.org" target="_blank">YASR</a>) is integrated in common triple-stores such as <a href="https://jena.apache.org/" target="_blank">Apache Jena</a>
, <a href="http://rdf4j.org/" target="_blank">OpenRDF Sesame</a>
and <a href="http://www.swi-prolog.org/web/ClioPatria/" target="_blank">ClioPatria</a>.
</p>
<p>It has seen uptake in Linked Data tools as well, including</p>
<ul>
<li><a href="https://github.com/scampi/gosparqled" target="_blank">Gosparqled</a> <small>(<a href="http://scampi.github.io/gosparqled/" target="_blank">demo</a>)</small>, an extension of YASQE providing context-dependent property and class autocompletions</li>
<li><a href="https://github.com/jiemakel/snapper" target="_blank">Snapper</a> <small>(<a href="http://jiemakel.github.io/snapper/#/" target="_blank">demo</a>)</small>, a browser based Turtle editor</li>
<li><a href="https://github.com/jiemakel/visu" target="_blank">Visu</a> <small>(<a href="http://demo.seco.tkk.fi/visu/" target="_blank">demo</a>)</small>, the first library to extend YASR with Google Chart functionality</li>
<li><a href="https://github.com/Data2Semantics/brwsr" target="_blank">Brwsr</a>, a Linked Data browser</li>
<li><a href="https://github.com/zazukoians/trifid-ld" target="_blank">Trifid-LD</a>, a lightweight Linked Data server and proxy</li>
</ul>
<p>Publishers are using as well, such as
<a href="http://www.healthdata.gov/sparql/" target="_blank">HealthData.gov</a>
, <a href="http://americanart.si.edu/collections/search/lod/about/sparql.cfm" target="_blank">the Smithsonian American Art museum</a>
,<a href="http://zbw.eu/labs/en/blog/publishing-sparql-queries-live" target="_blank">the German National Library of Economics (ZWB)</a>
, <a href="http://lov.okfn.org/dataset/lov/sparql" target="_blank">Linked Open Vocabularies</a>
, the <a href="http://lodlaundromat.org/sparql/" target="_blank">LOD Laundromat</a>
, <a href="http://doc.metalex.eu/query" target="_blank">MetaLex</a>
, <a href="http://http://linkedarc.net/" target="_blank">linkedArc</a>
and the <a href="http://lod.cedar-project.nl/cedar/data.html" target="_blank">CEDAR project</a>.
</p>
</div>
</div>
<div class="row" id="thanks">
<div class="col-md-12">
<h1>Thanks!</h1>
A big thanks goes out to:
<ul>
<li>The people behind the <a href="http://openuplabs.tso.co.uk/demos/sparqleditor" target="_blank">Flint SPARQL editor</a> for publishing the javascript SPARQL grammar</li>
<li>Marijn Haverbeke for his great work on the <a href="http://codemirror.net" target="_blank">CodeMirror library</a> syntax highlighting library</li>
<li>Pierre-Yves Vandenbussche and Bernard Vatant for their useful <a href='http://lov.okfn.org/' target="_blank">Linked Open Vocabularies service</a>, of which I use the <a target="_blank" href="lov.okfn.org/dataset/lov/apidoc/">API</a> to autocomplete properties and classes
<li>Richard Cyganiak for his simple but effective <a href='http://prefix.cc' target="_blank">Prefix.cc</a> service, which I use for autocompleting prefixes.
</ul>
</div>
</div>
</div> <!-- /container -->
<script src="dist/yasqe.bundled.min.js"></script>
<script src="doc/doc.min.js"></script>
<script type="text/javascript">
var yasqe = YASQE(document.getElementById("showcase"), {
sparql: {
showQueryButton: true,
callbacks:{
success: function(data){
console.log("success", data);
}
}
}
});
</script>
</body>
</html>