diff libervia/pages/_browser/slideshow.py @ 1312:39a87d9099c4

browser (slideshow): slides can now be zoomed: zoom is activated either by double clicking/taping or by pinching on touch devices
author Goffi <goffi@goffi.org>
date Sat, 01 Aug 2020 16:47:24 +0200
parents 9948598e7ec0
children 0cbf86b1dcca
line wrap: on
line diff
--- a/libervia/pages/_browser/slideshow.py	Sat Aug 01 16:47:24 2020 +0200
+++ b/libervia/pages/_browser/slideshow.py	Sat Aug 01 16:47:24 2020 +0200
@@ -72,6 +72,10 @@
                     "onlyInViewport": False,
                 },
                 "mousewheel": True,
+                "zoom": {
+                    "maxRatio": 15,
+                    "toggle": False,
+                },
             }
         )
         window.addEventListener("keydown", self.on_key_down, True)
@@ -79,10 +83,16 @@
         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.swiper.on("doubleTap", self.on_double_tap)
         self.on_slide_change()
         self.fullscreen(True)
 
-    def add_slide(self, slide_elt):
+    def add_slide(self, elt, item_data=None):
+        slide_elt = html.DIV(Class="swiper-slide")
+        zoom_cont_elt = html.DIV(Class="swiper-zoom-container")
+        slide_elt <= zoom_cont_elt
+        zoom_cont_elt <= elt
+        slide_elt._item = item_data
         self.swiper.appendSlide([slide_elt])
         self.swiper.update()
 
@@ -150,6 +160,18 @@
             self.click_timer = timer.set_timeout(
                 lambda: self.toggle_hide_controls(evt), 300)
 
+    def on_double_tap(self, evt):
+        evt.stopPropagation()
+        evt.preventDefault()
+        if self.click_timer is not None:
+            timer.clear_timeout(self.click_timer)
+            self.click_timer = None
+        if self.swiper.zoom.scale != 1:
+            self.swiper.zoom.toggle()
+        else:
+            # "in" is reserved in Python, so we call it using dict syntax
+            self.swiper.zoom["in"]()
+
     def on_close(self, evt):
         evt.stopPropagation()
         evt.preventDefault()