Fix tutorial dragging

pyscript · Dec 16, 2024 · ab70de5 · ab70de5
1 parent 26e1631
commit ab70de5
Show file tree

Hide file tree

Showing 2 changed files with 59 additions and 7 deletions.
diff --git a/ltk/widgets.py b/ltk/widgets.py
@@ -1450,13 +1450,10 @@ def __init__(self, widget, buttons, content):
         Div.__init__(self, buttons, content)
         self.content = content
         self.widget = widget
-        self.draggable({
-            "drag": proxy(lambda *args: (
-                find(".leader-line").remove(),
-                schedule(self.show_arrow, "ltk-step-draw-arrow", 0.1)
-            )),
-        })
-
+        self.draggable()
+        self.draggable("option", "drag", proxy(lambda *args: (
+            schedule(self.show_arrow, "ltk-step-draw-arrow")
+        )))
         self.on("mouseenter", proxy(lambda event: self.show_arrow()))
 
     def show(self):

diff --git a/tutorial.html b/tutorial.html
@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <title>LTK on MicroPython</title>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width,initial-scale=1">
+
+    <link rel="stylesheet" href="https://pyscript.net/releases/2024.10.2/core.css">
+    <script type="module" src="https://pyscript.net/releases/2024.10.2/core.js"></script>
+
+    <script src="https://code.jquery.com/jquery-3.6.0.js"></script>
+    <script src="https://code.jquery.com/ui/1.13.2/jquery-ui.js"></script>
+    <script src=" https://cdnjs.cloudflare.com/ajax/libs/leader-line/1.0.3/leader-line.min.js"></script>
+    <link rel="stylesheet" href="https://code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css">
+</head>
+<body>
+    <py-config>
+        [files]
+        "ltk/jquery.py" = "ltk/jquery.py"
+        "ltk/widgets.py" = "ltk/widgets.py"
+        "ltk/pubsub.py" = "ltk/pubsub.py"
+        "ltk/__init__.py" = "ltk/__init__.py"
+        "ltk/logger.py" = "ltk/logger.py"
+        "ltk/ltk.js" = "ltk/ltk.js"
+        "ltk/ltk.css" = "ltk/ltk.css"
+    </py-config>
+
+    <script type="py">
+import ltk
+
+def show_tutorial():
+    print("show tutorial")
+    try:
+        ltk.Tutorial([
+            (
+                "#show-button",
+                "click",
+                ltk.Preformatted("This is an LTK Tutorial").css("font-size", "2em"),
+            )
+        ]).run()
+    except Exception as e:
+        print(e)
+
+(
+    ltk.VBox(
+        ltk.Text("Tutorial Demo"),
+        ltk.Button("Show the tutorial", lambda event: show_tutorial())
+            .attr("id", "show-button")
+    )
+    .appendTo(ltk.window.document.body)
+)
+    </script>
+
+</body>
+</html>