From 52d94c7458ac3c67d3fa97b772ab316d2f0ba0e4 Mon Sep 17 00:00:00 2001 From: ShrishtiSingh26 Date: Fri, 4 Oct 2024 13:07:27 +0530 Subject: [PATCH] projects added Text to speech convertor and Image Generator added --- index.html | 24 +++++++ projects/Text to Speech/index.html | 29 ++++++++ projects/Text to Speech/script.js | 40 +++++++++++ projects/Text to Speech/style.css | 104 ++++++++++++++++++++++++++++ projects/Text to Speech/txtsp.png | Bin 0 -> 3198 bytes projects/image Generator/index.html | 43 ++++++++++++ projects/image Generator/script.js | 61 ++++++++++++++++ projects/image Generator/search.png | Bin 0 -> 15075 bytes projects/image Generator/style.css | 95 +++++++++++++++++++++++++ 9 files changed, 396 insertions(+) create mode 100644 projects/Text to Speech/index.html create mode 100644 projects/Text to Speech/script.js create mode 100644 projects/Text to Speech/style.css create mode 100644 projects/Text to Speech/txtsp.png create mode 100644 projects/image Generator/index.html create mode 100644 projects/image Generator/script.js create mode 100644 projects/image Generator/search.png create mode 100644 projects/image Generator/style.css diff --git a/index.html b/index.html index da7056f60..de6596e73 100644 --- a/index.html +++ b/index.html @@ -321,6 +321,30 @@

Wordle

+ + +
+ Text to Speech logo +
+
+

Text to Speech

+

+ Text to speech convertor +

+
+ + +
+ Image Generator logo +
+
+

Image Generator

+

+ Generates Images +

+
+ + diff --git a/projects/Text to Speech/index.html b/projects/Text to Speech/index.html new file mode 100644 index 000000000..92b84a76f --- /dev/null +++ b/projects/Text to Speech/index.html @@ -0,0 +1,29 @@ + + + + + + Interactive Text to Speech + + + +
+

Text to Speech

+ + +
+ + + + + +
+ + + +

+
+ + + + diff --git a/projects/Text to Speech/script.js b/projects/Text to Speech/script.js new file mode 100644 index 000000000..580de42e9 --- /dev/null +++ b/projects/Text to Speech/script.js @@ -0,0 +1,40 @@ +const textInput = document.getElementById("text-input"); +const speakBtn = document.getElementById("speak-btn"); +const rateInput = document.getElementById("rate"); +const pitchInput = document.getElementById("pitch"); +const rateValue = document.getElementById("rate-value"); +const pitchValue = document.getElementById("pitch-value"); +const status = document.getElementById("status"); + +rateInput.addEventListener("input", () => { + rateValue.textContent = rateInput.value; +}); + +pitchInput.addEventListener("input", () => { + pitchValue.textContent = pitchInput.value; +}); + +speakBtn.addEventListener("click", function() { + const text = textInput.value; + if (!text) { + status.textContent = "Please enter some text!"; + return; + } + + const speech = new SpeechSynthesisUtterance(text); + speech.pitch = pitchInput.value; + speech.rate = rateInput.value; + + // Update status during speech + status.textContent = "Speaking..."; + + speech.onend = () => { + status.textContent = "Speech finished."; + }; + + speech.onerror = () => { + status.textContent = "Error occurred while speaking."; + }; + + window.speechSynthesis.speak(speech); +}); diff --git a/projects/Text to Speech/style.css b/projects/Text to Speech/style.css new file mode 100644 index 000000000..37d8585db --- /dev/null +++ b/projects/Text to Speech/style.css @@ -0,0 +1,104 @@ +/* General reset */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; + } + + /* Body styling with gradient background and centered content */ + body { + font-family: 'Poppins', sans-serif; + background: linear-gradient(135deg, #74ebd5 0%, #9face6 100%); + height: 100vh; + display: flex; + justify-content: center; + align-items: center; + text-align: center; /* Centering text */ + } + + /* Center the container and style it */ + .container { + background-color: #ffffff; + padding: 30px; + border-radius: 15px; + box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1); + text-align: center; + width: 350px; + } + + /* Style the heading with a new font and center it */ + h1 { + margin-bottom: 15px; + font-size: 28px; + font-family: 'Pacifico', cursive; /* New font for the main heading */ + color: #333; + } + + /* Style the textarea */ + textarea { + width: 100%; + height: 120px; + padding: 15px; + font-size: 16px; + border: 2px solid #ddd; + border-radius: 10px; + margin-bottom: 20px; + resize: none; + outline: none; + transition: border 0.3s; + } + + textarea:focus { + border-color: #28a745; + } + + /* Styling the controls for pitch and rate */ + .controls { + margin-bottom: 20px; + text-align: left; + } + + label { + font-size: 14px; + color: #555; + } + + input[type="range"] { + width: 100%; + margin: 10px 0; + } + + /* Style the button */ + button { + width: 100%; + padding: 15px; + background-color: #28a745; + color: white; + font-size: 16px; + border: none; + border-radius: 10px; + cursor: pointer; + transition: background-color 0.3s; + } + + button:hover { + background-color: #218838; + } + + /* Feedback text during speech */ + #status { + margin-top: 20px; + font-size: 14px; + color: #888; + font-style: italic; + } + + /* Display the value of rate and pitch */ + #rate-value, #pitch-value { + font-weight: bold; + color: #28a745; + } + + /* Google Fonts import */ + @import url('https://fonts.googleapis.com/css2?family=Pacifico&family=Poppins:wght@300;400;500;700&display=swap'); + \ No newline at end of file diff --git a/projects/Text to Speech/txtsp.png b/projects/Text to Speech/txtsp.png new file mode 100644 index 0000000000000000000000000000000000000000..734a95a8ba1dfe03290897d00d24811fc86af22c GIT binary patch literal 3198 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 k(P%UpjYgx + + + + Image Generator + + + + +

IMAGE SEARCH

+
+ + +
+
+ + + + + + + + \ No newline at end of file diff --git a/projects/image Generator/script.js b/projects/image Generator/script.js new file mode 100644 index 000000000..e0667d140 --- /dev/null +++ b/projects/image Generator/script.js @@ -0,0 +1,61 @@ +const accessKey = "eJCYDaO5lcyBr6Vyscq1RmWvikF8jBibrzAomh1JX6M"; +const searchForm = document.getElementById("search-form"); +const searchBox = document.getElementById("search-box"); +const searchResult = document.getElementById("search-result"); +const showMoreBtn = document.getElementById("show-more-btn"); + +let keyword = ""; +let page = 1; + +async function searchImages() { + keyword = searchBox.value; + // Use backticks to correctly interpolate the variables + const url = `https://api.unsplash.com/search/photos?page=${page}&query=${keyword}&client_id=${accessKey}&per_page=9`; + + try { + const response = await fetch(url); + + // Check if the response status is OK (200–299) + if (!response.ok) { + throw new Error(`HTTP error! Status: ${response.status}`); + } + + const data = await response.json(); + + // Clear previous search results if starting a new search + if (page === 1) { + searchResult.innerHTML = ""; + } + + const results = data.results; + results.map((result) => { + const image = document.createElement("img"); + image.src = result.urls.small; + const imageLink = document.createElement("a"); + imageLink.href = result.links.html; + imageLink.target = "_blank"; + + imageLink.appendChild(image); + searchResult.appendChild(imageLink); + }); + + // Show "Show More" button if there are results + if (results.length > 0) { + showMoreBtn.style.display = "block"; + } else { + showMoreBtn.style.display = "none"; + } + } catch (error) { + console.error('Error fetching images:', error); + } +} + +searchForm.addEventListener("submit", (e) => { + e.preventDefault(); + page = 1; // Reset page on new search + searchImages(); +}); +showMoreBtn.addEventListener("click", () => { + page++; // Increment page for next set of results + searchImages(); +}); \ No newline at end of file diff --git a/projects/image Generator/search.png b/projects/image Generator/search.png new file mode 100644 index 0000000000000000000000000000000000000000..615dc1be177cd80b74c171cbeb50c1ac8d423e96 GIT binary patch literal 15075 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 literal 0 HcmV?d00001 diff --git a/projects/image Generator/style.css b/projects/image Generator/style.css new file mode 100644 index 000000000..53000f5bd --- /dev/null +++ b/projects/image Generator/style.css @@ -0,0 +1,95 @@ +*{ + margin: 0; + padding: 0; + font-family: 'Poppins' , sans-serif; + box-sizing: border-box; +} +body{ + background: #39297b; + color: #fff; + +} +.scroll-top-btn { + position: fixed; /* Fixed position */ + bottom: 20px; /* Distance from the bottom of the viewport */ + right: 20px; /* Distance from the right of the viewport */ + background-color: #ff3929; + color: white; + border: none; + padding: 10px 15px; + cursor: pointer; + border-radius: 5px; + display: none; /* Initially hidden */ + z-index: 1000; /* Ensure it appears above other content */ +} + +.scroll-top-btn:hover { + background-color: #ff3929; +} +h1{ + text-align:center; + margin: 100px auto 50px; + font-weight: 600; +} +form{ + width: 90%; + max-width: 600px; + margin: auto; + height: 80px; + background: #aaafe9; + display: flex; + align-items: center; + border-radius: 8px ; +} +form input{ + flex:1; + height: 100%; + border: 0; + outline: 0; + background: transparent; + color: #fff; + font-size: 18px; + padding: 0 30px; +} +form button{ + padding: 0 40px; + height:100%; + background: #ff3929; + color: #fff; + font-size: 18px; + border: 0; + outline: 0; + border-top-right-radius: 8px; + border-bottom-right-radius: 8px; + cursor: pointer; +} +::placeholder{ + color: #fff; + font-size: 18px; +} +#show-more-btn{ + background: #ff3929; + color: #fff; + border: 0; + outline: 0; + padding: 10px 20px; + border-radius: 4px; + margin: 10px auto 100px; + cursor: pointer; + display: none; +} +#search-result{ + width: 80%; + margin: 100px auto 50px; + display: grid; + grid-template-columns: 1fr 1fr 1fr; + grid-gap: 40px; + + +} +#search-result-img{ + width:100%; + height: 230px; + object-fit: cover ; + border-radius: 5px; +}