Cuckoo
Cuckoo

Reputation: 366

Stop function from re- executing for one second with settimeout

I want to prevent my function from re-executing for one second after it's last executed. I've tried the method below, but it doesn't work.

function displayOut() {
	
	// images
	document.getElementById("imgBox").style.backgroundImage = "url(" + db.rooms[roomLoc].roomImg + ")";
	// Diologue box
	diologueBox.innerHTML = ""; // Clear Box
	teleTyperDiologue(db.rooms[roomLoc].description + 
		" The room contains: " +
			(function() {
				let x = "";
				for (let i = 0; i < db.items.length; i++) {
					if (db.items[i].location === roomLoc && db.items[i].hidden === false) {
						x += db.items[i].name + ", "
					}
				}
				x = x.slice(0, x.length -2);
				if (x === "") {
					x = " nothing of special interest";
				}
				return x;
			})()
		+ ".");
	pause();
};

function pause() {
	setTimeout(function() {
		// Wait one second!
	}, 1000);
}

Upvotes: 0

Views: 59

Answers (3)

FrankCamara
FrankCamara

Reputation: 348

This one will achieve that:

function run () {
  console.log('Im running');
  pause(1000);
};

function pause(s) {
  console.log('Im paused');
  setTimeout(() =>{
    run();
  }, s)
};

run();

The code above will run every 1 sec but if you want to make sure the function cant be runned again until you decide then you could use a flag instead like:

let canExecute = true;
function run () {
  if (canExecute) {
    console.log('Im running');
    canExecute = false;
    pause(1000);
  }
};

function pause(s) {
  console.log('Im paused');
    setTimeout(() =>{
      canExecute = true;
    }, s)
};

run();
run();
run();
setTimeout(() =>{
  run();
}, 2000)

This code will execute run function twice, first on time and then one more after 2 sec.

Upvotes: 0

quique
quique

Reputation: 129

Try to use throttle (http://underscorejs.org/#throttle) or debounce (http://underscorejs.org/#debounce) from underscore, one of those should fit your needs

Upvotes: 0

Arg0n
Arg0n

Reputation: 8423

You could use a pattern like this:

var executing = false;

function myFunc() {
  if(!executing) {
    executing = true;
    
    //Code
    console.log('Executed!');
    //End code
    
    setTimeout(function() {
      executing = false;
    }, 1000);
  }
}

setInterval(myFunc, 100);

So in your case, this would look like this:

var executing = false;

function displayOut() {
  if(!executing) {
    executing = true;

    // images
    document.getElementById("imgBox").style.backgroundImage = "url(" + db.rooms[roomLoc].roomImg + ")";
    // Diologue box
    diologueBox.innerHTML = ""; // Clear Box
    teleTyperDiologue(db.rooms[roomLoc].description + 
    " The room contains: " +
    (function() {
      let x = "";
      for (let i = 0; i < db.items.length; i++) {
        if (db.items[i].location === roomLoc && db.items[i].hidden === false) {
          x += db.items[i].name + ", "
        }
      }
      x = x.slice(0, x.length -2);
      if (x === "") {
        x = " nothing of special interest";
      }
      return x;
    })()
    + ".");

    setTimeout(function() {
      executing = false;
    }, 1000);
  }
};

Upvotes: 1

Related Questions