From f0fcb7f67a94fbdeb89be1bdef03412ed9e6cd0a Mon Sep 17 00:00:00 2001
From: Guillaume Mazoyer <gmazoyer@gravitons.in>
Date: Thu, 22 Dec 2016 12:49:38 +0100
Subject: Focus on and highlight the parameter field if no parameter was given.

The parameter field will take the focus and its edges will turn red. This will
be cleared up if the reset button is hit or if the field is changed.
---
 js/looking-glass.js | 9 +++++++++
 1 file changed, 9 insertions(+)

(limited to 'js')

diff --git a/js/looking-glass.js b/js/looking-glass.js
index bbdcf2f..3020e08 100644
--- a/js/looking-glass.js
+++ b/js/looking-glass.js
@@ -31,6 +31,9 @@ $(document).ready(function() {
 
     e.preventDefault();
 
+    // reset the parameter field if it was marked as error
+    $('#input-param').parent().removeClass('has-error');
+
     // reset the form and update the doc modal
     $(this).closest('form').get(0).reset();
     request_doc($('#query').val());
@@ -51,6 +54,11 @@ $(document).ready(function() {
     request_doc($('#query').val());
   });
 
+  // if the field has been completed, turn it back to normal
+  $('#input-param').change(function() {
+    $('#input-param').parent().removeClass('has-error');
+  });
+
   // send an ajax request that will get the info on the router
   $('form').on('submit', function(e) {
     e.preventDefault();
@@ -74,6 +82,7 @@ $(document).ready(function() {
       if (!response || (response.length === 0)) {
         // no parameter given
         $('#error-text').text('No parameter given.');
+        $('#input-param').focus().parent().addClass('has-error');
         $('.alert').slideDown();
       } else {
         var response = $.parseJSON(response);
-- 
cgit v1.2.3