3 files changed, 27 insertions, 25 deletions
diff --git a/src/pages/chart/ChartEmbedPage.tsx b/src/pages/chart/ChartEmbedPage.tsx
index 4b485b7..2034f2c 100644
--- a/src/pages/chart/ChartEmbedPage.tsx
+++ b/src/pages/chart/ChartEmbedPage.tsx
@@ -18,19 +18,16 @@ const ChartEmbedPage = () => {
     viewportMeta.name = 'viewport';
     viewportMeta.content = 'width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no';
     document.head.appendChild(viewportMeta);
-    
-    // Set canonical URL
-    const canonicalLink = document.createElement('link');
-    canonicalLink.rel = 'canonical';
-    canonicalLink.href = 'https://morsehero.com/charts/embed';
-    document.head.appendChild(canonicalLink);
-    
+
     // Set page title
     document.title = 'Morse Code Chart | Embed';
-    
+
     return () => {
-      document.head.removeChild(viewportMeta);
-      document.head.removeChild(canonicalLink);
+      // Remove viewport meta tag when component unmounts
+      const metaTag = document.querySelector('meta[name="viewport"]');
+      if (metaTag && metaTag.parentNode) {
+        metaTag.parentNode.removeChild(metaTag);
+      }
     };
   }, []);
 
diff --git a/src/pages/chart/ChartPage.tsx b/src/pages/chart/ChartPage.tsx
index 784aa0d..ffb679e 100644
--- a/src/pages/chart/ChartPage.tsx
+++ b/src/pages/chart/ChartPage.tsx
@@ -43,10 +43,18 @@ const ChartPage = () => {
         clickedItem.classList.add('playing');
       }
 
-      cw.play(character, {
-        wpm: 20,
-        actx: actxRef.current
-      });
+      try {
+        // Get Morse code for the character
+        const morseCode = getMorseCode(character);
+        
+        // Play the Morse code
+        window.cw.play(morseCode, {
+          wpm: 20,
+          actx: actxRef.current
+        });
+      } catch (error) {
+        console.error('Error playing Morse code:', error);
+      }
 
       // Remove the 'playing' class after the audio finishes
       setTimeout(() => {
diff --git a/src/pages/embed/EmbedPage.tsx b/src/pages/embed/EmbedPage.tsx
index c75a4f7..35417c0 100644
--- a/src/pages/embed/EmbedPage.tsx
+++ b/src/pages/embed/EmbedPage.tsx
@@ -3,26 +3,23 @@ import MorseGame from '../../components/MorseGame';
 import '../../styles.css';
 
 const EmbedPage = () => {
-  // Add meta tag for WebView compatibility
+  // Add meta tag for WebView compatibility and set page title
   useEffect(() => {
     // Set viewport for better mobile display
     const viewportMeta = document.createElement('meta');
     viewportMeta.name = 'viewport';
     viewportMeta.content = 'width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no';
     document.head.appendChild(viewportMeta);
-    
-    // Set canonical URL
-    const canonicalLink = document.createElement('link');
-    canonicalLink.rel = 'canonical';
-    canonicalLink.href = 'https://morsehero.com/embed';
-    document.head.appendChild(canonicalLink);
-    
+
     // Set page title
     document.title = 'Morse Hero | Embed';
-    
+
     return () => {
-      document.head.removeChild(viewportMeta);
-      document.head.removeChild(canonicalLink);
+      // Remove viewport meta tag when component unmounts
+      const metaTag = document.querySelector('meta[name="viewport"]');
+      if (metaTag && metaTag.parentNode) {
+        metaTag.parentNode.removeChild(metaTag);
+      }
     };
   }, []);