Files
TheEvilList/js/util.js
2026-04-17 12:29:41 -04:00

66 lines
2.3 KiB
JavaScript

// https://stackoverflow.com/questions/3452546/how-do-i-get-the-youtube-video-id-from-a-url
export function getYoutubeIdFromUrl(url) {
return url.match(
/.*(?:youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=)([^#\&\?]*).*/,
)?.[1] ?? '';
}
export function embed(video) {
return `https://www.youtube.com/embed/${getYoutubeIdFromUrl(video)}`;
}
export function localize(num) {
return num.toLocaleString(undefined, { minimumFractionDigits: 0 });
}
export function getThumbnailFromId(id) {
return `https://img.youtube.com/vi/${id}/mqdefault.jpg`;
}
// https://stackoverflow.com/questions/2450954/how-to-randomize-shuffle-a-javascript-array
export function shuffle(array) {
let currentIndex = array.length, randomIndex;
// While there remain elements to shuffle.
while (currentIndex != 0) {
// Pick a remaining element.
randomIndex = Math.floor(Math.random() * currentIndex);
currentIndex--;
// And swap it with the current element.
[array[currentIndex], array[randomIndex]] = [
array[randomIndex],
array[currentIndex],
];
}
return array;
}
// https://stackoverflow.com/a/44615197
export function getFontColour(hexColor){
function getsRGB(c) {
return parseInt(c, 16) || c;
}
const brightness = Math.round(((getsRGB(hexColor.substr(1, 2)))*299 +
(getsRGB(hexColor.substr(3, 2))*587) +
(getsRGB(hexColor.substr(-2))*114))/1000);
return (brightness > 125) ? 'black' : 'white';
}
export function getLevelThumbnail(name){
return `background: url('/assets/levels/${name}.png') #00000094; background-blend-mode: multiply; background-position: center; background-size: cover; color: var(--color-on-background); border: none; border-radius: 1rem; padding: 2rem; text-align: start; word-break: normal; overflow-wrap: anywhere; cursor: pointer; margin-left: 0.5rem; width: 100%; margin-bottom: 0.5rem;`;
}
export function getLeaderboardLevelThumbnail(name){
return `background: url('/assets/levels/${name}.png') #00000094;
background-blend-mode: multiply;
background-size: cover;
background-position: center;
border-radius: 1rem;
padding-top: 1.5rem;
padding-left: 1.5rem;
padding-bottom: 0.5rem;`;
}