https://github.com/kenkyoo/lofi-radio

Una estación de radio Lofi en línea con múltiples canales, fondos dinámicos y un reproductor interactivo. Perfecto para quienes buscan relajarse, estudiar o simplemente disfrutar de buena música.
https://github.com/kenkyoo/lofi-radio

html javascript lofi lofi-music lofi-player lofi-radio sass

Last synced: 8 days ago
JSON representation

Una estación de radio Lofi en línea con múltiples canales, fondos dinámicos y un reproductor interactivo. Perfecto para quienes buscan relajarse, estudiar o simplemente disfrutar de buena música.

• Host: GitHub
• URL: https://github.com/kenkyoo/lofi-radio
• Owner: Kenkyoo
• Created: 2024-11-30T08:19:15.000Z (22 days ago)
• Default Branch: main
• Last Pushed: 2024-12-09T06:16:08.000Z (13 days ago)
• Last Synced: 2024-12-09T06:31:03.595Z (13 days ago)
• Topics: html, javascript, lofi, lofi-music, lofi-player, lofi-radio, sass
• Language: SCSS
• Homepage: https://kenkyoo.github.io/lofi-radio/
• Size: 5.74 MB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Lofi Radio 24/7 🎧

Una estación de radio **Lofi** que transmite música relajante las 24 horas, ideal para trabajar, estudiar o relajarse. Incluye múltiples canales de YouTube para cambiar entre diferentes estilos de música Lofi y fondos dinámicos que se ajustan al ambiente.

## 🚀 Funcionalidades

- **Cambio de canales**: Selecciona entre varios canales Lofi en YouTube con un solo clic.

- **Reproductor personalizado**:

  - Reproduce, pausa o detén la música.

  - Control de reproducción desde la interfaz.

- **Fondos dinámicos**: Cambia el fondo aleatoriamente cada vez que seleccionas un canal o presionas el botón.

- **Animación visual**: Incluye una barra de sonido animada para un toque estético.

- **Interfaz simple y elegante**: Diseño enfocado en la experiencia del usuario.

## 🛠️ Tecnologías Utilizadas

- **HTML5**: Estructura principal de la página.

- **CSS3**: Animaciones y estilos.

- **JavaScript**: Lógica para la integración con YouTube y cambio de fondos.

- **YouTube IFrame API**: Controla la reproducción de videos de YouTube directamente en la página.

## 📦 Cómo Usarlo

1. Clona este repositorio y asegúrate de tener un servidor local configurado (ej. [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer) en VS Code).

2. Abre el archivo `index.html` en tu navegador.

3. Selecciona un canal de la lista de radios y disfruta de la música Lofi.

4. Cambia el fondo o controla la reproducción con los botones disponibles.

## 🎨 Personalización

1. **Añadir más videos**:

   - Agrega el ID de nuevos videos de YouTube a la constante `videos` en `app.js`.

2. **Cambiar fondos**:

   - Coloca nuevas imágenes en la carpeta `images` y actualiza la lista en la constante `images`.

3. **Ajustar el tamaño del reproductor**:

   - Modifica las propiedades `height` y `width` en el objeto `YT.Player` en el archivo `app.js`.

## 🌟 Características Adicionales

- **Fondos animados**: Compatibilidad con GIFs para un diseño más inmersivo.

- **Experiencia fluida**: Cambia de canal sin interrupciones en la música.

## 📄 Licencia

Este proyecto está bajo la licencia [MIT License](https://opensource.org/licenses/MIT).