javascript - How to pass variable asyncronously through different scripts -

i can't figure out how it.

i have 2 separate scripts. first 1 generates interval (or timeout) run specified function every x seconds, i.e. reload page.

the other script contains actions button control (pause/play) interval.

the pitfall here both sides must asyncronous (both run when document loaded).

how use interval within second script?

here's jsfiddle: http://jsfiddle.net/hm2d6d6l/4/

and here's code quick view:

var interval; // main script (function($){     $(function(){         var reload = function() {             console.log('reloading...');         };         // create interval here run reload() every time     }); })(jquery);  // script, available specific users (function($){     $(function(){         var $playerbutton = $('body').find('button.player'),             $icon         = $playerbutton.children('i');             buttonaction = function(e){                 e.preventdefault();                 if ($(this).hasclass('playing')) {                     // pause/clear interval here                     $(this).removeclass('playing').addclass('paused');                     $icon.removeclass('glyphicon-pause').addclass('glyphicon-play');                 }                 else {                     // play/recreate interval here                     $(this).removeclass('paused').addclass('playing');                     $icon.removeclass('glyphicon-play').addclass('glyphicon-pause');                 }             },             buttoninit = function() {                 $playerbutton.on('click', buttonaction);             };         buttoninit();     }); })(jquery); 

you create simple event bus. pretty easy create jquery, since have in there:

// somewhere globally accessible (script 1 works fine) var bus = $({});  // script 1 setinterval(function() {     reload();     bus.trigger('reload'); }, 1000);  // script 2 bus.on('reload', function() {     // there reload in script 1, yay! });