Skip to content
Advertisement

Disable a button for some hours with countdown in javascript [closed]

I want the button to be disabled after clicking it for 1 hr with displaying the countdown for current logged in user, is it possible to store time in firebase? And retrieve it and i want the time to be continue even the client refreshes the site. Any ideas or suggestions

Advertisement

Answer

For your initial question (without Firebase), here is a quick example

const button = document.querySelector('#mybutton');
let sec = 5;
let countdown = null;

const updateButton = () => {
  button.innerHTML = `wait ${sec}s`;
  
  if (sec === 0) {
    clearInterval(countdown);
    sec = 5;
    button.innerHTML = 'Click me';
    button.disabled = false;
    return;
  }

  sec--;
}

button.onclick = () => {
  button.disabled = true;
  updateButton();
  countdown = setInterval(function() {
    updateButton();
  }, 1000);
}
<button id="mybutton">Click me</button>

I guess you could make calls to Firebase when you init the sec variable and when you update it, but you could just use local storage for that as you would not add any security using Firebase to prevent any request to be sent.

Advertisement