Wacth/prueba.js at main · MrBeeza/Wacth · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
let timerA, timerB, PauseReplayBool=true,
PlusHoras = document.getElementById("PlusHoras"),
PlusMinutos = document.getElementById("PlusMinutos"),
PlusSegundos = document.getElementById("PlusSegundos"),
Circulo = document.getElementById("Circulo"),
CuentaRegresiva = document.getElementById("CuentaRegresiva"),
PausaReplay = document.getElementById("PausaReplay"),
horasRestantes, minutosRestantes, segundosRestantes;


function CambiosS() {
    if(PlusSegundos.value >= 60){
        PlusMinutos.value = parseInt(PlusMinutos.value, 10) + 1;
        PlusSegundos.value = parseInt(PlusSegundos.value, 10) - 60;
    }
    if(PlusSegundos.value >= 60){CambiosS();}
}
function CambiosM() {
    if(PlusMinutos.value >= 60){
        PlusHoras.value = parseInt(PlusHoras.value, 10) + 1;
        PlusMinutos.value = parseInt(PlusMinutos.value, 10) - 60;
    }
    if(PlusMinutos.value >= 60){CambiosM();}
}

/* Poner 0 cuando se quede vacio */
function EnCero(Elemento){
    if(Elemento.value == ""){Elemento.value = 0;}
}

function PauseReplay() {
    /* Si se esta parado */
    console.log(PauseReplayBool);
    if(PauseReplayBool){Comenzar();}
    else{
        timerA.finish();
        clearTimeout(timerB);
        PlusHoras.value = horasRestantes;
        PlusMinutos.value = minutosRestantes;
        PlusSegundos.value = segundosRestantes;
        document.title = "Temporizador";
        PausaReplay.innerHTML = `<path d="M2.067,0.043C2.21-0.028,2.372-0.008,2.493,0.085l13.312,8.503c0.094,0.078,0.154,0.191,0.154,0.313c0,0.12-0.061,0.237-0.154,0.314L2.492,17.717c-0.07,0.057-0.162,0.087-0.25,0.087l-0.176-0.04c-0.136-0.065-0.222-0.207-0.222-0.361V0.402C1.844,0.25,1.93,0.107,2.067,0.043z"/>`;
        PauseReplayBool=true;
    }
}

function Comenzar() {
    // Cambios de diseño del botón
    PauseReplayBool=false;
    PausaReplay.innerHTML = `
        <rect x="-2" y="-1" width="7" height="20"/>
        <rect x="9" y="-1" width="7" height="20"/>`;

    // Limpiar cualquier temporizador previo
    if(timerA!=null){timerA.finish();}
    if(timerB!==null){clearTimeout(timerB);}

    // Obtener la hora actual
    let horaActual = new Date();

    // Obtener la hora deseada
    let horaDeseada = new Date();
    horaDeseada.setHours(horaDeseada.getHours() + parseInt(PlusHoras.value, 10));
    horaDeseada.setMinutes(horaDeseada.getMinutes() + parseInt(PlusMinutos.value, 10));
    horaDeseada.setSeconds(horaDeseada.getSeconds() + parseInt(PlusSegundos.value, 10));

    // Calcular la diferencia entre la hora deseada y la hora actual
    let tiempoRestante = horaDeseada - horaActual;

    // Calcular las horas, minutos y segundos de diferencia
    horasRestantes = Math.floor(tiempoRestante / (60 * 60 * 1000));
    minutosRestantes = Math.floor((tiempoRestante % (60 * 60 * 1000)) / (60 * 1000));
    segundosRestantes = Math.floor((tiempoRestante % (60 * 1000)) / 1000);

    // Añadir cero delante si es necesario
    let horasFormateadas = (horasRestantes < 10) ? "0" + horasRestantes : horasRestantes;
    let minutosFormateados = (minutosRestantes < 10) ? "0" + minutosRestantes : minutosRestantes;
    let segundosFormateados = (segundosRestantes < 10) ? "0" + segundosRestantes : segundosRestantes;

    // Utilizar esta diferencia como la duración total para el temporizador
    timerA=Circulo.animate([
        {strokeDasharray: "100, 100"},
        {strokeDasharray: "0, 100"}],
        {duration: tiempoRestante-500});

    // Mostrar en el temporizador y título
    CuentaRegresiva.innerHTML = horasFormateadas+" : "+minutosFormateados+" : "+segundosFormateados;
    document.title = "Temporizador "+horasFormateadas+":"+minutosFormateados+":"+segundosFormateados;

    // Bucle que va restando el tiempo
    timerB=setInterval(function(){

        // Calcular las horas, minutos y segundos de diferencia
        horasRestantes = Math.floor(tiempoRestante / (60 * 60 * 1000));
        minutosRestantes = Math.floor((tiempoRestante % (60 * 60 * 1000)) / (60 * 1000));
        segundosRestantes = Math.floor((tiempoRestante % (60 * 1000)) / 1000);

        // Añadir cero delante si es necesario
        horasFormateadas = (horasRestantes < 10) ? "0" + horasRestantes : horasRestantes;
        minutosFormateados = (minutosRestantes < 10) ? "0" + minutosRestantes : minutosRestantes;
        segundosFormateados = (segundosRestantes < 10) ? "0" + segundosRestantes : segundosRestantes;

        // Obtener la hora actual
        horaActual = new Date();

        // Calcular la diferencia entre la hora deseada y la hora actual
        tiempoRestante = horaDeseada - horaActual;

        // Terminar el bucle si el tiempo llega a cero
        if(horasRestantes<=0 && minutosRestantes<=0 && segundosRestantes<=0){
            finish.playclip();
            clearTimeout(timerB);
            // Cambios de diseño del botón al finalizar
            PausaReplay.innerHTML = `<path d="M2.067,0.043C2.21-0.028,2.372-0.008,2.493,0.085l13.312,8.503c0.094,0.078,0.154,0.191,0.154,0.313c0,0.12-0.061,0.237-0.154,0.314L2.492,17.717c-0.07,0.057-0.162,0.087-0.25,0.087l-0.176-0.04c-0.136-0.065-0.222-0.207-0.222-0.361V0.402C1.844,0.25,1.93,0.107,2.067,0.043z"/>`;
            PauseReplayBool=true;
        }

        // Actualizar el temporizador y título si el tiempo es mayor o igual a cero
        if(tiempoRestante>=0) {
            CuentaRegresiva.innerHTML = horasFormateadas+" : "+minutosFormateados+" : "+segundosFormateados;
            document.title = "Temporizador "+horasFormateadas+":"+minutosFormateados+":"+segundosFormateados;
        } else {document.title = "Temporizador";}
    },500);
}


// Definir lista de extensiones y el tipo de fichero de audio asociado
let html5_audiotypes={
    "mp3": "audio/mpeg",
    "mp4": "audio/mp4",
    "ogg": "audio/ogg",
    "wav": "audio/wav"
}

//Elegir sonido
let finish = createsoundbite('./Sonido.mp3');

//Inicializar sonidos
function createsoundbite(sound){
    let html5audio=document.createElement('audio')
    if (html5audio.canPlayType){ //Comprobar soporte para audio HTML5
        for (let i=0; i<arguments.length; i++){
            let sourceel=document.createElement('source')
            sourceel.setAttribute('src', arguments[i])
            if (arguments[i].match(/.(w+)$/i))
            sourceel.setAttribute('type', html5_audiotypes[RegExp.$1])
            html5audio.appendChild(sourceel)
        }
        html5audio.load()
        html5audio.playclip=function(){
            html5audio.pause()
            html5audio.currentTime=0
            html5audio.play()
        }
        return html5audio
    } else {alert("Su navegador no soporta audio HTML5");}
}