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.

2 files changed, 10 insertions, 1 deletions

diff --git a/includes/config.defaults.php b/includes/config.defaults.php
index b160f0e..d6d4ae0 100644
--- a/includes/config.defaults.php
+++ b/includes/config.defaults.php
@@ -157,7 +157,7 @@ $config = array(
     ),
     // Documentation for the 'traceroute' query
     'traceroute' => array(
-      'command' =>'traceroute IP_ADDRESS|HOSTNAME',
+      'command' => 'traceroute IP_ADDRESS|HOSTNAME',
       'description' => 'Display the path to a given destination.',
       'parameter' => 'The parameter must be an IPv4/IPv6 address (without mask) or a hostname.<br />RFC1918 addresses, IPv6 starting with FD or FC, and IPv4 reserved ranges (0.0.0.0/8, 169.254.0.0/16, 192.0.2.0/24 and 224.0.0.0/4) may be refused.<br /><br />Example of valid arguments:<br /><ul><li>8.8.8.8</li><li>2001:db8:1337::42</li><li>example.com</li></ul>'
     )
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);