From 4808367ed52ec33072eedfb54a0e0f21d2375349 Mon Sep 17 00:00:00 2001
From: Ted Lawless <lawlesst@gmail.com>
Date: Thu, 12 Nov 2015 13:55:17 -0500
Subject: [PATCH] Add YASQE - allows for syntax highlighting and prefix
 autocompletion.

---
 webapp/web/css/edit.css                           |  8 +++++---
 webapp/web/js/sparql/init-yasqe.js                |  2 ++
 .../body/admin/admin-sparqlQueryForm.ftl          | 15 ++++++++-------
 3 files changed, 15 insertions(+), 10 deletions(-)
 create mode 100644 webapp/web/js/sparql/init-yasqe.js

diff --git a/webapp/web/css/edit.css b/webapp/web/css/edit.css
index 27e28f392..106b8cd4d 100644
--- a/webapp/web/css/edit.css
+++ b/webapp/web/css/edit.css
@@ -12,10 +12,12 @@ div.sparqlform label {
 input.block {
     display: block;
 }
-textarea,
-div.sparqlform div {
+textarea {
     margin-bottom: 1.5em;
 }
+div.sparqlform div.options, div.sparqlform input.submit {
+    margin-top: 1.5em;
+}
 form {
     padding-bottom: 20px;
 }
@@ -336,4 +338,4 @@ div.adr {
     font-size: .8em;
     line-height: 1.3em;
     color: #7f8993;
-}
\ No newline at end of file
+}
diff --git a/webapp/web/js/sparql/init-yasqe.js b/webapp/web/js/sparql/init-yasqe.js
new file mode 100644
index 000000000..eefa5f1ec
--- /dev/null
+++ b/webapp/web/js/sparql/init-yasqe.js
@@ -0,0 +1,2 @@
+YASQE.defaults.createShareLink = false;
+var yasqe = YASQE.fromTextArea(document.getElementById('query-area'));
diff --git a/webapp/web/templates/freemarker/body/admin/admin-sparqlQueryForm.ftl b/webapp/web/templates/freemarker/body/admin/admin-sparqlQueryForm.ftl
index d3f12e248..2f1edb45e 100644
--- a/webapp/web/templates/freemarker/body/admin/admin-sparqlQueryForm.ftl
+++ b/webapp/web/templates/freemarker/body/admin/admin-sparqlQueryForm.ftl
@@ -6,13 +6,10 @@
     <h2>SPARQL Query</h2>
     <form action='${submitUrl}' method="get">
         <h3>Query:</h3>
-        <div>
-            <textarea name='query' rows ='30' cols='100' class="span-23 maxWidth">
-${sampleQuery}
-            </textarea>
-        </div>
 
-        <div>
+        <textarea name='query' rows='30' cols='100' class="span-23 maxWidth" id="query-area">${sampleQuery}</textarea>
+
+        <div class="options">
         	 <h3>Format for SELECT and ASK query results:</h3>
         	 <label><input type='radio' name='resultFormat' value='text/plain' checked>RS_TEXT</label>
         	 <label><input type='radio' name='resultFormat' value='text/csv'>CSV</label>
@@ -21,7 +18,7 @@ ${sampleQuery}
         	 <label><input type='radio' name='resultFormat' value='application/sparql-results+json'>RS_JSON</label>
         </div>
 
-        <div>
+        <div class="options">
         	 <h3>Format for CONSTRUCT and DESCRIBE query results:</h3>
         	 <label><input type='radio' name='rdfResultFormat' value='text/plain'>N-Triples</label>
         	 <label><input type='radio' name='rdfResultFormat' value='application/rdf+xml' checked>RDF/XML</label>
@@ -33,3 +30,7 @@ ${sampleQuery}
         <input class="submit" type="submit" value="Run Query" />
     </form>
 </div><!-- content -->
+
+${stylesheets.add('<link rel="stylesheet" href="//cdn.jsdelivr.net/yasqe/2.6.1/yasqe.min.css" />')}
+${scripts.add('<script type="text/javascript" src="//cdn.jsdelivr.net/yasqe/2.6.1/yasqe.bundled.min.js"></script>',
+'<script type="text/javascript" src="${urls.base}/js/sparql/init-yasqe.js"></script>')}