How to stop Spin.js from other js file

Question

i need help

Actually in my work i need to implement spin.js and block UI in a jqgrid. This is ok when i put the code in the same file and function, but i want to call a method from other JS file, and hear is where my problem. The spin.js and block UI start, then block UI stop with unblock but the spin.js still running.

Here is my code:

In BeforeRequest() in jqgrid i call one method

 $.pui.common.loaderAnimationON("pane-content");

this method have this code

  loaderAnimationON: function (div) {
        var opts = {
            lines: 13, // The number of lines to draw
            length: 20, // The length of each line
            width: 10, // The line thickness
            radius: 30, // The radius of the inner circle
            corners: 1, // Corner roundness (0..1)
            rotate: 0, // The rotation offset
            direction: 1, // 1: clockwise, -1: counterclockwise
            color: '#000', // #rgb or #rrggbb or array of colors
            speed: 1, // Rounds per second
            trail: 60, // Afterglow percentage
            shadow: false, // Whether to render a shadow
            hwaccel: false, // Whether to use hardware acceleration
            className: 'spinner', // The CSS class to assign to the spinner
            zIndex: 2e9, // The z-index (defaults to 2000000000)
            top: '50%', // Top position relative to parent in px
            left: '50%' // Left position relative to parent in px
        };
        var target = document.getElementById(div);
        var spinner = new Spinner(opts).spin(target);


        $.blockUI({
            blockMsgClass: "gridProjectsLoader",
            message: null
        });

        return spinner;
    },

in gridComplete() i call other method

     $.pui.common.loaderAnimationOFF("pane-content");

this method have this code

     loaderAnimationOFF: function (div) {
        var target = document.getElementById(div);
        var spinner = $.pui.common.loaderAnimationON();
        spinner.stop(target);
        $.unblockUI();
    }

Anyone can help me?

Thanks guys

Answer 1

You should use the same object to start and stop it. You can use global variables anywhere (just another .js) Check this jsFiddle. It's stop spinner after 3 secs.

http://jsfiddle.net/YX7dy/8/

spinner=loaderAnimationON('Spin');
setInterval(function(){spinner.stop();},3000);