By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
432,510 Members | 1,810 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 432,510 IT Pros & Developers. It's quick & easy.

javascript increment setInteval counter while video is playing

P: 1
I have the following code that detect if user is idle or not. On page load, a timer will run and if the user is idle for a certain of seconds the timer will pause and resume if the user is active. And I have also codes that detect if video is playing, if the video is playing timer should run and if the video is stop/pause a timeout will run and detect if the user is still active

The problem is even if video is playing, the timer paused and it will start to idle. What I want is when video is playing timer should countinue to increment.

Heres my code:


Expand|Select|Wrap|Line Numbers
  1.     function setPlayingVideoToTrue(){playing_video = true;}
  2.  
  3.     function setPlayingVideoToFalse(){playing_video = false;}
  4.  
  5.     // check if a video iframe exists
  6.     var iframe_videos = $('body').find('iframe');
  7.  
  8.     if(iframe_videos.length > 0){
  9.     // create ready events for every iframe
  10.     iframe_videos.each(function(index){
  11.         // add a temporary id for the iframe
  12.         // append additional parameters to the end of the iframe's src
  13.         var temporary_player_id = 'iframe_player_'+ index;
  14.         var new_iframe_src = $(this).attr('src') +'?api=1&player_id='+ temporary_player_id;
  15.         $(this).attr('id', temporary_player_id);
  16.         $(this).attr('src', new_iframe_src);
  17.  
  18.         // add event listener for ready
  19.         $f(this).addEvent('ready', iframe_ready);
  20.     });
  21.  
  22.     // when a player is ready, add event listeners for play, pause, finish, and playProgress
  23.     function iframe_ready(player_id) {
  24.         $f(player_id).addEvent('play', setPlayingVideoToTrue);
  25.         $f(player_id).addEvent('playProgress', setPlayingVideoToTrue);
  26.         $f(player_id).addEvent('pause', setPlayingVideoToFalse);
  27.         $f(player_id).addEvent('finish', setPlayingVideoToFalse);
  28.     }
  29.     }
  30.  
  31.  
  32.     function start_idle_timer(){
  33.     var timer = 0;
  34.  
  35.     function increment_duration()
  36.     {    
  37.         if(isPaused === false)
  38.         {
  39.             timer++;
  40.         }
  41.  
  42.         // increment timer if video is playing
  43.         if(playing_video === true){
  44.             clearTimeout(idleTimer);
  45.             isPaused = false;
  46.         }
  47.  
  48.  
  49.         if(playing_video === false && isPaused === false){
  50.  
  51.             // stop timer if the user is idle for 3 minutes
  52.             var idleTimer = setTimeout(function(){
  53.                 // console.log('idle');
  54.                 clearInterval(check_time);
  55.                 isPaused = true;
  56.  
  57.                 // a modal will apper to inform that user is on idle state
  58.                 $('#linkage').trigger('click');
  59.  
  60.                 var modal_timer = 0;
  61.                 // timer for modal idle timer
  62.                 continue_modal_timer = setInterval(function(){
  63.                     modal_timer++;
  64.  
  65.                     inactivity_timer = modal_timer;
  66.                     if(modal_timer == 60)
  67.                     {
  68.                         clearInterval(continue_modal_timer);
  69.                         clearTimeout(idleTimer);    
  70.                     }
  71.                 }, 1000)    
  72.             }, 10000);
  73.         }
  74.  
  75.         // bind to all elements on DOM possible events indicating the user is active
  76.         $('*').bind('mousemove click mouseup mousedown keydown keypress keyup submit change mouseenter scroll resize dblclick', function () {
  77.                clearTimeout(idleTimer);
  78.             isPaused = false;
  79.         });
  80.     }
  81.  
  82.     // initialize the interval
  83.     check_time = setInterval(increment_duration, 1000); 
  84.     }
  85.  
  86.     // check if start_timer is present from the loading page to record the time duration of the user
  87.     if($('.start_timer').length > 0){    
  88.     start_idle_timer();
  89.     }
Jun 23 '15 #1
Share this question for a faster answer!
Share on Google+

Post your reply

Sign in to post your reply or Sign up for a free account.