Una aplicación web para mostrar su canción actualmente en Spotify. Te permite omitir canciones, tocar/pausar y me gusta/diferente. Analiza las obras de arte del álbum para elegir el fondo y el color en primer plano para que coincidan con la imagen. Encuestas cada dos segundos para actualizar la pantalla para mostrar su canción de reproducción actualmente. Escala al tamaño de su pantalla usando un diseño dinámico.
Comencé mi proyecto configurando un sitio básico para mostrar el JSON bruto de mis datos de Spotify utilizando Spotipy, una API de código abierto Spotify Python. Más tarde, escribí algunos JavaScript para encuestar la API de Spotify cada dos segundos para verificar los cambios. Si la canción ha cambiado, la página se actualiza con la nueva información.
Calculo la paleta de colores usando una biblioteca JavaScript llamada Colorthief que toma el color dominante para el fondo, y un color alternativo contrastante de la paleta para el texto. El color del texto no es solo negro o blanco, sino que muestre algunos colores alternativos para formar una paleta completa, y encuentra un color de esa paleta que contrasta con el color de fondo seleccionado.
Utilizo símbolos de material de Google para los íconos de control de reproducción. Esto permite una fácil escala a diferentes tamaños de pantalla sin necesidad de imágenes separadas.
Obtener la disposición de elementos en la pantalla y escalar para diferentes pantallas fue un desafío. Quería que al menos se viera tolerable en cualquier cosa, desde una PC con una pantalla de paisaje, hasta algo así como un teléfono móvil. No es perfecto, pero es bastante sólido. Además, encontrar en qué punto el texto debería ser blanco en lugar de negro fue difícil. Tenía que asegurarme de que los detalles de la canción sean fácilmente legibles sin importar qué canción estuviera tocando en ese momento.
Hay muchas formas diferentes en que puede alojar esta aplicación web. Yo personalmente uso Fly.io. También necesitará configurar una aplicación de desarrollador de Spotify para obtener su identificación de cliente Spotify y su secreto del cliente.
Cree una cuenta de desarrollador de Spotify si no tiene una y crea una nueva aplicación. Deberá tomar nota de la identificación del cliente y el secreto del cliente. Aloje la aplicación web utilizando una de las siguientes 3 opciones:
Luego regrese al tablero de desarrolladores de Spotify e ingrese el URI de redirección. Asegúrese de eliminar las bases finales. ¡Debería ser funcional!
Hay información adicional sobre la configuración de las variables de entorno y alojamiento localmente en un comentario grande en la parte superior de App.py.
Originalmente, este fue un proyecto para el curso Harvard CS50. Desde entonces, he estado agregando características propias. Puede ver la versión CS50 original en una rama separada. Desde entonces, he mejorado masivamente el algoritmo de detección de color. Ahora también hay una rama "Raspi" designada que contiene líneas de código adicionales para llamar a un servidor web local para apagar la pantalla de Raspberry Pi cuando la música no se reproduce.
Todavía tengo la intención de actualizar esto para corregir los errores con la detección de color y la escala de pantalla, y un par de botones más y características de bonificación, y más.