mirror of
https://github.com/jeffvli/feishin.git
synced 2024-11-20 14:37:06 +01:00
Remove dynamic queue header color
This commit is contained in:
parent
b037329377
commit
cdbd3f8c7b
@ -1,50 +1,13 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
import { Group } from '@mantine/core';
|
||||
import { FastAverageColor } from 'fast-average-color';
|
||||
import { PageHeader, TextTitle } from '/@/renderer/components';
|
||||
import { useCurrentSong } from '/@/renderer/store';
|
||||
import { getHeaderColor } from '/@/renderer/utils';
|
||||
import { useTheme } from '/@/renderer/hooks';
|
||||
|
||||
export const NowPlayingHeader = () => {
|
||||
const [headerColor, setHeaderColor] = useState({ isDark: false, value: 'rgba(0, 0, 0, 0)' });
|
||||
const currentSong = useCurrentSong();
|
||||
const theme = useTheme();
|
||||
|
||||
useEffect(() => {
|
||||
const fac = new FastAverageColor();
|
||||
const url = currentSong?.imageUrl;
|
||||
|
||||
if (url) {
|
||||
fac
|
||||
.getColorAsync(currentSong?.imageUrl, {
|
||||
algorithm: 'simple',
|
||||
ignoredColor: [
|
||||
[255, 255, 255, 255], // White
|
||||
[0, 0, 0, 255], // Black
|
||||
],
|
||||
mode: 'precision',
|
||||
})
|
||||
.then((color) => {
|
||||
const isDark = color.isDark;
|
||||
return setHeaderColor({
|
||||
isDark,
|
||||
value: getHeaderColor(color.rgb, theme === 'dark' ? 0.5 : 0.8),
|
||||
});
|
||||
})
|
||||
.catch((e) => {
|
||||
console.log(e);
|
||||
});
|
||||
}
|
||||
|
||||
return () => {
|
||||
fac.destroy();
|
||||
};
|
||||
}, [currentSong?.imageUrl, theme]);
|
||||
// const currentSong = useCurrentSong();
|
||||
// const theme = useTheme();
|
||||
|
||||
return (
|
||||
<PageHeader backgroundColor={headerColor.value}>
|
||||
<Group>
|
||||
<PageHeader>
|
||||
<Group p="1rem">
|
||||
<TextTitle
|
||||
fw="bold"
|
||||
order={3}
|
||||
|
Loading…
Reference in New Issue
Block a user