Contenidos
main.py
|
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 |
import os import threading import time from flask import Flask, jsonify app = Flask(__name__) # Variable global para almacenar el tiempo del cronómetro timer_seconds = 0 timer_running = False # Función que se ejecuta en un hilo separado como cronómetro def timer_task(): global timer_seconds, timer_running while timer_running: time.sleep(1) # Pausa de 1 segundo timer_seconds += 1 @app.route('/') def index(): return ''' <h1>Cronómetro</h1> <button onclick="startTimer()">Iniciar Cronómetro</button> <button onclick="stopTimer()">Detener Cronómetro</button> <h2>Tiempo Transcurrido:</h2> <pre id="output">0 segundos</pre> <script> function startTimer() { fetch('/start-timer') .then(response => response.json()) .then(data => { if (data.started) { document.getElementById('output').innerText = 'Cronómetro iniciado...'; checkTimerOutput(); } }); } function stopTimer() { fetch('/stop-timer') .then(response => response.json()) .then(data => { if (data.stopped) { document.getElementById('output').innerText = 'Cronómetro detenido en ' + data.time + ' segundos'; } }); } function checkTimerOutput() { fetch('/timer-output') .then(response => response.json()) .then(data => { document.getElementById('output').innerText = data.time + ' segundos'; if (data.running) { setTimeout(checkTimerOutput, 1000); } }); } </script> ''' @app.route('/start-timer') def start_timer(): global timer_seconds, timer_running if not timer_running: timer_seconds = 0 timer_running = True thread = threading.Thread(target=timer_task, name='TimerThread') thread.start() return jsonify({'started': True}) else: return jsonify({'started': False}) @app.route('/stop-timer') def stop_timer(): global timer_running timer_running = False return jsonify({'stopped': True, 'time': timer_seconds}) @app.route('/timer-output') def get_timer_output(): global timer_seconds, timer_running return jsonify({'time': timer_seconds, 'running': timer_running}) def main(): app.run(port=int(os.environ.get('PORT', 5000)), debug=True) if __name__ == "__main__": main() |
Explicación
- Cronómetro en Hilo:
- La función
timer_taskactúa como el cronómetro, incrementandotimer_secondscada segundo mientrastimer_runningesTrue. - El hilo se inicia y detiene mediante las rutas
/start-timery/stop-timer.
- La función
- Rutas de Flask:
- La ruta
/start-timerinicia el cronómetro si no está ya en ejecución. - La ruta
/stop-timerdetiene el cronómetro y devuelve el tiempo transcurrido. - La ruta
/timer-outputdevuelve el tiempo actual del cronómetro y si está en ejecución.
- La ruta
- JavaScript en HTML:
- La función
startTimerenvía una solicitud a/start-timerpara iniciar el cronómetro. - La función
stopTimerenvía una solicitud a/stop-timerpara detener el cronómetro. - La función
checkTimerOutputenvía solicitudes periódicas a/timer-outputpara actualizar el tiempo transcurrido en la página web.
- La función
Ejecución
- Guarda el código en un archivo Python, por ejemplo,
main.py. - Ejecuta el script con
python main.py. - Abre un navegador web y navega a
http://localhost:5000. - Haz clic en «Iniciar Cronómetro» para empezar el cronómetro y «Detener Cronómetro» para pararlo y mostrar el tiempo transcurrido.