From 063a4e56288f49da3ae6fc96c31f1519566537ac Mon Sep 17 00:00:00 2001 From: Julian Lam Date: Fri, 29 Aug 2014 11:48:30 -0400 Subject: [PATCH] finished up UX integration for in-topic searching, added mousetrap lib to capture ctrl-F only in topic view, closed #1800 --- public/language/en_GB/search.json | 3 ++- public/src/ajaxify.js | 6 ++++- public/src/app.js | 31 +++++++++++++++++++------- public/src/modules/search.js | 33 ++++++++++++++-------------- public/vendor/mousetrap/mousetrap.js | 9 ++++++++ src/meta/js.js | 1 + 6 files changed, 56 insertions(+), 27 deletions(-) create mode 100644 public/vendor/mousetrap/mousetrap.js diff --git a/public/language/en_GB/search.json b/public/language/en_GB/search.json index 20d27c2a46..81c404a591 100644 --- a/public/language/en_GB/search.json +++ b/public/language/en_GB/search.json @@ -1,3 +1,4 @@ { - "results_matching": "%1 result(s) matching \"%2\", (%3 seconds)" + "results_matching": "%1 result(s) matching \"%2\", (%3 seconds)", + "no-matches": "No posts found" } \ No newline at end of file diff --git a/public/src/ajaxify.js b/public/src/ajaxify.js index f0a7f92d9b..9fa4b16262 100644 --- a/public/src/ajaxify.js +++ b/public/src/ajaxify.js @@ -116,10 +116,14 @@ $(document).ready(function() { ajaxify.initialLoad = false; app.refreshTitle(url); - }, animationDuration * 1000 - ((new Date()).getTime() - startTime)) + }, animationDuration * 1000 - ((new Date()).getTime() - startTime)); }); }); + + require(['search'], function(search) { + search.topicDOM.end(); + }); }); return true; diff --git a/public/src/app.js b/public/src/app.js index f7965a518d..a3bf1f9d81 100644 --- a/public/src/app.js +++ b/public/src/app.js @@ -419,11 +419,20 @@ var socket, searchFields = $("#search-fields"), searchInput = $('#search-fields input'); + $('#search-form').on('submit', dismissSearch); + searchInput.on('blur', dismissSearch); + function dismissSearch(){ searchFields.hide(); searchButton.show(); } + function prepareSearch() { + searchFields.removeClass('hide').show(); + searchButton.hide(); + searchInput.focus(); + } + searchButton.on('click', function(e) { if (!config.loggedIn && !config.allowGuestSearching) { app.alert({ @@ -435,17 +444,11 @@ var socket, } e.stopPropagation(); - searchFields.removeClass('hide').show(); - $(this).hide(); - - searchInput.focus(); - - $('#search-form').on('submit', dismissSearch); - searchInput.on('blur', dismissSearch); + prepareSearch(); return false; }); - require(['search'], function(search) { + require(['search', 'mousetrap'], function(search, Mousetrap) { $('#search-form').on('submit', function (e) { e.preventDefault(); var input = $(this).find('input'), @@ -464,6 +467,18 @@ var socket, .on('click', '.next', function() { search.topicDOM.next(); }); + + Mousetrap.bind('ctrl+f', function(e) { + // If in topic, open search window and populate, otherwise regular behaviour + var match = ajaxify.currentPage.match(/^topic\/([\d]+)/), + tid; + if (match) { + e.preventDefault(); + tid = match[1]; + searchInput.val('in:topic-' + tid + ' '); + prepareSearch(); + } + }); }); } diff --git a/public/src/modules/search.js b/public/src/modules/search.js index 7de1f33395..aa035367a8 100644 --- a/public/src/modules/search.js +++ b/public/src/modules/search.js @@ -51,16 +51,6 @@ define('search', ['navigator'], function(nav) { }; Search.topicDOM = {}; - Search.topicDOM.start = function() { - var topicSearchEl = $('.topic-search'); - - topicSearchEl.find('.count').html('1 / ' + Search.current.results.length); - topicSearchEl.removeClass('hidden'); - Search.checkPagePresence(Search.current.tid, function() { - Search.highlightResult(0); - }); - }; - Search.topicDOM.prev = function() { Search.topicDOM.update((Search.current.index === 0) ? Search.current.results.length-1 : Search.current.index-1); }; @@ -71,17 +61,26 @@ define('search', ['navigator'], function(nav) { Search.topicDOM.update = function(index) { var topicSearchEl = $('.topic-search'); - Search.current.index = index; - topicSearchEl.find('.count').html((index+1) + ' / ' + Search.current.results.length); - topicSearchEl.removeClass('hidden'); - Search.checkPagePresence(Search.current.tid, function() { - socket.emit('posts.getPidIndex', Search.current.results[index], function(err, postIndex) { - nav.scrollToPost(postIndex-1, true); // why -1? Ask @barisusakli + if (Search.current.results.length > 0) { + topicSearchEl.find('.count').html((index+1) + ' / ' + Search.current.results.length); + topicSearchEl.removeClass('hidden').find('.prev, .next').removeAttr('disabled'); + Search.checkPagePresence(Search.current.tid, function() { + socket.emit('posts.getPidIndex', Search.current.results[index], function(err, postIndex) { + nav.scrollToPost(postIndex-1, true); // why -1? Ask @barisusakli + }); }); - }); + } else { + translator.translate('[[search:no-matches]]', function(text) { + topicSearchEl.find('.count').html(text); + }); + topicSearchEl.removeClass('hidden').find('.prev, .next').attr('disabled', 'disabled'); + } + }; + Search.topicDOM.end = function() { + $('.topic-search').addClass('hidden'); }; return Search; diff --git a/public/vendor/mousetrap/mousetrap.js b/public/vendor/mousetrap/mousetrap.js new file mode 100644 index 0000000000..01709ffd9a --- /dev/null +++ b/public/vendor/mousetrap/mousetrap.js @@ -0,0 +1,9 @@ +/* mousetrap v1.4.6 craig.is/killing/mice */ +(function(J,r,f){function s(a,b,d){a.addEventListener?a.addEventListener(b,d,!1):a.attachEvent("on"+b,d)}function A(a){if("keypress"==a.type){var b=String.fromCharCode(a.which);a.shiftKey||(b=b.toLowerCase());return b}return h[a.which]?h[a.which]:B[a.which]?B[a.which]:String.fromCharCode(a.which).toLowerCase()}function t(a){a=a||{};var b=!1,d;for(d in n)a[d]?b=!0:n[d]=0;b||(u=!1)}function C(a,b,d,c,e,v){var g,k,f=[],h=d.type;if(!l[a])return[];"keyup"==h&&w(a)&&(b=[a]);for(g=0;gg||h.hasOwnProperty(g)&&(p[h[g]]=g)}e=p[d]?"keydown":"keypress"}"keypress"==e&&f.length&&(e="keydown");return{key:c,modifiers:f,action:e}}function F(a,b,d,c,e){q[a+":"+d]=b;a=a.replace(/\s+/g," ");var f=a.split(" ");1":".","?":"/","|":"\\"},G={option:"alt",command:"meta","return":"enter",escape:"esc",mod:/Mac|iPod|iPhone|iPad/.test(navigator.platform)?"meta":"ctrl"},p,l={},q={},n={},D,z=!1,I=!1,u=!1;for(f=1;20>f;++f)h[111+f]="f"+f;for(f=0;9>=f;++f)h[f+96]=f;s(r,"keypress",y);s(r,"keydown",y);s(r,"keyup",y);var m={bind:function(a,b,d){a=a instanceof Array?a:[a];for(var c=0;c