Blur search input when hidding search bar

theme/javascript/core/keyboard.js

@@ -2,8 +2,9 @@ define([
     "jQuery",
     "Mousetrap",
     "core/navigation",
-    "core/sidebar"
-], function($, Mousetrap, navigation, sidebar){
+    "core/sidebar",
+    "core/search"
+], function($, Mousetrap, navigation, sidebar, search){
     // Bind keyboard shortcuts
     var init = function() {
         // Next
@@ -26,12 +27,13 @@ define([
 
         // Toggle Search
         Mousetrap.bind(['f'], function(e) {
-            sidebar.toggleSearch();
+            search.toggle();
             return false;
         });
     };
 
     return {
-        init: init
+        init: init,
+        search: search
     };
 });

theme/javascript/core/search.js

@@ -2,8 +2,11 @@ define([
     "jQuery",
     "lodash",
     "lunr",
-], function($, _, lunr) {
+    "core/state",
+    "core/sidebar"
+], function($, _, lunr, state, sidebar) {
     var index = null;
+    var $searchInput = sidebar.$el.find(".book-search input");
 
     // Load complete index
     var loadIndex = function() {
@@ -29,13 +32,52 @@ define([
         return results;
     };
 
+    // Toggle search bar
+    var toggleSearch = function(_state) {
+        if (state != null && isSearchOpen() == _state) return;
+
+        
+        sidebar.$el.toggleClass("with-search", _state);
+
+        // If search bar is open: focus input
+        if (isSearchOpen()) {
+            $searchInput.focus();
+        } else {
+            $searchInput.blur();
+        }
+    };
+
+    // Return true if search bar is open
+    var isSearchOpen = function() {
+        return sidebar.$el.hasClass("with-search");
+    };
+
 
     var init = function() {
         loadIndex();
+
+        // Toggle search
+        state.$book.find(".book-header .toggle-search").click(function(e) {
+            e.preventDefault();
+            toggleSearch();
+        });
+
+        $searchInput.keyup(function(e) {
+            var key = (e.keyCode ? e.keyCode : e.which);
+            var q = $(this).val();
+
+            if (key == 27) {
+                e.preventDefault();
+                toggleSearch(false);
+                return;
+            }
+            console.log("search", q);
+        });
     };
 
     return {
         init: init,
-        search: search
+        search: search,
+        toggle: toggleSearch
     };
 });

theme/javascript/core/sidebar.js

@@ -1,12 +1,9 @@
 define([
     "utils/storage",
     "utils/platform",
-    "core/state",
-    "core/search"
-], function(storage, platform, state, search) {
+    "core/state"
+], function(storage, platform, state) {
     var $summary = state.$book.find(".book-summary");
-    var $searchInput = $summary.find(".book-search input")
-
 
     // Toggle sidebar with or withour animation
     var toggleSidebar = function(_state, animation) {
@@ -19,31 +16,11 @@ define([
         storage.set("sidebar", isOpen());
     };
 
-    // Toggle search
-    var toggleSearch = function(_state) {
-        if (state != null && isSearchOpen() == _state) return;
-
-        
-        $summary.toggleClass("with-search", _state);
-
-        // If search bar is open: focus input
-        if (isSearchOpen()) {
-            $searchInput.focus();
-        } else {
-
-        }
-    };
-
     // Return true if sidebar is open
     var isOpen = function() {
         return state.$book.hasClass("with-summary");
     };
 
-    // Return true if search bar is open
-    var isSearchOpen = function() {
-        return $summary.hasClass("with-search");
-    };
-
     // Prepare sidebar: state and toggle button
     var init = function() {
         // Toggle summary
@@ -56,29 +33,11 @@ define([
         if (!platform.isMobile) {
             toggleSidebar(storage.get("sidebar", true), false);
         }
-
-        // Toggle search
-        state.$book.find(".book-header .toggle-search").click(function(e) {
-            e.preventDefault();
-            toggleSearch();
-        });
-
-        $searchInput.keyup(function(e) {
-            var key = (e.keyCode ? e.keyCode : e.which);
-            var q = $(this).val();
-
-            if (key == 27) {
-                e.preventDefault();
-                toggleSearch(false);
-                return;
-            }
-            console.log("search", q);
-        });
     };
 
     return {
+        $el: $summary,
         init: init,
-        toggle: toggleSidebar,
-        toggleSearch: toggleSearch
+        toggle: toggleSidebar
     }
 });