Mercurial > libervia-web
changeset 1310:9e356f8eb62c
browser (slideshow): (un)hide controls on single click:
a time is used to avoid future conflicts with double-click
author | Goffi <goffi@goffi.org> |
---|---|
date | Sat, 01 Aug 2020 16:47:24 +0200 |
parents | 9344ca3b21a6 |
children | 9948598e7ec0 |
files | libervia/pages/_browser/slideshow.py |
diffstat | 1 files changed, 21 insertions(+), 3 deletions(-) [+] |
line wrap: on
line diff
--- 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)