From efec664b91af8818aac78fe6b498195d0dc3c14a Mon Sep 17 00:00:00 2001 From: afreen shaik Date: Wed, 25 Dec 2024 01:17:41 +0530 Subject: [PATCH 1/4] createde teh template for project --- Source-Code/LanguageTranslator/index.html | 11 +++++++++++ Source-Code/LanguageTranslator/script.js | 0 Source-Code/LanguageTranslator/style.css | 0 3 files changed, 11 insertions(+) create mode 100644 Source-Code/LanguageTranslator/index.html create mode 100644 Source-Code/LanguageTranslator/script.js create mode 100644 Source-Code/LanguageTranslator/style.css diff --git a/Source-Code/LanguageTranslator/index.html b/Source-Code/LanguageTranslator/index.html new file mode 100644 index 0000000..d01f779 --- /dev/null +++ b/Source-Code/LanguageTranslator/index.html @@ -0,0 +1,11 @@ + + + + + + Document + + + + + \ No newline at end of file diff --git a/Source-Code/LanguageTranslator/script.js b/Source-Code/LanguageTranslator/script.js new file mode 100644 index 0000000..e69de29 diff --git a/Source-Code/LanguageTranslator/style.css b/Source-Code/LanguageTranslator/style.css new file mode 100644 index 0000000..e69de29 From 0c86bbb434f584214b6f489a0d4fb9224c55d652 Mon Sep 17 00:00:00 2001 From: afreen shaik Date: Wed, 25 Dec 2024 01:31:58 +0530 Subject: [PATCH 2/4] Add a project --- Source-Code/LanguageTranslator/index.html | 81 +++++++++++++++++++++-- Source-Code/LanguageTranslator/script.js | 32 +++++++++ Source-Code/LanguageTranslator/style.css | 65 ++++++++++++++++++ 3 files changed, 173 insertions(+), 5 deletions(-) diff --git a/Source-Code/LanguageTranslator/index.html b/Source-Code/LanguageTranslator/index.html index d01f779..2359393 100644 --- a/Source-Code/LanguageTranslator/index.html +++ b/Source-Code/LanguageTranslator/index.html @@ -1,11 +1,82 @@ - - - Document + + + Language Translator App + - +
+

Language Translator

+
+ +
+ + + +
+ +
+
+ - \ No newline at end of file + diff --git a/Source-Code/LanguageTranslator/script.js b/Source-Code/LanguageTranslator/script.js index e69de29..ee14549 100644 --- a/Source-Code/LanguageTranslator/script.js +++ b/Source-Code/LanguageTranslator/script.js @@ -0,0 +1,32 @@ +const translateButton = document.getElementById('translateButton'); +const sourceText = document.getElementById('sourceText'); +const translatedText = document.getElementById('translatedText'); +const sourceLang = document.getElementById('sourceLang'); +const targetLang = document.getElementById('targetLang'); + +// Replace with your own API key +const API_URL = 'https://api.mymemory.translated.net/get'; + +translateButton.addEventListener('click', async () => { + const text = sourceText.value.trim(); + const fromLang = sourceLang.value; + const toLang = targetLang.value; + + if (!text) { + alert('Please enter text to translate.'); + return; + } + + try { + const response = await fetch( + `${API_URL}?q=${encodeURIComponent(text)}&langpair=${fromLang}|${toLang}`, + ); + const data = await response.json(); + const translated = data.responseData.translatedText; + + translatedText.value = translated; + } catch (error) { + console.error('Error fetching translation:', error); + alert('Failed to translate. Please try again later.'); + } +}); diff --git a/Source-Code/LanguageTranslator/style.css b/Source-Code/LanguageTranslator/style.css index e69de29..772a271 100644 --- a/Source-Code/LanguageTranslator/style.css +++ b/Source-Code/LanguageTranslator/style.css @@ -0,0 +1,65 @@ +body { + font-family: Arial, sans-serif; + background-color: #a4bef2; + margin: 0; + padding: 0; + display: flex; + justify-content: center; + align-items: center; + height: 100vh; + } + + .container { + text-align: center; + background: white; + padding: 20px; + border-radius: 10px; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); + min-width: 500px; + } + + h1 { + font-size: 24px; + margin-bottom: 20px; + } + + .translator { + display: flex; + flex-direction: column; + } + + textarea { + width: 90%; + height: 100px; + margin: 10px ; + padding: 10px; + border: 1px solid #ccc; + border-radius: 5px; + resize: none; + } + + .controls { + display: flex; + justify-content: space-around; + align-items: center; + } + + select { + padding: 10px; + border-radius: 5px; + border: 1px solid #ccc; + } + + button { + padding: 10px 15px; + background-color: #007bff; + color: white; + border: none; + border-radius: 5px; + cursor: pointer; + } + + button:hover { + background-color: #0056b3; + } + \ No newline at end of file From c4dc76d7e585ef27017e8bb248c25e1604cc7712 Mon Sep 17 00:00:00 2001 From: afreen shaik Date: Wed, 25 Dec 2024 01:35:12 +0530 Subject: [PATCH 3/4] update the readme with the description --- README.md | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/README.md b/README.md index 3ed6348..cd4db08 100644 --- a/README.md +++ b/README.md @@ -518,6 +518,17 @@ In order to run this project you need: +
  • +
    +Language Translator +

    The Language Translator App is a simple and user-friendly web application that allows users to translate text between various languages. It uses the MyMemory Translation API to fetch translations.

    + +
    +
    • +

    (back to top)

    From 511b689bef7974bf195b31941204ccc2162ba39a Mon Sep 17 00:00:00 2001 From: afreen shaik Date: Wed, 25 Dec 2024 01:38:16 +0530 Subject: [PATCH 4/4] solve linter errors --- Source-Code/LanguageTranslator/style.css | 127 +++++++++++------------ 1 file changed, 63 insertions(+), 64 deletions(-) diff --git a/Source-Code/LanguageTranslator/style.css b/Source-Code/LanguageTranslator/style.css index 772a271..1d9b219 100644 --- a/Source-Code/LanguageTranslator/style.css +++ b/Source-Code/LanguageTranslator/style.css @@ -1,65 +1,64 @@ body { - font-family: Arial, sans-serif; - background-color: #a4bef2; - margin: 0; - padding: 0; - display: flex; - justify-content: center; - align-items: center; - height: 100vh; - } - - .container { - text-align: center; - background: white; - padding: 20px; - border-radius: 10px; - box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); - min-width: 500px; - } - - h1 { - font-size: 24px; - margin-bottom: 20px; - } - - .translator { - display: flex; - flex-direction: column; - } - - textarea { - width: 90%; - height: 100px; - margin: 10px ; - padding: 10px; - border: 1px solid #ccc; - border-radius: 5px; - resize: none; - } - - .controls { - display: flex; - justify-content: space-around; - align-items: center; - } - - select { - padding: 10px; - border-radius: 5px; - border: 1px solid #ccc; - } - - button { - padding: 10px 15px; - background-color: #007bff; - color: white; - border: none; - border-radius: 5px; - cursor: pointer; - } - - button:hover { - background-color: #0056b3; - } - \ No newline at end of file + font-family: Arial, sans-serif; + background-color: #a4bef2; + margin: 0; + padding: 0; + display: flex; + justify-content: center; + align-items: center; + height: 100vh; +} + +.container { + text-align: center; + background: white; + padding: 20px; + border-radius: 10px; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); + min-width: 500px; +} + +h1 { + font-size: 24px; + margin-bottom: 20px; +} + +.translator { + display: flex; + flex-direction: column; +} + +textarea { + width: 90%; + height: 100px; + margin: 10px; + padding: 10px; + border: 1px solid #ccc; + border-radius: 5px; + resize: none; +} + +.controls { + display: flex; + justify-content: space-around; + align-items: center; +} + +select { + padding: 10px; + border-radius: 5px; + border: 1px solid #ccc; +} + +button { + padding: 10px 15px; + background-color: #007bff; + color: white; + border: none; + border-radius: 5px; + cursor: pointer; +} + +button:hover { + background-color: #0056b3; +}