Partially implemented CSE API search
h3rald h3rald@h3rald.com
Sun, 16 Feb 2014 18:52:47 +0100
4 files changed,
43 insertions(+),
20 deletions(-)
M
content/js/init.js
→
content/js/init.js
@@ -16,5 +16,20 @@ lightboxHTML: null,
showToAllBrowsers: false }; sevenUp.plugin.black.test(sevenup_options, false); + // Search + $("#h3rald-search-btn").click(function(){ + h3rald_search(); + }) + $("#h3rald-search-box").keydown(function(e){ + q = $("#h3rald-search-box").val(); + if (q.length == 1){ + $("#h3rald-search-results").addClass("hidden"); + $("#main").show(); + } + if (e.which == 13) { + e.preventDefault(); + h3rald_search(); + } + }) });
M
content/js/search.js
→
content/js/search.js
@@ -1,7 +1,20 @@
-(function() { - var cx = '003503231605187715852:_cygcrnuzrg'; - var gcse = document.createElement('script'); gcse.type = 'text/javascript'; gcse.async = true; - gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') + - '//www.google.com/cse/cse.js?cx=' + cx; - var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(gcse, s); -})(); +function h3rald_search(){ + var q = $("#h3rald-search-box"); + var rs = $("#h3rald-search-results"); + $.get("https://www.googleapis.com/customsearch/v1?key=AIzaSyD3AAPBIEBeujPRhfEAEp0rxm0_gBVm104&cx=003503231605187715852:_cygcrnuzrg&q="+q.val(), function( data ) { + rs.empty(); + var info = data.searchInformation; + $("main").hide(); + rs.removeClass("hidden"); + rs.append("<h2>Search results for <em>"+data.queries.request[0].searchTerms+"</em></h2>"); + $.each(data.items, function(i, e){ + var res = $("<section class=\"search-result\"></section>"); + var rel_url = e.link.replace(/^https?:\/\/h3rald.com/, ''); + var link = function(title){ return "<a href=\""+rel_url+"\">"+title+"</a>"} + res.append("<h3>"+link(e.htmlTitle)+"</h3>"); + res.append("<p class=\"search-result-link\">"+link("h3rald.com"+rel_url)+"</p>"); + res.append("<p class=\"search-result-snippet\">"+e.htmlSnippet.replace("<br>", "")+"</p>"); + rs.append(res); + }); + }); +}
M
layouts/default.erb
→
layouts/default.erb
@@ -55,14 +55,12 @@ <script src="/js/bootstrap.js" type="text/javascript"></script>
</head> <body> <div id="wrap"> + <%= render 'header' %> + <div class="hidden container" id="h3rald-search-results"></div> + <main id="main" class="container"> <% if @item[:permalink] == 'home' then %> - <%= render 'header' %> - <div class="container"> <%= yield %> - </div> <% else %> - <%= render 'header', :item => @item %> - <main class="container clear-top"> <article class="page"> <%= render 'page_meta', :item => @item %> <section id="body-text" class="hyphenate">@@ -73,8 +71,8 @@ <% if @item[:type] == 'article' then %>
<%= render 'legacy_comments', :item => @item if @item[:comments] %> <%= render 'comments', :item => @item %> <% end %> - </main> <% end %> + </main> <%= render 'footer' %> <% if @item[:type] == 'article' then %> <script type="text/javascript">
M
layouts/header.erb
→
layouts/header.erb
@@ -34,18 +34,15 @@ <li<%=active_if("tags")%>><a href="/tags/">TAGS</a></li>
<li<%=active_if("archives")%>><a href="/archives/">ARCHIVES</a></li> <li<%=active_if("about")%>><a href="/about/">ABOUT</a></li> </ul> - <form class="navbar-form"> + <div class="navbar-form"> <div class="input-group"> - <input type="text" class="form-control" placeholder="Search" id="searchbox"> + <input type="text" class="form-control" name="q" placeholder="Search" id="h3rald-search-box"> <span class="input-group-btn"> - <button class="btn btn-default" type="button"><i class="fa fa-search"></i></button> + <button class="btn btn-default" id="h3rald-search-btn" type="button"><i class="fa fa-search"></i></button> </span> </div> - </form> + </div> </div> </div> </div> </header> -<div id="search_results"> - <div class="gcse-searchresults" data-linkTarget="_top"></div> -</div>