Keyboard on events

[richgcook]

I can't quite create a reduced edge case unfortunately as my setup is quite complex.

I am using fullpage.js and upon reaching the last flickity slide, if the user clicks again, then it should advance to the next fullpage.js section. This is absolutely fine to do with clicks.

 $slider.on('select.flickity', function() {
    if (flkty.selectedIndex == flkty.cells.length - 1) {
        $slider.one('pointerUp.flickity', function(event) {
            var nextCount = $article.next().data('count');
                $.fn.fullpage.moveTo(nextCount, 0);
        });
    }
});

However I'm wondering if it's at all possible with the keyboard keys too? There seems to be events for touch, drag, pointer etc but not keyboard. I can't send to the user to the next fullpage.js section before the user interacts again otherwise they'll skip the last image.

Any thoughts?

[desandro]

I recommend just using select or change event and do not try mapping interactions to touch or keyboard events. The select and change events are triggered however a cell is selected, via swipe, page dot click, keyboard, or other API call.

[richgcook]

@desandro Are you able to determine how the select or change event was triggered? And are you able to know whether the select or change event went left/right? The only issue is there is no event called when the user attempts to go next once the end of the slider has been reached.

[desandro]

Try playing around with this code

var flkty = $slider.data('flickity');
var previousIndex = flkty.selectedIndex;

$slider.on( 'change.flickity', function( event, index ) {
  // get changed index
  var delta = index - previousIndex;
  if ( delta > 0 ) {
    // Flickity changed to the right
  } else {
    // Flickity changed to the back
  }

  var lastIndex = flkty.slides.length - 1;
  var isWrapped = index === 0 && previousIndex === lastIndex;
  if ( isWrapped ) {
    // Flickity changed from last to first
  }

  previousIndex = index;
});

[richgcook]

@desandro Thanks for your help on this! Much appreciated.