How to prevent spam clicking from firing off events?

Ask the community
,
1

Hey guys i have this code to show multiple services on one spot with a fade animation when clicking a invisible box over some icons, works great when clicking slowly but gets messy when doing it fast, how i can prevent this from happening?

let fadeOptions = {
 "duration":   300,
 "delay":      0
};

export function SalarmasCaja_click(event) {
 //Add your code for this event here: 
    $w("#GrupoSAlarmas").show("fade", fadeOptions);
    $w("#GrupoVVigilancia").hide();
    $w("#LineaSAlarmas").show();
    $w('#LineaVVigilancia').hide();
    $w("#GrupoMonitoreo").hide();
    $w('#LineaMonitoreo').hide();
    $w('#GrupoAHogar').hide();
    $w('#LineaAHogar').hide();
}

export function VVigilanciaCaja_click(event) {
 //Add your code for this event here: 
    $w("#GrupoVVigilancia").show("fade", fadeOptions);
    $w("#GrupoSAlarmas").hide();
    $w("#LineaSAlarmas").hide();
    $w("#LineaVVigilancia").show();
    $w("#GrupoMonitoreo").hide();
    $w('#LineaMonitoreo').hide();
    $w('#GrupoAHogar').hide();
    $w('#LineaAHogar').hide();
}

export function MonitoreoCaja_click(event) {
 //Add your code for this event here: 
    $w("#GrupoMonitoreo").show("fade", fadeOptions);
    $w("#LineaMonitoreo").show();
    $w("#GrupoVVigilancia").hide();
    $w('#LineaVVigilancia').hide();
    $w("#GrupoSAlarmas").hide();
    $w("#LineaSAlarmas").hide();
    $w('#GrupoAHogar').hide();
    $w('#LineaAHogar').hide();
}

export function AHogarCaja_click(event) {
 //Add your code for this event here: 
    $w('#GrupoAHogar').show("fade", fadeOptions);
    $w('#LineaAHogar').show();
    $w("#GrupoVVigilancia").hide();
    $w('#LineaVVigilancia').hide();
    $w("#GrupoSAlarmas").hide();
    $w("#LineaSAlarmas").hide();
    $w("#GrupoMonitoreo").hide();
    $w('#LineaMonitoreo').hide();
}