unified search in header bar. still todo: searches in modals

wagtail/wagtailadmin/static/wagtailadmin/css/components/forms.less

@@ -563,7 +563,7 @@ ul.inline li:first-child, li.inline:first-child{
 }
 
 
-/* search bars  (search integrated into header area) */
+/* search bars (search integrated into header area) */
 .search-bar{
     margin-top:-2em;
     padding-top:1em;

wagtail/wagtailadmin/static/wagtailadmin/js/core.js

@@ -106,4 +106,29 @@ $(function(){
     $('#menu-search').bind('focus click', function(){
         $(this).addClass('focussed');
     });
+
+    /* Header search behaviour */
+    var search_current_index = 0;
+    var search_next_index = 0;
+
+    $(window.headerSearch.termInput).on('input', function() {
+        clearTimeout($.data(this, 'timer'));
+        var wait = setTimeout(search, 200);
+        $(this).data('timer', wait);
+    });   
+
+    function search () {
+        search_next_index++;
+        var index = search_next_index;
+        $.ajax({
+            url: window.headerSearch.url,
+            data: {q: $(window.headerSearch.termInput).val()},
+            success: function(data, status) {
+                if (index > search_current_index) {
+                    search_current_index = index;
+                    $(window.headerSearch.targetOutput).html(data);
+                }
+            },
+        });
+    };
 });

wagtail/wagtailadmin/templates/wagtailadmin/chooser/_search_behaviour.js

@@ -1,6 +1,7 @@
 modal.ajaxifyForm($('form.search-bar', modal.body));
 
 var searchUrl = $('form.search-bar', modal.body).attr('action');
+
 function search() {
     $.ajax({
         url: searchUrl,
@@ -12,6 +13,7 @@ function search() {
     });
     return false;
 }
+
 $('#id_q', modal.body).on('input', function() {
     clearTimeout($.data(this, 'timer'));
     var wait = setTimeout(search, 200);

wagtail/wagtailadmin/templates/wagtailadmin/pages/_editor_js.html

@@ -31,7 +31,7 @@
     <script src="{{ STATIC_URL }}admin/js/urlify.js"></script>
 {% endcompress %}
 
-<script type='text/javascript'>
+<script>
     window.chooserUrls = {
         'documentChooser': '{% url "wagtaildocs_chooser" %}',
         'imageChooser': '{% url "wagtailimages_chooser" %}',
@@ -39,9 +39,7 @@
         'pageChooser': '{% url "wagtailadmin_choose_page" %}',
         'snippetChooser': '{% url "wagtailsnippets_choose_generic" %}'
     };
-</script>
 
-<script>
     (function() {
         function fixPrefix(str) {return str;}
 

wagtail/wagtailadmin/templates/wagtailadmin/pages/search.html

@@ -3,35 +3,11 @@
 {% block bodyclass %}menu-search{% endblock %}
 {% block extra_js %}
     <script>
-        $('#id_q').on('input', function() {
+        window.headerSearch = {
-            clearTimeout($.data(this, 'timer'));
+            url: "{% url 'wagtailadmin_pages_search' %}",
-            var wait = setTimeout(search, 200);
+            termInput: "#id_q",
-            $(this).data('timer', wait);
+            targetOutput: "#page-results"
-        });
+        }
-        $('a.suggested-tag').click(function() {
-            $('#id_q').val($(this).text());
-            search();
-            return false;
-        })
-
-        // These variables keep track of ajax requests to prevent an older request from replacing a new one
-        var search_current_index = 0;
-        var search_next_index = 0;
-
-        function search () {
-            search_next_index++;
-            var index = search_next_index;
-            $.ajax({
-                url: "{%url 'wagtailadmin_pages_search' %}",
-                data: {q: $('#id_q').val()},
-                success: function(data, status) {
-                    if (index > search_current_index) {
-                        search_current_index = index;
-                        $('#page-results').html(data);
-                    }
-                },
-            });
-        };
     </script>
 {% endblock %}
 

wagtail/wagtaildocs/templates/wagtaildocs/documents/index.html

@@ -3,29 +3,11 @@
 {% block bodyclass %}menu-documents{% endblock %}
 {% block extra_js %}
     <script>
-        $('#id_q').on('input', function() {
+        window.headerSearch = {
-            clearTimeout($.data(this, 'timer'));
+            url: "{% url 'wagtaildocs_index' %}",
-            var wait = setTimeout(search, 200);
+            termInput: "#id_q",
-            $(this).data('timer', wait);
+            targetOutput: "#document-results"
-        });
+        }
-
-        var search_current_index = 0;
-        var search_next_index = 0;
-
-        function search () {
-            search_next_index++;
-            var index = search_next_index;
-            $.ajax({
-                url: "{% url 'wagtaildocs_index' %}",
-                data: {q: $('#id_q').val()},
-                success: function(data, status) {
-                    if (index > search_current_index) {
-                        search_current_index = index;
-                        $('#document-results').html(data);
-                    }
-                },
-            });
-        };
     </script>
 {% endblock %}
 

wagtail/wagtailimages/templates/wagtailimages/images/index.html

@@ -5,35 +5,11 @@
 {% block bodyclass %}menu-images{% endblock %}
 {% block extra_js %}
     <script>
-        $('#id_q').on('input', function() {
+        window.headerSearch = {
-            clearTimeout($.data(this, 'timer'));
+            url: "{% url 'wagtailimages_index' %}",
-            var wait = setTimeout(search, 200);
+            termInput: "#id_q",
-            $(this).data('timer', wait);
+            targetOutput: "#image-results"
-        });
+        }
-        $('a.suggested-tag').click(function() {
-            $('#id_q').val($(this).text());
-            search();
-            return false;
-        })
-
-        // These variables keep track of ajax requests to prevent an older request from replacing a new one
-        var search_current_index = 0;
-        var search_next_index = 0;
-
-        function search () {
-            search_next_index++;
-            var index = search_next_index;
-            $.ajax({
-                url: "{% url 'wagtailimages_index' %}",
-                data: {q: $('#id_q').val()},
-                success: function(data, status) {
-                    if (index > search_current_index) {
-                        search_current_index = index;
-                        $('#image-results').html(data);
-                    }
-                },
-            });
-        };
     </script>
 {% endblock %}
 

wagtail/wagtailredirects/templates/wagtailredirects/index.html

@@ -4,30 +4,11 @@
 
 {% block extra_js %}
     <script>
-        $('#id_q').on('input', function() {
+        window.headerSearch = {
-            clearTimeout($.data(this, 'timer'));
+            url: "{% url 'wagtailredirects_index' %}",
-            var wait = setTimeout(search, 200);
+            termInput: "#id_q",
-            $(this).data('timer', wait);
+            targetOutput: "#redirects-results"
-        });
+        }
-
-        var search_current_index = 0;
-        var search_next_index = 0;
-
-        function search () {
-            search_next_index++;
-            var index = search_next_index;
-            $.ajax({
-                url: "{%url 'wagtailredirects_index' %}",
-                data: {q: $('#id_q').val()},
-                success: function(data, status) {
-                    console.log('here')
-                    if (index > search_current_index) {
-                        search_current_index = index;
-                        $('#redirects-results').html(data);
-                    }
-                },
-            });
-        };
     </script>
 {% endblock %}
 

wagtail/wagtailsearch/templates/wagtailsearch/editorspicks/index.html

@@ -4,30 +4,11 @@
 
 {% block extra_js %}
     <script>
-        $('#id_q').on('input', function() {
+        window.headerSearch = {
-            clearTimeout($.data(this, 'timer'));
+            url: "{% url 'wagtailsearch_editorspicks_index' %}",
-            var wait = setTimeout(search, 200);
+            termInput: "#id_q",
-            $(this).data('timer', wait);
+            targetOutput: "#editorspicks-results"
-        });
+        }
-
-        var search_current_index = 0;
-        var search_next_index = 0;
-
-        function search () {
-            search_next_index++;
-            var index = search_next_index;
-            $.ajax({
-                url: "{%url 'wagtailsearch_editorspicks_index' %}",
-                data: {q: $('#id_q').val()},
-                success: function(data, status) {
-                    console.log('here')
-                    if (index > search_current_index) {
-                        search_current_index = index;
-                        $('#editorspicks-results').html(data);
-                    }
-                },
-            });
-        };
     </script>
 {% endblock %}
 

wagtail/wagtailusers/templates/wagtailusers/index.html

@@ -4,29 +4,11 @@
 {% block bodyclass %}menu-users{% endblock %}
 {% block extra_js %}
     <script>
-        $('#id_q').on('input', function() {
+        window.headerSearch = {
-            clearTimeout($.data(this, 'timer'));
+            url: "{% url 'wagtailusers_index' %}",
-            var wait = setTimeout(search, 200);
+            termInput: "#id_q",
-            $(this).data('timer', wait);
+            targetOutput: "#user-results"
-        });
+        }
-
-        var search_current_index = 0;
-        var search_next_index = 0;
-
-        function search () {
-            search_next_index++;
-            var index = search_next_index;
-            $.ajax({
-                url: "{% url 'wagtailusers_index' %}",
-                data: {q: $('#id_q').val()},
-                success: function(data, status) {
-                    if (index > search_current_index) {
-                        search_current_index = index;
-                        $('#user-results').html(data);
-                    }
-                },
-            });
-        };
     </script>
 {% endblock %}