Progressbar Bootstrap – session control

Dynamic progressbar with bootstrap and session control.

Progressbar. Today I wrote a simple progressbar handler on Bootstrap – I needed a project that would display the session time of a logged-in user for my project. Due to the fact that in my case the session lasts 1 hour (3600 seconds) – the scripts below permanently take this parameter into account.

Progressbar Bootstrap
Progressbar Bootstrap

You can of course tweak the script below, e.g. by changing the color of the progress bar to red when there is less than 10% left:

if(3600 - s <= 360) document.getElementById("progress-value").setAttribute("class", "progress-bar progress-bar-danger");

Log out a user:

var logoutUrl = '/?logout=1'; // URL to logout user
if(p <= 0) window.location = logoutUrl;

Resources needed for everything:

https://cdnjs.cloudflare.com/ajax/libs/bootstrap-progressbar/0.9.0/bootstrap-progressbar.min.js 
https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css

Everything on fiddle:

5/5 - (5 votes)

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top