From 388ce3d04a5f03575f3dc2fdba1ce1547e7707ea Mon Sep 17 00:00:00 2001
From: Mathias Wagner <germannewsmaker@gmail.com>
Date: Sat, 1 Mar 2025 20:01:10 +0100
Subject: [PATCH] Translate UI parts to german

---
 client/src/components/YouTubePlayer/YouTubePlayer.jsx  |  4 +---
 client/src/pages/Game/Game.jsx                         | 10 +++++-----
 .../pages/Game/components/MusicSlider/MusicSlider.jsx  |  6 +-----
 client/src/pages/WaitingRoom/WaitingRoom.jsx           |  8 ++++----
 4 files changed, 11 insertions(+), 17 deletions(-)

diff --git a/client/src/components/YouTubePlayer/YouTubePlayer.jsx b/client/src/components/YouTubePlayer/YouTubePlayer.jsx
index 00d84a6..4fe9f81 100644
--- a/client/src/components/YouTubePlayer/YouTubePlayer.jsx
+++ b/client/src/components/YouTubePlayer/YouTubePlayer.jsx
@@ -64,8 +64,7 @@ const YouTubePlayer = ({
           events: {
             'onReady': (event) => {
               console.log("YouTube player ready");
-              
-              // Start playback if needed
+
               if (autoplay) {
                 event.target.seekTo(startTime || 0);
                 event.target.playVideo();
@@ -76,7 +75,6 @@ const YouTubePlayer = ({
             },
             'onError': (event) => {
               console.error("YouTube player error:", event);
-              // Remove error handling
             }
           }
         });
diff --git a/client/src/pages/Game/Game.jsx b/client/src/pages/Game/Game.jsx
index 89817bb..aa843a7 100644
--- a/client/src/pages/Game/Game.jsx
+++ b/client/src/pages/Game/Game.jsx
@@ -333,7 +333,7 @@ export const Game = () => {
                                 </div>
                                 
                                 <div className="music-controls">
-                                    <p className="instruction">Use the player above to listen, and the tone slider to play!</p>
+                                    <p className="instruction">Verändere die Frequenz des Tons, um den Song zu spielen.</p>
                                 </div>
                             </div>
                         )}
@@ -344,7 +344,7 @@ export const Game = () => {
                                     <div className="listening-icon">
                                         <FontAwesomeIcon icon={faHeadphones} size="4x" />
                                     </div>
-                                    <p className="instruction">Listen carefully and think about which song it might be!</p>
+                                    <p className="instruction">Hör dir die Frequenzen an und wähle den passenden Song aus.</p>
                                 </div>
                                 
                                 {songOptions.length > 0 && (
@@ -380,7 +380,7 @@ export const Game = () => {
                 return (
                     <div className="guessing-phase">
                         <div className="phase-header">
-                            <h3>Final Answer Time!</h3>
+                            <h3>Auswahlphase</h3>
                             <div className="timer urgent">
                                 <FontAwesomeIcon icon={faClock} /> {timeLeft}s
                             </div>
@@ -518,7 +518,7 @@ export const Game = () => {
                 );
                 
             default:
-                return <div>Unknown phase</div>;
+                return <div>Phasenfehler</div>;
         }
     };
 
@@ -586,7 +586,7 @@ export const Game = () => {
 
             {songsLoading && (
                 <div className="songs-loading-indicator">
-                    Loading songs...
+                    Lade Songs...
                 </div>
             )}
         </div>
diff --git a/client/src/pages/Game/components/MusicSlider/MusicSlider.jsx b/client/src/pages/Game/components/MusicSlider/MusicSlider.jsx
index f74082a..a47b903 100644
--- a/client/src/pages/Game/components/MusicSlider/MusicSlider.jsx
+++ b/client/src/pages/Game/components/MusicSlider/MusicSlider.jsx
@@ -57,7 +57,6 @@ export const MusicSlider = ({ isReadOnly, onFrequencyChange, frequency: external
   useEffect(() => {
     if (!isReadOnly || !externalFrequency) return;
     
-    // Initialize audio if not already done
     if (!audioContext) {
       initAudio();
       return;
@@ -82,11 +81,8 @@ export const MusicSlider = ({ isReadOnly, onFrequencyChange, frequency: external
       const slider = sliderRef.current;
       const rect = slider.getBoundingClientRect();
       const width = rect.width;
-      
-      // Calculate relative X position using window coordinates
+
       let x = clientX - rect.left;
-      
-      // For positions outside the slider, calculate relative to slider bounds
       if (clientX < rect.left) x = 0;
       if (clientX > rect.right) x = width;
       
diff --git a/client/src/pages/WaitingRoom/WaitingRoom.jsx b/client/src/pages/WaitingRoom/WaitingRoom.jsx
index 785cb1c..cd5178e 100644
--- a/client/src/pages/WaitingRoom/WaitingRoom.jsx
+++ b/client/src/pages/WaitingRoom/WaitingRoom.jsx
@@ -189,8 +189,8 @@ export const WaitingRoom = () => {
     const renderPlaylistSection = () => (
         <div className="playlist-section">
             <div className="section-header">
-                <h2>Choose a Playlist</h2>
-                <p className="vote-info">Most voted playlist will be used for the game</p>
+                <h2>Playlist wählen</h2>
+                <p className="vote-info">Die Playlist mit den meisten Stimmen wird gespielt</p>
             </div>
             <div className="playlists-grid">
                 {Object.entries(playlists).map(([genre, playlist]) => (
@@ -204,10 +204,10 @@ export const WaitingRoom = () => {
                             <div className="playlist-overlay">
                                 <div className="vote-count">
                                     <span className="count">{getVoteCount(playlist.id)}</span>
-                                    <span className="vote-label">votes</span>
+                                    <span className="vote-label">Stimmen</span>
                                 </div>
                                 {selectedPlaylist === playlist.id && (
-                                    <div className="your-vote">Your Vote</div>
+                                    <div className="your-vote">Deine Stimme</div>
                                 )}
                             </div>
                         </div>