mirror of
https://github.com/rabbibotton/clog.git
synced 2025-12-06 02:30:42 -08:00
71 lines
2.4 KiB
Common Lisp
71 lines
2.4 KiB
Common Lisp
|
|
;;;; In this tutorial we will see how to wrap last tutorial's JavaScript
|
|
;;;; component in to something that feels more like a plugin to CLOG.
|
|
|
|
;;; First we will create a package for our component
|
|
(defpackage #:clog-toggler
|
|
(:use #:cl #:clog)
|
|
(:export clog-toggler
|
|
init-toggler
|
|
create-toggler
|
|
activate))
|
|
|
|
(in-package :clog-toggler)
|
|
|
|
;;; Next we will create a function to initialize the environment
|
|
;;; for the component.
|
|
(defun init-toggler (body &key (path-to-js "/tutorial/jslists/"))
|
|
"Initialize BODY to use clog-toggler components"
|
|
(load-css (html-document body)
|
|
(concatenate 'string path-to-js "jsLists.css"))
|
|
(load-script (html-document body)
|
|
(concatenate 'string path-to-js "jsLists.js")))
|
|
|
|
;;; Next we will use the clog-unordered-list as the base for our new
|
|
;;; class clog-toggler
|
|
(defclass clog-toggler (clog-unordered-list) ()
|
|
(:documentation "Toggler object - a collapsable UI component"))
|
|
|
|
(defgeneric create-toggler (clog-obj &key content class auto-place)
|
|
(:documentation "Create a toggler with CONTENT as the top of tree."))
|
|
|
|
(defmethod create-toggler ((obj clog-obj) &key (content "")
|
|
(class nil)
|
|
(auto-place t))
|
|
(let ((new-obj (create-unordered-list obj :class class
|
|
:auto-place auto-place)))
|
|
;; Using change-class we can reuse the parent clog-obj's create
|
|
;; method and it's initialization.
|
|
(change-class new-obj 'clog-toggler)
|
|
new-obj))
|
|
|
|
(defgeneric activate (clog-toggler)
|
|
(:documentation "Activate the clog-toggler."))
|
|
|
|
(defmethod activate ((obj clog-toggler))
|
|
(js-execute obj (format nil "JSLists.applyToList('~A', 'ALL');"
|
|
(html-id obj))))
|
|
|
|
(defpackage #:clog-user
|
|
(:use #:cl #:clog)
|
|
(:export start-tutorial))
|
|
|
|
(in-package :clog-user)
|
|
|
|
(defun on-new-window (body)
|
|
(clog-toggler:init-toggler body)
|
|
;; Now we build or CLOG-Toggler
|
|
(let* ((toggler (clog-toggler:create-toggler body))
|
|
(item (create-list-item toggler :content "Top of tree"))
|
|
(list-b (create-unordered-list item))
|
|
(item (create-list-item list-b :content "Item 1"))
|
|
(item (create-list-item list-b :content "Item 2"))
|
|
(item (create-list-item list-b :content "Item 3"))
|
|
(item (create-list-item list-b :content "Item 4")))
|
|
(clog-toggler:activate toggler))
|
|
(run body))
|
|
|
|
(defun start-tutorial ()
|
|
"Start turtorial."
|
|
(initialize #'on-new-window)
|
|
(open-browser))
|