diff options
Diffstat (limited to 'js/prev-next-button.js')
-rw-r--r-- | js/prev-next-button.js | 87 |
1 files changed, 24 insertions, 63 deletions
diff --git a/js/prev-next-button.js b/js/prev-next-button.js index 22841f2..a50d694 100644 --- a/js/prev-next-button.js +++ b/js/prev-next-button.js @@ -1,24 +1,20 @@ -// -------------------------- prev/next button -------------------------- // - +// prev/next buttons ( function( window, factory ) { - 'use strict'; // universal module definition - + /* jshint strict: false */ if ( typeof define == 'function' && define.amd ) { // AMD define( [ - 'eventie/eventie', './flickity', 'tap-listener/tap-listener', 'fizzy-ui-utils/utils' - ], function( eventie, Flickity, TapListener, utils ) { - return factory( window, eventie, Flickity, TapListener, utils ); + ], function( Flickity, TapListener, utils ) { + return factory( window, Flickity, TapListener, utils ); }); - } else if ( typeof exports == 'object' ) { + } else if ( typeof module == 'object' && module.exports ) { // CommonJS module.exports = factory( window, - require('eventie'), require('./flickity'), require('tap-listener'), require('fizzy-ui-utils') @@ -27,36 +23,17 @@ // browser global factory( window, - window.eventie, window.Flickity, window.TapListener, window.fizzyUIUtils ); } -}( window, function factory( window, eventie, Flickity, TapListener, utils ) { - +}( window, function factory( window, Flickity, TapListener, utils ) { 'use strict'; -// ----- inline SVG support ----- // - var svgURI = 'http://www.w3.org/2000/svg'; -// only check on demand, not on script load -var supportsInlineSVG = ( function() { - var supports; - function checkSupport() { - if ( supports !== undefined ) { - return supports; - } - var div = document.createElement('div'); - div.innerHTML = '<svg/>'; - supports = ( div.firstChild && div.firstChild.namespaceURI ) == svgURI; - return supports; - } - return checkSupport; -})(); - // -------------------------- PrevNextButton -------------------------- // function PrevNextButton( direction, parent ) { @@ -84,34 +61,25 @@ PrevNextButton.prototype._create = function() { element.setAttribute( 'aria-label', this.isPrevious ? 'previous' : 'next' ); - Flickity.setUnselectable( element ); // create arrow - if ( supportsInlineSVG() ) { - var svg = this.createSVG(); - element.appendChild( svg ); - } else { - // SVG not supported, set button text - this.setArrowText(); - element.className += ' no-svg'; - } + var svg = this.createSVG(); + element.appendChild( svg ); // update on select - var _this = this; - this.onCellSelect = function() { - _this.update(); - }; - this.parent.on( 'cellSelect', this.onCellSelect ); + this.parent.on( 'select', function() { + this.update(); + }.bind( this )); // tap this.on( 'tap', this.onTap ); // pointerDown this.on( 'pointerDown', function onPointerDown( button, event ) { - _this.parent.childUIPointerDown( event ); - }); + this.parent.childUIPointerDown( event ); + }.bind( this )); }; PrevNextButton.prototype.activate = function() { this.bindTap( this.element ); // click events from keyboard - eventie.bind( this.element, 'click', this ); + this.element.addEventListener( 'click', this ); // add to DOM this.parent.element.appendChild( this.element ); }; @@ -122,7 +90,7 @@ PrevNextButton.prototype.deactivate = function() { // do regular TapListener destroy TapListener.prototype.destroy.call( this ); // click events from keyboard - eventie.unbind( this.element, 'click', this ); + this.element.removeEventListener( 'click', this ); }; PrevNextButton.prototype.createSVG = function() { @@ -156,12 +124,6 @@ function getArrowMovements( shape ) { ' Z'; } -PrevNextButton.prototype.setArrowText = function() { - var parentOptions = this.parent.options; - var arrowText = this.isLeft ? parentOptions.leftArrowText : parentOptions.rightArrowText; - utils.setText( this.element, arrowText ); -}; - PrevNextButton.prototype.onTap = function() { if ( !this.isEnabled ) { return; @@ -200,14 +162,14 @@ PrevNextButton.prototype.disable = function() { }; PrevNextButton.prototype.update = function() { - // index of first or last cell, if previous or next - var cells = this.parent.cells; - // enable is wrapAround and at least 2 cells - if ( this.parent.options.wrapAround && cells.length > 1 ) { + // index of first or last slide, if previous or next + var slides = this.parent.slides; + // enable is wrapAround and at least 2 slides + if ( this.parent.options.wrapAround && slides.length > 1 ) { this.enable(); return; } - var lastIndex = cells.length ? cells.length - 1 : 0; + var lastIndex = slides.length ? slides.length - 1 : 0; var boundIndex = this.isPrevious ? 0 : lastIndex; var method = this.parent.selectedIndex == boundIndex ? 'disable' : 'enable'; this[ method ](); @@ -221,8 +183,6 @@ PrevNextButton.prototype.destroy = function() { utils.extend( Flickity.defaults, { prevNextButtons: true, - leftArrowText: '‹', - rightArrowText: '›', arrowShape: { x0: 10, x1: 60, y1: 50, @@ -232,8 +192,9 @@ utils.extend( Flickity.defaults, { }); Flickity.createMethods.push('_createPrevNextButtons'); +var proto = Flickity.prototype; -Flickity.prototype._createPrevNextButtons = function() { +proto._createPrevNextButtons = function() { if ( !this.options.prevNextButtons ) { return; } @@ -244,13 +205,13 @@ Flickity.prototype._createPrevNextButtons = function() { this.on( 'activate', this.activatePrevNextButtons ); }; -Flickity.prototype.activatePrevNextButtons = function() { +proto.activatePrevNextButtons = function() { this.prevButton.activate(); this.nextButton.activate(); this.on( 'deactivate', this.deactivatePrevNextButtons ); }; -Flickity.prototype.deactivatePrevNextButtons = function() { +proto.deactivatePrevNextButtons = function() { this.prevButton.deactivate(); this.nextButton.deactivate(); this.off( 'deactivate', this.deactivatePrevNextButtons ); |