diff --git a/tutorial/01-tutorial.lisp b/tutorial/01-tutorial.lisp
index 142b388..c23eb20 100644
--- a/tutorial/01-tutorial.lisp
+++ b/tutorial/01-tutorial.lisp
@@ -17,7 +17,8 @@
;; A CLOG-Element represents a block of HTML (we will see later ways to
;; directly create buttons and all sorts of HTML elements in more lisp
- ;; like ways with no knowledge of HTML or javascript.
+ ;; like ways with no knowledge of HTML or javascript. CREATE-CHILD
+ ;; allows any html element to be created and returned as a CLOG-Element.
(create-child body "
Hello World! (click me!)
")))
(set-on-click hello-element ; Now we set a function to handle clicks
diff --git a/tutorial/02-tutorial.lisp b/tutorial/02-tutorial.lisp
index 7654a2d..b95b5fc 100644
--- a/tutorial/02-tutorial.lisp
+++ b/tutorial/02-tutorial.lisp
@@ -17,7 +17,16 @@
;; (navigator body) is the CLOG-Navigator object
(let ((hello-element
- (create-child body "Hello World! (click me!)
")))
+
+ ;; CREATE-SECTION is a lispier way of create any of the HTML 5
+ ;; section elements:
+ ;;
+ ;; :address :article :aside :header :main :nav :hgroup
+ ;; :p :pre :section :blockquote :h1 :h2 :h3 :h4 :h5 :h6
+ ;;
+ ;; Take a look at clog-element-common.lisp or the clog-manual
+
+ (create-section body :h1 :content "Hello World! (click me!)")))
(let ((x 0)) ; A closure - each call to on-new-window will
(set-on-click hello-element ; create a different version of this closer.
diff --git a/tutorial/03-tutorial.lisp b/tutorial/03-tutorial.lisp
index 3452960..11e442d 100644
--- a/tutorial/03-tutorial.lisp
+++ b/tutorial/03-tutorial.lisp
@@ -10,7 +10,7 @@
(setf (title (html-document body)) "Tutorial 3")
(let ((hello-element
- (create-child body "Hello World! (click me!)
")))
+ (create-section body :h1 :content "Hello World! (click me!)")))
(let ((x 0))
(set-on-click hello-element
@@ -18,8 +18,8 @@
(declare (ignore obj))
(incf x)
(dotimes (n x)
- (create-child body
- (format nil "Clicked ~A times.
" x))
+ (create-p body
+ :content (format nil "Clicked ~A times." x))
(sleep x)))))
(run body)))
diff --git a/tutorial/04-tutorial.lisp b/tutorial/04-tutorial.lisp
index fe39ec3..f12086a 100644
--- a/tutorial/04-tutorial.lisp
+++ b/tutorial/04-tutorial.lisp
@@ -4,18 +4,19 @@
(in-package :clog-user)
-(defun my-on-click (obj) ; obj in any event is the target of the event
- (setf (color obj) "green")) ; this makes it possible to reuse events
+(defun my-on-click (obj) ; obj in any event is the target of the event
+ (setf (color obj) (rgb 0 255 0))) ; this makes it possible to reuse events
+ ; RGB is a helper function for colors
(defun on-new-window (body)
"On-new-window handler."
(setf (title (html-document body)) "Tutorial 4")
- (set-on-click (create-child body "Hello World! (click me!)
")
+ (set-on-click (create-section body :h1 :content "Hello World! (click me!)")
#'my-on-click)
- (set-on-click (create-child body "Click me too!
")
+ (set-on-click (create-section body :h3 :content "Click me too!")
#'my-on-click)
(run body))
diff --git a/tutorial/05-tutorial.lisp b/tutorial/05-tutorial.lisp
index 569fa15..9c8a46c 100644
--- a/tutorial/05-tutorial.lisp
+++ b/tutorial/05-tutorial.lisp
@@ -16,11 +16,11 @@
(setf (title (html-document body)) "Tutorial 5")
- (set-on-click (create-child body "Hello World! (click me!)
")
+ (set-on-click (create-section body :h1 :content "Hello World! (click me!)")
#'my-on-click)
(setf (connection-data-item body "changer")
- (create-child body "I change
"))
+ (create-section body :h1 :content "I change"))
(run body))
diff --git a/tutorial/06-tutorial.lisp b/tutorial/06-tutorial.lisp
index 7c4508e..1c3277b 100644
--- a/tutorial/06-tutorial.lisp
+++ b/tutorial/06-tutorial.lisp
@@ -15,9 +15,9 @@
(loop
(if (and (validp obj) (connection-data-item obj "isRunning"))
(progn
- (setf (color obj) "green")
+ (setf (color obj) :green)
(sleep 0.3)
- (setf (color obj) "red")
+ (setf (color obj) :red)
(sleep 0.3))
(return))))
(setf (connection-data-item obj "isRunning") nil)
@@ -30,7 +30,7 @@
(setf (title (html-document body)) "Tutorial 6")
- (set-on-click (create-child body "(click me to start!)
")
+ (set-on-click (create-section body :h1 :content "(click me to start!)")
#'my-on-click)
(run body))
diff --git a/tutorial/07-tutorial.lisp b/tutorial/07-tutorial.lisp
index 1803b86..e78ba76 100644
--- a/tutorial/07-tutorial.lisp
+++ b/tutorial/07-tutorial.lisp
@@ -15,7 +15,8 @@
(setf (title (html-document body)) "Tutorial 7")
(setf (hiddenp (prog1
- (create-child body "KILL Darth's Tie Fighter - Click on it!
")
+ (create-section body :h2
+ :content "KILL Darth's Tie Fighter - Click on it!")
(sleep 2))) t)
(let* ((mover (create-div body :content "(-o-)"))