Jonas Kress (WMDE) has uploaded a new change for review.
https://gerrit.wikimedia.org/r/248692
Change subject: Created toolbar and cleaned UI
......................................................................
Created toolbar and cleaned UI
Created bootstrap toolbar and moved most of ui clutter to it.
In addition changed sample queries to be loaded from mediawiki.org.
Bug: T115837
Change-Id: Ie9a5215d27318ead40e38270dc68a25adc74e2cb
---
M gui/gui.js
M gui/index.html
2 files changed, 116 insertions(+), 121 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/wikidata/query/rdf
refs/changes/92/248692/1
diff --git a/gui/gui.js b/gui/gui.js
index ba7a213..cd81f82 100644
--- a/gui/gui.js
+++ b/gui/gui.js
@@ -240,7 +240,7 @@
*/
function addPrefixes() {
var current = EDITOR.getValue();
- EDITOR.setValue(STANDARD_PREFIXES + current);
+ EDITOR.setValue(STANDARD_PREFIXES +'\n'+ current);
}
/**
@@ -250,7 +250,6 @@
var category, select, ns,
container = $('.namespace-shortcuts');
// add namespaces to dropdowns
- container.text('Namespace prefixes: ');
for ( category in NAMESPACE_SHORTCUTS) {
select = $('<select>')
.attr('class', 'form-control')
@@ -372,46 +371,33 @@
*/
function setupExamples() {
var exampleQueries = document.getElementById('exampleQueries');
- exampleQueries.add(new Option('US presidents and spouses',
- 'PREFIX wikibase: <http://wikiba.se/ontology#>\n' +
- 'PREFIX wd: <http://www.wikidata.org/entity/> \n' +
- 'PREFIX wdt: <http://www.wikidata.org/prop/direct/>\n' +
- 'PREFIX rdfs:
<http://www.w3.org/2000/01/rdf-schema#>\n' +
- 'PREFIX p: <http://www.wikidata.org/prop/>\n' +
- 'PREFIX v: <http://www.wikidata.org/prop/statement/>\n'
+
- 'SELECT ?p ?pLabel ?w ?wLabel WHERE {\n' +
- ' wd:Q30 p:P6/v:P6 ?p .\n' +
- ' ?p wdt:P26 ?w .\n' +
- ' SERVICE wikibase:label {\n'+
- ' bd:serviceParam wikibase:language "en" .\n'+
- ' }\n'+
- ' }'
- ));
- exampleQueries.add(new Option('Largest cities with female
mayors',
- 'PREFIX wikibase: <http://wikiba.se/ontology#>\n' +
- 'PREFIX wd: <http://www.wikidata.org/entity/>\n' +
- 'PREFIX wdt: <http://www.wikidata.org/prop/direct/>\n' +
- 'PREFIX rdfs:
<http://www.w3.org/2000/01/rdf-schema#>\n' +
- 'PREFIX p: <http://www.wikidata.org/prop/>\n' +
- 'PREFIX q: <http://www.wikidata.org/prop/qualifier/>\n'
+
- 'PREFIX v:
<http://www.wikidata.org/prop/statement/>\n\n' +
- 'SELECT DISTINCT ?city ?cityLabel ?mayor ?mayorLabel
WHERE {\n' +
- ' ?city wdt:P31/wdt:P279* wd:Q515 . # find instances
of subclasses of city\n' +
- ' ?city p:P6 ?statement . # with a P6 (head
of goverment) statement\n' +
- ' ?statement v:P6 ?mayor . # ... that has
the value ?mayor\n' +
- ' ?mayor wdt:P21 wd:Q6581072 . # ... where the
?mayor has P21 (sex or gender) female\n' +
- ' FILTER NOT EXISTS { ?statement q:P582 ?x } # ...
but the statement has no P582 (end date) qualifier\n\n' +
+ $.ajax({
+ url:
'https://www.mediawiki.org/w/api.php?action=query&prop=revisions&titles=Wikibase/Indexing/SPARQL_Query_Examples&rvprop=content',
+ data: {
+ format: 'json'
+ },
+ dataType: 'jsonp'
+ }).done( function ( data ) {
- ' # Now select the population value of the ?city\n' +
- ' # (the number is reached through a chain of three
properties)\n' +
- ' ?city wdt:P1082 ?population .\n\n' +
- ' # Optionally, find English labels for city and
mayor:\n'+
- ' SERVICE wikibase:label {\n'+
- ' bd:serviceParam wikibase:language "en" .\n'+
- ' }\n'+
- ' } ORDER BY DESC(?population) LIMIT 10'
- ));
+ var wikitext = data.query.pages[Object.keys(
data.query.pages )].revisions[0]['*'];
+ var paragraphs = wikitext.split( "==" );
+
+ $.each(paragraphs, function( key, paragraph ){
+ if(paragraph.match(/SPARQL|.*query\=/)){
+ var query = paragraph.substring(
paragraph.indexOf( '|query=' )+7, ( paragraph.lastIndexOf('}}') ) ).trim();
+ var title = paragraphs[key-1] || "";
+ title = title.replace( '=', '' ).trim();
+
+ if(title && title.length > 0){
+ exampleQueries.add( new Option(
title, query ) );
+ }
+ }
+ })
+ } );
+
+ //exampleQueries.add(new Option('US presidents and spouses',));
+
}
/**
@@ -433,7 +419,7 @@
$('#query-form').submit(submitQuery);
$('.namespace-shortcuts').on('change', 'select',
selectNamespace);
$('.exampleQueries').on('change', pasteExample);
- $('#prefixes-button').click(addPrefixes);
+ $('.addPrefixes').click(addPrefixes);
$('#showhide').click(showHideHelp);
$('#hide-explorer').click(hideExlorer);
$('#clear-button').click(function () { EDITOR.setValue("") });
diff --git a/gui/index.html b/gui/index.html
index ce6bcc5..7947f6f 100644
--- a/gui/index.html
+++ b/gui/index.html
@@ -1,7 +1,7 @@
<!doctype html>
<html>
<head>
-<script
src="https://www.mediawiki.org/w/load.php?debug=false&modules=jquery&only=scripts&raw=1";></script>
+<script src="jquery-1.11.3.js"></script>
<script src="bootstrap.min.js"></script>
<script src="codemirror.js"></script>
<script src="gui.js"></script>
@@ -16,87 +16,96 @@
<link rel="stylesheet" href="codemirror.css">
<link rel="stylesheet" href="addon/hint/show-hint.css">
-<link rel="shortcut icon"
href="//www.wikidata.org/static/favicon/testwikidata.ico">
+<link rel="shortcut icon"
+ href="//www.wikidata.org/static/favicon/testwikidata.ico">
-<title>Wikidata Query Service Beta</title>
+<title>Wikidata Query Service (Beta)</title>
</head>
<body>
- <div class="container-fluid">
- <h1>Welcome to Wikidata Query Service Beta!</h1>
- <div class="row">
- <div class="col-md-4">
- <p>Please enter your query below.</p>
- </div>
- <div class="col-md-4">
- <p>See also: <small>[<a href="#" id="showhide">hide</a>]</small></p>
- <div id="seealso">
- <ul>
- <li> <font size="4"><b><a
href="https://www.mediawiki.org/w/index.php?title=Talk:Wikidata_query_service&action=edit§ion=new";>Give
us your feedback!</a></b></font>
- <li> <a
href="https://www.mediawiki.org/wiki/Wikidata_query_service/User_Manual";>User
Manual</a>
- <li> <a
href="https://www.mediawiki.org/wiki/Wikibase/Indexing/RDF_Dump_Format";>RDF
data model</a>
- (<a
href="https://www.mediawiki.org/wiki/Wikibase/Indexing/RDF_Dump_Format#Full_list_of_prefixes";>prefixes
list</a>)
- <li> <a
href="https://github.com/wikimedia/wikidata-query-rdf/blob/master/docs/exploring-linked-data.md";>Exploring
Linked Data</a>
- <li> <a
href="https://www.mediawiki.org/wiki/Wikibase/Indexing/SPARQL_Query_Examples";>SPARQL
query examples</a>
- <li> <a href="https://tools.wmflabs.org/wdq2sparql/w2s.php";>WDQ
syntax translator</a>
- <li>
- Sample query:
- <select id="exampleQueries" class="exampleQueries">
- <option value="">-</option>
- </select>
- </li>
- <li>Last updated: <span id="dbUpdated">[connecting]</span></li>
- </ul>
- </div>
- </div>
- <div class="col-md-4">
- <div class="namespace-shortcuts"></div>
- </div>
- </div>
- <div class="row">
- <div class="col-md-12" id="query-box">
- <form class="form-horizontal" id="query-form">
- <div class="form-group">
- <textarea id="query" name="query" placeholder="(Input a SPARQL
query)"></textarea>
- <div>Press <i>ctrl-space</i> to activate auto completion.</div>
- </div>
- <div class="form-group" id="form-buttons">
- <input class="btn btn-default" type="submit" id="execute-button"
value="Execute">
- <input class="btn btn-default" type="reset" id="clear-button"
value="Clear">
- <input class="btn btn-default" type="button" id="prefixes-button"
value="Add prefixes">
- </div>
- </form>
- <hr>
- </div>
- </div>
- <div class="row">
- <div class="col-md-12"><div id="explore"></div></div>
- </div>
- <div class="row" id="total">
- <div class="col-md-4 pull-left">
- Total results: <span id="total-results"></span>, duration: <span
id="query-time"></span> ms.
- <span id="show-explorer">Click on <b>*</b> to explore.</span>
- <button id="hide-explorer" href="#">Hide explorer</button>
- </div>
- <div class="col-sm-2 pull-right">
- <a href="#" data-toggle="dropdown" class="dropdown-toggle">Download
results<span class="caret"></span></a>
- <ul class="dropdown-menu" role="menu">
- <li><a id="downloadCSV" href="#">CSV</a></li>
- <li><a id="downloadTSV" href="#">TSV</a></li>
- <li><a id="downloadJSON" href="#">JSON</a></li>
- <li><a id="downloadSimple-TSV" href="#">Simple TSV</a></li>
- <li><a id="downloadFull-JSON" href="#">Full JSON</a></li>
- </ul>
- </div>
- <div class="col-sm-2 pull-right">
- <a href="#" target="_blank" id="shorturl">Generate short URL</a>
- </div>
- </div>
- <div class="row">
- <div class="col-md-10" id="query-result">Test result</div>
- </div>
- <div class="row">
- <div class="col-md-10" id="query-error">Test error</div>
- </div>
- </div>
+ <div class="container-fluid">
+ <div class="row">
+ <!-- Editor Navbar -->
+ <nav class="navbar navbar-default">
+ <div class="navbar-header">
+ <div class="navbar-brand">Wikidata
Query Service <span class="label label-info">Beta</span></div>
+ </div>
+ <div class="collapse navbar-collapse"
id="bs-example-navbar-collapse-1">
+ <ul class="nav navbar-nav">
+ <li class="dropdown"><a
class="dropdown-toggle" data-toggle="dropdown" role="button"
aria-haspopup="true" aria-expanded="false">Prefixes<span
class="caret"></span></a>
+ <ul
class="dropdown-menu">
+ <li><div
class="namespace-shortcuts"></div></li>
+ <li
role="separator" class="divider"></li>
+ <li><a
class="addPrefixes">Add Standard Prefixes</a></li>
+ </ul></li>
+ <li class="dropdown"><a
class="dropdown-toggle" data-toggle="dropdown" role="button"
aria-haspopup="true" aria-expanded="false">Tools<span class="caret"></span></a>
+ <ul
class="dropdown-menu">
+ <li><a
target="_blank"
href="https://github.com/wikimedia/wikidata-query-rdf/blob/master/docs/exploring-linked-data.md";>Exploring
Linked Data</a></li>
+ <li><a
target="_blank" href="https://tools.wmflabs.org/wdq2sparql/w2s.php";>WDQ Syntax
Translator</a></li>
+ <li><select
id="exampleQueries" class="exampleQueries form-control"><option value="">Query
Examples</option></select></li>
+ </ul></li>
+ <li class="dropdown"><a
href="#" class="dropdown-toggle" data-toggle="dropdown" role="button"
aria-haspopup="true" aria-expanded="false">Help<span class="caret"></span></a>
+ <ul
class="dropdown-menu">
+ <li><a
target="_blank"
href="https://www.mediawiki.org/w/index.php?title=Talk:Wikidata_query_service&action=edit§ion=new";>Give
Feedback!</a></li>
+ <li
role="separator" class="divider"></li>
+ <li><a
target="_blank"
href="https://www.mediawiki.org/wiki/Wikidata_query_service/User_Manual";>User
Manual</a></li>
+ <li><a
target="_blank"
href="https://www.mediawiki.org/wiki/Wikibase/Indexing/SPARQL_Query_Examples";>Sample
Queries</a></li>
+ <li
role="separator" class="divider"></li>
+ <li><a
target="_blank"
href="https://www.mediawiki.org/wiki/Wikibase/Indexing/RDF_Dump_Format";>RDF
Data Model</a></li>
+ <li><a
target="_blank"
href="https://www.mediawiki.org/wiki/Wikibase/Indexing/RDF_Dump_Format#Full_list_of_prefixes";>List
of prefixes</a></li>
+ </ul></li>
+ </ul>
+ </div>
+ </nav>
+
+ <div class="col-md-12" id="query-box">
+ <form class="form-horizontal" id="query-form">
+ <div class="form-group">
+ <textarea id="query"
name="query" placeholder="(Input a SPARQL query)"></textarea>
+ <div class="alert alert-success
alert-dismissible" role="alert">
+ <button type="button"
class="close" data-dismiss="alert" aria-label="Close"><span
aria-hidden="true">×</span></button>
+ Press
<i>[CTRL-SPACE]</i> to activate auto completion. Data last updated: <span
id="dbUpdated">[connecting]</span>
+ </div>
+ </div>
+ <input class="btn btn-default btn-lg"
type="submit" id="execute-button" value="Execute"> <input class="btn
btn-default btn-lg" type="reset" id="clear-button" value="Clear">
+ </form>
+ <hr>
+ </div>
+ </div>
+ <div class="row">
+ <div class="col-md-12">
+ <div id="explore"></div>
+ </div>
+ </div>
+ <div class="row" id="total">
+ <div class="col-md-4 pull-left">
+ Total results: <span
id="total-results"></span>, duration: <span
+ id="query-time"></span> ms. <span
id="show-explorer">Click
+ on <b>*</b> to explore.
+ </span>
+ <button id="hide-explorer" href="#">Hide
explorer</button>
+ </div>
+ <div class="col-sm-2 pull-right">
+ <a href="#" data-toggle="dropdown"
class="dropdown-toggle">Download
+ results<span class="caret"></span>
+ </a>
+ <ul class="dropdown-menu" role="menu">
+ <li><a id="downloadCSV"
href="#">CSV</a></li>
+ <li><a id="downloadTSV"
href="#">TSV</a></li>
+ <li><a id="downloadJSON"
href="#">JSON</a></li>
+ <li><a id="downloadSimple-TSV"
href="#">Simple TSV</a></li>
+ <li><a id="downloadFull-JSON"
href="#">Full JSON</a></li>
+ </ul>
+ </div>
+ <div class="col-sm-2 pull-right">
+ <a href="#" target="_blank"
id="shorturl">Generate short URL</a>
+ </div>
+ </div>
+ <div class="row">
+ <div class="col-md-10" id="query-result">Test
result</div>
+ </div>
+ <div class="row">
+ <div class="col-md-10" id="query-error">Test error</div>
+ </div>
+ </div>
</body>
</html>
--
To view, visit https://gerrit.wikimedia.org/r/248692
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: Ie9a5215d27318ead40e38270dc68a25adc74e2cb
Gerrit-PatchSet: 1
Gerrit-Project: wikidata/query/rdf
Gerrit-Branch: master
Gerrit-Owner: Jonas Kress (WMDE) <jonas.kr...@wikimedia.de>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
