Mercurial > libervia-web

changeset 1312:39a87d9099c4

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
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 12aa95eeb409
files libervia/pages/_browser/slideshow.py libervia/pages/photos/album/_browser/__init__.py
diffstat 2 files changed, 24 insertions(+), 12 deletions(-) [+]
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()
--- a/libervia/pages/photos/album/_browser/__init__.py	Sat Aug 01 16:47:24 2020 +0200
+++ b/libervia/pages/photos/album/_browser/__init__.py	Sat Aug 01 16:47:24 2020 +0200
@@ -1,8 +1,5 @@
 from browser import document, window, bind, html, DOMNode
-from browser import aio
-from browser import timer
 from javascript import JSON
-from interpreter import Inspector
 from bridge import Bridge
 from template import Template
 import dialog
@@ -73,9 +70,7 @@
             "uploading": True,
         })
         photo_elt.classList.add("progress_started")
-        print(photo_elt.outerHTML)
         album_items <= photo_elt
-        # timer.set_timeout(lambda photo_elt=photo_elt: fake_finish(photo_elt), 5000)
 
         bridge.fileHTTPUploadGetSlot(
             file_.name,
@@ -160,15 +155,10 @@
     target = evt.currentTarget
     clicked_item_elt = DOMNode(target.elt.closest('.item'))
 
-    select_idx = 0
     slideshow.attach()
     for idx, item_elt in enumerate(document.select('.item')):
         item = JSON.parse(item_elt.dataset.item)
-        slide = html.DIV(Class="swiper-slide")
-        img = html.IMG(src=item['url'], Class="slide_img")
-        slide <= img
-        slide._item = item
-        slideshow.add_slide(slide)
+        slideshow.add_slide(html.IMG(src=item['url'], Class="slide_img"), item)
         if item_elt == clicked_item_elt:
             slideshow.index = idx