Skip to content

Instantly share code, notes, and snippets.

@bhaumik55231
Created June 15, 2021 16:57
Show Gist options
  • Save bhaumik55231/a6aa799c56ffcb7755f51cd0462a8a8a to your computer and use it in GitHub Desktop.
Save bhaumik55231/a6aa799c56ffcb7755f51cd0462a8a8a to your computer and use it in GitHub Desktop.
Track user inactivity on a web page using javascript
const inactivityTime = () => {
let time;
const resetTimer = () => {
clearTimeout(time);
time = setTimeout(() => {
const resposeTimeout = setTimeout(() => {
// log out user if they don't respond to warning after 5 minutes.
logOut();
}, 300000)
// Show warning after 20 minutes of no activity.
const button = document.createElement('button');
button.dataset.toggle = 'modal';
button.dataset.target = '#confluenceMainModal'
document.body.appendChild(button);
button.click();
const header = document.getElementById('confluenceModalHeader');
const body = document.getElementById('confluenceModalBody');
header.innerHTML = `<h5 class="modal-title">Inactive</h5>`;
body.innerHTML = `You were inactive for 20 minutes, would you like to extend your session?
<div class="modal-footer">
<button type="button" title="Close" class="btn btn-dark log-out-user" data-dismiss="modal">Log Out</button>
<button type="button" title="Continue" class="btn btn-primary extend-user-session" data-dismiss="modal">Continue</button>
</div>`
document.body.removeChild(button);
Array.from(document.getElementsByClassName('log-out-user')).forEach(e => {
e.addEventListener('click', () => {
logOut();
})
})
Array.from(document.getElementsByClassName('extend-user-session')).forEach(e => {
e.addEventListener('click', () => {
clearTimeout(resposeTimeout);
resetTimer;
})
});
}, 1200000);
}
window.onload = resetTimer;
document.onmousemove = resetTimer;
document.onkeypress = resetTimer;
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment