Skip to content
Snippets Groups Projects
Commit f22120c9 authored by alvaro's avatar alvaro
Browse files

Added useful SPARQL queries in menu

parent effb6f66
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
classes/modules/adminModule.php
+ 110
− 101
View file @ f22120c9
......@@ -15,107 +15,116 @@ class AdminModule extends abstractModule{
<link href='codemirror/lib/codemirror.css' rel='stylesheet' type='text/css' media='screen' />
<style>
body {
padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
}
.CodeMirror {border: 1px solid black;}
.cm-mustache {color: #0ca;}
.wait{
background-image:url('img/wait.gif');
background-repeat:no-repeat;
padding-right:20px;
background-position: right;
}
.strong{font-weight: 900; font-size:120%}
.cheat-sheet{
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
border-radius: 15px;
background:lightgray;
width:400px;
padding:5px;
position:absolute;
border:1px solid black;
right:-370px;
top:121px;
opacity:0.9
}
.cheat-title{
writing-mode:tb-rl;
-webkit-transform:rotate(90deg);
-moz-transform:rotate(90deg);
-o-transform: rotate(90deg);
white-space:nowrap;
display:block;
width:20px;
height:40px;
font-size:24px;
font-weight:normal;
text-shadow: 0px 0px 1px #333;
}
/* Base class */
.bs-docs-template {
position: relative;
margin: 0px 0;
padding: 39px 19px 14px;
*padding-top: 19px;
background-color: #fff;
border: 1px solid #ddd;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.cheat-list{
margin-left:60px;
margin-top:-40px;
}
/* Echo out a label for the example */
.bs-docs-template:after {
content: 'Template';
position: absolute;
top: -1px;
left: -1px;
padding: 3px 7px;
font-size: 12px;
font-weight: bold;
background-color: #f5f5f5;
border: 1px solid #ddd;
color: #9da0a4;
-webkit-border-radius: 4px 0 4px 0;
-moz-border-radius: 4px 0 4px 0;
border-radius: 4px 0 4px 0;
}
.bs-docs-query {
position: relative;
margin: 0px 0;
padding: 39px 19px 14px;
*padding-top: 19px;
background-color: #fff;
border: 1px solid #ddd;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
/* Echo out a label for the example */
.bs-docs-query:after {
content: 'Query';
position: absolute;
top: -1px;
left: -1px;
padding: 3px 7px;
font-size: 12px;
font-weight: bold;
background-color: #f5f5f5;
border: 1px solid #ddd;
color: #9da0a4;
-webkit-border-radius: 4px 0 4px 0;
-moz-border-radius: 4px 0 4px 0;
border-radius: 4px 0 4px 0;
}
body {
padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
}
.CodeMirror {border: 1px solid black;}
.cm-mustache {color: #0ca;}
.wait{
background-image:url('img/wait.gif');
background-repeat:no-repeat;
padding-right:20px;
background-position: right;
}
.strong{font-weight: 900; font-size:120%}
.cheat-sheet{
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
border-radius: 15px;
min-height: 200px;
background:lightgray;
width:400px;
padding:5px;
position:absolute;
border:1px solid black;
right:-370px;
opacity:0.9
}
.cheat-title{
writing-mode:tb-rl;
-webkit-transform:rotate(90deg);
-moz-transform:rotate(90deg);
-o-transform: rotate(90deg);
white-space:nowrap;
display:block;
width:20px;
height:40px;
font-size:24px;
font-weight:normal;
text-shadow: 0px 0px 1px #333;
}
.first-editor{
top:120px;
}
.second-editor{
top:540px;
}
/* Base class */
.bs-docs-template {
position: relative;
margin: 0px 0;
padding: 39px 19px 14px;
*padding-top: 19px;
background-color: #fff;
border: 1px solid #ddd;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.cheat-list{
margin-left:60px;
margin-top:-30px;
}
.sparql-list{
margin-left:60px;
margin-top:-40px;
}
/* Echo out a label for the example */
.bs-docs-template:after {
content: 'Template';
position: absolute;
top: -1px;
left: -1px;
padding: 3px 7px;
font-size: 12px;
font-weight: bold;
background-color: #f5f5f5;
border: 1px solid #ddd;
color: #9da0a4;
-webkit-border-radius: 4px 0 4px 0;
-moz-border-radius: 4px 0 4px 0;
border-radius: 4px 0 4px 0;
}
.bs-docs-query {
position: relative;
margin: 0px 0;
padding: 39px 19px 14px;
*padding-top: 19px;
background-color: #fff;
border: 1px solid #ddd;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
/* Echo out a label for the example */
.bs-docs-query:after {
content: 'Query';
position: absolute;
top: -1px;
left: -1px;
padding: 3px 7px;
font-size: 12px;
font-weight: bold;
background-color: #f5f5f5;
border: 1px solid #ddd;
color: #9da0a4;
-webkit-border-radius: 4px 0 4px 0;
-moz-border-radius: 4px 0 4px 0;
border-radius: 4px 0 4px 0;
}
</style>
<link href='../css/bootstrap-responsive.min.css' rel='stylesheet' type='text/css' media='screen' />
<script type='text/javascript' src='../js/jquery.js'></script>
......
doc/examples/originalComponents/static/admin/js/editor.js
+ 64
− 38
View file @ f22120c9
......@@ -19,6 +19,29 @@ $(document).ready(function(){
};
return CodeMirror.overlayMode(CodeMirror.getMode(config, parserConfig.backdrop || 'text/html'), mustacheOverlay);
});
//Create Template and Query Editor
var templateEditor = CodeMirror.fromTextArea(document.getElementById('template-editor'), {mode: 'mustache',
onChange:function(e){
if(templateEditor.getValue() == templateBuffer){
$('#template-save-button').addClass('disabled');
}else{
$('#template-save-button').removeClass('disabled');
}
}
});
var queryEditor = CodeMirror.fromTextArea(document.getElementById('query-editor'), {mode: 'sparql',
onChange:function(e){
if(queryEditor.getValue() == queryBuffer){
$('#query-save-button').addClass('disabled');
}else{
$('#query-save-button').removeClass('disabled');
}
}
});
var tip = $('<div></div>');
tip.css("width", "400px")
.css("height", "220px")
......@@ -36,56 +59,59 @@ $(document).ready(function(){
.css("padding", "5px")
.css("opacity", 0);
$("body").append(tip);
var cheatSheet = $("body").append("<div id='cheat' class='cheat-sheet'></div>");
var cheatSheet = $("body").append("<div id='cheat' class='cheat-sheet first-editor'></div>");
$("#cheat").on('mouseenter', function(){$(this).animate({right: '+=200'}, 180)})
.on('mouseleave', function(){$(this).animate({right: '-=200'}, 180);tip.css("top", 1000).css("left", 0)}).html("<span class='cheat-title'>Visualization Filters</span>")
.on('mousemove', function(e){tip.css("top", e.pageY-100).css("left", e.pageX-430)});
.on('mouseleave', function(){$(this).animate({right: '-=200'}, 180);tip.css("top", 1000).css("left", 0)}).html("<span class='cheat-title'>Visualization Filters</span>")
.on('mousemove', function(e){tip.css("top", e.pageY-100).css("left", e.pageX-430)});
$("#cheat").append("<ul id='cheat-list' class='cheat-list'></ul>");
var visualizationsEnabled = [ {name: 'D3CirclePacking', params: "childNode,parentNode", img: "circlepacking.png"},
{name: 'D3Dendrogram', params: "childNode,parentNode", img: "dendrogram.png"},
{name: 'D3ForceGraph', params: "sourceNode,TargetNode", img: "graph.png"},
{name: 'D3ParallelCoordinates', params: "label,value1,value2,...,valueN", img: "parallelcoordinates.png"},
{name: 'D3WordCloud', params: "textVariable", img: "wordcloud.png"},
{name: 'GoogleMaps', params: "latitude,longitude,label", img: "maps.png"},
{name: 'GoogleVizBarChart', params: "valuesInAxisX,valuesInAxisY", img: "barchart.png"},
{name: 'GoogleVizColumnChart', params: "valuesInAxisX,valuesInAxisY", img: "columnchart.png"},
{name: 'GoogleVizLineChart', params: "valuesInAxisX,valuesInAxisY", img: "linechart.png"},
{name: 'GoogleVizPieChart', params: "valuesInAxisX,valuesInAxisY", img: "piechart.png"},
{name: 'GoogleVizScatterChart', params: "valuesInAxisX,valuesInAxisY", img: "piechart.png"},
{name: 'GoogleVizTable', params: "column1,column2,...,columnN", img: "table.png"},
{name: 'Timeknot', params: "date,label[,image]", img: "timeknots.png"}];
{name: 'D3Dendrogram', params: "childNode,parentNode", img: "dendrogram.png"},
{name: 'D3ForceGraph', params: "sourceNode,TargetNode", img: "graph.png"},
{name: 'D3ParallelCoordinates', params: "label,value1,value2,...,valueN", img: "parallelcoordinates.png"},
{name: 'D3WordCloud', params: "textVariable", img: "wordcloud.png"},
{name: 'GoogleMaps', params: "latitude,longitude,label", img: "maps.png"},
{name: 'GoogleVizBarChart', params: "valuesInAxisX,valuesInAxisY", img: "barchart.png"},
{name: 'GoogleVizColumnChart', params: "valuesInAxisX,valuesInAxisY", img: "columnchart.png"},
{name: 'GoogleVizLineChart', params: "valuesInAxisX,valuesInAxisY", img: "linechart.png"},
{name: 'GoogleVizPieChart', params: "valuesInAxisX,valuesInAxisY", img: "piechart.png"},
{name: 'GoogleVizScatterChart', params: "valuesInAxisX,valuesInAxisY", img: "piechart.png"},
{name: 'GoogleVizTable', params: "column1,column2,...,columnN", img: "table.png"},
{name: 'Timeknot', params: "date,label[,image]", img: "timeknots.png"}];
$.each(visualizationsEnabled, function(index, value){
$("#cheat-list").append("<li><a href='#' class='cheat-link' data-params='"+value.params+"' data-img='"+value.img+"'>"+value.name+"</a></li>");
$("#cheat-list").append("<li><a href='#' class='cheat-link' data-params='"+value.params+"' data-img='"+value.img+"'>"+value.name+"</a></li>");
});
$(".cheat-link").on('click', function(){
var visualFilter = '{{models.main|'+$(this).html()+':"'+$(this).attr("data-params")+'"}}';
templateEditor.replaceSelection(visualFilter);
var visualFilter = '{{models.main|'+$(this).html()+':"'+$(this).attr("data-params")+'"}}';
templateEditor.replaceSelection(visualFilter);
})
.on('mouseenter', function(){var visualFilter = '<h3>'+$(this).html()+'</h3><p style="background:#ccc">{{models.main|'+$(this).html()+':"'+$(this).attr("data-params")+'"}}</p><img src="img/'+$(this).attr("data-img")+'"/>';tip.html(visualFilter).animate({opacity: .95}, 20)})
.on('mouseleave', function(){tip.animate({opacity: '0'}, 20)});
//Create Template and Query Editor
var templateEditor = CodeMirror.fromTextArea(document.getElementById('template-editor'), {mode: 'mustache',
onChange:function(e){
if(templateEditor.getValue() == templateBuffer){
$('#template-save-button').addClass('disabled');
}else{
$('#template-save-button').removeClass('disabled');
}
}
});
var queryEditor = CodeMirror.fromTextArea(document.getElementById('query-editor'), {mode: 'sparql',
onChange:function(e){
if(queryEditor.getValue() == queryBuffer){
$('#query-save-button').addClass('disabled');
}else{
$('#query-save-button').removeClass('disabled');
}
}
.on('mouseenter', function(){var visualFilter = '<h3>'+$(this).html()+'</h3><p style="background:#ccc">{{models.main|'+$(this).html()+':"'+$(this).attr("data-params")+'"}}</p><img src="img/'+$(this).attr("data-img")+'"/>';tip.html(visualFilter).animate({opacity: .95}, 20)})
.on('mouseleave', function(){tip.animate({opacity: '0'}, 20)});
var sparqlSheet = $("body").append("<div id='sparql' class='cheat-sheet second-editor'></div>").css("top:520px");
$("#sparql").on('mouseenter', function(){$(this).animate({right: '+=200'}, 180)})
.on('mouseleave', function(){$(this).animate({right: '-=200'}, 180);tip.css("top", 1000).css("left", 0)}).html("<span class='cheat-title'>SPARQL Queries</span>")
.on('mousemove', function(e){tip.css("top", e.pageY-100).css("left", e.pageX-430)});
$("#sparql").append("<ul id='sparql-list' class='cheat-list'></ul>");
var sparqlQueriesEnabled = [ {name: 'Get classes', query: "SELECT DISTINCT ?class WHERE {\n [] a ?class\n}\n#You can change the limit to obtain more results\nLIMIT 100"},
{name: 'Get instances of a class', query: "SELECT DISTINCT ?instance WHERE{\n ?instance a <http://my/class>\n}\n#You can change the limit to obtain more results\nLIMIT 100"},
{name: 'Get properties of a resource', query: "SELECT DISTINCT ?property ?object WHERE{\n <http://my/resource> ?property ?object\n}\n#You can change the limit to obtain more results\nLIMIT 100"},
{name: 'All properties pointing to a resource', query: "SELECT DISTINCT ?subject ?object WHERE{\n ?subject ?property <http://my/resource>\n}\n#You can change the limit to obtain more results\nLIMIT 100"}];
$.each(sparqlQueriesEnabled, function(index, value){
$("#sparql-list").append("<li><a href='#query-editor' class='sparql-link' data-query='"+value.query+"'>"+value.name+"</a></li>");
});
$(".sparql-link").on('click', function(){
queryEditor.setValue($(this).attr('data-query'));
})
//Test button
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment