<!DOCTYPE html>
<html>
<head>
<script data-require="rxjs@*" data-semver="2.5.3" src="//cdnjs.cloudflare.com/ajax/libs/rxjs/2.5.3/rx.all.js"></script>
<script data-require="rx.dom.js@4.0.4" data-semver="4.0.4" src="https://cdn.rawgit.com/Reactive-Extensions/RxJS-DOM/v4.0.4/dist/rx.dom.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body>
<h1>Hello Plunker!</h1>
<input type="text" id="input" value="123">
<p>Idle timeout triggers after 5 seconds of inactivity. You can stop with Quit and restart it refreshing the page. Check console for messages.</p>
</body>
</html>
var mergedStreams = Rx.Observable.merge(
Rx.DOM.click(document),
Rx.DOM.keydown(document),
Rx.DOM.mousemove(document),
Rx.DOM.touchstart(document),
Rx.DOM.scroll(document)
);
var idleStream = mergedStreams
.bufferWithTime(5000)
.filter(function(arr){
return arr.length===0;
})
.pausable();
var subscription = idleStream.subscribeOnNext(
function () {
idleStream.pause();
if (!confirm("Idle timeout. Quit?")){
console.log('user wants to stay');
idleStream.resume();
} else {
//add quit logic
console.log('user wants to quit');
}
},
function (err) {
console.log('Error: ' + err);
});
//start
idleStream.resume();
/* Styles go here */