We Keep Coding

Trouble with Disabling Functions when button is clicked

So I'm working on a school coding project and I'm having trouble disabling a function when a particular button is pressed. I assumed a return command would be the best way to go but my code doesn't seem to be doing the job. Here's an example of the code I tried:
var x = false;
onEvent("button","click",function(){
`` x = true;
newScreen();
});
if(x == true){
return false;
}else{
return true;
}
}
This is taken from the end of a function. Does the if statement have to be directly connected to the function (placed right at the top)? If so, how would I go about coding the function where if it's true, run the code but if it's false, don't (if that makes sense)?

var x = false;
onEvent("button","click",function(e){
if(x === true) {
e.target.disabled = true;
e.preventDefault();
e.stopPropagation();
return;
}
x = true;
newScreen();
});

How to disable onkeyup for a few seconds

im creating a browser game and i have added keybinds so the player can use keys to move around the world.
If people use the buttons to move, these buttons are getting hidden for 5 seconds to allow an animation to end. Now i want to do this for the keybinds too.
For example: Player presses spacebar and a interval will run that lasts 5 seconds. Pressing space again will glitch out really bad running the same interval twice. So how do i disable a function for 5 seconds after it has been called so that it won't glitch out?
This is the code i use for the keys:
<script>
document.body.onkeyup = function(e){
if(e.keyCode == 32){
var cmd = "<?php echo $row['HEADING']; ?>";
if(cmd == "N") myMoveUp();
if(cmd == "E") myMoveRight();
if(cmd == "S") myMoveDown();
if(cmd == "W") myMoveLeft();
}
if(e.keyCode == 37){
ChangeHeadingKP("W");
}
if(e.keyCode == 38){
ChangeHeadingKP("N");
}
if(e.keyCode == 39){
ChangeHeadingKP("E");
}
if(e.keyCode == 40){
ChangeHeadingKP("S");
}
}
</script>
Any help would be appreciated.

I wouldn't rely on timing (say, 5 seconds) because when you change them, you'll have to review your code.
Instead I'd rely on toggling a flag by calling specific methods, like this:
keymanager.suspend();
// play animation, cutscene or whatever
keymanager.resume();
Those two functions are easy to define, along with the keymanager, as follows:
var keymanager = {
"active": true,
"suspend": () => {
keymanager.active = false;
},
"resume": () => {
keymanager.active = true;
}
};
All that remains is the key event handler bailing out when keys are deactivated:
document.body.onkeyup = function (e) {
if (!keymanager.active)
{
return; // do not process any keys
}
// rest of your code...
}

Angular button click

I'm new to Angular and I don't know how to do this kind of action. I have these buttons:
<button *ngIf="entryControlEnabled && !gateOpen" class="bottomButton red" (click)="openGate()">Open</button>
<button *ngIf="entryControlEnabled && gateOpen" class="bottomButton green" (click)="closeGate()">Close</button>
And In .ts file I have this:
if (data.IoNumber == config.IoNumberGates) {
if (data.IoStatus == "DetectorDeactivated") {
this.gateOpen = true;
} else {
this.gateOpen = false;
}
}
I want to change data.IoStatus == "DetectorDeactivated" to data.IoStatus == "DetectorActivated"
I want to illustrate what I mean:
openGate(){
this.data.IoStatus == "DetectorActivated"
}
closeGate(){
this.data.IoStatus == "DetectorDeactivated"
}
Can someone help me please?

Assuming you want to switch variable this.gateOpen to true or false and this.gateOpen, openGate and closeGate belongs to same component. Your functions should look like this.
openGate(){
// this.data.IoStatus == "DetectorActivated";
// it's wrong, this is comparison not assignement
this.data.IoStatus = "DetectorActivated";
}
closeGate(){
// this.data.IoStatus == "DetectorDeactivated";
// it's wrong, this is comparison not assignement
this.data.IoStatus = "DetectorDeactivated";
}
Hope it helps
if (data.IoNumber == config.IoNumberGates) {
if (data.IoStatus == "DetectorDeactivated") {
this.gateOpen = true;
} else {
this.gateOpen = false;
}
}
Make sure this code runs on correct event, in your case it should be click event or something. Else just directly change the this.gateOpen variable in functions like this.
openGate(){
this.gateOpen = true;
}
closeGate(){
this.gateOpen = false;
}

It would be easier to use a slide / switch toggle. Below I am using Angular Material Slide Toggle.
View:
<mat-slide-toggle #approve (change)="toggle($event)" [labelPosition]="'before'">
{{approve.checked? "Detector Activated": "Detector Activate"}}</mat-slide-toggle>
Component:
toggle(event: MatSlideToggleChange) {
console.log('Toggle fired');
if(event.checked)
this.data.IoStatus = "DetectorActivated";
else
this.data.IoStatus = "DetectorActivated";
}

How to use a true/false condition to pause video in an if loop of javascript?

Say I get an onclick even to return either true or false and store it in a variable.
$('.box1').on('click', function(){
boxClicked = true;
video1[0].play();
});
Later on in the code, I am using;
$(video1).on('timeupdate', function()
{
var currentTime = Math.round(this.currentTime);
var durationNum = Math.round(this.duration);
var formattedCurrentTime = secondsToHms(currentTime);
var formattedDurationTime = secondsToHms(durationNum)
onTrackedVideoFram(formattedCurrentTime, formattedDurationTime)
if(currentTime == boxTime && boxClicked == true) {
video1[0].pause();
}
});
});
boxTime is a variable with a prestored value of say, 10
So it should at 10 sec duration check, if the boxClick is true or false and if false, it should pause the video.
My only problem... it is not doing that.

You say that you want to pause the video only when boxClicked is false. If that is the case, then simply check for boxClicked to be false rather than true in your if-statement:
if(currentTime == boxTime && boxClicked == false) {
video1[0].pause();
}

How to add click event and if condition together?

I need to perform some task based on 2 conditions on page load.
1) If a button is clicked or
2) If condition becomes true
so can I combine this two events into one?
if(x== true) || button.click(function(e){
..
perform task...
}

var perform_task = function() {
....
}
if(x == true) perform_task();
button.click(function(er) { perform_task(); }

try this?
button.click(function(){
if(x == true){
/* do something */
}
});

var flag = false;
$("button").click(function() {
flag = true;
});
if((x== true) || flag ){
// do here
}