This commit is contained in:
zadit
2025-01-07 16:31:54 +07:00
parent 0c99be55ec
commit 8e8eab48c1
2 changed files with 20 additions and 21 deletions

View File

@@ -121,21 +121,21 @@ const MusicComponent = ({ song, min, max, onDecision }) => {
onTouchEnd={handleTouchEnd} onTouchEnd={handleTouchEnd}
style={{ transform: `translateX(${positionX}px)` }} style={{ transform: `translateX(${positionX}px)` }}
ref={containerRef}> ref={containerRef}>
{song.set && <div className="decisionbgrnd" style={{ backgroundColor: song.bePlayed ? "green" : "red" }}> {song[3] && <div className="decisionbgrnd" style={{ backgroundColor: song[4] ? "green" : "red" }}>
<h1 className="decision">{song.bePlayed ? "next up" : "skipped"}</h1></div>} <h1 className="decision">{song[4] ? "next up" : "skipped"}</h1></div>}
<div className="bgrnd" style={{ backgroundColor: backgroundColor }}></div> <div className="bgrnd" style={{ backgroundColor: backgroundColor }}></div>
<img <img
src={song.image} src={song[0]?.image || song.image}
alt={song.name} alt={song[0]?.name}
className="song-image" className="song-image"
onError={(e) => e.target.src = song.image} onError={(e) => e.target.src = song[0]?.image || song.image}
/> />
<div className="song-details"> <div className="song-details">
<p className="song-name">{song.name}</p> <p className="song-name">{song[0]?.name || song.name}</p>
<p className="artist-name">{song.artist}</p> <p className="artist-name">{song[0]?.artist || song.artist}</p>
{min < 0 && <p className="artist-name">&lt;--- {song.disagree} no - {song.agree} yes ---&gt;</p>} {min < 0 && <p className="artist-name">&lt;--- {song[2]?.length} no - {song[1]?.length} yes ---&gt;</p>}
</div> </div>
<p className="song-duration">{song.length}</p> <p className="song-duration">{song[0]?.length || song.length}</p>
</div> </div>
); );
}; };

View File

@@ -85,9 +85,9 @@ export function MusicPlayer({ socket, shopId, user, shopOwnerId, isSpotifyNeedLo
const fetchColor = async () => { const fetchColor = async () => {
if ( if (
currentSong && currentSong &&
currentSong.image currentSong[0]?.image
) { ) {
const imageUrl = currentSong.image; const imageUrl = currentSong[0].image;
try { try {
const dominantColor = await getDominantColor(imageUrl); const dominantColor = await getDominantColor(imageUrl);
// Calculate luminance (YIQ color space) to determine if subtitle should be black or white // Calculate luminance (YIQ color space) to determine if subtitle should be black or white
@@ -429,8 +429,8 @@ export function MusicPlayer({ socket, shopId, user, shopOwnerId, isSpotifyNeedLo
<div className="current-info" > <div className="current-info" >
<div <div
className={`current-name ${viewing ? '' : 'animated-text'}`} style={{ margin: `${viewing ? '35px 30px' : '13px 30px'}` }}> className={`current-name ${viewing ? '' : 'animated-text'}`} style={{ margin: `${viewing ? '35px 30px' : '13px 30px'}` }}>
{currentSong && currentSong.name {currentSong && currentSong[0]?.name
? (viewing ? currentSong.name : text) ? (viewing ? currentSong[0]?.name : text)
: :
viewing ? messages[0] : text} viewing ? messages[0] : text}
</div> </div>
@@ -438,9 +438,8 @@ export function MusicPlayer({ socket, shopId, user, shopOwnerId, isSpotifyNeedLo
<div className="current-artist"> <div className="current-artist">
{ {
currentSong && currentSong &&
currentSong.image && currentSong[0]?.artist
currentSong.artist ? currentSong[0]?.artist
? currentSong.artist
: "Pilih hits terbaikmu dibawah!"} : "Pilih hits terbaikmu dibawah!"}
</div> </div>
</> </>
@@ -512,14 +511,14 @@ export function MusicPlayer({ socket, shopId, user, shopOwnerId, isSpotifyNeedLo
<MusicComponent <MusicComponent
key={index} key={index}
song={song} song={song}
min={-100} min={song[3]? 0 : -100}
max={100} max={song[3]? 0 : 100}
onDecision={(vote) => onDecision(song.trackId, vote)} onDecision={(vote) => onDecision(song[0].trackId, vote)}
/> />
)) ))
) )
} }
{songName == "" && queue && queue.length > 0 && queue.length < 3 && ( {/* {songName == "" && queue && queue.length > 0 && queue.length < 3 && (
<div className="middle-text"> <div className="middle-text">
<span className="normal-text">Tambahkan musikmu</span> <span className="normal-text">Tambahkan musikmu</span>
@@ -530,7 +529,7 @@ export function MusicPlayer({ socket, shopId, user, shopOwnerId, isSpotifyNeedLo
Cari musik Cari musik
</button> </button>
</div> </div>
)} )} */}
</div> </div>