# HG changeset patch
# User Goffi <goffi@goffi.org>
# Date 1596293244 -7200
# Node ID 9e356f8eb62c22c69053e594cacad99f7640b62d
# Parent  9344ca3b21a6559dd6f2c1d905372b2c9dbe55e3
browser (slideshow): (un)hide controls on single click:

a time is used to avoid future conflicts with double-click

diff -r 9344ca3b21a6 -r 9e356f8eb62c libervia/pages/_browser/slideshow.py
--- a/libervia/pages/_browser/slideshow.py	Sat Aug 01 16:47:21 2020 +0200
+++ b/libervia/pages/_browser/slideshow.py	Sat Aug 01 16:47:24 2020 +0200
@@ -1,4 +1,4 @@
-from browser import document, window, DOMNode
+from browser import document, window, html, timer, DOMNode
 from js_modules.swiper import Swiper
 from template import Template
 
@@ -12,6 +12,8 @@
         self.comments_count_elt = self.slideshow_elt.select_one('.comments__count')
         self.wrapper = self.slideshow_elt.select_one(".swiper-wrapper")
         self.hidden_elts = {}
+        self.control_hidden = False
+        self.click_timer = None
 
     @property
     def current_slide(self):
@@ -60,7 +62,6 @@
                 "navigation": {
                     "nextEl": ".swiper-button-next",
                     "prevEl": ".swiper-button-prev",
-                    "hideOnClick": True,
                 },
                 "scrollbar": {
                     "el": ".swiper-scrollbar",
@@ -77,6 +78,7 @@
         self.slideshow_elt.select_one(".click_to_close").bind("click", self.on_close)
         self.slideshow_elt.select_one(".click_to_comment").bind("click", self.on_comment)
         self.swiper.on("slideChange", self.on_slide_change)
+        self.swiper.on("click", self.on_click)
         self.on_slide_change()
 
     def add_slide(self, slide_elt):
@@ -107,6 +109,22 @@
         comments_count = item.get('comments_count')
         self.comments_count_elt.text = comments_count or ''
 
+    def toggle_hide_controls(self, evt):
+        self.click_timer = None
+        if 'click_to_hide' in evt.target.classList:
+            # we don't want to hide controls when a control is clicked
+            return
+        for elt in self.slideshow_elt.select('.click_to_hide'):
+            elt.style.display = '' if self.control_hidden else 'none'
+        self.control_hidden = not self.control_hidden
+
+    def on_click(self, evt):
+        # we use a timer so double tap can cancel the click
+        # this avoid double tap side effect
+        if self.click_timer is None:
+            self.click_timer = timer.set_timeout(
+                lambda: self.toggle_hide_controls(evt), 300)
+
     def on_close(self, evt):
         evt.stopPropagation()
         evt.preventDefault()
@@ -138,7 +156,7 @@
         })
         self.slideshow_elt <= self.comments_panel_elt
         side_panel = self.comments_panel_elt.select_one('.comments_side_panel')
-        window.setTimeout(lambda: side_panel.classList.add("open"))
+        timer.set_timeout(lambda: side_panel.classList.add("open"), 0)
         for close_elt in self.comments_panel_elt.select('.click_to_close'):
              close_elt.bind("click", self.on_comment_close)
         side_panel.bind("click", self.on_comments_panel_click)