Skip to content

Commit

Permalink
refactoring of marker and hidden links in *_js helpers:
Browse files Browse the repository at this point in the history 
- MARKER renamed to MARK is simpler, static and hardcoded in pagy.js as well
- removed hidden links to bogus urls that were triggering crawlers to follow (#158)
- pagy_items_selector now works also with trim and in combination with other *nav_js helpers
- updated tests
  • Loading branch information
@ddnexus
ddnexus committed May 8, 2019
1 parent aa140e1 commit 1732dee
Show file tree
Hide file tree
Showing 25 changed files with 271 additions and 164 deletions.
27 changes: 25 additions & 2 deletions Rakefile
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,16 @@ require "rake/testtask"

Rake::TestTask.new(:test_main) do |t|
t.libs += %w[test lib]
t.test_files = FileList.new.include("test/**/*_test.rb").exclude('test/**/i18n_test.rb', 'test/**/items_test.rb', 'test/**/overflow_test.rb', 'test/**/trim_test.rb', 'test/**/elasticsearch_rails_test.rb', 'test/**/searchkick_test.rb', 'test/**/support_test.rb', 'test/**/shared_test.rb')
t.test_files = FileList.new.include("test/**/*_test.rb")
.exclude('test/**/i18n_test.rb',
'test/**/items_test.rb',
'test/**/overflow_test.rb',
'test/**/trim_test.rb',
'test/**/elasticsearch_rails_test.rb',
'test/**/searchkick_test.rb',
'test/**/support_test.rb',
'test/**/shared_test.rb',
'test/**/shared_combo_test.rb')
end

Rake::TestTask.new(:test_extra_i18n) do |t|
Expand Down Expand Up @@ -49,7 +58,21 @@ Rake::TestTask.new(:test_shared) do |t|
t.test_files = FileList['test/**/shared_test.rb']
end

task :test => [:test_main, :test_extra_items, :test_extra_i18n, :test_extra_overflow, :test_extra_trim, :test_extra_elasticsearch, :test_support, :test_shared ]
Rake::TestTask.new(:test_shared_combo) do |t|
t.libs += %w[test lib]
t.test_files = FileList['test/**/shared_combo_test.rb']
end


task :test => [ :test_main,
:test_extra_items,
:test_extra_i18n,
:test_extra_overflow,
:test_extra_trim,
:test_extra_elasticsearch,
:test_support,
:test_shared,
:test_shared_combo ]

if ENV['RUN_RUBOCOP']
require "rubocop/rake_task"
Expand Down
2 changes: 1 addition & 1 deletion docs/extras.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ Extras don't define any new module or class, they just re-open the `Pagy` class

## Methods

A few extras require the [pagy/extras/shared](https://github.com/ddnexus/pagy/blob/master/lib/pagy/extras/shared.rb) file. It defines only 3 methods used internally, so you don't actually need to use them directly.
A few extras require the [pagy/extras/shared](https://github.com/ddnexus/pagy/blob/master/lib/pagy/extras/shared.rb) file. It defines only a few methods used internally, so you don't actually need to use them directly.

**Notice**: All the other added methods are documented in the respective extras doc.

Expand Down
35 changes: 17 additions & 18 deletions lib/javascripts/pagy.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,12 +11,12 @@ Pagy.init = function(arg){
}
};

Pagy.nav = function(id, marker, tags, sequels){
Pagy.nav = function(id, tags, sequels){
var pagyEl = document.getElementById(id),
container = pagyEl.parentElement,
lastWidth = undefined,
timeoutId = 0,
marker_re = new RegExp(marker, 'g'),
markRE = new RegExp('--pagy.page--', 'g'),
widths = [];
for (var width in sequels) { widths.push(parseInt(width)) } // fine with sequels structure
widths.sort(function(a, b){return b-a});
Expand All @@ -33,9 +33,9 @@ Pagy.nav = function(id, marker, tags, sequels){
series = sequels[width];
for (i = 0, len = series.length; i < len; i++) {
var item = series[i];
if (typeof(item) === 'number') { html += tags.link.replace(marker_re, item) }
if (typeof(item) === 'number') { html += tags.link.replace(markRE, item) }
else if (item === 'gap') { html += tags.gap }
else if (typeof(item) === 'string') { html += tags.active.replace(marker_re, item) }
else if (typeof(item) === 'string') { html += tags.active.replace(markRE, item) }
}
html += tags.after;
pagyEl.insertAdjacentHTML('beforeend', html);
Expand All @@ -54,36 +54,36 @@ Pagy.nav = function(id, marker, tags, sequels){
render();
};

Pagy.combo_nav = function(id, marker, page, trim){
Pagy.combo_nav = function(id, page, links){
var pagyEl = document.getElementById(id),
input = pagyEl.getElementsByTagName('input')[0],
link = pagyEl.getElementsByTagName('a')[0],
linkP1 = pagyEl.getElementsByTagName('a')[1],
go = function(){
if (page !== input.value) {
if (trim === true && input.value === '1') { linkP1.click() }
else {
var href = link.getAttribute('href').replace(marker, input.value);
link.setAttribute('href', href);
link.click();
if (links.hasOwnProperty('trimmed') && input.value === '1') {
pagyEl.insertAdjacentHTML('afterbegin', links.trimmed);
} else {
pagyEl.insertAdjacentHTML('afterbegin', links.standard.replace('--pagy.page--', input.value));
}
pagyEl.getElementsByTagName('a')[0].click();
}
};
Pagy.addInputEventListeners(input, go);
};

Pagy.items_selector = function(id, marker, from){
Pagy.items_selector = function(id, from, links){
var pagyEl = document.getElementById(id),
input = pagyEl.getElementsByTagName('input')[0],
current = input.value,
link = pagyEl.getElementsByTagName('a')[0],
go = function(){
var items = input.value;
if (current !== items) {
var page = Math.max(Math.ceil(from / items),1);
var href = link.getAttribute('href').replace(marker+'-page-', page).replace(marker+'-items-', items);
link.setAttribute('href', href);
link.click();
if (links.hasOwnProperty('trimmed') && page === 1) {
pagyEl.insertAdjacentHTML('afterbegin', links.trimmed.replace('--pagy.items--', items));
} else {
pagyEl.insertAdjacentHTML('afterbegin', links.standard.replace('--pagy.page--', page).replace('--pagy.items--', items));
}
pagyEl.getElementsByTagName('a')[0].click();
}
};
Pagy.addInputEventListeners(input, go);
Expand All @@ -99,4 +99,3 @@ Pagy.addInputEventListeners = function(input, handler){
// … and when pressing enter inside the input
input.addEventListener('keyup', function(e){ if (e.which === 13) handler() }.bind(this));
};

25 changes: 11 additions & 14 deletions lib/pagy/extras/bootstrap.rb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,29 +29,26 @@ def pagy_bootstrap_nav_js(pagy, id=pagy_id)
link, p_prev, p_next = pagy_link_proc(pagy, 'class="page-link"'), pagy.prev, pagy.next
tags = { 'before' => p_prev ? %(<ul class="pagination"><li class="page-item prev">#{link.call p_prev, pagy_t('pagy.nav.prev'), 'aria-label="previous"'}</li>)
: %(<ul class="pagination"><li class="page-item prev disabled"><a href="#" class="page-link">#{pagy_t('pagy.nav.prev')}</a></li>),
'link' => %(<li class="page-item">#{marker = link.call(MARKER)}</li>),
'active' => %(<li class="page-item active">#{marker}</li>),
'link' => %(<li class="page-item">#{mark = link.call(MARK)}</li>),
'active' => %(<li class="page-item active">#{mark}</li>),
'gap' => %(<li class="page-item gap disabled"><a href="#" class="page-link">#{pagy_t('pagy.nav.gap')}</a></li>),
'after' => p_next ? %(<li class="page-item next">#{link.call p_next, pagy_t('pagy.nav.next'), 'aria-label="next"'}</li></ul>)
: %(<li class="page-item next disabled"><a href="#" class="page-link">#{pagy_t('pagy.nav.next')}</a></li></ul>) }
%(<nav id="#{id}" class="pagy-bootstrap-nav-js pagination" role="navigation" aria-label="pager"></nav>#{pagy_json_tag(:nav, id, MARKER, tags, pagy.sequels)})
%(<nav id="#{id}" class="pagy-bootstrap-nav-js pagination" role="navigation" aria-label="pager"></nav>#{pagy_json_tag(:nav, id, tags, pagy.sequels)})
end

# Javascript combo pagination for bootstrap: it returns a nav and a JSON tag used by the Pagy.combo_nav javascript
def pagy_bootstrap_combo_nav_js(pagy, id=pagy_id)
link, p_prev, p_next, p_page, p_pages = pagy_link_proc(pagy), pagy.prev, pagy.next, pagy.page, pagy.pages

html = %(<nav id="#{id}" class="pagy-bootstrap-combo-nav-js pagination" role="navigation" aria-label="pager">) \
+ link.call(MARKER, '', %(style="display: none;" ))
(html << link.call(1, '', %(style="display: none;" ))) if defined?(TRIM)
html << %(<div class="btn-group" role="group">)
html << (p_prev ? link.call(p_prev, pagy_t('pagy.nav.prev'), 'aria-label="previous" class="prev btn btn-primary"')
: %(<a class="prev btn btn-primary disabled" href="#">#{pagy_t('pagy.nav.prev')}</a>))
input = %(<input type="number" min="1" max="#{p_pages}" value="#{p_page}" class="text-primary" style="padding: 0; border: none; text-align: center; width: #{p_pages.to_s.length+1}rem;">)
html << %(<div class="pagy-combo-input btn btn-primary disabled" style="white-space: nowrap;">#{pagy_t('pagy.combo_nav_js', page_input: input, count: p_page, pages: p_pages)}</div>)
html << (p_next ? link.call(p_next, pagy_t('pagy.nav.next'), 'aria-label="next" class="next btn btn-primary"')
: %(<a class="next btn btn-primary disabled" href="#">#{pagy_t('pagy.nav.next')}</a>))
html << %(</div></nav>#{pagy_json_tag(:combo_nav, id, MARKER, p_page, !!defined?(TRIM))})
html = %(<nav id="#{id}" class="pagy-bootstrap-combo-nav-js pagination" role="navigation" aria-label="pager">) + %(<div class="btn-group" role="group">)
html << (p_prev ? link.call(p_prev, pagy_t('pagy.nav.prev'), 'aria-label="previous" class="prev btn btn-primary"')
: %(<a class="prev btn btn-primary disabled" href="#">#{pagy_t('pagy.nav.prev')}</a>))
input = %(<input type="number" min="1" max="#{p_pages}" value="#{p_page}" class="text-primary" style="padding: 0; border: none; text-align: center; width: #{p_pages.to_s.length+1}rem;">)
html << %(<div class="pagy-combo-input btn btn-primary disabled" style="white-space: nowrap;">#{pagy_t('pagy.combo_nav_js', page_input: input, count: p_page, pages: p_pages)}</div>)
html << (p_next ? link.call(p_next, pagy_t('pagy.nav.next'), 'aria-label="next" class="next btn btn-primary"')
: %(<a class="next btn btn-primary disabled" href="#">#{pagy_t('pagy.nav.next')}</a>))
html << %(</div></nav>#{pagy_json_tag(:combo_nav, id, p_page, pagy_links(link))})
end

end
Expand Down
24 changes: 11 additions & 13 deletions lib/pagy/extras/bulma.rb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,28 +34,26 @@ def pagy_bulma_nav_js(pagy, id=pagy_id)
+ (p_next ? link.call(p_next, pagy_t('pagy.nav.next'), 'class="pagination-next" aria-label="next page"')
: %(<a class="pagination-next" disabled>#{pagy_t('pagy.nav.next')}</a>)) \
+ '<ul class="pagination-list">' ),
'link' => %(<li>#{link.call(MARKER, MARKER, %(class="pagination-link" aria-label="goto page #{MARKER}"))}</li>),
'active' => %(<li>#{link.call(MARKER, MARKER, %(class="pagination-link is-current" aria-current="page" aria-label="page #{MARKER}"))}</li>),
'link' => %(<li>#{link.call(MARK, MARK, %(class="pagination-link" aria-label="goto page #{MARK}"))}</li>),
'active' => %(<li>#{link.call(MARK, MARK, %(class="pagination-link is-current" aria-current="page" aria-label="page #{MARK}"))}</li>),
'gap' => %(<li><span class="pagination-ellipsis">#{pagy_t('pagy.nav.gap')}</span></li>),
'after' => '</ul>' }
%(<nav id="#{id}" class="pagy-bulma-nav-js pagination is-centered" role="navigation" aria-label="pagination"></nav>#{pagy_json_tag(:nav, id, MARKER, tags, pagy.sequels)})
%(<nav id="#{id}" class="pagy-bulma-nav-js pagination is-centered" role="navigation" aria-label="pagination"></nav>#{pagy_json_tag(:nav, id, tags, pagy.sequels)})
end

# Javascript combo pagination for Bulma: it returns a nav and a JSON tag used by the Pagy.combo_nav javascript
def pagy_bulma_combo_nav_js(pagy, id=pagy_id)
link, p_prev, p_next, p_page, p_pages = pagy_link_proc(pagy), pagy.prev, pagy.next, pagy.page, pagy.pages

html = %(<nav id="#{id}" class="pagy-bulma-combo-nav-js" role="navigation" aria-label="pagination">) \
+ link.call(MARKER, '', 'style="display: none;"')
(html << link.call(1, '', %(style="display: none;"))) if defined?(TRIM)
html << %(<div class="field is-grouped is-grouped-centered" role="group">)
html << (p_prev ? %(<p class="control">#{link.call(p_prev, pagy_t('pagy.nav.prev'), 'class="button" aria-label="previous page"')}</p>)
: %(<p class="control"><a class="button" disabled>#{pagy_t('pagy.nav.prev')}</a></p>))
input = %(<input class="input" type="number" min="1" max="#{p_pages}" value="#{p_page}" style="padding: 0; text-align: center; width: #{p_pages.to_s.length+1}rem; margin:0 0.3rem;">)
html << %(<div class="pagy-combo-input control level is-mobile">#{pagy_t('pagy.combo_nav_js', page_input: input, count: p_page, pages: p_pages)}</div>)
html << (p_next ? %(<p class="control">#{link.call(p_next, pagy_t('pagy.nav.next'), 'class="button" aria-label="next page"')}</p>)
: %(<p class="control"><a class="button" disabled>#{pagy_t('pagy.nav.next')}</a></p>))
html << %(</div></nav>#{pagy_json_tag(:combo_nav, id, MARKER, p_page, !!defined?(TRIM))})
+ %(<div class="field is-grouped is-grouped-centered" role="group">)
html << (p_prev ? %(<p class="control">#{link.call(p_prev, pagy_t('pagy.nav.prev'), 'class="button" aria-label="previous page"')}</p>)
: %(<p class="control"><a class="button" disabled>#{pagy_t('pagy.nav.prev')}</a></p>))
input = %(<input class="input" type="number" min="1" max="#{p_pages}" value="#{p_page}" style="padding: 0; text-align: center; width: #{p_pages.to_s.length+1}rem; margin:0 0.3rem;">)
html << %(<div class="pagy-combo-input control level is-mobile">#{pagy_t('pagy.combo_nav_js', page_input: input, count: p_page, pages: p_pages)}</div>)
html << (p_next ? %(<p class="control">#{link.call(p_next, pagy_t('pagy.nav.next'), 'class="button" aria-label="next page"')}</p>)
: %(<p class="control"><a class="button" disabled>#{pagy_t('pagy.nav.next')}</a></p>))
html << %(</div></nav>#{pagy_json_tag(:combo_nav, id, p_page, pagy_links(link))})
end

end
Expand Down
23 changes: 10 additions & 13 deletions lib/pagy/extras/foundation.rb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,30 +30,27 @@ def pagy_foundation_nav_js(pagy, id=pagy_id)
tags = { 'before' => ( '<ul class="pagination">' \
+ (p_prev ? %(<li class="prev">#{link.call(p_prev, pagy_t('pagy.nav.prev'), 'aria-label="previous"')}</li>)
: %(<li class="prev disabled">#{pagy_t('pagy.nav.prev')}</li>)) ),
'link' => %(<li>#{link.call(MARKER)}</li>),
'link' => %(<li>#{link.call(MARK)}</li>),
'active' => %(<li class="current">#{pagy.page}</li>),
'gap' => %(<li class="ellipsis gap" aria-hidden="true"></li>),
'after' => ( (p_next ? %(<li class="next">#{link.call(p_next, pagy_t('pagy.nav.next'), 'aria-label="next"')}</li>)
: %(<li class="next disabled">#{pagy_t('pagy.nav.next')}</li>)) \
+ '</ul>' ) }
%(<nav id="#{id}" class="pagy-foundation-nav-js" role="navigation" aria-label="Pagination"></nav>#{pagy_json_tag(:nav, id, MARKER, tags, pagy.sequels)})
%(<nav id="#{id}" class="pagy-foundation-nav-js" role="navigation" aria-label="Pagination"></nav>#{pagy_json_tag(:nav, id, tags, pagy.sequels)})
end

# Javascript combo pagination for Foundation: it returns a nav and a JSON tag used by the Pagy.combo_nav javascript
def pagy_foundation_combo_nav_js(pagy, id=pagy_id)
link, p_prev, p_next, p_page, p_pages = pagy_link_proc(pagy), pagy.prev, pagy.next, pagy.page, pagy.pages

html = %(<nav id="#{id}" class="pagy-foundation-combo-nav-js" role="navigation" aria-label="Pagination">) \
+ link.call(MARKER, '', %(style="display: none;" ))
(html << link.call(1, '', %(style="display: none;" ))) if defined?(TRIM)
html << %(<div class="input-group">)
html << (p_prev ? link.call(p_prev, pagy_t('pagy.nav.prev'), 'style="margin-bottom: 0px;" aria-label="previous" class="prev button primary"')
: %(<a style="margin-bottom: 0px;" class="prev button primary disabled" href="#">#{pagy_t('pagy.nav.prev')}</a>))
input = %(<input class="input-group-field cell shrink" type="number" min="1" max="#{p_pages}" value="#{p_page}" style="width: #{p_pages.to_s.length+1}rem; padding: 0 0.3rem; margin: 0 0.3rem;">)
html << %(<span class="input-group-label">#{pagy_t('pagy.combo_nav_js', page_input: input, count: p_page, pages: p_pages)}</span>)
html << (p_next ? link.call(p_next, pagy_t('pagy.nav.next'), 'style="margin-bottom: 0px;" aria-label="next" class="next button primary"')
: %(<a style="margin-bottom: 0px;" class="next button primary disabled" href="#">#{pagy_t('pagy.nav.next')}</a>))
html << %(</div></nav>#{pagy_json_tag(:combo_nav, id, MARKER, p_page, !!defined?(TRIM))})
html = %(<nav id="#{id}" class="pagy-foundation-combo-nav-js" role="navigation" aria-label="Pagination">) + %(<div class="input-group">)
html << (p_prev ? link.call(p_prev, pagy_t('pagy.nav.prev'), 'style="margin-bottom: 0px;" aria-label="previous" class="prev button primary"')
: %(<a style="margin-bottom: 0px;" class="prev button primary disabled" href="#">#{pagy_t('pagy.nav.prev')}</a>))
input = %(<input class="input-group-field cell shrink" type="number" min="1" max="#{p_pages}" value="#{p_page}" style="width: #{p_pages.to_s.length+1}rem; padding: 0 0.3rem; margin: 0 0.3rem;">)
html << %(<span class="input-group-label">#{pagy_t('pagy.combo_nav_js', page_input: input, count: p_page, pages: p_pages)}</span>)
html << (p_next ? link.call(p_next, pagy_t('pagy.nav.next'), 'style="margin-bottom: 0px;" aria-label="next" class="next button primary"')
: %(<a style="margin-bottom: 0px;" class="next button primary disabled" href="#">#{pagy_t('pagy.nav.next')}</a>))
html << %(</div></nav>#{pagy_json_tag(:combo_nav, id, p_page, pagy_links(link))})
end

end
Expand Down
Loading

0 comments on commit 1732dee

Please sign in to comment.