Method 'slickPause' not compatible with Play/Pause button

[warriotox]

Clicking on the play/pause button triggers the autoPlayToggleHandler function which toggles between the two buttons. This logic is not called when calling the slickPause method. This can be easily fixed by moving the logic for the play/pause buttons directly into the slickPlay and slickPause function...

Original code:

Slick.prototype.autoPlayToggleHandler = function() {
        var _ = this;

        if(_.paused) {
            _.$playIcon.css('display', 'none'); //to be extracted to slickPlay
            _.$pauseIcon.css('display', 'inline');  //to be extracted to slickPlay

            _.$pauseButton.find('.slick-play-text').attr('style', 'display: none');  //to be extracted to slickPlay
            _.$pauseButton.find('.slick-pause-text').removeAttr('style');  //to be extracted to slickPlay

            _.slickPlay();
        } else {
            _.$playIcon.css('display', 'inline');  //to be extracted to slickPause
            _.$pauseIcon.css('display', 'none');  //to be extracted to slickPause

            _.$pauseButton.find('.slick-play-text').removeAttr('style');  //to be extracted to slickPause
            _.$pauseButton.find('.slick-pause-text').attr('style', 'display: none');  //to be extracted to slickPause

            _.slickPause();
        }
    };

I have solved this exactly as I was suggesting above. I have moved the toggle logic into slickPlay and slickPause functions respectively, which means calling slickPause manually triggers the slickPause function which now also toggles the button states. Works as expected!

New code for Slick.prototype.autoPlayToggleHandler:

Slick.prototype.autoPlayToggleHandler = function() {
        var _ = this;

        if(_.paused) {
            _.slickPlay();
        } else {
            _.slickPause();
        }
    };

New code for Slick.prototype.slickPause

Slick.prototype.pause = Slick.prototype.slickPause = function() {

        var _ = this;

        if ( _.options.autoplay){ //added
          _.$playIcon.css('display', 'inline'); //added
          _.$pauseIcon.css('display', 'none'); //added

          _.$pauseButton.find('.slick-play-text').removeAttr('style'); //added
          _.$pauseButton.find('.slick-pause-text').attr('style', 'display: none'); //added
        } //added

        _.autoPlayClear();
        _.paused = true;

    };

New code for Slick.prototype.slickPlay

    Slick.prototype.play = Slick.prototype.slickPlay = function() {

        var _ = this;

        if ( _.options.autoplay){ //added
          _.$playIcon.css('display', 'none'); //added
          _.$pauseIcon.css('display', 'inline'); //added

          _.$pauseButton.find('.slick-play-text').attr('style', 'display: none'); //added
          _.$pauseButton.find('.slick-pause-text').removeAttr('style'); //added
        } //added

        _.autoPlay();
        _.options.autoplay = true;
        _.paused = false;
        _.focussed = false;
        _.interrupted = false;

    };