Skip to content

Commit

Permalink
Merge pull request fac29b#63 from fac29b/refactoring-code-for-audio-a…
Browse files Browse the repository at this point in the history 
…nd-buttons

Refactoring code for audio and buttons
  • Loading branch information
@josueJURE
josueJURE authored Aug 3, 2024
2 parents 3ab6888 + 72f4414 commit 4af15d6
Show file tree
Hide file tree
Showing 6 changed files with 44 additions and 83 deletions.
25 changes: 10 additions & 15 deletions public/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,26 +20,21 @@
<body>

<div class="container">
<!-- Navigation -->
<div class="menu-icon">
<div class="line line-1"></div>
<div class="line line-2"></div>
</div>
<nav class="navigation">
<div class="nav-items">
<a href="#recipe-section">Select Cuisine</a>
<a href="#picture-section">Take a picture of your ingredients</a>
</div>
</nav>
<!-- Content Sections -->
<!-- <section id="cusine-options">Select Cuisine</section>
<section id="picture-section">Take a picture of your ingredients</section> -->

</div>
<div class="stream"></div>

<div aria-label="parent container" class="parent-container">
<div class="wrapper">
<div class="menu-icon">
<div class="line line-1"></div>
<div class="line line-2"></div>
</div>
<nav class="navigation">
<div class="nav-items">
<a href="#recipe-section">Select Cuisine</a>
<a href="#picture-section">Take a picture of your ingredients</a>
</div>
</nav>

<div id="recipe-section" class="recipe-section">

Expand Down
94 changes: 27 additions & 67 deletions public/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,40 +12,33 @@ import {
stopAudio,
createAudio,
createUserRecipe,
cacheData,
CACHE_NAME_URL,
CACHE_NAME_AUDIO,
audioElement,
alert_message
alert_message,
} from "./js_utilities/functions_and_variables.js";

import {
mainElement,
backgroundImg,
gptResponseElement,
headline,
lactoseIntolerant,
loadingContainer,
allergies,
darkLightButton,
userWantAnotherRecipe,
tryAgainBtn,
recipeButtons,
sendRecipeToUserInboxBtn,
loadingText,
recording,
userEmail,
emailSection,
sendToUserInboxBtn,
dietaryRequirements,
otherDietaryRequirements,
userText,
pictureSection,
video,
canvas,
takePicture,
context,
constraint,
chatGptVisionText,
videoBtnCanvas,
pictureSectionHeadline,
Expand All @@ -54,7 +47,7 @@ import {
pictureEmailSection,
previousPage,
sendToUserInbox,
emailUserRecipeSection,
wrapper,
} from "./js_utilities/query_selector.js";

let currentCameraIndex = 0;
Expand Down Expand Up @@ -143,7 +136,6 @@ sendToUserInbox.addEventListener("click", () => {
});

sendToUserInboxBtn.addEventListener("click", () => {
// console.log(`userEmail ${userEmail.value}`);
console.log(emailObject);
fetch(`/email?${createQuery(emailObject)}`)
.then((response) => response.json())
Expand Down Expand Up @@ -196,39 +188,14 @@ recipeButtons.forEach((button) => {
if (eventData.image) {
data.image = eventData.image;
}
// console.log("cacheObject", data);

console.log("data.audio", eventData.audio);
console.log("data.image", eventData.image);

if (data.audio && data.image) {
console.log(typeof data.image);
removeElements([loadingContainer]);
const imageUrl = data.image.data[0].url;
console.log(`imageURL ${imageUrl}`);
// await cacheData(imageUrl, CACHE_NAME_URL, "image");
backgroundImg.src = imageUrl;
backgroundImg.onload = () => {
console.log("Image loaded successfully");

};
backgroundImg.onerror = () => {
console.error("Error loading image");
};

///
console.log(data.audio);
const audio_data = createAudio(data.audio);
console.log(`line 261: ${audio_data}`);
await cacheData(audio_data, CACHE_NAME_AUDIO, "audio");
displayElementsFlex([recording]);
displayElements([sendRecipeToUserInboxBtn, userWantAnotherRecipe]);
const speechBtns = Array.from(document.querySelectorAll(".fa-solid"));
const speedBtn = document.querySelector("#speed");
audioElement.src = createAudio(data.audio);
audioElement.stop = function () {
this.pause();
this.currentTime = 0;
};
createImage(data);

const { speedBtn, speechBtns } = createTextToSpeech(data);

userWantAnotherRecipe.addEventListener("click", () => {
displayElements([headline, allergies, ...recipeButtons, mainElement]);
Expand Down Expand Up @@ -257,27 +224,31 @@ recipeButtons.forEach((button) => {
});
});
}

// if (data.image) {
// console.log(typeof data.image);
// removeElements([loadingContainer]);
// const imageUrl = data.image.data[0].url;
// console.log(`imageURL ${imageUrl}`);
// // await cacheData(imageUrl, CACHE_NAME_URL, "image");
// backgroundImg.src = imageUrl;
// backgroundImg.onload = () => {
// console.log("Image loaded successfully");
// };
// backgroundImg.onerror = () => {
// console.error("Error loading image");
// };
// }
};
});
});

// Picture section
function createImage(param) {
removeElements([loadingContainer]);
const imageUrl = param.image.data[0].url;
backgroundImg.src = imageUrl;
return backgroundImg;
}

function createTextToSpeech(param) {
displayElementsFlex([recording]);
displayElements([sendRecipeToUserInboxBtn, userWantAnotherRecipe]);
const speechBtns = Array.from(document.querySelectorAll(".fa-solid"));
const speedBtn = document.querySelector("#speed");
audioElement.src = createAudio(param.audio);
audioElement.stop = function () {
this.pause();
this.currentTime = 0;
};
return { speedBtn, speechBtns };
}

// Picture section
async function getVideoDevices() {
const devices = await navigator.mediaDevices.enumerateDevices();
return devices.filter((device) => device.kind === "videoinput");
Expand Down Expand Up @@ -328,16 +299,6 @@ async function initializeCamera() {

initializeCamera();

// navigator.mediaDevices
// .getUserMedia(constraint)
// .then((stream) => {
// video.srcObject = stream;
// video.play();
// })
// .catch((error) => {
// console.error("Error accessing camera:", error);
// });

function capturePhoto() {
context.drawImage(video, 0, 0, 400, 100);
}
Expand Down Expand Up @@ -375,8 +336,7 @@ takePicture.addEventListener("click", () => {

// Menu icon toggle
const menuIcon = document.querySelector(".menu-icon");
const container = document.querySelector(".container");

menuIcon.addEventListener("click", () => {
container.classList.toggle("change");
wrapper.classList.toggle("change");
});
4 changes: 4 additions & 0 deletions public/js_utilities/functions_and_variables.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -113,6 +113,10 @@ function loopOverArrayOfElements(array, display) {







function displayElements(array) {
loopOverArrayOfElements(array, "block");
}
Expand Down
2 changes: 2 additions & 0 deletions public/js_utilities/query_selector.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
const emailRecipe = document.querySelector(".email-recipe");
const wrapper = document.querySelector(".wrapper");
const emailUserRecipeSection = document.querySelector(".user-email-recipe-section");
const sendToUserInbox = document.querySelector(".send-to-user-inbox");
const previousPage = document.querySelector(".previous-page");
Expand Down Expand Up @@ -86,6 +87,7 @@ export {
previousPage,
sendToUserInbox,
emailUserRecipeSection,
wrapper
};


Expand Down
2 changes: 1 addition & 1 deletion public/url_folder.txt
View file
Original file line number Diff line number Diff line change
@@ -1 +1 @@
https://oaidalleapiprodscus.blob.core.windows.net/private/org-nYbqgo3O0LNnYYAoKAmApBfx/user-58Je7efi0iy880e2UYCdYpBm/img-1wpjmjhOyCV8QTN9mWJBvyFQ.png?st=2024-08-02T12%3A29%3A05Z&se=2024-08-02T14%3A29%3A05Z&sp=r&sv=2023-11-03&sr=b&rscd=inline&rsct=image/png&skoid=6aaadede-4fb3-4698-a8f6-684d7786b067&sktid=a48cca56-e6da-484e-a814-9c849652bcb3&skt=2024-08-01T23%3A41%3A18Z&ske=2024-08-02T23%3A41%3A18Z&sks=b&skv=2023-11-03&sig=AcczkNo41h%2Bul%2B4Ud3ztnmq9qPvt2AYdUfBzHHUgAyM%3D
https://oaidalleapiprodscus.blob.core.windows.net/private/org-nYbqgo3O0LNnYYAoKAmApBfx/user-58Je7efi0iy880e2UYCdYpBm/img-ovb7qD0yHMLLx0Ooe4iCpSOE.png?st=2024-08-03T13%3A22%3A53Z&se=2024-08-03T15%3A22%3A53Z&sp=r&sv=2023-11-03&sr=b&rscd=inline&rsct=image/png&skoid=6aaadede-4fb3-4698-a8f6-684d7786b067&sktid=a48cca56-e6da-484e-a814-9c849652bcb3&skt=2024-08-03T04%3A05%3A06Z&ske=2024-08-04T04%3A05%3A06Z&sks=b&skv=2023-11-03&sig=bDE%2Bp86dJ7jZ6nydnnnKPumw/XA0M1VaghM8Bm5XY5E%3D
Binary file modified speech.mp3
View file
Binary file not shown.

0 comments on commit 4af15d6

Please sign in to comment.