Tutorial 2

README.md

@@ -45,7 +45,7 @@ Sample CLOG app with code base so far:
 	  ;; This application simply creates a CLOG-Element as a child to the
 	  ;; CLOG-body object in the browser window.
 
-      ;; A CLOG-Element represents a block of HTML (we will see later ways to
+	  ;; 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. 
 	  (create-child body "<h1>Hello World! (click me!)</h1>")))

tutorial/02-tutorial.lisp

@@ -0,0 +1,34 @@
+(defpackage #:clog-user
+  (:use #:cl #:clog)
+  (:export start-tutorial))
+
+(in-package :clog-user)
+
+(defun on-new-window (body)
+  "On-new-window handler."
+
+  ;; Give your app a name that apears in the browser tab/window
+  (setf (title (html-document body)) "Tutorial 2")
+  ;; The CLOG-body object gives you access to a number of other CLOG-Objects
+  ;;
+  ;; (html-document body) is the CLOG-Document object
+  ;; (window body) is the CLOG-Window object
+  ;; (location body) is the CLOG-Location object
+  ;; (navigator body) is the CLOG-Navigator object
+  
+  (let ((hello-element
+	  (create-child body "<h1>Hello World! (click me!)</h1>")))
+
+    (let ((x 0))                     ; A closure - each call to on-new-window will
+      (set-on-click hello-element    ; create a different version of this closer.
+		    (lambda ()
+		      (incf x)
+		      (dotimes (n x)
+			(create-child body
+				      (format nil "<p>Clicked ~A times.</p>" x))))))))
+
+(defun start-tutorial ()
+  "Start turtorial."
+
+  (initialize #'on-new-window)
+  (open-browser))