
Tabla de contenido:
2025 Autor: John Day | [email protected]. Última modificación: 2025-01-23 14:39

Esto no es exactamente un Instructable. Estoy diseñando mi propio Word Clock y decidí construir primero un simulador de aplicación web para poder diseñar la cuadrícula y probar cómo se ve en varios momentos del día. Entonces me di cuenta de que esto podría ser útil para otras personas que trabajan con relojes de palabras y decidí compartirlo.
La aplicación es un solo archivo HTML corto. Si lo guarda y hace doble clic en él, se abrirá en su navegador y comenzará a mostrar la hora actual. Luego, actualizará la pantalla cada 10 segundos si la hora ha cambiado.
También hay un campo de texto donde puede escribir en cualquier momento específico y ver cómo se verá en su proyecto.
El diseño del reloj de palabras de cada persona es diferente, así que intenté configurar el código fácilmente. Consulte los siguientes pasos para obtener sugerencias sobre cómo hacerlo.
¡Espero que encuentres esto útil! ¡Es genial poder experimentar con diseños y redacción antes de comprometerse con el hardware!
Paso 1: descargue el archivo HTML
El simulador es una aplicación web de un solo archivo. Son poco menos de 200 líneas. Puedes descargarlo aquí.
(En realidad, no hay un botón para descargar el archivo en Github. Pero puede seleccionar el contenido del archivo, copiarlo y pegarlo en un nuevo archivo de texto en su computadora. Asegúrese de nombrar el archivo como algo.html).
Una vez que lo haya descargado, haga doble clic en el archivo y se cargará en una pestaña en su navegador. Debería ver la hora actual mostrada en una cuadrícula de palabras.
Nota: Solo probé la aplicación con Chrome en Windows.
Paso 2: editar la cuadrícula
Puede probar diferentes diseños de palabras editando la parte de Javascript que se ve así:
var row_strs = ["ES", "UNO DOS TRES", "CUATRO CINCO SEIS", "SIETE OCHO", "NUEVE DIEZ", "ONCE DOCE", "OH CINCO DIEZ", "QUINCE VEINTE", "TREINTA EN EL RELOJ", "CUARENTA CINCUENTA Y CINCO", "EN LA TARDE", "EN LA NOCHE MAÑANA",];
Si agrega / elimina filas y vuelve a cargar la página, su cuadrícula será más grande o más pequeña.
Y si agrega más letras a cada fila, su cuadrícula se ensanchará. Solo asegúrate de que todas las filas tengan el mismo número de letras.
Notará que las cadenas en el código anterior tienen espacios, pero se convierten en caracteres aleatorios en la cuadrícula. Puede elegir el conjunto de caracteres que se usarán aleatoriamente para llenar esos espacios editando la línea que se ve así:
var RANDCHARS = "ABCDEFGHIJKLMNOPQRSTUVWXYZ @ # $% &";
Paso 3: cambia la redacción
Necesitará saber cómo escribir código si desea usar diferentes frases. La lógica que toma una fecha y la convierte en palabras está en la función llamada dateToSentence ().
Recomendado:
SIMULADOR DE JUEGO DE CARRERAS DE BRICOLAJE -- SIMULADOR F1: 5 Pasos

SIMULADOR DE JUEGO DE CARRERAS DE BRICOLAJE || SIMULADOR F1: Hola a todos Bienvenidos a Mi canal, Hoy les voy a mostrar cómo construyo un " Simulador de juegos de carreras " con la ayuda de Arduino UNO. esto no es un blog de compilación, es solo una descripción general y una prueba del simulador. Próximamente el blog de compilación completo
Reloj de palabras NeoMatrix 8x8: 6 pasos (con imágenes)

NeoMatrix 8x8 Word Clock: ¿Está fascinado con el paso del tiempo? ¿Quiere un reloj elegante, moderno y funcional para agregar a su colección de relojes? El reloj de palabras es un dispositivo único para decir la hora, que utiliza una cuadrícula de letras para deletrear la hora. Mientras puedes
Reloj de palabras Arduino RGB Matrix: 6 pasos

Reloj de palabras Arduino RGB Matrix: Olvídese de los números, ¡el reloj de palabras LED RGB muestra la hora como texto! En lugar de dos manecillas o una pantalla digital, Word Clock muestra la hora actual como palabras con una luz LED brillante utilizando una matriz LED estándar de 8x8. Por ejemplo, si fueran las 10:50
Reloj de red ESP8266 sin ningún RTC - Reloj Nodemcu NTP Sin RTC - PROYECTO RELOJ DE INTERNET: 4 Pasos

Reloj de red ESP8266 sin ningún RTC | Reloj Nodemcu NTP Sin RTC | PROYECTO DE RELOJ DE INTERNET: En el proyecto se realizará un proyecto de reloj sin RTC, se tomará tiempo de Internet usando wifi y lo mostrará en la pantalla st7735
Reloj de palabras minimalista: 28 pasos (con imágenes)

Reloj de palabras minimalista: Un gran agradecimiento a Super Make Something ya que este proyecto se inspiró en su Reloj de palabras de Neopixel. Creé este reloj como parte de mi diseño IGCSE & Curso de tecnología y recibió una A * por ello. El modelo CAD se construyó sobre la fusión de antemano y así