From 01352c1c3893e32d01e69af9beef86498dae91dd Mon Sep 17 00:00:00 2001
From: Ilya Kantor <iliakan@gmail.com>
Date: Fri, 18 Oct 2019 19:39:47 +0300
Subject: [PATCH] minor

---
 .../mouseenter-mouseleave-delegation-2.view/index.html   | 4 ++++
 .../mouseenter-mouseleave-delegation-2.view/script.js    | 9 +++++++++
 .../mouseenter-mouseleave-delegation.view/script.js      | 8 +++++---
 3 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/mouseenter-mouseleave-delegation-2.view/index.html b/2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/mouseenter-mouseleave-delegation-2.view/index.html
index e129ee6a..eedd3871 100755
--- a/2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/mouseenter-mouseleave-delegation-2.view/index.html
+++ b/2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/mouseenter-mouseleave-delegation-2.view/index.html
@@ -67,6 +67,10 @@
 
   </table>
 
+  <textarea id="text"></textarea>
+
+  <input type="button" onclick="text.value=''" value="Clear">
+
   <script src="script.js"></script>
 
 </body>
diff --git a/2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/mouseenter-mouseleave-delegation-2.view/script.js b/2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/mouseenter-mouseleave-delegation-2.view/script.js
index 27ae27b9..d4fd22ff 100755
--- a/2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/mouseenter-mouseleave-delegation-2.view/script.js
+++ b/2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/mouseenter-mouseleave-delegation-2.view/script.js
@@ -19,6 +19,10 @@ table.onmouseover = function(event) {
   // hooray! we entered a new <td>
   currentElem = target;
   target.style.background = 'pink';
+
+  // show that in textarea
+  text.value += `OVER -> ${currentElem.tagName}.${currentElem.className}\n`;
+  text.scrollTop = 1e6;
 };
 
 
@@ -41,5 +45,10 @@ table.onmouseout = function(event) {
 
   // we left the <td>. really.
   currentElem.style.background = '';
+
+  // show that in textarea
+  text.value += `OUT <- ${currentElem.tagName}.${currentElem.className}\n`;
+  text.scrollTop = 1e6;
+
   currentElem = null;
 };
diff --git a/2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/mouseenter-mouseleave-delegation.view/script.js b/2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/mouseenter-mouseleave-delegation.view/script.js
index 4700d686..44851a6e 100755
--- a/2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/mouseenter-mouseleave-delegation.view/script.js
+++ b/2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/mouseenter-mouseleave-delegation.view/script.js
@@ -1,13 +1,15 @@
 table.onmouseover = function(event) {
   let target = event.target;
   target.style.background = 'pink';
-  text.value += "mouseover " + target.tagName + "\n";
+
+  text.value += `OVER -> ${target.tagName}.${target.className}\n`;
   text.scrollTop = text.scrollHeight;
 };
 
 table.onmouseout = function(event) {
   let target = event.target;
   target.style.background = '';
-  text.value += "mouseout " + target.tagName + "\n";
+
+  text.value += `OUT <- ${target.tagName}.${target.className}\n`;
   text.scrollTop = text.scrollHeight;
-};
\ No newline at end of file
+};