Ufdjrw

Using jQuery Idle Timeout by Eric Hynds, but it appears to be an abandoned project.

This is being used on a kiosk project (in Chrome dev tools, the resolution has to be 1080px wide by 1920px tall) and it will load the kiosk version: http://dev.demo38.com/owu/

The timeout is used for when a user walks away from the kiosk, a timer triggers an alert with a countdown. That countdown can be reset to keep browsing, or if let count down, redirects the kiosk back to the home screen.

This used to work fine, however started getting the following console error:

Uncaught TypeError: Cannot read property 'nodeType' of undefined
at Function.n.acceptData [as accepts] (jquery.js:3531)
at K.key (jquery.js:3556)
at K.set (jquery.js:3593)
at K.access (jquery.js:3652)
at Function.data (jquery.js:3761)
at Object.init (jquery.idletimeout.js?ver=1.2:32)
at Function.$.idleTimeout (jquery.idletimeout.js?ver=1.2:139)
at (index):825

Any insights on where that error is triggering / how to resolve?

The first script is by Paul Irish, using his IdleTimer (jquery.idletimer.js)

(function($)

$.idleTimer = function f(newTimeout) +new Date;

 //assign a new timeout if necessary
 if (typeof newTimeout == "number")
 timeout = newTimeout;
 else if (newTimeout === 'destroy') 
 stop();
 return this; 
 else if (newTimeout === 'getElapsedTime')
 return (+new Date) - f.olddate;
 

 //assign appropriate event handlers
 $(document).bind($.trim((events+' ').split(' ').join('.idleTimer ')),handleUserEvent);


 //set a timeout to toggle state
 $.idleTimer.tId = setTimeout(toggleIdleState, timeout);

 // assume the user is active for the first x seconds.
 $.data(document,'idleTimer',"active");




; // end of $.idleTimer()



)(jQuery);

The second script is the timeout / redirect (jquery.idletimeout.js)

(function($, win)

 var idleTimeout = 
 init: function( element, resume, options )
 var self = this, elem;

 this.warning = elem = $(element);
 this.resume = $(resume);
 this.options = options;
 this.countdownOpen = false;
 this.failedRequests = options.failedRequests;
 this._startTimer();
 this.title = document.title;

 // expose obj to data cache so peeps can call internal methods
 $.data( elem[0], 'idletimeout', this );

 // start the idle timer
 $.idleTimer(options.idleAfter * 1000);

 // once the user becomes idle
 $(document).bind("idle.idleTimer", function()

 // if the user is idle and a countdown isn't already running
 if( $.data(document, 'idleTimer') === 'idle' && !self.countdownOpen )
 self._stopTimer();
 self.countdownOpen = true;
 self._idle();
 
 );

 // bind continue link
 this.resume.bind("click", function(e)
 e.preventDefault();

 win.clearInterval(self.countdown); // stop the countdown
 self.countdownOpen = false; // stop countdown
 self._startTimer(); // start up the timer again
 self._keepAlive( false ); // ping server
 options.onResume.call( self.warning ); // call the resume callback
 );
 ,

 _idle: function()
 var self = this,
 options = this.options,
 warning = this.warning[0],
 counter = options.warningLength;

 // fire the onIdle function
 options.onIdle.call(warning);

 // set inital value in the countdown placeholder
 options.onCountdown.call(warning, counter);

 // create a timer that runs every second
 this.countdown = win.setInterval(function()
 if(--counter === 0)
 window.clearInterval(self.countdown);
 options.onTimeout.call(warning);
 else 
 options.onCountdown.call(warning, counter);
 document.title = options.titleMessage.replace('%s', counter) + self.title;
 
 , 1000);
 ,

 _startTimer: function()
 var self = this;

 this.timer = win.setTimeout(function()
 self._keepAlive();
 , this.options.pollingInterval * 1000);
 ,

 _stopTimer: function()
 // reset the failed requests counter
 this.failedRequests = this.options.failedRequests;
 win.clearTimeout(this.timer);
 ,

 _keepAlive: function( recurse )
 var self = this,
 options = this.options;

 //Reset the title to what it was.
 document.title = self.title;

 // assume a startTimer/keepAlive loop unless told otherwise
 if( typeof recurse === "undefined" )
 recurse = true;
 

 // if too many requests failed, abort
 if( !this.failedRequests )
 this._stopTimer();
 options.onAbort.call( this.warning[0] );
 return;
 

 $.ajax(
 timeout: options.AJAXTimeout,
 url: options.keepAliveURL,
 error: function()
 self.failedRequests--;
 ,
 success: function(response)
 if($.trim(response) !== options.serverResponseEquals)
 self.failedRequests--;
 
 ,
 complete: function()
 if( recurse )
 self._startTimer();
 
 
 );
 
 ;

 // expose
 $.idleTimeout = function(element, resume, options)
 idleTimeout.init( element, resume, $.extend($.idleTimeout.options, options) );
 return this;
 ;

 // options
 $.idleTimeout.options = ',

 /*
 Callbacks
 "this" refers to the element found by the first selector passed to $.idleTimeout.
 */
 // callback to fire when the session times out
 onTimeout: $.noop,

 // fires when the user becomes idle
 onIdle: $.noop,

 // fires during each second of warningLength
 onCountdown: $.noop,

 // fires when the user resumes the session
 onResume: $.noop,

 // callback to fire when the script is aborted due to too many failed requests
 onAbort: $.noop
 ;

)(jQuery, window);

And, this is the script that trigger:

$.idleTimeout('#idletimeout', '#idletimeout a', 
 idleAfter: 180,
 pollingInterval: 5,
 keepAliveURL: 'http://dev.demo38.com/owu/wp-content/themes/owu/keepalive.php',
 serverResponseEquals: 'OK',
 onTimeout: function()
 $(this).slideUp();
 // window.location = home_url;
 window.location = "http://dev.demo38.com/owu/";
 ,
 onIdle: function()
 $(this).slideDown(); // show the warning bar
 ,
 onCountdown: function( counter )
 $(this).find("span").html( counter ); // update the counter
 ,
 onResume: function()
 $(this).slideUp(); // hide the warning bar
 
 );