From 552c434e99092771635aed4b372da1aa64f7986a Mon Sep 17 00:00:00 2001 From: Send_Nukez Date: Fri, 29 Oct 2021 23:21:04 +0200 Subject: [PATCH] workaround for #73 and fix some playbar colors --- package.json | 1 + src/js/main.js | 49 +++++++++++++++++++------------------------- src/styles/main.scss | 18 ++++++++++++++++ 3 files changed, 40 insertions(+), 28 deletions(-) diff --git a/package.json b/package.json index 0e7baab..7b8fe24 100644 --- a/package.json +++ b/package.json @@ -14,6 +14,7 @@ "dependencies": { "chroma-js": "^2.1.2", "jquery": "^3.6.0", + "moment": "^2.29.1", "node-vibrant": "3.1.4" } } diff --git a/src/js/main.js b/src/js/main.js index dcf1c6e..b1da16f 100644 --- a/src/js/main.js +++ b/src/js/main.js @@ -1,6 +1,7 @@ import * as Vibrant from "node-vibrant"; import chroma from "chroma-js"; import $ from "jquery"; +import moment from "moment"; import ConfigMenu from "./ConfigMenu"; @@ -341,8 +342,9 @@ function copyToClipboard(text) { } /* js */ -function getAlbumInfo(uri) { - return Spicetify.CosmosAsync.get(`hm://album/v1/album-app/album/${uri}/desktop`); +async function getAlbumRelease(uri) { + const info = await Spicetify.CosmosAsync.get(`hm://album/v1/album-app/album/${uri}/desktop`); + return { year: info.year, month: (info.month ?? 1) - 1, day: info.day ?? 0 }; } function isLight(hex) { @@ -538,10 +540,10 @@ function updateColors(textColHex, sideColHex, checkDarkMode = true) { if (checkDarkMode) checkDarkLightMode([textColHex, sideColHex]); } -let nearArtistSpan; -let nearArtistSpanText = ""; let coverListenerInstalled = false; async function songchange() { + if (!document.querySelector(".main-trackInfo-container")) return setTimeout(songchange, 300); + try { // warning popup if (Spicetify.Platform.PlatformData.client_version_triple < "1.1.68") Spicetify.showNotification(`Your version of Spotify ${Spicetify.Platform.PlatformData.client_version_triple}) is un-supported`); @@ -549,6 +551,14 @@ async function songchange() { console.error(err); } + if (!document.getElementById("main-trackInfo-year")) { + const el = document.createElement("div"); + el.id = "main-trackInfo-year"; + el.classList.add("main-trackInfo-release", "ellipsis-one-line", "main-type-finale"); + document.querySelector(".main-trackInfo-container").append(el); + } + const albumInfoSpan = document.getElementById("main-trackInfo-year"); + let album_uri = Spicetify.Player.data.track.metadata.album_uri; let bgImage = Spicetify.Player.data.track.metadata.image_url; if (bgImage === undefined) { @@ -560,25 +570,20 @@ async function songchange() { if (!coverListenerInstalled) hookCoverChange(true); if (album_uri !== undefined && !album_uri.includes("spotify:show")) { - const albumInfo = await getAlbumInfo(album_uri.replace("spotify:album:", "")); - - let album_date = new Date(albumInfo.year, (albumInfo.month || 1) - 1, albumInfo.day || 0); - let recent_date = new Date(); - recent_date.setMonth(recent_date.getMonth() - 6); - album_date = album_date.toLocaleString("default", album_date > recent_date ? { year: "numeric", month: "short" } : { year: "numeric" }); - let album_link = '' + Spicetify.Player.data.track.metadata.album_title + ""; - - nearArtistSpanText = album_link + " • " + album_date; + moment.locale(Spicetify.Locale.getLocale()); + const albumDate = moment(await getAlbumRelease(album_uri.replace("spotify:album:", ""))); + const albumLink = `${Spicetify.Player.data.track.metadata.album_title}`; + albumInfoSpan.innerHTML = `${albumLink} • ${albumDate.format(moment().diff(albumDate, "months") <= 6 ? "MMM YYYY" : "YYYY")}`; } else if (Spicetify.Player.data.track.uri.includes("spotify:episode")) { // podcast bgImage = bgImage.replace("spotify:image:", "https://i.scdn.co/image/"); - nearArtistSpanText = Spicetify.Player.data.track.metadata.album_title; + albumInfoSpan.innerHTML = Spicetify.Player.data.track.metadata.album_title; } else if (Spicetify.Player.data.track.metadata.is_local == "true") { // local file - nearArtistSpanText = Spicetify.Player.data.track.metadata.album_title; + albumInfoSpan.innerHTML = Spicetify.Player.data.track.metadata.album_title; } else if (Spicetify.Player.data.track.provider == "ad") { // ad - nearArtistSpanText = "advertisement"; + albumInfoSpan.innerHTML = "Advertisement"; coverListenerInstalled = false; return; } else { @@ -587,18 +592,6 @@ async function songchange() { setTimeout(songchange, 200); } - if (document.querySelector("#main-trackInfo-year") === null) { - waitForElement([".main-trackInfo-container"], (queries) => { - nearArtistSpan = document.createElement("div"); - nearArtistSpan.id = "main-trackInfo-year"; - nearArtistSpan.classList.add("main-trackInfo-artists", "ellipsis-one-line", "main-type-finale"); - nearArtistSpan.innerHTML = nearArtistSpanText; - queries[0].append(nearArtistSpan); - }); - } else { - nearArtistSpan.innerHTML = nearArtistSpanText; - } - $("html").css("--image-url", `url("${bgImage}")`); } diff --git a/src/styles/main.scss b/src/styles/main.scss index d7a5308..4e6ffaf 100644 --- a/src/styles/main.scss +++ b/src/styles/main.scss @@ -676,6 +676,10 @@ input:hover:not([disabled]):not(:active) ~ .x-toggle-indicatorWrapper { font-weight: 500; } +.main-trackInfo-release > a { + color: var(--spice-subtext); +} + .main-topBar-topbarContent .main-playButton-PlayButton { --size: 35px !important; } @@ -859,10 +863,24 @@ li.GlueDropTarget { flex: 1; width: auto; min-width: unset !important; + + & span { + display: block !important; + color: var(--spice-subtext); + } } .main-nowPlayingWidget-nowPlaying { justify-content: center; + + // Workaround for #73 (https://github.com/JulienMaille/dribbblish-dynamic-theme/issues/73) + & button { + color: var(--spice-subtext); + + &:hover { + color: var(--spice-text); + } + } } .player-controls {