Botão de Silenciar Alarmes com Ícone Dinâmico no ScadaBR

Boas-vindas a todos.
Estava com um problema onde o cliente queria um botão que silenciasse os alarmes, onde este botão teria que mudar a imagem conforme o som estivesse habilitado ou desabilitado.
Como não achei nada do gênero no fórum. Venho compartilhar o meu código:

<input
    type="image"
    id="muteImage" 
    src="graphics/Novo/alarm.png" 
    height="25" 
    title="Silenciar"
    onclick="toggleMuteAndUpdateImage();"
    style="border: none; cursor: pointer;"
/>

<script>
    // Função para alternar o mute e atualizar a imagem
    function toggleMuteAndUpdateImage() {
        // Alterna o estado do mute
        MiscDwr.toggleUserMuted(setUserMuted);
        
        // Aguarda o tempo necessário para o estado ser alterado antes de atualizar a imagem
        setTimeout(function() {
            updateImage();
        }, 100); // 100ms pode ser ajustado conforme necessário
    }

    // Função que altera a imagem de acordo com o estado de mute
    function updateImage() {
        var muteImage = document.getElementById('muteImage');
        muteImage.src = mango.soundPlayer.isMute() ? "graphics/Novo/noalarm.png" : "graphics/Novo/alarm.png";
    }

    // Chama a função uma vez quando a página for carregada
    window.onload = updateImage;
</script>

image

image

1 curtida