Skip to content

Conversation

@Heleneabrahamsson
Copy link

Copy link
Contributor

@HIPPIEKICK HIPPIEKICK left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great job creating this chatbot! 🥳 Let's go through some feedback.

JavaScript

  • You've structured the code by grouping similar blocks together (e.g., DOM selectors, functions). This is a solid approach and helps readability. 🧹
  • Great conditionals, I like that you used .includes() to match more options

Clean Code

  • Naming conventions are consistent and descriptive (locationForm, locationInput, showMessage). This makes your code easy to read and understand. Well done! 🎯 Some could maybe be even more descriptive, for example - how do I know the difference between the functions handleOccasonInput and occasionInputHandler 👀 And change OutfitSuggestion to camelCase (and maybe verb form as well) -> suggestOutfit
  • Be consistent with if you're using single or double quotes

Keep up the good work! 🤖

Comment on lines +80 to +89
chat.innerHTML += `
<section class="bot-msg clothing-options">
<img src="assets/bot.png" alt="Bot" />
<div class="bubble bot-bubble">
<p>Would you prefer casual or formal clothing?</p>
<button class="clothing-choice" data-choice="casual">Casual</button>
<button class="clothing-choice" data-choice="formal">Formal</button>
</div>
</section>
`
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You already have the showMessage to handle this! If you want buttons, use the input wrapper instead.


// Eevent listeners to the buttons to handle the user's choice
const buttons = document.querySelectorAll('.clothing-choice');
buttons.forEach(button => {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants