Pausing jQuery slider when Video is playing

Question

I'm using a jQuery slider on my site which allows for the embedding of Vimeo videos and I was wondering how I can make it so that if someone clicks "play" on the vimeo video, the slider will stop auto-rotating until the video is finished or until the user clicks "pause." I'm assuming I'm going to need to tap into the Vimeo API to accomplish this. Here is my slider code, any help is greatly appreciated!

UPDATE Solved this with the help of Trevor, here is the code for the slider:

var slideInProgress = 0;
var currentSlideIndex = 0,
    slides;
var playing = false;    
function setTopSlider() {
    if (jQuery('#top_slider #container .slide').length != 0) {
        slides = jQuery('#top_slider #container > .slide');
        for (var i = 0; i <= slides.length; i++) {
            jQuery(slides[i]).css('left', '100%');
        }
        ;
        jQuery(slides[currentSlideIndex]).css('left', '0%');
        var el = jQuery('.dot:eq(' + currentSlideIndex + ')');
        src = el.css("background-image").replace("_off", "_over");
        el.css("background-image", src);
        el.addClass('active');
    };
};

function slide(dir) {
    if (slideInProgress != 0) {
        return;
    }
    slideInProgress = 3;
    var current, next, nextSlide;
    var slideSpeed = 200;
    current = jQuery(slides[currentSlideIndex]);
    if (!isNaN(dir)) {
        next = dir;
        if (next > currentSlideIndex)
            dir = 'left';
        else
            dir = 'right';
    };
    if (dir == 'left') {
        if (!next) {
            next = currentSlideIndex + 1;
            if (next >= slides.length) {
                next = 0;
            }
        }
        nextSlide = jQuery(slides[next]);
        nextSlide.css('left', '100%');
        nextSlide.css('z-index', parseInt(current.css('z-index'), 10) + 1);
        //nextSlide.animate({left: '0%'}, 1500);
        nextSlide.animate({
            left: '0%'
        }, {
            duration: slideSpeed,
            complete: function() {
                slideInProgress--;
            }
        });
        //current.animate({left: '-100%'}, 1500);
        current.animate({
            left: '-100%'
        }, {
            duration: slideSpeed,
            complete: function() {
                slideInProgress--;
            }
        });

    } else {
        console.log('moving right');
        if (!next) {
            next = currentSlideIndex - 1;
            if (next < 0) {
                next = slides.length - 1;
            }
        }
        nextSlide = jQuery(slides[next]);
        nextSlide.css('left', '-100%');
        nextSlide.css('z-index', parseInt(current.css('z-index'), 10) + 1);
        //nextSlide.animate({left: '0%'}, 1500);
        nextSlide.animate({
            left: '0%'
        }, {
            duration: slideSpeed,
            complete: function() {
                slideInProgress--;
            }
        });
        //current.animate({left: '100%'}, 1500);
        current.animate({
            left: '100%'
        }, {
            duration: slideSpeed,
            complete: function() {
                slideInProgress--;
            }
        });

    }
    current.addClass('active');
    nextSlide.removeClass('active');
    var el = jQuery('.dot:eq(' + currentSlideIndex + ')');
    src = el.css("background-image").replace("_over", "_off");
    el.css("background-image", src);
    el.removeClass('active');
    el = jQuery('.dot:eq(' + next + ')');
    src = el.css("background-image").replace("_off", "_over");
    el.css("background-image", src);
    el.addClass('active');
    console.log('currentSlideIndex' + currentSlideIndex);
    console.log('next' + next);
    console.log('dir' + dir);
    currentSlideIndex = next;
    // **** //
    slideInProgress--;
    // **** //
}
setTopSlider();
playing = setInterval(function() {slide('left')}, 6000);

And how I tied it into the Vimeo API:

(function () {

    var $=jQuery;


    var f = $('iframe');
    var url = f.attr('src').split('?')[0]; <?php //HACK! had to hard code the protocol in here or postMethod shows error: Uncaught SyntaxError: An invalid or illegal string was specified. ?>
    //var status = $('.status');


    // Listen for messages from the player
    if (window.addEventListener){
        window.addEventListener('message', onMessageReceived, false);
    } else {
        window.attachEvent('onmessage', onMessageReceived, false);
    }

    // Handle messages received from the player
    function onMessageReceived(e) {
        var data = JSON.parse(e.data);


        switch (data.event) {
            case 'ready':
                onReady();
                break;

            case 'playProgress':
                onPlayProgress(data.data);
                break;

            case 'pause':
                onPause();
                break;

            case 'finish':
                onFinish();
                break;
        }
    }

    // Call the API when a button is pressed
    $('button').on('click', function() {
        post($(this).text().toLowerCase());
    });

    // Helper function for sending a message to the player
    function post(action, value) {
        var data = { method: action };

        if (value) {
            data.value = value;
        }
        $('iframe')[0].contentWindow.postMessage(JSON.stringify(data), url);
    }

    function onReady() {


        post('addEventListener', 'pause');
        post('addEventListener', 'finish');
        post('addEventListener', 'playProgress');
    }

    function onPause() {
        console.log("vimeo paused");
    }

    function onFinish() {
        playing = setInterval(function() {slide('left')}, 6000);
        console.log("vimeo finish");
        slide('left');
    }

    function onPlayProgress(data) {
        clearInterval(playing);
        console.log("vimeo play progress");
    }
})();

Answer 1

How about creating a boolean variable playing and using it to keep track of when the video is playing or not. If the video is playing then don't run your slide function.

e.g.

var playing = false;

function slide(dir) {
   if(playing)
        return false;
   ...
}

function onPause() {
    playing = false;
    console.log("vimeo paused");
}

function onFinish() {
    playing = false;
    console.log("vimeo finish");
    slide('left');
}

function onPlayProgress(data) {
    playing = true;
    console.log("vimeo play progress");
}