lab-antwerp-1 / alina-word-list

Word list maker app. Individual deliverables of "Separation of Concerns".

Home Page:https://lab-antwerp-1.github.io/alina-word-list/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

must have: get warnings

AlinaTaoRao opened this issue · comments

Get warnings

"As a user I want to get warnings so that I know I did something wrong."

  • Give '123' and click add button then will get the warning: "123" is not a word.
  • If 'abc' has not added yet. Give 'abc' and click remove button then will get the warning: "abc" is not in the list.

Logic: Get warnings

  • type: logic: Write a function isWord(text = '') in /logic to check if the user input is a word. export function.

  • type: handlers:

    • Write a function inputWord(event) in/handlers. It's an entry point for adding or removing a word. It is called each time the user clicks the "add word" or the "remove word" button. It gathers user input from DOM and then render new words by calling function sortStrings(data.words, data.sort) and renderList(sorted) to a div with the id listContainer.

    • Add a guard to check if user input is a word by calling function isWord(text = ''), if it isn't, post a warning "${userInput}" is not a word.

    • Add a guard to check text, use data.words.includes(text), if not, post a warning "${text}" is not in the list

    • export function.

Interface: Get warnings

  • type:html: a code tag with the id warnings, then assign the warning message to it's innerText.

Interaction: Get warnings

  • Given the input contains non-letters, it will not be added a warning is displayed.

  • Given the input is not in the list a warning is posted.