refactor: getClickPosition

Author: solygambas

020-button ripple effect/script.js

@@ -1,13 +1,19 @@
 const buttons = document.querySelectorAll(".ripple");
 
+function getClickPosition(e, element) {
+  const x = e.clientX;
+  const y = e.clientY;
+  const buttonTop = element.offsetTop;
+  const buttonLeft = element.offsetLeft;
+  return {
+    xInside: x - buttonLeft,
+    yInside: y - buttonTop,
+  };
+}
+
 buttons.forEach((button) => {
   button.addEventListener("click", function (e) {
-    const x = e.clientX;
-    const y = e.clientY;
-    const buttonTop = e.target.offsetTop;
-    const buttonLeft = e.target.offsetLeft;
-    const xInside = x - buttonLeft;
-    const yInside = y - buttonTop;
+    const { xInside, yInside } = getClickPosition(e, this);
     const circle = document.createElement("span");
     circle.classList.add("circle");
     circle.style.top = yInside + "px";