CLOG-GUI support for touch

source/clog-base.lisp

@@ -1184,8 +1184,7 @@ ON-TOUCH-END-HANDLER is nil unbind the event."))
   (set-event obj "touchend"
 	     (when handler
 	       (lambda (data)
-		 (declare (ignore dara))
+		 (funcall handler obj '(:event-type :touch))))
-		 (funcall handler obj)))
 	     :one-time one-time
 	     :cancel-event cancel-event))
 

source/clog-gui.lisp

@@ -886,9 +886,10 @@ for identifiying the window to use with window-to-top-by-param or window-by-para
              (clog::jquery-execute win
                              (format nil "draggable({handle:'#~A-title-bar'})" html-id))
              (clog::jquery-execute win "resizable({handles:'se'})")
+	     (set-on-touch-start (win-title win) (lambda (obj data) (declare (ignore obj data)) nil) :cancel-event t)
              (set-on-pointer-down (win-title win)
                                   (lambda (obj data)
-                                    (declare (ignore obj) (ignore data))
+                                    (declare (ignore obj data))
                                     (setf (z-index win) (incf (last-z app)))
                                     (fire-on-window-change win app)))
              (clog::set-on-event win "dragstart"
@@ -908,8 +909,10 @@ for identifiying the window to use with window-to-top-by-param or window-by-para
                                    (declare (ignore obj))
                                    (fire-on-window-size-done win))))
             (t
+	     (set-on-touch-start (win-title win) (lambda (obj data) (declare (ignore obj data)) nil) :cancel-event t)
              (set-on-pointer-down
               (win-title win) 'on-gui-drag-down :capture-pointer t)
+	     (set-on-touch-start (sizer win) (lambda (obj data) (declare (ignore obj data)) nil) :cancel-event t)
              (set-on-pointer-down
               (sizer win) 'on-gui-drag-down :capture-pointer t)))
       win)))

tools/clog-builder.lisp

@@ -9,7 +9,7 @@
 
 (defparameter *start-project* nil)
 
-(defparameter *client-side-movement* t)
+(defparameter *client-side-movement* nil)
 
 ;; Per instance app data
 

tutorial/08-tutorial.lisp

@@ -5,11 +5,7 @@
 (in-package :clog-tut-8)
 
 (defclass app-data ()
-  ((drag-type
+  ((drag-x
-    :accessor drag-type
-    :initform nil
-    :documentation "Ensure only pointer or touch events.")
-    (drag-x
     :accessor drag-x
     :documentation "The location of the left side of the box relative to mouse during drag.")
    (drag-y
@@ -19,31 +15,19 @@
 
 (defun stop-tracking (obj)
   (set-on-pointer-move obj nil)
-  (set-on-pointer-up obj nil)
+  (set-on-pointer-up obj nil))
-  (set-on-touch-move obj nil)
-  (set-on-touch-end obj nil)
-  (let ((app (connection-data-item obj "app-data")))
-    (setf (drag-type app) nil)))
 
 (defun on-mouse-down (obj data)
-  (let ((app (connection-data-item obj "app-data")))
+  (let* ((app (connection-data-item obj "app-data"))
-    (with-sync-event (obj)                     ; Process one event at a time
+	 (mouse-x  (getf data :screen-x))  ; Use the screen coordinates not
-      (when (eq (drag-type app) :pointer)      ; Prefer touch events to pointer events
+	 (mouse-y  (getf data :screen-y))  ; the coordinates relative to the obj
-	(stop-tracking obj))                   ; to accomidate mobile devices emulating mice
+	 (obj-top  (parse-integer (top obj) :junk-allowed t))
-      (setf (drag-type app) (getf data :event-type))
+	 (obj-left (parse-integer (left obj) :junk-allowed t)))
-      (let* ((mouse-x  (getf data :screen-x))  ; Use the screen coordinates not
+    (setf (drag-x app) (- mouse-x obj-left))
-	     (mouse-y  (getf data :screen-y))  ; the coordinates relative to the obj
+    (setf (drag-y app) (- mouse-y obj-top))
-	     (obj-top  (parse-integer (top obj) :junk-allowed t))
+    (set-on-pointer-move obj 'on-mouse-move)
-	     (obj-left (parse-integer (left obj) :junk-allowed t)))
+    (set-on-pointer-up obj 'on-mouse-up)))
-	(setf (drag-x app) (- mouse-x obj-left))
+  
-	(setf (drag-y app) (- mouse-y obj-top))
-	(cond ((eq (getf data :event-type) :touch)
-	       (set-on-touch-move obj 'on-mouse-move)
-	       (set-on-touch-end obj 'on-touch-end))
-	      (t
-	       (set-on-pointer-move obj 'on-mouse-move)
-	       (set-on-pointer-up obj 'on-mouse-up)))))))
-
 (defun on-mouse-move (obj data)
   (let* ((app (connection-data-item obj "app-data"))
 	 (x   (getf data :screen-x))
@@ -55,9 +39,6 @@
   (declare (ignore data))
   (stop-tracking obj))
 
-(defun on-touch-end (obj)
-  (stop-tracking obj))
-
 (defun on-new-window (body)
   (let ((app (make-instance 'app-data)))                 ; Create our "App-Data" for this instance
     (setf (connection-data-item body "app-data") app))   ; of our App.
@@ -88,11 +69,15 @@
     (setf (overflow div2) :hidden)
     (setf (positioning div3) :absolute)
     ;; Setup mouse/touch/pointer events
+    ;;
     ;; Since our divs are embedded on with in the other we use cancel-event so events do
     ;; not bubble up from one div to another
-    (set-on-touch-start div1 'on-mouse-down :cancel-event t)
+    ;;
-    (set-on-touch-start div2 'on-mouse-down :cancel-event t)
+    ;; We need to catch the on-touch-start event or touches will not be tracked
-    (set-on-touch-start div3 'on-mouse-down :cancel-event t)
+    ;; However once cought the pointer events will be same for mouse or touch
+    (set-on-touch-start div1 (lambda (obj data) (declare (ignore obj data)) nil) :cancel-event t)
+    (set-on-touch-start div2 (lambda (obj data) (declare (ignore obj data)) nil) :cancel-event t)
+    (set-on-touch-start div3 (lambda (obj data) (declare (ignore obj data)) nil) :cancel-event t)
     (set-on-pointer-down div1 'on-mouse-down :cancel-event t :capture-pointer t)
     (set-on-pointer-down div2 'on-mouse-down :cancel-event t :capture-pointer t)
     (set-on-pointer-down div3 'on-mouse-down :cancel-event t :capture-pointer t)))