diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js index 9097d83..674a433 100644 --- a/app/assets/javascripts/application.js +++ b/app/assets/javascripts/application.js @@ -12,4 +12,4 @@ // //= require jquery //= require jquery_ujs -//= require_tree . +//= require_tree . \ No newline at end of file diff --git a/app/assets/javascripts/keybindings.js b/app/assets/javascripts/keybindings.js new file mode 100644 index 0000000..20d31e4 --- /dev/null +++ b/app/assets/javascripts/keybindings.js @@ -0,0 +1,62 @@ +$(function() { + + var selectedClass = 'selected'; + var searchField = $("#search-form #q"); + + searchField.select(); + + Mousetrap.bind(['down'], function(e) { + navigateList('down', $("ul.search-results li:first")); + haltEvent(e); + }); + + Mousetrap.bind(['up'], function(e) { + navigateList('up', $("ul.search-results li:last")); + haltEvent(e); + }); + + Mousetrap.bind(['enter', 'o'], function(e) { + if(goToSelectedResult()) { + haltEvent(e); + } + }); + + Mousetrap.bind(['/', 's', 'escape'], function(e) { + searchField.focus().select(); + $("ul.search-results li.selected").removeClass(selectedClass); + haltEvent(e); + }); + + var haltEvent = function(event) { + event.stopPropagation(); + event.preventDefault(); + }; + + // direction == up|down + var navigateList = function(direction, defaultEl) { + + previouslySelectedEl = $("ul.search-results li.selected"); + + if(previouslySelectedEl.size() <= 0) { + defaultEl.addClass(selectedClass); + searchField.blur(); + } else { + previouslySelectedEl.removeClass(selectedClass); + newlySelectedEl = direction == 'up' ? previouslySelectedEl.prev() : previouslySelectedEl.next(); + newlySelectedEl.addClass(selectedClass); + if(newlySelectedEl.size() <= 0) { + searchField.focus(); + } + } + } + + var goToSelectedResult = function() { + selectedEl = $("ul.search-results li.selected"); + if(selectedEl.size() >= 1) { + location.href = selectedEl.find("a.gist-url").attr('href'); + return true; + } else { + return false; + } + }; +}); \ No newline at end of file diff --git a/app/assets/javascripts/mousetrap.min.js b/app/assets/javascripts/mousetrap.min.js new file mode 100644 index 0000000..124775d --- /dev/null +++ b/app/assets/javascripts/mousetrap.min.js @@ -0,0 +1,8 @@ +/* mousetrap v1.1.4 craig.is/killing/mice */ +(function(){function q(a,c,b){if(a.addEventListener)return a.addEventListener(c,b,!1);a.attachEvent("on"+c,b)}function w(a){return"keypress"==a.type?String.fromCharCode(a.which):h[a.which]?h[a.which]:x[a.which]?x[a.which]:String.fromCharCode(a.which).toLowerCase()}function r(a){var a=a||{},c=!1,b;for(b in l)a[b]?c=!0:l[b]=0;c||(n=!1)}function y(a,c,b,d,F){var g,e,f=[],i=b.type;if(!k[a])return[];"keyup"==i&&s(a)&&(c=[a]);for(g=0;gd||h.hasOwnProperty(d)&&(p[h[d]]=d)}b=p[a]? +"keydown":"keypress"}"keypress"==b&&c.length&&(b="keydown");return b}function A(a,c,b,d,f){var a=a.replace(/\s+/g," "),g=a.split(" "),e,h,i=[];if(1":".","?":"/","|":"\\"},C={option:"alt",command:"meta","return":"enter",escape:"esc"},p,k={},j={},l={},B,v=!1,n=!1,f=1;20>f;++f)h[111+f]="f"+f;for(f=0;9>=f;++f)h[f+96]=f;q(document,"keypress",u);q(document,"keydown",u);q(document,"keyup",u);var E={bind:function(a,c,b){for(var d=a instanceof Array?a:[a],f=0;f 'gist-url') end def files_display(result) diff --git a/app/views/gists/search.html.haml b/app/views/gists/search.html.haml index fd7fe78..1aac536 100644 --- a/app/views/gists/search.html.haml +++ b/app/views/gists/search.html.haml @@ -1,24 +1,23 @@ +%style(type="text/css") + :sass + ul.search-results + list-style-type: none + li:nth-child(even) + background: #EEE + li.selected + background: #999 + %p - = form_tag(search_gists_path, :method => "get") do + = form_tag(search_gists_path, :method => "get", :id => "search-form") do = label_tag(:q, "Search your gists:") - = text_field_tag(:q, params[:q]) + = text_field_tag(:q, params[:q], :size => 50, :class => "mousetrap") = submit_tag("Go") = "(last indexed: #{current_user.last_gh_fetch ? current_user.last_gh_fetch.to_formatted_s(:short) : "not yet"})" - if @results.size > 0 - %ul + %ul.search-results - for result in @results %li %p= search_result_link(result) - / %p= result.inspect - / %p.files= files_display(result) - / - if(result.highlight && result.highlight[:'files.content']) - / - highlights = result.highlight[:'files.content'] - / %span.matches= highlights[0..(highlights.size < 2 ? -1 : 1)].join(' . . . ') - else - %p= "No results found for \"#{params[:q]}\"" - -:javascript - $(function() { - $('#q').select(); - }) \ No newline at end of file + %p= "No results found for \"#{params[:q]}\"" \ No newline at end of file