diff --git a/README.md b/README.md index 1395a36c..56256053 100644 --- a/README.md +++ b/README.md @@ -8,7 +8,7 @@ Create 2 promises `promise1` and `promise2`. ## Instructions 1. Replace `` with your Github username in the link - - [DEMO LINK](https://.github.io/js_promise_basic_DOM/) + - [DEMO LINK](https://Ruslan-oss-max0.github.io/js_promise_basic_DOM/) 2. Follow [this instructions](https://mate-academy.github.io/layout_task-guideline/) - Run `npm run test` command to test your code; - Run `npm run test:only -- -n` to run fast test ignoring linter; diff --git a/src/scripts/main.js b/src/scripts/main.js index c6e3f878..916d0472 100644 --- a/src/scripts/main.js +++ b/src/scripts/main.js @@ -1,3 +1,45 @@ 'use strict'; -// write your code here +const logo = document.querySelector('.logo'); + +const promise1 = new Promise(function (resolve, reject) { + logo.addEventListener('click', () => { + resolve(); + }); +}); + +const promise2 = new Promise(function (resolve, reject) { + setTimeout(() => reject(new Error('Error')), 3000); +}); + +promise1 + .then(() => { + const div = document.createElement('div'); + + div.className = 'message'; + div.textContent = 'Promise was resolved!'; + document.body.appendChild(div); + }) + .catch(() => { + const div = document.createElement('div'); + + div.classList.add('message', 'error-message'); + div.textContent = 'Promise was rejected!'; + document.body.appendChild(div); + }); + +promise2 + .then(() => { + const div = document.createElement('div'); + + div.className = 'message'; + div.textContent = 'Promise was resolved!'; + document.body.appendChild(div); + }) + .catch(() => { + const div = document.createElement('div'); + + div.classList.add('message', 'error-message'); + div.textContent = 'Promise was rejected!'; + document.body.appendChild(div); + });