mirror of
https://github.com/rabbibotton/clog.git
synced 2025-12-06 02:30:42 -08:00
Added JavaScript event editting on panels
This commit is contained in:
David Botton
parent
370b28fc74
commit
17017198b8
2 changed files with 243 additions and 51 deletions
|
|
@ -787,103 +787,151 @@
|
|||
'((:name "on-create"
|
||||
:parameters "target")
|
||||
(:name "on-click"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "onclick")
|
||||
(:name "on-focus"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "onfocus")
|
||||
(:name "on-blur"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "onblur")
|
||||
(:name "on-change"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "onchange")
|
||||
(:name "on-input"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "oninput")
|
||||
(:name "on-focus-in"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "onfocusin")
|
||||
(:name "on-focus-out"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "onfocusout")
|
||||
(:name "on-reset"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "onreset")
|
||||
(:name "on-search"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "onsearch")
|
||||
(:name "on-select"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "onselect")
|
||||
(:name "on-submit"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "onsubmit")
|
||||
(:name "on-context-menu"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "oncontextmenu")
|
||||
(:name "on-double-click"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "ondblclick")
|
||||
(:name "on-mouse-click"
|
||||
:parameters "target data")
|
||||
:parameters "target data"
|
||||
:js-event "onmouseclick")
|
||||
(:name "on-mouse-double-click"
|
||||
:parameters "target data")
|
||||
:parameters "target data"
|
||||
:js-event "onmousedoubleclick")
|
||||
(:name "on-mouse-right-click"
|
||||
:parameters "target data")
|
||||
:parameters "target data"
|
||||
:js-event "onmouserightclick")
|
||||
(:name "on-mouse-enter"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "onmouseenter")
|
||||
(:name "on-mouse-leave"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "onmouseleave")
|
||||
(:name "on-mouse-over"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "onmouseover")
|
||||
(:name "on-mouse-out"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "onmouseout")
|
||||
(:name "on-mouse-down"
|
||||
:parameters "target data")
|
||||
:parameters "target data"
|
||||
:js-event "onmousedown")
|
||||
(:name "on-mouse-up"
|
||||
:parameters "target data")
|
||||
:parameters "target data"
|
||||
:js-event "onmouseup")
|
||||
(:name "on-mouse-move"
|
||||
:parameters "target data")
|
||||
:parameters "target data"
|
||||
:js-event "onmousemove")
|
||||
(:name "on-pointer-enter"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "onpointerenter")
|
||||
(:name "on-pointer-leave"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "onpointerleave")
|
||||
(:name "on-pointer-over"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "onpointerover")
|
||||
(:name "on-pointer-out"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "onpointerout")
|
||||
(:name "on-pointer-down"
|
||||
:parameters "target data")
|
||||
:parameters "target data"
|
||||
:js-event "onpointerdown")
|
||||
(:name "on-pointer-up"
|
||||
:parameters "target data")
|
||||
:parameters "target data"
|
||||
:js-event "onpointerup")
|
||||
(:name "on-pointer-move"
|
||||
:parameters "target data")
|
||||
:parameters "target data"
|
||||
:js-event "onpointermove")
|
||||
(:name "on-touch-start"
|
||||
:parameters "target data")
|
||||
:parameters "target data"
|
||||
:js-event "ontouchstart")
|
||||
(:name "on-touch-move"
|
||||
:parameters "target data")
|
||||
:parameters "target data"
|
||||
:js-event "ontouchmove")
|
||||
(:name "on-touch-end"
|
||||
:parameters "target data")
|
||||
:parameters "target data"
|
||||
:js-event "ontouchend")
|
||||
(:name "on-touch-cancel"
|
||||
:parameters "target data")
|
||||
:parameters "target data"
|
||||
:js-event "ontouchcancel")
|
||||
(:name "on-character"
|
||||
:parameters "target data")
|
||||
(:name "on-key-down"
|
||||
:parameters "target data")
|
||||
:parameters "target data"
|
||||
:js-event "onkeydown")
|
||||
(:name "on-key-up"
|
||||
:parameters "target data")
|
||||
:parameters "target data"
|
||||
:js-event "onkeyup")
|
||||
(:name "on-key-press"
|
||||
:parameters "target data")
|
||||
:parameters "target data"
|
||||
:js-event "onkeypress")
|
||||
(:name "on-copy"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "oncopy")
|
||||
(:name "on-cut"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "oncut")
|
||||
(:name "on-paste"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "onpaste")
|
||||
(:name "on-resize"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "onresize")
|
||||
(:name "on-drag-start"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "ondragstart")
|
||||
(:name "on-drag"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "ondrag")
|
||||
(:name "on-drag-end"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "ondragend")
|
||||
(:name "on-drag-enter"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "ondragenter")
|
||||
(:name "on-drag-leave"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "ondragleave")
|
||||
(:name "on-drag-over"
|
||||
:parameters "target")
|
||||
:parameters "target"
|
||||
:js-event "ondragover")
|
||||
(:name "on-drop"
|
||||
:parameters "target data")))
|
||||
:parameters "target data"
|
||||
:js-event "ondrop")))
|
||||
|
||||
(defparameter *supported-controls*
|
||||
(list
|
||||
|
|
|
|||
|
|
@ -71,6 +71,14 @@
|
|||
:accessor event-editor
|
||||
:initform nil
|
||||
:documentation "Editor in events window")
|
||||
(events-js-list
|
||||
:accessor events-js-list
|
||||
:initform nil
|
||||
:documentation "JS Event list in events window")
|
||||
(event-js-editor
|
||||
:accessor event-js-editor
|
||||
:initform nil
|
||||
:documentation "JS Editor in events window")
|
||||
(auto-complete-configured
|
||||
:accessor auto-complete-configured
|
||||
:initform nil
|
||||
|
|
@ -83,6 +91,10 @@
|
|||
:accessor control-events-win
|
||||
:initform nil
|
||||
:documentation "Current control events window")
|
||||
(control-js-events-win
|
||||
:accessor control-js-events-win
|
||||
:initform nil
|
||||
:documentation "Current control events window")
|
||||
(control-list-win
|
||||
:accessor control-list-win
|
||||
:initform nil
|
||||
|
|
@ -959,6 +971,77 @@ not a temporarily attached one when using select-control."
|
|||
txt))
|
||||
(setf (attribute elist "data-current-event") attr)
|
||||
(set-on-blur (event-editor app) #'on-blur)))))))
|
||||
(populate-options))))))
|
||||
(on-populate-control-js-events-win obj))
|
||||
|
||||
(defun on-populate-control-js-events-win (obj)
|
||||
"Populate the control js events for the current control"
|
||||
(let* ((app (connection-data-item obj "builder-app-data"))
|
||||
(event-win (control-js-events-win app))
|
||||
(elist (events-js-list app))
|
||||
(control (current-control app)))
|
||||
(when event-win
|
||||
(set-on-blur (event-js-editor app) nil)
|
||||
(set-on-change elist nil)
|
||||
(setf (inner-html elist) "")
|
||||
(remove-attribute elist "data-current-js-event")
|
||||
(setf (text-value (event-js-editor app)) "")
|
||||
(setf (clog-ace:read-only-p (event-js-editor app)) t)
|
||||
(when control
|
||||
(let ((info (control-info (attribute control "data-clog-type"))))
|
||||
(labels ((populate-options (&key (current ""))
|
||||
(set-on-change elist nil)
|
||||
(setf (inner-html elist) "")
|
||||
(add-select-option elist "" "Select JS Event")
|
||||
(dolist (event (getf info :events))
|
||||
(when (getf event :js-event)
|
||||
(let ((attr (format nil "~A" (getf event :js-event))))
|
||||
(add-select-option elist
|
||||
(getf event :js-event)
|
||||
(format nil "~A ~A"
|
||||
(if (has-attribute control attr)
|
||||
"■ "
|
||||
"□ ")
|
||||
(getf event :js-event))
|
||||
:selected (equal attr current)))))
|
||||
(set-on-change elist #'on-change))
|
||||
(on-blur (obj)
|
||||
(declare (ignore obj))
|
||||
(set-on-blur (event-js-editor app) nil)
|
||||
(let ((attr (attribute elist "data-current-js-event")))
|
||||
(unless (equalp attr "undefined")
|
||||
(let ((opt (select-text elist))
|
||||
(txt (text-value (event-js-editor app))))
|
||||
(setf (char opt 0) #\space)
|
||||
(setf opt (string-left-trim "#\space" opt))
|
||||
(cond ((or (equal txt "")
|
||||
(equalp txt "undefined"))
|
||||
(setf (select-text elist) (format nil "~A ~A" (code-char 9633) opt))
|
||||
(remove-attribute control attr))
|
||||
(t
|
||||
(setf (select-text elist) (format nil "~A ~A" (code-char 9632) opt))
|
||||
(setf (attribute control attr) (text-value (event-js-editor app))))))
|
||||
(jquery-execute (get-placer control) "trigger('clog-builder-snap-shot')")))
|
||||
(set-on-blur (event-js-editor app) #'on-blur))
|
||||
(on-change (obj)
|
||||
(declare (ignore obj))
|
||||
(set-on-blur (event-js-editor app) nil)
|
||||
(let ((event (select-value elist "clog-js-events")))
|
||||
(cond ((equal event "")
|
||||
(set-on-blur (event-js-editor app) nil)
|
||||
(remove-attribute elist "data-current-js-event")
|
||||
(setf (text-value (event-js-editor app)) "")
|
||||
(setf (clog-ace:read-only-p (event-js-editor app)) t))
|
||||
(t
|
||||
(setf (clog-ace:read-only-p (event-js-editor app)) nil)
|
||||
(let* ((attr (format nil "~A" event))
|
||||
(txt (attribute control attr)))
|
||||
(setf (text-value (event-js-editor app))
|
||||
(if (equalp txt "undefined")
|
||||
""
|
||||
txt))
|
||||
(setf (attribute elist "data-current-js-event") attr)
|
||||
(set-on-blur (event-js-editor app) #'on-blur)))))))
|
||||
(populate-options)))))))
|
||||
|
||||
(defun on-populate-control-properties-win (obj &key win)
|
||||
|
|
@ -1612,7 +1695,7 @@ It parse the string TEXT without using READ functions."
|
|||
(let ((app (connection-data-item obj "builder-app-data")))
|
||||
(if (control-events-win app)
|
||||
(window-focus (control-events-win app))
|
||||
(let* ((win (create-gui-window obj :title "Control Events"
|
||||
(let* ((win (create-gui-window obj :title "Control CLOG Events"
|
||||
:left 225
|
||||
:top 480
|
||||
:height 200 :width 645
|
||||
|
|
@ -1662,7 +1745,67 @@ It parse the string TEXT without using READ functions."
|
|||
(declare (ignore obj))
|
||||
(setf (event-editor app) nil)
|
||||
(setf (events-list app) nil)
|
||||
(setf (control-events-win app) nil)))))))
|
||||
(setf (control-events-win app) nil))))))
|
||||
(on-populate-control-events-win obj))
|
||||
|
||||
(defun on-show-control-js-events-win (obj)
|
||||
"Show control events window"
|
||||
(let ((app (connection-data-item obj "builder-app-data")))
|
||||
(if (control-js-events-win app)
|
||||
(window-focus (control-js-events-win app))
|
||||
(let* ((win (create-gui-window obj :title "Control Client JavaScript Events"
|
||||
:left 225
|
||||
:top 700
|
||||
:height 200 :width 645
|
||||
:has-pinner t :client-movement *client-side-movement*))
|
||||
(content (window-content win))
|
||||
status)
|
||||
(setf (current-editor-is-lisp app) nil)
|
||||
(set-on-window-focus win
|
||||
(lambda (obj)
|
||||
(declare (ignore obj))
|
||||
(setf (current-editor-is-lisp app) nil)))
|
||||
(setf (control-js-events-win app) win)
|
||||
(setf (events-js-list app) (create-select content :name "clog-js-events" :class "w3-gray w3-text-white"))
|
||||
(setf (positioning (events-js-list app)) :absolute)
|
||||
(set-geometry (events-js-list app) :top 5 :left 5 :right 5)
|
||||
(setf (event-js-editor app) (clog-ace:create-clog-ace-element content))
|
||||
(setf (clog-ace:read-only-p (event-js-editor app)) t)
|
||||
(set-on-event (event-js-editor app) "clog-save-ace"
|
||||
(lambda (obj)
|
||||
(declare (ignore obj))
|
||||
;; toggle focus to force a save of event
|
||||
(focus (events-js-list app))
|
||||
(focus (event-js-editor app))))
|
||||
(setf (positioning (event-js-editor app)) :absolute)
|
||||
(setf (width (event-js-editor app)) "")
|
||||
(setf (height (event-js-editor app)) "")
|
||||
(set-geometry (event-js-editor app) :top 35 :left 5 :right 5 :bottom 30)
|
||||
(clog-ace:resize (event-js-editor app))
|
||||
(setf status (create-div content :class "w3-tiny w3-border"))
|
||||
(setf (positioning status) :absolute)
|
||||
(setf (width status) "")
|
||||
(set-geometry status :height 20 :left 5 :right 5 :bottom 5)
|
||||
(setup-lisp-ace (event-js-editor app) status :package "clog-user")
|
||||
(setf (clog-ace:mode (event-js-editor app)) "ace/mode/javascript")
|
||||
(set-on-window-size-done win (lambda (obj)
|
||||
(declare (ignore obj))
|
||||
(clog-ace:resize (event-js-editor app))))
|
||||
(panel-mode win t)
|
||||
(set-on-window-focus win
|
||||
(lambda (obj)
|
||||
(declare (ignore obj))
|
||||
(panel-mode win t)))
|
||||
(set-on-window-blur win
|
||||
(lambda (obj)
|
||||
(declare (ignore obj))
|
||||
(panel-mode win nil)))
|
||||
(set-on-window-close win (lambda (obj)
|
||||
(declare (ignore obj))
|
||||
(setf (event-js-editor app) nil)
|
||||
(setf (events-js-list app) nil)
|
||||
(setf (control-js-events-win app) nil))))))
|
||||
(on-populate-control-js-events-win obj))
|
||||
|
||||
(defun on-show-copy-history-win (obj)
|
||||
"Create and show copy/but history"
|
||||
|
|
@ -2962,7 +3105,8 @@ It parse the string TEXT without using READ functions."
|
|||
(open-window (window body) "/source-editor")))
|
||||
(create-gui-menu-item src :content "New System Browser" :on-click 'on-new-sys-browser)
|
||||
(create-gui-menu-item src :content "New ASDF System Browser" :on-click 'on-new-asdf-browser)
|
||||
(create-gui-menu-item tools :content "Control Events" :on-click 'on-show-control-events-win)
|
||||
(create-gui-menu-item tools :content "Control CLOG Events" :on-click 'on-show-control-events-win)
|
||||
(create-gui-menu-item tools :content "Control JavaScript Events" :on-click 'on-show-control-js-events-win)
|
||||
(create-gui-menu-item tools :content "Directory Window" :on-click 'on-dir-win)
|
||||
(create-gui-menu-item tools :content "List Callers" :on-click 'on-show-callers)
|
||||
(create-gui-menu-item tools :content "List Callees" :on-click 'on-show-callees)
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue