[Bigdata-commit] SF.net SVN: bigdata:[8135] branches/RDR/bigdata-war/src/html

[<tob...@us...>]

Revision: 8135
          http://sourceforge.net/p/bigdata/code/8135
Author:   tobycraig
Date:     2014-04-21 22:08:01 +0000 (Mon, 21 Apr 2014)
Log Message:
-----------
Rudimentary error position highlighting in query, needs some polishing

Modified Paths:
--------------
    branches/RDR/bigdata-war/src/html/css/style.css
    branches/RDR/bigdata-war/src/html/index.html
    branches/RDR/bigdata-war/src/html/js/workbench.js

Modified: branches/RDR/bigdata-war/src/html/css/style.css
===================================================================
--- branches/RDR/bigdata-war/src/html/css/style.css	2014-04-21 21:04:52 UTC (rev 8134)
+++ branches/RDR/bigdata-war/src/html/css/style.css	2014-04-21 22:08:01 UTC (rev 8135)
@@ -228,6 +228,35 @@
    float: right;
 }
 
+#query-box {
+   background-color: transparent;
+   padding: 2px;
+   border-width: 1px;
+}
+
+/* these should have the same typography so the error highlighting matches up with the query text */
+#query-box, #query-errors {
+   font-family: sans-serif;
+   font-size: 90%;
+   line-height: normal;
+}
+
+#query-errors {
+   position: absolute;
+   z-index: -1;
+   padding: 8px 3px;
+   color: transparent;
+   white-space: pre;
+}
+
+#error-line {
+   background-color: lightgreen;
+}
+
+#error-character {
+   background-color: red;
+}
+
 #running-queries li {
    margin: 10px 0;
 }

Modified: branches/RDR/bigdata-war/src/html/index.html
===================================================================
--- branches/RDR/bigdata-war/src/html/index.html	2014-04-21 21:04:52 UTC (rev 8134)
+++ branches/RDR/bigdata-war/src/html/index.html	2014-04-21 22:08:01 UTC (rev 8135)
@@ -80,6 +80,7 @@
           </div>
 
           <form id="query-form">
+            <div id="query-errors"></div>
             <textarea id="query-box" name="query" placeholder="(Input a SPARQL query)"></textarea>
 
             <a href="#" id="advanced-features-toggle">Advanced features</a>

Modified: branches/RDR/bigdata-war/src/html/js/workbench.js
===================================================================
--- branches/RDR/bigdata-war/src/html/js/workbench.js	2014-04-21 21:04:52 UTC (rev 8134)
+++ branches/RDR/bigdata-war/src/html/js/workbench.js	2014-04-21 22:08:01 UTC (rev 8135)
@@ -441,7 +441,8 @@
 
 /* Query */
 
-$('#query-box').bind('keydown', 'ctrl+return', function(e) { e.preventDefault(); $('#query-form').submit(); });
+$('#query-box').bind('keydown', 'ctrl+return', function(e) { e.preventDefault(); $('#query-form').submit(); })
+               .on('input propertychange', function() { $('#query-errors').hide(); });
 $('#query-form').submit(submitQuery);
 
 function submitQuery(e) {
@@ -699,6 +700,25 @@
 function queryResultsError(jqXHR, textStatus, errorThrown) {
    $('#query-response, #query-tab .bottom *').show();
    $('#query-response').text('Error! ' + textStatus + ' ' + jqXHR.statusText);
+   var match = errorThrown.match(/line (\d+), column (\d+)/);
+   if(match) {
+      // highlight character at error position
+      var line = match[1] - 1;
+      var column = match[2] - 1;
+      var query = $('#query-box').val();
+      var lines = query.split('\n');
+      $('#query-errors').html('');
+      for(var i=0; i<line; i++) {
+         var p = $('<p>').text(lines[i]);
+         $('#query-errors').append(p);
+      }
+      $('#query-errors').append('<p id="error-line">');
+      $('#error-line').append(document.createTextNode(lines[line].substr(0, column)));
+      $('#error-line').append($('<span id="error-character">').text(lines[line].charAt(column) || ' '));
+      $('#error-line').append(document.createTextNode(lines[line].substr(column + 1)));
+      $('#query-errors').show();
+      $('#query-box').scrollTop(0);
+   }
 }
 
 /* Pagination */

This was sent by the SourceForge.net collaborative development platform, the world's largest Open Source development site.