diff options
| -rw-r--r-- | .cypress/cypress/integration/around_filters.js | 25 | ||||
| -rw-r--r-- | CHANGELOG.md | 1 | ||||
| -rw-r--r-- | templates/web/base/js/translation_strings.html | 2 | ||||
| -rw-r--r-- | templates/web/bristol/footer_extra.html | 56 | ||||
| -rw-r--r-- | templates/web/bristol/front/footer-marketing.html | 53 | ||||
| -rw-r--r-- | web/cobrands/fixmystreet/fixmystreet.js | 27 | ||||
| -rw-r--r-- | web/cobrands/fixmystreet/images/map-tools.png | bin | 846 -> 788 bytes | |||
| -rw-r--r-- | web/cobrands/fixmystreet/images/map-tools.svg | 2 | ||||
| -rw-r--r-- | web/cobrands/sass/_base.scss | 12 | ||||
| -rw-r--r-- | web/cobrands/sass/_layout.scss | 2 | ||||
| -rw-r--r-- | web/cobrands/sass/_multiselect.scss | 45 | ||||
| -rw-r--r-- | web/cobrands/sass/_report_list.scss | 15 | ||||
| -rw-r--r-- | web/vendor/jquery.multi-select.min.js | 19 |
13 files changed, 191 insertions, 68 deletions
diff --git a/.cypress/cypress/integration/around_filters.js b/.cypress/cypress/integration/around_filters.js index 7bd029856..46d1f8477 100644 --- a/.cypress/cypress/integration/around_filters.js +++ b/.cypress/cypress/integration/around_filters.js @@ -126,4 +126,29 @@ describe('Around page filtering and push state', function() { cy.contains('Loose drain cover'); cy.should('not.contain', 'Back to all reports'); }); + + it('lets me show and hide the filters on narrow screens', function(){ + // #map_filter does not exist at normal window size + cy.visit('/around?lon=-2.295894&lat=51.526877&zoom=6'); + cy.get('#map_filter').should('not.exist'); + + // #map_filter appears when window is narrowed _after_ pageload + cy.viewport(375, 667); + cy.get('#map_filter').should('exist'); + + // #map_filter exists when window is _already_ narrow at pageload + cy.reload(); + cy.get('#map_filter').should('exist'); + + // And the filters are static (hidden) underneath the map as normal + cy.get('.report-list-filters-wrapper').invoke('css', 'position').should('equal', 'static'); + + // The filters appear when you click the #map_filter button + cy.get('#map_filter').click(); + cy.get('.report-list-filters-wrapper').invoke('css', 'position').should('equal', 'fixed'); + + // And disappear again when you click #map_filter a second time + cy.get('#map_filter').click(); + cy.get('.report-list-filters-wrapper').invoke('css', 'position').should('equal', 'static'); + }); }); diff --git a/CHANGELOG.md b/CHANGELOG.md index ac6f22d73..a8bda116e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,6 +3,7 @@ * Unreleased - Front end improvements: - Improved 403 message, especially for private reports. + - Mobile users can now filter the pins on the `/around` map view. #2366 - Admin improvements: - Add new roles system, to group permissions and apply to users. - Bugfixes: diff --git a/templates/web/base/js/translation_strings.html b/templates/web/base/js/translation_strings.html index 881f6ecb9..8968247d5 100644 --- a/templates/web/base/js/translation_strings.html +++ b/templates/web/base/js/translation_strings.html @@ -68,6 +68,8 @@ fixmystreet.password_minimum_length = [% c.cobrand.password_minimum_length %]; permalink: '[% loc('Permalink') | replace("'", "\\'") %]', + filter: '[% loc('Filter') | replace("'", "\\'") %]', + show_pins: '[% loc('Show pins') | replace("'", "\\'") %]', hide_pins: '[% loc('Hide pins') | replace("'", "\\'") %]', diff --git a/templates/web/bristol/footer_extra.html b/templates/web/bristol/footer_extra.html index ea586e26d..6aa1d5493 100644 --- a/templates/web/bristol/footer_extra.html +++ b/templates/web/bristol/footer_extra.html @@ -1,5 +1,59 @@ <div class="bristol_footer"> <footer role="contentinfo" class="clearfix"> - [% INCLUDE 'front/footer-marketing.html' %] + +<div class="span8"> + <div id="footer-logo"> + <p> + <a href="https://www.bristol.gov.uk" title="Bristol City Council">Bristol City Council</a> + </p> + </div> + <div class="legal-nav"> + <ul class="linklist"> + <li> + <a href="https://www.bristol.gov.uk/contact">Contact</a> + </li> + <li> + <a href="https://www.bristol.gov.uk/complaints">Complaints and feedback</a> + </li> + <li> + <a href="https://www.bristol.gov.uk/about-our-website/cookies">Cookies</a> + </li> + <li> + <a href="https://www.bristol.gov.uk/about-our-website/privacy">Privacy</a> + </li> + <li> + <a href="https://www.bristol.gov.uk/about-our-website/accessibility">Accessibility</a> + </li> + </ul> + </div> +</div> +<div class="span4"> + <div class="footer-title"> + Follow us: + </div> + <div class="footer-social-links"> + <ul class="linklist"> + <li> + <a href="http://www.facebook.com/BristolCouncil" title="Follow us on Facebook"><img alt="Facebook" src="/cobrands/bristol/img/facebook.png"></a> + </li> + <li> + <a href="http://www.twitter.com/bristolcouncil" title="Follow us on Twitter"><img alt="Twitter" src="/cobrands/bristol/img/twitter.png"></a> + </li> + <li> + <a href="http://www.youtube.com/bristolcitycouncil" title="Follow us on Youtube"><img alt="Youtube" src="/cobrands/bristol/img/youtube.png"></a> + </li> + <li> + <a href="http://www.flickr.com/photos/bristolcouncil" title="Follow us on Flickr"><img alt="Flickr" src="/cobrands/bristol/img/flickr.png"></a> + </li> + <li> + <a href="http://news.bristol.gov.uk/feed/en" title="Council news RSS feed"><img alt="Council news RSS feed" src="/cobrands/bristol/img/rss.png"></a> + </li> + </ul> + </div> + <div class="footer-copyright"> + <a href="https://www.bristol.gov.uk/about-our-website/copyright">Copyright © 2015 Bristol City Council</a> + </div> +</div> + </footer> </div> diff --git a/templates/web/bristol/front/footer-marketing.html b/templates/web/bristol/front/footer-marketing.html deleted file mode 100644 index 11d051b2c..000000000 --- a/templates/web/bristol/front/footer-marketing.html +++ /dev/null @@ -1,53 +0,0 @@ -<div class="span8"> - <div id="footer-logo"> - <p> - <a href="https://www.bristol.gov.uk" title="Bristol City Council">Bristol City Council</a> - </p> - </div> - <div class="legal-nav"> - <ul class="linklist"> - <li> - <a href="https://www.bristol.gov.uk/contact">Contact</a> - </li> - <li> - <a href="https://www.bristol.gov.uk/complaints">Complaints and feedback</a> - </li> - <li> - <a href="https://www.bristol.gov.uk/about-our-website/cookies">Cookies</a> - </li> - <li> - <a href="https://www.bristol.gov.uk/about-our-website/privacy">Privacy</a> - </li> - <li> - <a href="https://www.bristol.gov.uk/about-our-website/accessibility">Accessibility</a> - </li> - </ul> - </div> -</div> -<div class="span4"> - <div class="footer-title"> - Follow us: - </div> - <div class="footer-social-links"> - <ul class="linklist"> - <li> - <a href="http://www.facebook.com/BristolCouncil" title="Follow us on Facebook"><img alt="Facebook" src="/cobrands/bristol/img/facebook.png"></a> - </li> - <li> - <a href="http://www.twitter.com/bristolcouncil" title="Follow us on Twitter"><img alt="Twitter" src="/cobrands/bristol/img/twitter.png"></a> - </li> - <li> - <a href="http://www.youtube.com/bristolcitycouncil" title="Follow us on Youtube"><img alt="Youtube" src="/cobrands/bristol/img/youtube.png"></a> - </li> - <li> - <a href="http://www.flickr.com/photos/bristolcouncil" title="Follow us on Flickr"><img alt="Flickr" src="/cobrands/bristol/img/flickr.png"></a> - </li> - <li> - <a href="http://news.bristol.gov.uk/feed/en" title="Council news RSS feed"><img alt="Council news RSS feed" src="/cobrands/bristol/img/rss.png"></a> - </li> - </ul> - </div> - <div class="footer-copyright"> - <a href="https://www.bristol.gov.uk/about-our-website/copyright">Copyright © 2015 Bristol City Council</a> - </div> -</div> diff --git a/web/cobrands/fixmystreet/fixmystreet.js b/web/cobrands/fixmystreet/fixmystreet.js index d71217ad0..2f0a48385 100644 --- a/web/cobrands/fixmystreet/fixmystreet.js +++ b/web/cobrands/fixmystreet/fixmystreet.js @@ -116,7 +116,9 @@ function isR2L() { // data-* attributes into settings for the multiSelect constructor. return this.each(function() { var $select = $(this); - var settings = {}; + var settings = { + modalHTML: '<div class="multi-select-modal">' + }; if ( $select.data('none') ) { settings.noneText = $select.data('none'); @@ -157,6 +159,24 @@ fixmystreet.mobile_reporting = { // and special "OK/Cancel" buttons etc. $('html').addClass('map-fullscreen only-map map-reporting'); $('.mobile-map-banner span').text(translation_strings.place_pin_on_map); + + if ($('#map_filter').length === 0) { + $map_filter = $('<a href="#side" id="map_filter">' + translation_strings.filter + '</a>'); + $map_filter.on('click', function(e) { + e.preventDefault(); + var $form = $('#mapForm'); + var $sub_map_links = $('#sub_map_links'); + if ( $form.is('.mobile-filters-active') ) { + $form.removeClass('mobile-filters-active'); + $sub_map_links.css('bottom', ''); + } else { + $form.addClass('mobile-filters-active'); + $sub_map_links.css('bottom', $('.report-list-filters-wrapper').outerHeight() ); + } + }); + $('#sub_map_links').prepend($map_filter); + } + // Do this on a timeout, so it takes precedence over the browser’s // remembered position, which we do not want, we want a fixed map. setTimeout(function() { @@ -170,6 +190,11 @@ fixmystreet.mobile_reporting = { $('html').removeClass('map-fullscreen only-map map-reporting'); $('#map_box').css({ width: "", height: "", position: "" }); $('#mob_sub_map_links').remove(); + + // Turn off the mobile map filters. + $('#mapForm').removeClass('mobile-filters-active'); + $('#sub_map_links').css('bottom', ''); + $('#map_filter').remove(); } }; diff --git a/web/cobrands/fixmystreet/images/map-tools.png b/web/cobrands/fixmystreet/images/map-tools.png Binary files differindex 037fb7af2..1c6f78445 100644 --- a/web/cobrands/fixmystreet/images/map-tools.png +++ b/web/cobrands/fixmystreet/images/map-tools.png diff --git a/web/cobrands/fixmystreet/images/map-tools.svg b/web/cobrands/fixmystreet/images/map-tools.svg index 5be4d71d0..cc204198f 100644 --- a/web/cobrands/fixmystreet/images/map-tools.svg +++ b/web/cobrands/fixmystreet/images/map-tools.svg @@ -1 +1 @@ -<svg width="96" height="12" viewBox="0 0 96 12" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><path d="M15.7 9.6a1.4 1.4 0 1 1-2.7 0 1.4 1.4 0 0 1 2.7 0zM13 4.4v2c2.5 0 4.6 2 4.6 4.6h2c0-3.6-3-6.6-6.6-6.6zM13 3a8 8 0 0 1 8 8h2A10 10 0 0 0 13 1v2z" fill="#FFF" fill-rule="nonzero"/><path d="M26 4L31 9.2 29.7 12 28 8.7A3.9 3.9 0 0 1 26 4zm1.8-2.2A4 4 0 0 1 33.1 7l-5.3-5.3zM25.7 1L34 9.3l-.7.7L25 1.7l.7-.7zM42.5 12a5.5 5.5 0 1 1 0-11 5.5 5.5 0 0 1 0 11zm0-1.5a4 4 0 1 0 0-8 4 4 0 0 0 0 8z" fill="#FFF"/><path stroke="#FFF" d="M42 3v3l2 2"/><path fill="#FFF" d="M5 2L1 6l4 4zM7 2l4 4-4 4z"/><g fill="#FFF"><path d="M54 5.4l1-1.1c.2 0 .3.2.4.3a3 3 0 0 1 0 4.2L54 10.2A3 3 0 1 1 49.8 6l1-1-.3.3.6 1.5-.3.3A1.5 1.5 0 0 0 53 9l1.5-1.3a1.5 1.5 0 0 0-.5-2.4z"/><path d="M54 6.6l-1 1.1a3 3 0 0 1-.4-4.6L54 1.9A3 3 0 1 1 58.2 6l-1 1 .3-.3-.6-1.5.3-.3A1.5 1.5 0 0 0 55 3l-1.5 1.3a1.5 1.5 0 0 0 .5 2.4z"/></g><path d="M62.6 12l3.4-1.7 3.4 1.7c.2 0 .3-.2.5-.3L69.2 8 72 5.4l-.2-.5-3.8-.5L66.3 1a6.6 6.6 0 0 0-.6 0L64 4.4l-3.8.5-.2.5L62.8 8l-.7 3.7.5.3zM88.6 6H90v5l-1.8-1.8-2.5 2.5-1.4-1.4 2.5-2.5L85 6h3.6zm3.2-3.2L94.3.3l1.4 1.4-2.5 2.5L95.1 6H90V1l1.8 1.8zM78 7.4l-2.8 2.8 1.9 1.8H72V7l1.8 1.8L76.6 6 78 7.4zM79.4 6l2.8-2.8L84.1 5 84 0h-5l1.8 1.8L78 4.6 79.4 6z" fill="#FFF"/></g></svg>
\ No newline at end of file +<svg width="108" height="12" viewbox="0 0 108 12" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><path d="M15.7 9.6a1.4 1.4 0 1 1-2.7 0 1.4 1.4 0 0 1 2.7 0zM13 4.4v2c2.5 0 4.6 2 4.6 4.6h2c0-3.6-3-6.6-6.6-6.6zM13 3a8 8 0 0 1 8 8h2A10 10 0 0 0 13 1v2z" fill="#FFF" fill-rule="nonzero"/><path d="M26 4L31 9.2 29.7 12 28 8.7A3.9 3.9 0 0 1 26 4zm1.8-2.2A4 4 0 0 1 33.1 7l-5.3-5.3zM25.7 1L34 9.3l-.7.7L25 1.7l.7-.7zM42.5 12a5.5 5.5 0 1 1 0-11 5.5 5.5 0 0 1 0 11zm0-1.5a4 4 0 1 0 0-8 4 4 0 0 0 0 8z" fill="#FFF"/><path stroke="#FFF" d="M42 3v3l2 2"/><path fill="#FFF" d="M5 2L1 6l4 4zM7 2l4 4-4 4z"/><g fill="#FFF"><path d="M54 5.4l1-1.1c.2 0 .3.2.4.3a3 3 0 0 1 0 4.2L54 10.2A3 3 0 1 1 49.8 6l1-1-.3.3.6 1.5-.3.3A1.5 1.5 0 0 0 53 9l1.5-1.3a1.5 1.5 0 0 0-.5-2.4z"/><path d="M54 6.6l-1 1.1a3 3 0 0 1-.4-4.6L54 1.9A3 3 0 1 1 58.2 6l-1 1 .3-.3-.6-1.5.3-.3A1.5 1.5 0 0 0 55 3l-1.5 1.3a1.5 1.5 0 0 0 .5 2.4z"/></g><path d="M62.6 12c-.2 0-.3-.2-.5-.3l.7-3.7L60 5.4l.2-.5 3.8-.5L65.7 1a6.6 6.6 0 0 1 .6 0L68 4.4l3.8.5.2.5L69.2 8l.7 3.7-.5.3-3.4-1.7-3.4 1.7zM88.6 6H90v5l-1.8-1.8-2.5 2.5-1.4-1.4 2.5-2.5L85 6h3.6zm3.2-3.2L94.3.3l1.4 1.4-2.5 2.5L95.1 6H90V1l1.8 1.8zM78 7.4l-2.8 2.8 1.9 1.8H72V7l1.8 1.8L76.6 6 78 7.4zM79.4 6L78 4.6l2.8-2.8L79 0h5v5l-1.8-1.8L79.4 6z" fill="#FFF"/><path fill="#FFF" fill-rule="nonzero" d="M97 2h10v2H97zM99 5h6v2h-6zM101 8h2v2h-2z"/></g></svg>
\ No newline at end of file diff --git a/web/cobrands/sass/_base.scss b/web/cobrands/sass/_base.scss index e193553be..b410649a8 100644 --- a/web/cobrands/sass/_base.scss +++ b/web/cobrands/sass/_base.scss @@ -1673,7 +1673,7 @@ html.js #map .noscript { height: 12px; margin-#{$left}: 8px; vertical-align: -0.1em; - background-size: 96px 12px; + background-size: 108px 12px; @include svg-background-image('/cobrands/fixmystreet/images/map-tools'); } @@ -1743,6 +1743,11 @@ html.js #map .noscript { @extend %sub-map-link-icon; background-position: -84px 0; } + + #map_filter:after { + @extend %sub-map-link-icon; + background-position: -96px 0; + } } // Want some visual consistency between the top and bottom bars on mobile. @@ -1753,6 +1758,11 @@ html.js #map .noscript { color: #fff; } +// "Selected" styling for the report-list-filter toggle when selected. +.mobile-filters-active #map_filter { + background: #000; +} + // On mobile, once #mob_ok has been pressed, the new report form is shown, // and .sub-map-links transforms into a completely different-looking set // of buttons for return back to the map. diff --git a/web/cobrands/sass/_layout.scss b/web/cobrands/sass/_layout.scss index 0cbb6a007..b27305d31 100644 --- a/web/cobrands/sass/_layout.scss +++ b/web/cobrands/sass/_layout.scss @@ -651,7 +651,7 @@ body.authpage { top: 50%; margin-top: -6px; #{$left}: ((16px - 6px) / 2); // horizontally centre in 16px wide parent - background-size: 96px 12px; + background-size: 108px 12px; @include svg-background-image('/cobrands/fixmystreet/images/map-tools'); } diff --git a/web/cobrands/sass/_multiselect.scss b/web/cobrands/sass/_multiselect.scss index 9704d841d..5f59599a6 100644 --- a/web/cobrands/sass/_multiselect.scss +++ b/web/cobrands/sass/_multiselect.scss @@ -35,6 +35,51 @@ } } +.multi-select-modal { + display: none; +} + +// Centred, modal display for sub-768px screens only. +@media (max-width: 47.94em) { + .multi-select-menu { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + width: 75% !important; // override inline "width: auto" + max-height: 50%; + min-width: 0; + overflow: auto; // allow scrolling + border: none; + border-radius: 0.3em; + box-shadow: 0 1em 3em rgba(0, 0, 0, 0.4); + } + + .multi-select-menuitem { + font-size: 1em; + padding: flip(1em 2.5em 1em 3.5em, 1em 3.5em 1em 2.5em); + + input { + margin-top: 0.15em; + margin-#{$left}: -2em; + } + } + + .multi-select-modal { + position: fixed; + top: 0; + bottom: 0; + left: 0; + right: 0; + z-index: 1; + background: rgba(0, 0, 0, 0.4); + + .multi-select-container--open & { + display: block; + } + } +} + .multi-select-presets { border-bottom: 1px solid #ddd; } diff --git a/web/cobrands/sass/_report_list.scss b/web/cobrands/sass/_report_list.scss index 46c719b12..6910bb15e 100644 --- a/web/cobrands/sass/_report_list.scss +++ b/web/cobrands/sass/_report_list.scss @@ -1,8 +1,21 @@ +.report-list-filters-wrapper { + color: #666; + + .mobile-filters-active & { + position: fixed; + z-index: 1; + bottom: 0; + left: 0; + right: 0; + background: #000; + color: #fff; + } +} + .report-list-filters { padding: 1em; padding-bottom: 0.75em; // compensate for 0.25em border-top on .item-list__item margin-bottom: 0; - color: #666; font-size: 0.85em; line-height: 1.8em; diff --git a/web/vendor/jquery.multi-select.min.js b/web/vendor/jquery.multi-select.min.js index 015aee226..81a199ede 100644 --- a/web/vendor/jquery.multi-select.min.js +++ b/web/vendor/jquery.multi-select.min.js @@ -1,9 +1,10 @@ -(function(c){function f(b,a){this.b=c(b);this.a=c.extend({},g,a);this.H()}var g={containerHTML:'<div class="multi-select-container">',menuHTML:'<div class="multi-select-menu">',buttonHTML:'<span class="multi-select-button">',menuItemsHTML:'<div class="multi-select-menuitems">',menuItemHTML:'<label class="multi-select-menuitem">',presetsHTML:'<div class="multi-select-presets">',activeClass:"multi-select-container--open",noneText:"-- Select --",allText:void 0,presets:void 0,positionedMenuClass:"multi-select-container--positioned", -positionMenuWithin:void 0,viewportBottomGutter:20,menuMinHeight:200};c.extend(f.prototype,{H:function(){this.v();this.G();this.A();this.w();this.B();this.J();this.K();this.b.hide()},v:function(){if(!1===this.b.is("select[multiple]"))throw Error("$.multiSelect only works on <select multiple> elements");},G:function(){this.l=c('label[for="'+this.b.attr("id")+'"]')},A:function(){this.f=c(this.a.containerHTML);this.b.data("multi-select-container",this.f);this.f.insertAfter(this.b)},w:function(){var b= -this;this.g=c(this.a.buttonHTML);this.g.attr({role:"button","aria-haspopup":"true",tabindex:0,"aria-label":this.l.eq(0).text()}).on("keydown.multiselect",function(a){a=a.which;13!==a&&32!==a||b.g.click()}).on("click.multiselect",function(){b.m()}).appendTo(this.f);this.b.on("change.multiselect",function(){b.o()});this.o()},o:function(){var b=[],a=[];this.b.children("option").each(function(){var d=c(this).text();b.push(d);c(this).is(":selected")&&a.push(c.trim(d))});this.g.empty();0==a.length?this.g.text(this.a.noneText): -a.length===b.length&&this.a.allText?this.g.text(this.a.allText):this.g.text(a.join(", "))},B:function(){var b=this;this.c=c(this.a.menuHTML);this.c.attr({role:"menu"}).on("keyup.multiselect",function(a){27===a.which&&b.j()}).appendTo(this.f);this.D();this.a.presets&&this.F()},D:function(){var b=this;this.h=c(this.a.menuItemsHTML);this.c.append(this.h);this.b.on("change.multiselect",function(a,c){!0!==c&&b.s()});this.s()},s:function(){var b=this;this.h.empty();this.b.children("option").each(function(a, -d){a=b.C(c(d),a);b.h.append(a)})},F:function(){var b=this;this.i=c(this.a.presetsHTML);this.c.prepend(this.i);c.each(this.a.presets,function(a,d){a=b.b.attr("name")+"_preset_"+a;var h=c(b.a.menuItemHTML).attr({"for":a,role:"menuitem"}).text(" "+d.name).appendTo(b.i);c("<input>").attr({type:"radio",name:b.b.attr("name")+"_presets",id:a}).prependTo(h).on("change.multiselect",function(){b.b.val(d.options);b.b.trigger("change")})});this.b.on("change.multiselect",function(){b.u()});this.u()},u:function(){var b= -this;c.each(this.a.presets,function(a,c){a=b.b.attr("name")+"_preset_"+a;a=b.i.find("#"+a);a:{c=c.options||[];var d=b.b.val()||[];if(c.length!=d.length)c=!1;else{c.sort();d.sort();for(var e=0;e<c.length;e++)if(c[e]!==d[e]){c=!1;break a}c=!0}}c?a.prop("checked",!0):a.prop("checked",!1)})},C:function(b,a){var d=this.b.attr("name")+"_"+a;a=c(this.a.menuItemHTML).attr({"for":d,role:"menuitem"}).text(" "+b.text());d=c("<input>").attr({type:"checkbox",id:d,value:b.val()}).prependTo(a);b.is(":disabled")&& -d.attr("disabled","disabled");b.is(":selected")&&d.prop("checked","checked");d.on("change.multiselect",function(){c(this).prop("checked")?b.prop("selected",!0):b.prop("selected",!1);b.trigger("change",[!0])});return a},J:function(){var b=this;c("html").on("click.multiselect",function(){b.j()});this.f.on("click.multiselect",function(a){a.stopPropagation()})},K:function(){var b=this;this.l.on("click.multiselect",function(a){a.preventDefault();a.stopPropagation();b.m()})},I:function(){c("html").trigger("click.multiselect"); -this.f.addClass(this.a.activeClass);if(this.a.positionMenuWithin&&this.a.positionMenuWithin instanceof c){var b=this.c.offset().left+this.c.outerWidth(),a=this.a.positionMenuWithin.offset().left+this.a.positionMenuWithin.outerWidth();b>a&&(this.c.css("width",a-this.c.offset().left),this.f.addClass(this.a.positionedMenuClass))}b=this.c.offset().top+this.c.outerHeight();a=c(window).scrollTop()+c(window).height();b>a-this.a.viewportBottomGutter?this.c.css({maxHeight:Math.max(a-this.a.viewportBottomGutter- -this.c.offset().top,this.a.menuMinHeight),overflow:"scroll"}):this.c.css({maxHeight:"",overflow:""})},j:function(){this.f.removeClass(this.a.activeClass);this.f.removeClass(this.a.positionedMenuClass);this.c.css("width","auto")},m:function(){this.f.hasClass(this.a.activeClass)?this.j():this.I()}});c.fn.multiSelect=function(b){return this.each(function(){c.data(this,"plugin_multiSelect")||c.data(this,"plugin_multiSelect",new f(this,b))})}})(jQuery); +(function(c){function f(a,b){this.b=c(a);this.a=c.extend({},g,b);this.J()}var g={containerHTML:'<div class="multi-select-container">',menuHTML:'<div class="multi-select-menu">',buttonHTML:'<span class="multi-select-button">',menuItemsHTML:'<div class="multi-select-menuitems">',menuItemHTML:'<label class="multi-select-menuitem">',presetsHTML:'<div class="multi-select-presets">',modalHTML:void 0,activeClass:"multi-select-container--open",noneText:"-- Select --",allText:void 0,presets:void 0,positionedMenuClass:"multi-select-container--positioned", +positionMenuWithin:void 0,viewportBottomGutter:20,menuMinHeight:200};c.extend(f.prototype,{J:function(){this.w();this.I();this.B();this.A();this.C();this.G();this.L();this.M();this.b.hide()},w:function(){if(!1===this.b.is("select[multiple]"))throw Error("$.multiSelect only works on <select multiple> elements");},I:function(){this.l=c('label[for="'+this.b.attr("id")+'"]')},B:function(){this.f=c(this.a.containerHTML);this.b.data("multi-select-container",this.f);this.f.insertAfter(this.b)},A:function(){var a= +this;this.g=c(this.a.buttonHTML);this.g.attr({role:"button","aria-haspopup":"true",tabindex:0,"aria-label":this.l.eq(0).text()}).on("keydown.multiselect",function(b){b=b.which;13!==b&&32!==b||a.g.click()}).on("click.multiselect",function(){a.o()}).appendTo(this.f);this.b.on("change.multiselect",function(){a.s()});this.s()},s:function(){var a=[],b=[];this.b.children("option").each(function(){var d=c(this).text();a.push(d);c(this).is(":selected")&&b.push(c.trim(d))});this.g.empty();0==b.length?this.g.text(this.a.noneText): +b.length===a.length&&this.a.allText?this.g.text(this.a.allText):this.g.text(b.join(", "))},C:function(){var a=this;this.c=c(this.a.menuHTML);this.c.attr({role:"menu"}).on("keyup.multiselect",function(b){27===b.which&&a.h()}).appendTo(this.f);this.F();this.a.presets&&this.H()},F:function(){var a=this;this.i=c(this.a.menuItemsHTML);this.c.append(this.i);this.b.on("change.multiselect",function(b,c){!0!==c&&a.u()});this.u()},u:function(){var a=this;this.i.empty();this.b.children("option").each(function(b, +d){b=a.D(c(d),b);a.i.append(b)})},H:function(){var a=this;this.j=c(this.a.presetsHTML);this.c.prepend(this.j);c.each(this.a.presets,function(b,d){b=a.b.attr("name")+"_preset_"+b;var h=c(a.a.menuItemHTML).attr({"for":b,role:"menuitem"}).text(" "+d.name).appendTo(a.j);c("<input>").attr({type:"radio",name:a.b.attr("name")+"_presets",id:b}).prependTo(h).on("change.multiselect",function(){a.b.val(d.options);a.b.trigger("change")})});this.b.on("change.multiselect",function(){a.v()});this.v()},v:function(){var a= +this;c.each(this.a.presets,function(b,c){b=a.b.attr("name")+"_preset_"+b;b=a.j.find("#"+b);a:{c=c.options||[];var d=a.b.val()||[];if(c.length!=d.length)c=!1;else{c.sort();d.sort();for(var e=0;e<c.length;e++)if(c[e]!==d[e]){c=!1;break a}c=!0}}c?b.prop("checked",!0):b.prop("checked",!1)})},D:function(a,b){var d=this.b.attr("name")+"_"+b;b=c(this.a.menuItemHTML).attr({"for":d,role:"menuitem"}).text(" "+a.text());d=c("<input>").attr({type:"checkbox",id:d,value:a.val()}).prependTo(b);a.is(":disabled")&& +d.attr("disabled","disabled");a.is(":selected")&&d.prop("checked","checked");d.on("change.multiselect",function(){c(this).prop("checked")?a.prop("selected",!0):a.prop("selected",!1);a.trigger("change",[!0])});return b},G:function(){var a=this;this.a.modalHTML&&(this.m=c(this.a.modalHTML),this.m.on("click.multiselect",function(){a.h()}),this.m.insertBefore(this.c))},L:function(){var a=this;c("html").on("click.multiselect",function(){a.h()});this.f.on("click.multiselect",function(a){a.stopPropagation()})}, +M:function(){var a=this;this.l.on("click.multiselect",function(b){b.preventDefault();b.stopPropagation();a.o()})},K:function(){c("html").trigger("click.multiselect");this.f.addClass(this.a.activeClass);if(this.a.positionMenuWithin&&this.a.positionMenuWithin instanceof c){var a=this.c.offset().left+this.c.outerWidth(),b=this.a.positionMenuWithin.offset().left+this.a.positionMenuWithin.outerWidth();a>b&&(this.c.css("width",b-this.c.offset().left),this.f.addClass(this.a.positionedMenuClass))}a=this.c.offset().top+ +this.c.outerHeight();b=c(window).scrollTop()+c(window).height();a>b-this.a.viewportBottomGutter?this.c.css({maxHeight:Math.max(b-this.a.viewportBottomGutter-this.c.offset().top,this.a.menuMinHeight),overflow:"scroll"}):this.c.css({maxHeight:"",overflow:""})},h:function(){this.f.removeClass(this.a.activeClass);this.f.removeClass(this.a.positionedMenuClass);this.c.css("width","auto")},o:function(){this.f.hasClass(this.a.activeClass)?this.h():this.K()}});c.fn.multiSelect=function(a){return this.each(function(){c.data(this, +"plugin_multiSelect")||c.data(this,"plugin_multiSelect",new f(this,a))})}})(jQuery); |
