mirror of
https://github.com/rabbibotton/clog.git
synced 2025-12-06 02:30:42 -08:00
32 lines
1.3 KiB
Common Lisp
32 lines
1.3 KiB
Common Lisp
(defpackage #:clog-user
|
|
(:use #:cl #:clog)
|
|
(:export start-tutorial))
|
|
|
|
(in-package :clog-user)
|
|
|
|
;;; In this tutorial we will see how to easily use a JavaScript
|
|
;;; component. In the static-files directory there is a simple
|
|
;;; JavaScript component (clog/static-files/tutorial/jslists) to create
|
|
;;; collapsable trees that we will use for this tutorial.
|
|
|
|
(defun on-new-window (body)
|
|
;; First we need to load jslists' JavaScript file and css
|
|
(load-css (html-document body) "/tutorial/jslists/jsLists.css")
|
|
(load-script (html-document body) "/tutorial/jslists/jsLists.js")
|
|
;; Second we need to build an example list. jsLists uses an ordered
|
|
;; or unordered list for it's data.
|
|
(let* ((list-top (create-unordered-list body))
|
|
(item (create-list-item list-top :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")))
|
|
(js-execute body (format nil "JSLists.applyToList('~A', 'ALL');"
|
|
(html-id list-top))))
|
|
(run body))
|
|
|
|
(defun start-tutorial ()
|
|
"Start turtorial."
|
|
(initialize #'on-new-window)
|
|
(open-browser))
|