vndangkhoa/kv-music
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

tilting, rounding, and new trackerapi instance

Browse source
This commit is contained in:
edideaur 2026-04-02 12:08:05 +00:00 committed by GitHub
parent 9d076f1d60
commit c8b7a9cd17
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
7 changed files with 138 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
functions/unreleased/[sheetId]/[projectName].js
View file

@ -2,7 +2,11 @@
const ARTISTS_NDJSON_URL = 'https://assets.artistgrid.cx/artists.ndjson';
const ASSETS_BASE_URL = 'https://assets.artistgrid.cx';
const TRACKER_API_ENDPOINTS = ['https://trackerapi-1.artistgrid.cx/get/', 'https://trackerapi-2.artistgrid.cx/get/'];
const TRACKER_API_ENDPOINTS = [
'https://trackerapi-1.artistgrid.cx/get/',
'https://trackerapi-2.artistgrid.cx/get/',
'https://trackerapi-3.artistgrid.cx/get/',
];
function getSheetId(url) {
if (!url) return null;

23
index.html
View file

@ -2956,6 +2956,28 @@
<span class="slider"></span>
</label>
</div>
<div class="setting-item">
<div class="info">
<span class="label">No Round Album Cover</span>
<span class="description">Do not round the album cover in fullscreen view</span>
</div>
<label class="toggle-switch">
<input type="checkbox" id="fullscreen-cover-no-round-toggle" checked />
<span class="slider"></span>
</label>
</div>
<div class="setting-item">
<div class="info">
<span class="label">Vanilla Tilt Album Cover</span>
<span class="description"
>Enable 3D tilt effect on the album cover in fullscreen view</span
>
</div>
<label class="toggle-switch">
<input type="checkbox" id="fullscreen-cover-vanilla-tilt-toggle" checked />
<span class="slider"></span>
</label>
</div>
</div>
<div class="settings-group">
@ -5457,6 +5479,7 @@
</div>
</footer>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vanilla-tilt/1.8.1/vanilla-tilt.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/pocketbase@0.21.3/dist/pocketbase.umd.js"></script>
<script type="module" src="/js/app.js"></script>
</body>

22
js/settings.js
View file

@ -35,6 +35,8 @@ import {
analyticsSettings,
modalSettings,
preferDolbyAtmosSettings,
fullscreenCoverNoRoundSettings,
fullscreenCoverVanillaTiltSettings,
} from './storage.js';
import { audioContextManager, getPresetsForBandCount } from './audio-context.js';
import { calculateBiquadResponse, interpolate, getNormalizationOffset, runAutoEqAlgorithm } from './autoeq-engine.js';
@ -4604,6 +4606,26 @@ export async function initializeSettings(scrobbler, player, api, ui) {
});
}
// Fullscreen Cover No Round Toggle
const fullscreenCoverNoRoundToggle = document.getElementById('fullscreen-cover-no-round-toggle');
if (fullscreenCoverNoRoundToggle) {
fullscreenCoverNoRoundToggle.checked = fullscreenCoverNoRoundSettings.isEnabled();
fullscreenCoverNoRoundToggle.addEventListener('change', (e) => {
fullscreenCoverNoRoundSettings.setEnabled(e.target.checked);
window.dispatchEvent(new CustomEvent('fullscreen-cover-settings-changed'));
});
}
// Fullscreen Cover Vanilla Tilt Toggle
const fullscreenCoverVanillaTiltToggle = document.getElementById('fullscreen-cover-vanilla-tilt-toggle');
if (fullscreenCoverVanillaTiltToggle) {
fullscreenCoverVanillaTiltToggle.checked = fullscreenCoverVanillaTiltSettings.isEnabled();
fullscreenCoverVanillaTiltToggle.addEventListener('change', (e) => {
fullscreenCoverVanillaTiltSettings.setEnabled(e.target.checked);
window.dispatchEvent(new CustomEvent('fullscreen-cover-settings-changed'));
});
}
// Waveform Toggle
const waveformToggle = document.getElementById('waveform-toggle');
if (waveformToggle) {

32
js/storage.js
View file

@ -590,6 +590,38 @@ export const dynamicColorSettings = {
},
};
export const fullscreenCoverNoRoundSettings = {
STORAGE_KEY: 'fullscreen-cover-no-round',
isEnabled() {
try {
return localStorage.getItem(this.STORAGE_KEY) !== 'false';
} catch {
return true;
}
},
setEnabled(enabled) {
localStorage.setItem(this.STORAGE_KEY, enabled ? 'true' : 'false');
},
};
export const fullscreenCoverVanillaTiltSettings = {
STORAGE_KEY: 'fullscreen-cover-vanilla-tilt',
isEnabled() {
try {
return localStorage.getItem(this.STORAGE_KEY) !== 'false';
} catch {
return true;
}
},
setEnabled(enabled) {
localStorage.setItem(this.STORAGE_KEY, enabled ? 'true' : 'false');
},
};
export const cardSettings = {
COMPACT_ARTIST_KEY: 'card-compact-artist',
COMPACT_ALBUM_KEY: 'card-compact-album',

6
js/tracker.js
View file

@ -107,7 +107,11 @@ function transformErasImages(eras) {
}
async function fetchTrackerData(sheetId) {
const endpoints = ['https://trackerapi-1.artistgrid.cx/get/', 'https://trackerapi-2.artistgrid.cx/get/'];
const endpoints = [
'https://trackerapi-1.artistgrid.cx/get/',
'https://trackerapi-2.artistgrid.cx/get/',
'https://trackerapi-3.artistgrid.cx/get/',
];
let lastError = null;
for (const baseUrl of endpoints) {

48
js/ui.js
View file

@ -26,6 +26,8 @@ import {
fontSettings,
contentBlockingSettings,
settingsUiState,
fullscreenCoverNoRoundSettings,
fullscreenCoverVanillaTiltSettings,
} from './storage.js';
import { db } from './db.js';
import { getVibrantColorFromImage } from './vibrant-color.js';
@ -166,6 +168,30 @@ export class UIRenderer {
}
});
window.addEventListener('fullscreen-cover-settings-changed', () => {
const overlay = document.getElementById('fullscreen-cover-overlay');
const coverImage = document.getElementById('fullscreen-cover-image');
if (overlay && overlay.style.display === 'flex') {
if (fullscreenCoverNoRoundSettings.isEnabled()) {
overlay.classList.add('fullscreen-cover-no-round');
} else {
overlay.classList.remove('fullscreen-cover-no-round');
}
if (coverImage) {
if (fullscreenCoverVanillaTiltSettings.isEnabled() && window.VanillaTilt) {
window.VanillaTilt.init(coverImage, {
max: 15,
speed: 400,
glare: true,
'max-glare': 0.3,
});
} else if (coverImage.vanillaTilt) {
coverImage.vanillaTilt.destroy();
}
}
}
});
window.addEventListener('refresh-home-editors-picks', () => {
this.renderHomeEditorsPicks(true, 'home-editors-picks');
this.renderHomeEditorsPicks(true, 'home-editors-picks-empty');
@ -1232,6 +1258,22 @@ export class UIRenderer {
overlay.style.display = 'flex';
if (fullscreenCoverNoRoundSettings.isEnabled()) {
overlay.classList.add('fullscreen-cover-no-round');
} else {
overlay.classList.remove('fullscreen-cover-no-round');
}
const coverImage = document.getElementById('fullscreen-cover-image');
if (fullscreenCoverVanillaTiltSettings.isEnabled() && coverImage && window.VanillaTilt) {
window.VanillaTilt.init(coverImage, {
max: 15,
speed: 400,
glare: true,
'max-glare': 0.3,
});
}
const startVisualizer = async () => {
if (!visualizerSettings.isEnabled()) {
if (this.visualizer) this.visualizer.stop();
@ -1283,8 +1325,12 @@ export class UIRenderer {
closeFullscreenCover() {
const overlay = document.getElementById('fullscreen-cover-overlay');
const coverImage = document.getElementById('fullscreen-cover-image');
if (coverImage && coverImage.vanillaTilt) {
coverImage.vanillaTilt.destroy();
}
overlay.style.display = 'none';
overlay.classList.remove('visualizer-active', 'ui-hidden');
overlay.classList.remove('visualizer-active', 'ui-hidden', 'fullscreen-cover-no-round');
const playerBar = document.querySelector('.now-playing-bar');
if (playerBar) playerBar.style.removeProperty('display');

4
styles.css
View file

@ -4094,6 +4094,10 @@ input:checked + .slider::before {
z-index: 1;
}
#fullscreen-cover-overlay.fullscreen-cover-no-round #fullscreen-cover-image {
border-radius: 0;
}
/* Enhanced drop shadow for album cover in visualizer mode */
#fullscreen-cover-overlay.visualizer-active #fullscreen-cover-image {
box-shadow: