Homework 5 - JS logic

[vladyslav-yermolin-moc]

Підготовка

Як зазвичай, початок розробки нової функціональності (нового завдання) відбувається з актуальної версії продакшена (гілка main).

1. Перемкніться на гілку main та завантажте найновішу версію з нашого репозиторію.
2. Заведіть нову гілку під назвою 5-js_logic_<ім'я користувача github>.

Завдання

1. В вашому особистому каталозі в репозиторії створіть нову папку під назвою 5-logic.
2. Скопіюйте в цю папку файли index.html, script.js та homework.js з папки lectures/5-logic:
3. Стилізуйте інпути, селект, кнопку та заголовок стилями вашого проєкту.
4. Відкрийте файл homework.js та реалізуйте логіку калькулятора з минулого завдання.
5. Ця функція має вертати результат - число, або помилку:
   • 'Enter a number' , якщо перший чи другий аргумент - це не числа
   • 'Choose a valid operation', якщо операція не -, +, *, /. Тобто **має виводити цю помилку
   • 'Result is too big', якщо результат більший за 100

Update я оновив умови завдання:
Аргументи функціі firstValue, secondValue, operation - це змінні. Використовуючи їх, вам потрібно реалізувати логіку, описану у пункті 5, та зберігти число або текст помилки в змінну result яку повертає функція.

Завдання із зірочкой

1. Створіть у вашому проєкті нову сторінку calculator.html Додайте туди хедер, та розмітку з index.html. Скопіюйте файл script.js у вашу папку скриптів та підключить на сторінку calculator.html.

2. Додайте візуальну репрезантацію результату у вигляді великих чисел під інпутами.

3. Стилі для великого текста математичниї знаків, чисел та помилок - це стилі h1 із красним кольором вашого проєкту.

4. Помилка для завеликого результата 'Too many pokemons/games'

5. По бажанню: замість чисел в першому і останньому столбці можна виводити картки покемонів або ігор. Кількість карток має змінюватися дінамічно (подія onChange). Картки мають вишукуватися в стовбчик по 10 одна над іншою (margin-top: -50px або display: grid із необхідним разположенням). Максимальна кількість карток в першому стовбчику - 10, в останньому 100.

6. Додайте тініbox-shadow з дизайну,

7. По бажанню: якщо результат має дробну частину - відображайте її як частину картки, поруч із цілими картками.

8. По бажанню: можна додати валідаційне повідомлення на інпут або селект, який є причиною помилки за допомогою setCustomValidity

Дедлайни

• Дедлайн створення п-реквеста: 13:00 субота 4-листопада-2023
• Фінальний дедлайн: 21:00 понеділок 6-листопада-2023