From d60ce2e3f623d7629c574d1039577a4e96bebe32 Mon Sep 17 00:00:00 2001 From: Ojas Arora <127867874+Ojas-Arora@users.noreply.github.com> Date: Mon, 29 Jul 2024 19:16:09 +0530 Subject: [PATCH 1/4] MultiLanguage Facility --- src/components/Hero/Hero.jsx | 54 ++++++++++++++++++++++++++--- src/components/Hero/Hero.module.css | 1 + 2 files changed, 51 insertions(+), 4 deletions(-) diff --git a/src/components/Hero/Hero.jsx b/src/components/Hero/Hero.jsx index 054365b..11fc768 100644 --- a/src/components/Hero/Hero.jsx +++ b/src/components/Hero/Hero.jsx @@ -1,7 +1,6 @@ import React, { useEffect } from 'react'; import Typed from 'typed.js'; -import Earth from '../3D_Models/Earth/Earth.jsx' -import Styles from './Hero.module.css' +import Earth from '../3D_Models/Earth/Earth.jsx'; function Hero() { useEffect(() => { @@ -19,12 +18,59 @@ function Hero() { }; }, []); // Empty dependency array to run only once when component mounts + useEffect(() => { + // Function to dynamically load Google Translate script + const loadGoogleTranslateScript = () => { + const script = document.createElement('script'); + script.src = "https://translate.google.com/translate_a/element.js?cb=loadGoogleTranslate"; + script.type = 'text/javascript'; + script.onerror = () => handleError(); + document.body.appendChild(script); + }; + + // Function to handle script load errors + const handleError = () => { + console.error("Error loading Google Translate script."); + }; + + // Function to initialize Google Translate + window.loadGoogleTranslate = () => { + new window.google.translate.TranslateElement( + { + pageLanguage: "en", + includedLanguages: "en,hi,pa,sa,mr,ur,bn,es,fr,de,it", + layout: window.google.translate.TranslateElement.InlineLayout.SIMPLE, + }, + "google_element" + ); + }; + + loadGoogleTranslateScript(); + + // Cleanup function to remove script from document + return () => { + const script = document.querySelector('script[src*="translate.google.com"]'); + if (script) { + document.body.removeChild(script); + } + }; + }, []); // Empty dependency array to run only once when component mounts + + // Inline styles for Google Translate container + const googleTranslateStyle = { + position: 'absolute', + top: '10px', + left: '10px', + zIndex: 1000, + }; + return (
-
+
+

Let's embark on a Cosmic
X

Welcome to CosmoXplore, where NASA's API unveils celestial wonders. Discover breathtaking images and cutting-edge astronomical data, embarking on a cosmic journey that transcends the boundaries of earthly imagination.

@@ -39,4 +85,4 @@ function Hero() { ); } -export default Hero; \ No newline at end of file +export default Hero; diff --git a/src/components/Hero/Hero.module.css b/src/components/Hero/Hero.module.css index 62470e8..054b493 100644 --- a/src/components/Hero/Hero.module.css +++ b/src/components/Hero/Hero.module.css @@ -5,4 +5,5 @@ margin: 0; margin-top: 5%; } + } \ No newline at end of file From 87b868047d5dc7f82455d88610ad38602cce90e0 Mon Sep 17 00:00:00 2001 From: Ojas Arora <127867874+Ojas-Arora@users.noreply.github.com> Date: Tue, 30 Jul 2024 19:10:12 +0530 Subject: [PATCH 2/4] MultiLanguage Facility --- src/components/Navbar/Navbar.jsx | 26 ++++++++++++++++++++++++++ 1 file changed, 26 insertions(+) diff --git a/src/components/Navbar/Navbar.jsx b/src/components/Navbar/Navbar.jsx index a6e6510..02e031b 100644 --- a/src/components/Navbar/Navbar.jsx +++ b/src/components/Navbar/Navbar.jsx @@ -99,6 +99,29 @@ function Navbar() { } }; + useEffect(() => { + const loadGoogleTranslate = () => { + new window.google.translate.TranslateElement( + { + pageLanguage: 'en', + includedLanguages: 'en,hi,pa,sa,mr,ur,bn,es,fr,de,it', + layout: window.google.translate.TranslateElement.InlineLayout.SIMPLE, + }, + 'google_element' + ); + }; + + const script = document.createElement('script'); + script.type = 'text/javascript'; + script.src = 'https://translate.google.com/translate_a/element.js?cb=loadGoogleTranslate'; + script.onerror = () => console.error('Error loading Google Translate script'); + document.body.appendChild(script); + + return () => { + document.body.removeChild(script); + }; + }, []); + return (