Magnify on short tap

Previously magnifying required holding your finger on the screen. This
was not very discoverable. Allow magnifying on short tap (a click).
Coordinates will be set to the position of the tap and subsequent drags
will move the magnified area until finger is raised and the view is
again unmagnified. Short tap while magnified will 'zoom out' without
changing position. Hopefully this change will make magnify simpler to
use for those who don't already know how it works.

Big thanks to a friend of mine who was wondering what magnify button
does. I'm very glad you asked. I would not have found out this
shortcoming without that. :)

Signed-off-by: Tomi Leppänen <[email protected]>

Author: Tomin1

qml/pages/Game.qml

@@ -1,6 +1,6 @@
 /*
  * Patience Deck is a collection of patience games.
- * Copyright (C) 2020-2022 Tomi Leppänen
+ * Copyright (C) 2020-2023 Tomi Leppänen
  *
  * This program is free software: you can redistribute it and/or modify
  * it under the terms of the GNU General Public License as published by
@@ -167,13 +167,7 @@ Page {
                 backgroundColor: settings.backgroundColor
                 highlightColor: Theme.rgba(Theme.highlightColor, Theme.opacityLow)
 
-                transform: Scale {
-                    id: magnifyTransform
-                    origin {
-                        x: Math.floor(magnifyArea.mouseX)
-                        y: Math.floor(magnifyArea.mouseY)
-                    }
-                }
+                transform: Scale { id: magnifyTransform }
                 doubleResolution: magnifyArea.pressed || animateShrink.running || animateGrow.running
 
                 layer.enabled: pullDownMenu.active
@@ -214,8 +208,33 @@ Page {
                 }
                 enabled: toolbar.magnify
                 preventStealing: true
-                onPressed: animateGrow.running = true
-                onReleased: animateShrink.running = true
+                onPressed: {
+                    clickTimer.running = true
+                    if (magnifyTransform.xScale < 2) {
+                        animateGrow.running = true
+                    }
+                }
+                onReleased: if (magnifyTransform.xScale === 2 || !clickTimer.running) animateShrink.running = true
+                onEnabledChanged: if (!enabled) animateShrink.running = true
+
+                Timer {
+                    id: clickTimer
+                    interval: 100
+                }
+
+                Binding {
+                    target: magnifyTransform
+                    property: "origin.x"
+                    value: Math.floor(magnifyArea.mouseX)
+                    when: magnifyArea.pressed && (magnifyTransform.xScale === 1 || !clickTimer.running)
+                }
+
+                Binding {
+                    target: magnifyTransform
+                    property: "origin.y"
+                    value: Math.floor(magnifyArea.mouseY)
+                    when: magnifyArea.pressed && (magnifyTransform.xScale === 1 || !clickTimer.running)
+                }
             }
         }