From 636685c86e60a98d492ec2ad766bd41ede00223f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fe=CC=81lix=20Pe=CC=81ault?= <hello@flayks.com>
Date: Fri, 6 Mar 2020 11:08:52 +0100
Subject: [PATCH] Fix carousel buttons snap scroll when hovering areas

Buttons would trigger a nasty scroll due to the `.focus` on them on hover
---
 src/organisms/Carousel.svelte | 33 +++++++++++++++------------------
 1 file changed, 15 insertions(+), 18 deletions(-)

diff --git a/src/organisms/Carousel.svelte b/src/organisms/Carousel.svelte
index bc36ecb..8fe8000 100644
--- a/src/organisms/Carousel.svelte
+++ b/src/organisms/Carousel.svelte
@@ -30,20 +30,11 @@
     /*
     ** Navigate to a photo
     */
-   // Go to specific photo on Init
+    // Go to specific photo on Init
     if (init) {
         currentIndex = photos.findIndex(photo => photo.slug === init.params.photo)
     }
 
-    // Send current photo to event
-    const sendCurrentPhoto = ({ init = false }) => {
-        console.log('sendCurrentPhoto event: ', currentPhoto.slug)
-        dispatch('photoChange', {
-            currentPhoto: currentPhoto,
-            init
-        })
-    }
-
     // Change the current index depending on direction
     const goToPhoto = direction => {
         if (direction === 'prev') {
@@ -58,6 +49,14 @@
         sendCurrentPhoto({ init: false })
     }
 
+    // Send current photo to event
+    const sendCurrentPhoto = ({ init = false }) => {
+        dispatch('photoChange', {
+            currentPhoto: photos[currentIndex],
+            init
+        })
+    }
+
 
     /*
     ** Drag and touch navigation
@@ -74,8 +73,8 @@
     const swipeEnd = event => {
         touchEndX = event.changedTouches[0].screenX
         touchEndY = event.changedTouches[0].screenY
-        if (touchEndX <= touchStartX) goToPhoto('prev')
-        if (touchEndX >= touchStartX) goToPhoto('next')
+        if (touchEndX <= touchStartX) goToPhoto('next')
+        if (touchEndX >= touchStartX) goToPhoto('prev')
     }
 
 
@@ -110,10 +109,10 @@
             // Toggle class and focus of the button
             if (event.type === 'mouseenter') {
                 photoToHover.classList.add('hover')
-                button.focus()
+                button.classList.add('hover')
             } else if (event.type === 'mouseleave') {
                 photoToHover.classList.remove('hover')
-                button.blur()
+                button.classList.remove('hover')
             }
         }
 
@@ -122,11 +121,9 @@
     })
 
 
-
-
     /*
-        TODO: REVEAL ANIMATION ON CAROUSEL
-        Fix the CSS priority? Cancel the transition delay and duration?
+    ** TODO: REVEAL ANIMATION ON CAROUSEL
+    ** Fix the CSS priority? Cancel the transition delay and duration?
         data-aos="{
             (photo === prevPhoto) ? 'carousel-prev' :
             (photo === currentPhoto) ? 'carousel-active' :