null+****@clear*****
null+****@clear*****
2012年 7月 10日 (火) 12:47:06 JST
Yoji SHIDARA 2012-07-10 12:47:06 +0900 (Tue, 10 Jul 2012) New Revision: 5da889451e1e6c72bd1292765912014ae094f8e0 https://github.com/groonga/gcs/commit/5da889451e1e6c72bd1292765912014ae094f8e0 Log: Implement pager on web dashboard. Closes #33 Modified files: public/javascripts/gcs.js views/index.jade views/layout.jade Modified: public/javascripts/gcs.js (+38 -7) =================================================================== --- public/javascripts/gcs.js 2012-07-10 10:34:27 +0900 (56c698b) +++ public/javascripts/gcs.js 2012-07-10 12:47:06 +0900 (79fd616) @@ -1,7 +1,36 @@ -function renderResults(data) { +function renderResults(data, perPage) { var template = $('script#results-template').text(); var rendered = jade.compile(template)(data); + var found = data.hits.found; + var start = data.hits.start; + var returned = data.hits.hit.length; + var nextStart = start + perPage; + var previousStart = data.hits.start - perPage; $('#results').html(rendered); + + if (previousStart < 0) { + $('#pager .previous').addClass('disabled'); + $('#pager .previous a').click(function() { return false; }); + } else { + $('#pager .previous a').click(function() { + $('form#search input[name="start"]').val(previousStart); + searchExecute(); + }); + } + + if (nextStart >= data.hits.found) { + $('#pager .next').addClass('disabled'); + $('#pager .previous a').click(function() { return false; }); + } else { + $('#pager .next a').click(function() { + $('form#search input[name="start"]').val(nextStart); + searchExecute(); + }); + } + + var from = start + 1; + var to = start + returned; + $('#showing').text('Showing ' + from + ' to ' + to + ' of ' + found + ' Results'); } function renderRequestInformation(data) { @@ -10,22 +39,24 @@ function renderRequestInformation(data) { $('#request-information').html(rendered); } -function onSearch() { +function searchExecute() { var query = $('form#search input[name="query"]').val(); var domain = $('form#domain input[name="domain-name"]').val(); var searchEndpoint = 'http://search-' + domain + '-00000000000000000000000000.localhost:7575/2011-02-01/search'; - var params = {q: query}; + var perPage = 5; + var start = parseInt($('form#search input[name="start"]').val() || '0', 10); + var params = {q: query, size: perPage, start: start}; var urlForRawRequest = searchEndpoint + '?' + jQuery.param(params); renderRequestInformation({urlForRawRequest: urlForRawRequest}); - $('#results').hide(); + $('#results').empty(); $.ajax({ type: 'GET', url: searchEndpoint, data: params, dataType: 'jsonp', success: function(data) { - renderResults(data); + renderResults(data, perPage); $('#results').show(); } }); @@ -33,6 +64,6 @@ function onSearch() { } $(document).ready(function($) { - $('form#domain').submit(onSearch); - $('form#search').submit(onSearch); + $('form#domain').submit(searchExecute); + $('form#search').submit(searchExecute); }); Modified: views/index.jade (+1 -0) =================================================================== --- views/index.jade 2012-07-10 10:34:27 +0900 (c17ffef) +++ views/index.jade 2012-07-10 12:47:06 +0900 (9e8add1) @@ -1,6 +1,7 @@ form#search.form-search input.search-query(type="text", name="query", value="") input.btn(type="submit", value="Search") + input(type="hidden", name="start", value="") #request-information #results Modified: views/layout.jade (+7 -1) =================================================================== --- views/layout.jade 2012-07-10 10:34:27 +0900 (27778d1) +++ views/layout.jade 2012-07-10 12:47:06 +0900 (1835a60) @@ -12,11 +12,17 @@ html | span view raw: | a(href=urlForRawRequest, target='_blank')= urlForRawRequest script#results-template(type="text/html") + |p#showing + |.pager#pager + | li.previous + | a(href="#") ← Previous + | li.next + | a(href="#") Next → |table.table.table-bordered | if hits.hit.length > 0 | each record, index in hits.hit | tr.id-row - | td= index + 1 + | td= hits.start + index + 1 | td.id-cell(colspan="2")= record.id | each value, columnName in record.data | tr -------------- next part -------------- HTML$B$NE:IU%U%!%$%k$rJ]4I$7$^$7$?(B...下载