From 4b725a0cd69e769cc381f1ad41fe972ff35392f9 Mon Sep 17 00:00:00 2001
From: Franco Fichtner <franco@opnsense.org>
Date: Fri, 22 Jan 2016 17:23:47 +0100
Subject: [PATCH] search: improve behaviour

o Set tabindex to first for "tab -> type" action
o Translate "Search" string
o Redesign matcher to allow searching for multiple words at once
o Hide unwanted dashboard root submenu item
o Whitespace sweep
---
 .../app/models/OPNsense/Base/Menu/Menu.xml    |  2 +-
 .../mvc/app/views/layouts/default.volt        | 19 ++++++++++++++++++-
 src/opnsense/www/js/bootstrap3-typeahead.js   |  8 ++++----
 src/www/fbegin.inc                            |  2 +-
 src/www/head.inc                              | 17 +++++++++++++++++
 5 files changed, 41 insertions(+), 7 deletions(-)

diff --git a/src/opnsense/mvc/app/models/OPNsense/Base/Menu/Menu.xml b/src/opnsense/mvc/app/models/OPNsense/Base/Menu/Menu.xml
index b7b542fae..50a451852 100644
--- a/src/opnsense/mvc/app/models/OPNsense/Base/Menu/Menu.xml
+++ b/src/opnsense/mvc/app/models/OPNsense/Base/Menu/Menu.xml
@@ -1,7 +1,7 @@
 <menu>
     <Lobby order="0" cssClass="fa fa-laptop">
         <Dashboard order="0" url="/index.php" cssClass="fa fa-dashboard fa-fw">
-            <Root url="/"/>
+            <Root url="/" visibility="hidden"/>
         </Dashboard>
         <License order="1" url="/license.php" cssClass="fa fa-balance-scale fa-fw"/>
         <Password order="2" url="/system_usermanager_passwordmg.php" cssClass="fa fa-key fa-fw"/>
diff --git a/src/opnsense/mvc/app/views/layouts/default.volt b/src/opnsense/mvc/app/views/layouts/default.volt
index 85647d96e..575379bf8 100644
--- a/src/opnsense/mvc/app/views/layouts/default.volt
+++ b/src/opnsense/mvc/app/views/layouts/default.volt
@@ -97,6 +97,23 @@
                         });
                         $("#menu_search_box").typeahead({
                             source: menusearch_items,
+                            matcher: function (item) {
+                                var ar = this.query.trim()
+                                if (ar == "") {
+                                    return false;
+                                }
+                                ar = ar.toLowerCase().split(/\s+/);
+                                if (ar.length == 0) {
+                                    return false;
+                                }
+                                var it = this.displayText(item).toLowerCase();
+                                for (var i = 0; i < ar.length; i++) {
+                                    if (it.indexOf(ar[i]) == -1) {
+                                        return false;
+                                    }
+                                }
+                                return true;
+                            },
                             afterSelect: function(item){
                                 window.location.href = item.id;
                             }
@@ -148,7 +165,7 @@
 						<li>
 							<form class="navbar-form" role="search">
 								<div class="input-group">
-									<input type="text" style="width: 250px;" class="form-control" placeholder="Search" data-provide="typeahead" id="menu_search_box">
+									<input type="text" style="width: 250px;" class="form-control" tabindex="1" placeholder="{{ lang._('Search') }}" data-provide="typeahead" id="menu_search_box">
 									<div class="input-group-btn">
 										<button class="btn btn-default" type="button"><i class="glyphicon glyphicon-search"></i></button>
 									</div>
diff --git a/src/opnsense/www/js/bootstrap3-typeahead.js b/src/opnsense/www/js/bootstrap3-typeahead.js
index 18ed69606..a9bee9d96 100644
--- a/src/opnsense/www/js/bootstrap3-typeahead.js
+++ b/src/opnsense/www/js/bootstrap3-typeahead.js
@@ -80,7 +80,7 @@
         // Updater can be set to any random functions via "options" parameter in constructor above.
         // Add null check for cases when upadter returns void or undefined.
         if (!newVal) {
-          newVal = "";	
+          newVal = "";
         }
         this.$element
           .val(this.displayText(newVal) || newVal)
@@ -109,11 +109,11 @@
 
       var element;
       if (this.shown) {
-      	element = this.$menu;
+	element = this.$menu;
       } else if (this.$appendTo) {
-      	element = this.$menu.appendTo(this.$appendTo);
+	element = this.$menu.appendTo(this.$appendTo);
       } else {
-      	element = this.$menu.insertAfter(this.$element);
+	element = this.$menu.insertAfter(this.$element);
       }
       element.css({
           top: pos.top + pos.height + scrollHeight
diff --git a/src/www/fbegin.inc b/src/www/fbegin.inc
index a570811ea..2af46f338 100644
--- a/src/www/fbegin.inc
+++ b/src/www/fbegin.inc
@@ -114,7 +114,7 @@ if($need_alert_display == true) {
           <li>
             <form class="navbar-form" role="search">
               <div class="input-group">
-                <input type="text" style="width: 250px;" class="form-control" placeholder="Search" data-provide="typeahead" id="menu_search_box">
+                <input type="text" style="width: 250px;" class="form-control" tabindex="1" placeholder="<?= htmlspecialchars(gettext('Search')) ?>" data-provide="typeahead" id="menu_search_box">
                 <div class="input-group-btn">
                   <button class="btn btn-default" type="button"><i class="glyphicon glyphicon-search"></i></button>
                 </div>
diff --git a/src/www/head.inc b/src/www/head.inc
index ec0d08b94..bc5c90a21 100644
--- a/src/www/head.inc
+++ b/src/www/head.inc
@@ -201,6 +201,23 @@ $pagetitle .= sprintf(' | %s.%s', $config['system']['hostname'], $config['system
               });
               $("#menu_search_box").typeahead({
                   source: menusearch_items,
+                  matcher: function (item) {
+                      var ar = this.query.trim()
+                      if (ar == "") {
+                          return false;
+                      }
+                      ar = ar.toLowerCase().split(/\s+/);
+                      if (ar.length == 0) {
+                          return false;
+                      }
+                      var it = this.displayText(item).toLowerCase();
+                      for (var i = 0; i < ar.length; i++) {
+                          if (it.indexOf(ar[i]) == -1) {
+                              return false;
+                          }
+                      }
+                      return true;
+                  },
                   afterSelect: function(item){
                       window.location.href = item.id;
                   }