From 7b1188e62caa4a9257c533098d9f44ee117ecc85 Mon Sep 17 00:00:00 2001 From: igerashchenko Date: Sat, 4 Jan 2020 20:33:19 +0200 Subject: [PATCH 1/8] Add event listener --- script.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/script.js b/script.js index a03ba69..cd65dc2 100644 --- a/script.js +++ b/script.js @@ -20,4 +20,9 @@ var fnc = function(e) { } }; -document.addEventListener('keydown', fnc); +let cell = document.querySelectorAll('.game__cells__item'); +cell.forEach((element, index) => { + let eventMouseOver = element.addEventListener('mouseover', () => + console.log(`You just moused over element number ${index}`) + ); +}); From e798e6df2e42ab0df4ee9053fc2a9ea43d56ff35 Mon Sep 17 00:00:00 2001 From: igerashchenko Date: Sun, 5 Jan 2020 11:50:54 +0200 Subject: [PATCH 2/8] Remove event listener --- script.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/script.js b/script.js index cd65dc2..c6944b5 100644 --- a/script.js +++ b/script.js @@ -24,5 +24,6 @@ let cell = document.querySelectorAll('.game__cells__item'); cell.forEach((element, index) => { let eventMouseOver = element.addEventListener('mouseover', () => console.log(`You just moused over element number ${index}`) - ); + , true); + element.removeEventListener('mouseover', eventMouseOver); }); From 63d48c8b269c53991e539f4ef4d03f84007e922e Mon Sep 17 00:00:00 2001 From: igerashchenko Date: Sun, 5 Jan 2020 13:21:32 +0200 Subject: [PATCH 3/8] Remove event listener --- script.js | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/script.js b/script.js index c6944b5..1fac9a1 100644 --- a/script.js +++ b/script.js @@ -22,8 +22,9 @@ var fnc = function(e) { let cell = document.querySelectorAll('.game__cells__item'); cell.forEach((element, index) => { - let eventMouseOver = element.addEventListener('mouseover', () => - console.log(`You just moused over element number ${index}`) - , true); - element.removeEventListener('mouseover', eventMouseOver); + element.addEventListener( + 'mouseover', + () => console.log(`You just moused over element number ${index}`), + { once: true } + ); }); From 0af13e8a61fc9f0a27629904796ba85399ee72cb Mon Sep 17 00:00:00 2001 From: igerashchenko Date: Sun, 5 Jan 2020 13:27:16 +0200 Subject: [PATCH 4/8] Add handler function --- script.js | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) diff --git a/script.js b/script.js index 1fac9a1..e18db21 100644 --- a/script.js +++ b/script.js @@ -22,9 +22,8 @@ var fnc = function(e) { let cell = document.querySelectorAll('.game__cells__item'); cell.forEach((element, index) => { - element.addEventListener( - 'mouseover', - () => console.log(`You just moused over element number ${index}`), - { once: true } - ); + function mouseOverHandler() { + console.log(`You just moused over element number ${index}`); + } + element.addEventListener('mouseover', mouseOverHandler); }); From 1b707f69982d6149c4b6c65725fdd3e7e507cee6 Mon Sep 17 00:00:00 2001 From: igerashchenko Date: Sun, 5 Jan 2020 14:27:53 +0200 Subject: [PATCH 5/8] Minor changes --- script.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/script.js b/script.js index e18db21..978e154 100644 --- a/script.js +++ b/script.js @@ -20,10 +20,10 @@ var fnc = function(e) { } }; -let cell = document.querySelectorAll('.game__cells__item'); -cell.forEach((element, index) => { +const gameCells = document.querySelectorAll('.game__cells__item'); +gameCells.forEach((element, index) => { function mouseOverHandler() { - console.log(`You just moused over element number ${index}`); + console.log(`You just moused over an element number ${index}`); } element.addEventListener('mouseover', mouseOverHandler); }); From 55343ec301e6f76b52e42260fb8ca53b77667e7e Mon Sep 17 00:00:00 2001 From: igerashchenko Date: Sun, 5 Jan 2020 14:30:14 +0200 Subject: [PATCH 6/8] Minor changes --- script.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/script.js b/script.js index 978e154..e51cb79 100644 --- a/script.js +++ b/script.js @@ -20,6 +20,8 @@ var fnc = function(e) { } }; +document.addEventListener('keydown', fnc); + const gameCells = document.querySelectorAll('.game__cells__item'); gameCells.forEach((element, index) => { function mouseOverHandler() { From b94076be2b794541283869f23dfdde7e294de87f Mon Sep 17 00:00:00 2001 From: igerashchenko Date: Wed, 8 Jan 2020 17:49:03 +0200 Subject: [PATCH 7/8] Added 2 cases how to solve --- models/battleground.js | 3 ++- script.js | 8 ++++++++ 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/models/battleground.js b/models/battleground.js index d7d0a80..69e84bf 100644 --- a/models/battleground.js +++ b/models/battleground.js @@ -47,11 +47,12 @@ var BattleGround = (function() { BattleGround.prototype.update = function() { var self = this; this.cellsElement.innerHTML = ''; - this.area.forEach(function(el) { + this.area.forEach(function(el,index) { var cell = document.createElement('div'); var cellElement = el.render(); cell.classList.add('game__cells__item'); + cell.setAttribute('data-index',index + 1); cell.appendChild(cellElement); self.cellsElement.appendChild(cell); }); diff --git a/script.js b/script.js index e51cb79..0380adf 100644 --- a/script.js +++ b/script.js @@ -22,6 +22,7 @@ var fnc = function(e) { document.addEventListener('keydown', fnc); +// add event listener CASE 1 const gameCells = document.querySelectorAll('.game__cells__item'); gameCells.forEach((element, index) => { function mouseOverHandler() { @@ -29,3 +30,10 @@ gameCells.forEach((element, index) => { } element.addEventListener('mouseover', mouseOverHandler); }); + +// add event listener CASE2 +const gameWrapper = document.querySelector('.game__cells'); +gameWrapper.addEventListener('mouseover', event => { + let index = event.target.getAttribute('data-index'); + console.log(`You just moused over an element number ${index}`); +}); From c0ef4d6d1109f7edce84b1829bfa5a11fe6d2075 Mon Sep 17 00:00:00 2001 From: igerashchenko Date: Mon, 20 Jan 2020 00:34:58 +0200 Subject: [PATCH 8/8] Tuponula po jestkomu --- script.js | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/script.js b/script.js index 0380adf..aa1cd75 100644 --- a/script.js +++ b/script.js @@ -25,10 +25,9 @@ document.addEventListener('keydown', fnc); // add event listener CASE 1 const gameCells = document.querySelectorAll('.game__cells__item'); gameCells.forEach((element, index) => { - function mouseOverHandler() { + element.addEventListener('mouseover', () => { console.log(`You just moused over an element number ${index}`); - } - element.addEventListener('mouseover', mouseOverHandler); + }); }); // add event listener CASE2