diff --git a/playlist/models/album.py b/playlist/models/album.py index a30b2f2..69044f3 100644 --- a/playlist/models/album.py +++ b/playlist/models/album.py @@ -10,3 +10,4 @@ class Album(models.Model): album_type = models.CharField(max_length=255) total_tracks = models.PositiveSmallIntegerField(null=True) image = models.ImageField(upload_to="albums/") + image_url = models.URLField(null=True) diff --git a/playlist/models/track.py b/playlist/models/track.py index af120d6..d7cd691 100644 --- a/playlist/models/track.py +++ b/playlist/models/track.py @@ -15,6 +15,12 @@ class Track(models.Model): s += " door " s += " & ".join(artists) return s + @property + def artist(self): + if self.artists.count() > 0: + artists = list(map(lambda a:a.name, self.artists.all())) + return " & ".join(artists) + id = models.CharField(primary_key=True, max_length=128) name = models.CharField(max_length=255) artists = models.ManyToManyField(Artist) diff --git a/playlist/static/style.css b/playlist/static/style.css index 10f0b01..5755cda 100644 --- a/playlist/static/style.css +++ b/playlist/static/style.css @@ -10,3 +10,53 @@ flex-flow: column nowrap; justify-content: space-between; } + +iframe { + opacity: 0; + position: fixed; + left: 100%; +} + +#album { + background: black; + width: 100%; + display: flex; + flex-flow: column nowrap; + justify-content: center; + align-items: center; +} + +#album h1, #album h2 { + color: white; + margin: 0; +} + +#album h1 { + font-size: 2rem; +} +#album h2 { + font-size: 1.5rem; + font-weight: normal; +} +#album img { + max-width: 256px; +} + +input[type="range"] { + margin: 8px 0; +} + +input[type="range"]::-moz-range-track { + background: #aaa; + height: 12px; +} + +input[type="range"]::-moz-range-thumb { + height: 15px; + width: 15px; + transform: unset; + background: transparent; + border: 3px solid lightgray; + border-bottom-color: darkgrey; + box-shadow: 1px 0 0 #fff,1px 1px 0 #fff,0 1px 0 #fff,-1px 0 0 #a9a9a9,-1px -1px 0 #a9a9a9,0 -1px 0 #a9a9a9,-1px 1px 0 #fff,1px -1px #a9a9a9; +} diff --git a/playlist/templates/Base.html b/playlist/templates/Base.html index 0262f77..b6bdb05 100644 --- a/playlist/templates/Base.html +++ b/playlist/templates/Base.html @@ -4,12 +4,10 @@ - + - + + diff --git a/playlist/templates/SpotifyEmbed.html b/playlist/templates/SpotifyEmbed.html index bd9e5a5..5d1e4ce 100644 --- a/playlist/templates/SpotifyEmbed.html +++ b/playlist/templates/SpotifyEmbed.html @@ -1,12 +1,19 @@ {% if track %}
{% if error %}
{{ error }}
{% endif %} - +
+
+ {% if track.album.image_url %} + + {% else %} + + {% endif %} +

{{track.name}}

+

{{track.artist}}

+
+ + +
+