### Load CLOG and Run Tutorial

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Load the CLOG package using Quicklisp and start the first tutorial. Ensure Quicklisp is configured and xdg-utils is installed on WSL for browser integration.

```common-lisp
CL-USER> (ql:quickload :clog)
CL-USER> (clog:run-tutorial 1)
```

--------------------------------

### Create and Execute QLOT Setup Script

Source: https://github.com/rabbibotton/clog/blob/main/QLOT.md

This shell script automates the QLOT initialization, dependency loading, and CLOG builder launch. It's useful for creating a quick way to start your development environment.

```shell
sbcl --eval "(ql:quickload :qlot)" \
     --eval "(setf qlot:*project-root* (uiop:getcwd))" \
     --eval "(qlot:init (uiop:getcwd))" \
     --eval "(pushnew (uiop:getcwd) ql:*local-project-directories* :test #'equalp)" \
     --eval "(ql:quickload :qtest/tools)" \
     --eval "(clog-tools:clog-builder :project :qtest)"
```

--------------------------------

### Install QuickLisp

Source: https://github.com/rabbibotton/clog/blob/main/LINUX.md

Downloads and installs the QuickLisp Common Lisp implementation. This script fetches QuickLisp, installs it to ~/.quicklisp, and adds it to the Lisp initialization file.

```bash
curl -o /tmp/ql.lisp http://beta.quicklisp.org/quicklisp.lisp
sbcl --no-sysinit --no-userinit --load /tmp/ql.lisp \
       --eval '(quicklisp-quickstart:install :path "~/.quicklisp")' \
       --eval '(ql:add-to-init-file)' \
       --quit
```

--------------------------------

### Install SBCL and Quicklisp

Source: https://github.com/rabbibotton/clog/blob/main/ANDROID-TERMUX.md

Downloads, installs, and configures SBCL from a custom build for Termux, followed by Quicklisp installation.

```bash
curl -OL "https://github.com/bohonghuang/sbcl-termux-build/releases/download/2.3.3/sbcl-2.3.3-arm64-termux.tar.zst"
unzstd -c "sbcl-2.3.3-arm64-termux.tar.zst" | tar -xf -
cd "sbcl-2.3.3"
sh install.sh
```

```bash
curl -o ql.lisp http://beta.quicklisp.org/quicklisp.lisp
sbcl --no-sysinit --no-userinit --load ql.lisp \
       --eval '(quicklisp-quickstart:install :path "~/.quicklisp")' \
       --eval '(ql:add-to-init-file)' \
       --quit
sbcl --eval '(ql:quickload :quicklisp-slime-helper)' --quit
```

--------------------------------

### Load OCICL Setup Script

Source: https://github.com/rabbibotton/clog/blob/main/OCICL.md

Run the OCICL setup script using SBCL to install OCICL. This script typically creates the necessary files and directories for OCICL to function.

```bash
sbcl --load setup.lisp
```

--------------------------------

### Load CLOG and Start REPL

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Load the CLOG library and start the interactive REPL. This is the initial setup for developing CLOG applications interactively.

```lisp
(ql:quickload :clog)
    (clog:clog-repl)
```

--------------------------------

### Install ECL and Quicklisp

Source: https://github.com/rabbibotton/clog/blob/main/ANDROID-TERMUX.md

Installs the ECL Common Lisp implementation and Quicklisp, then loads it within the ECL REPL.

```bash
pkg install clang
pkg install ecl

curl -o ql.lisp http://beta.quicklisp.org/quicklisp.lisp
ecl
```

```lisp
(load "ql.lisp")
(quicklisp-quickstart:install :path "~/.quicklisp")
(ql:add-to-init-file)
(ql:quickload :quicklisp-slime-helper)
```

--------------------------------

### Install QuickLisp

Source: https://github.com/rabbibotton/clog/blob/main/WINDOWS.md

Load the downloaded QuickLisp script with SBCL to install QuickLisp to a specified path and add it to your init file. Then, load the QuickLisp Slime helper.

```bash
sbcl --no-sysinit --no-userinit --load /tmp/ql.lisp \
       --eval '(quicklisp-quickstart:install :path "~/.quicklisp")' \
       --eval '(ql:add-to-init-file)' \
       --quit
```

```bash
sbcl --eval '(ql:quickload :quicklisp-slime-helper)' --quit
```

--------------------------------

### Install UltraLisp Distro

Source: https://github.com/rabbibotton/clog/blob/main/MACOS.md

Install the UltraLisp distribution to access recent Common Lisp software through QuickLisp.

```bash
sbcl --eval '(ql-dist:install-dist "http://dist.ultralisp.org/" :prompt nil)' --eval '(ql:update-all-dists)' --quit
```

--------------------------------

### Initialize QLOT and Install Dependencies

Source: https://github.com/rabbibotton/clog/blob/main/QLOT.md

Use this REPL sequence to initialize QLOT for your project, set the project root, and install dependencies. Ensure you are in your project directory.

```lisp
(ql:quickload :qlot)
(setf qlot:*project-root* (uiop:getcwd))
(qlot:init (uiop:getcwd))
(qlot:install)
```

--------------------------------

### CLOG-WEB-INITIALIZE

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Initializes clog-web and installs a clog-web object on connection. If `W3-CSS-URL` has not been loaded before, it is installed unless it is nil.

```APIDOC
## CLOG-WEB-INITIALIZE

### Description
Initializes clog-web and installs a clog-web object on connection. If `W3-CSS-URL` has not been loaded before is installed unless is nil.

### Function Signature
`CLOG-WEB-INITIALIZE CLOG-BODY &KEY (W3-CSS-URL "/css/w3.css")`

### Parameters
*   **CLOG-BODY**: The CLOG body object.
*   **&KEY W3-CSS-URL**: The URL for W3 CSS. Defaults to "/css/w3.css".
```

--------------------------------

### Quickload Common Lisp Libraries

Source: https://github.com/rabbibotton/clog/blob/main/VSCODE.md

Load essential Common Lisp libraries using Quicklisp. Ensure these are installed before proceeding with VSCode setup.

```lisp
(ql:quickload :cl-json)
(ql:quickload :bordeaux-threads)
(ql:quickload :usocket)
(ql:quickload :flexi-streams)
```

--------------------------------

### Install UltraLisp Distro

Source: https://github.com/rabbibotton/clog/blob/main/LINUX.md

Installs the UltraLisp distribution for QuickLisp, providing access to recent Common Lisp software. It also updates all existing distributions.

```bash
sbcl --eval '(ql-dist:install-dist "http://dist.ultralisp.org/" :prompt nil)' --eval '(ql:update-all-dists)'
```

--------------------------------

### Install Slime for Emacs

Source: https://github.com/rabbibotton/clog/blob/main/MACOS.md

Install the Slime (Superior Lisp Interaction Mode) extension for Emacs using QuickLisp.

```bash
sbcl --eval '(ql:quickload :quicklisp-slime-helper)' --quit
```

--------------------------------

### Get CLOG Installation Directory

Source: https://github.com/rabbibotton/clog/blob/main/README.md

Retrieve the installation directory for CLOG files, including source, tutorials, and demos, from the Common Lisp REPL.

```lisp
(clog:clog-install-dir)
```

--------------------------------

### Start CLOG Application

Source: https://github.com/rabbibotton/clog/blob/main/tutorial/13-tutorial/README.md

Execute this command after loading the CLOG application to start the web server and make the application accessible.

```lisp
(hello-clog:start-app)
```

--------------------------------

### Start CLOG Application

Source: https://github.com/rabbibotton/clog/blob/main/tutorial/28-tutorial/README.md

Execute this command after loading the hello-builder system to start the CLOG application. The application's output can be viewed in CLOG Builder.

```lisp
(hello-builder:start-app)
```

--------------------------------

### Load CLOG Tools and Start Builder in SBCL

Source: https://github.com/rabbibotton/clog/blob/main/OCICL.md

These Lisp expressions load the CLOG tools system and then start the CLOG builder. This is typically run after starting SBCL with the userinit file.

```lisp
(asdf:load-system :clog/tools)
(clog-tools:clog-builder)
```

--------------------------------

### Initialize and Install CLOG with OCICL

Source: https://github.com/rabbibotton/clog/blob/main/OCICL.md

Use these commands to set up a new project directory and install the CLOG system using OCICL. Ensure your project directory is not named 'clog' to avoid circular dependencies.

```bash
ocicl setup > init
ocicl install clog
```

--------------------------------

### Install CLOG and CLOG Builder

Source: https://github.com/rabbibotton/clog/blob/main/ANDROID-TERMUX.md

Installs the CLOG framework and its builder tool for creating GUI applications.

```bash
sbcl --eval '(ql:quickload :clog/tools)' --quit
```

--------------------------------

### Enable and Start CLOG systemd Service

Source: https://github.com/rabbibotton/clog/blob/main/WEBSERVER.md

Commands to enable the CLOG service to start on boot and to start it manually.

```bash
sudo systemctl enable clogpower.service
```

```bash
sudo systemctl start clogpower.service
```

--------------------------------

### Install SBCL and OCICL on Mac

Source: https://github.com/rabbibotton/clog/blob/main/OCICL.md

Install SBCL and OCICL on macOS using Homebrew. This command handles the installation of both essential components for development.

```bash
brew install sbcl
brew install ocicl
```

--------------------------------

### Install Termux Packages

Source: https://github.com/rabbibotton/clog/blob/main/ANDROID-TERMUX.md

Installs essential packages for Termux, including SSH, Emacs, and Zstd.

```bash
pkg upgrade
pkg install openssh
pkg install emacs
pkg install zstd
pkg install libsqlite
```

--------------------------------

### Apache Module Installation for CLOG

Source: https://github.com/rabbibotton/clog/blob/main/WEBSERVER.md

Install necessary Apache modules for proxying HTTP and WebSocket traffic.

```bash
a2enmod proxy
a2enmod proxy_http
a2enmod proxy_wstunnel
```

--------------------------------

### Run a CLOG Demo

Source: https://github.com/rabbibotton/clog/blob/main/demos/README.md

Execute this command to start a CLOG demo. The demo number corresponds to the specific demo you wish to run. A web server will start, and a browser may open automatically.

```lisp
CL-USER> (clog:run-demo 1)
Hunchentoot server is started.
Listening on 0.0.0.0:8080.
HTTP listening on : 0.0.0.0:8080
HTML Root         : static-files/
Boot file default : /boot.html
```

--------------------------------

### Start CLOG Builder with SBCL

Source: https://github.com/rabbibotton/clog/blob/main/OCICL.md

Launch the CLOG Builder using SBCL. This command loads the necessary CLOG tools and starts the builder application. For Windows, an additional eval is recommended.

```bash
sbcl --userinit init --eval "(asdf:load-system :clog/tools)" --eval "(clog-tools:clog-builder :port 0 :app t)"
```

--------------------------------

### Install SBCL on Linux

Source: https://github.com/rabbibotton/clog/blob/main/OCICL.md

Install SBCL using the system's package manager on Linux. This is a prerequisite for using OCICL and CLOG.

```bash
sudo apt-get install sbcl
```

--------------------------------

### Install SBCL Common Lisp Compiler

Source: https://github.com/rabbibotton/clog/blob/main/MACOS.md

Install the Steel Bank Common Lisp compiler (SBCL) using Homebrew.

```bash
brew install sbcl
```

--------------------------------

### Install Common Lisp Packages on Linux

Source: https://github.com/rabbibotton/clog/blob/main/LINUX.md

Installs the SBCL Common Lisp implementation, OpenSSH client, and SQLite development libraries. Adapt package names for your specific Linux distribution.

```bash
sudo apt-get install sbcl openssh-client libsqlite3-dev
```

--------------------------------

### Start CLOG Builder with SBCL on Windows

Source: https://github.com/rabbibotton/clog/blob/main/OCICL.md

This command is specifically for Windows users to start the CLOG Builder with SBCL. It includes an additional eval to set compile-file-failure-behaviour.

```bash
sbcl --userinit init --eval "(setf asdf:*compile-file-failure-behaviour* :warn)" --eval "(asdf:load-system :clog/tools)" --eval "(clog-tools:clog-builder :port 0 :app t)"
```

--------------------------------

### Window Collection

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Get the hash table of open windows.

```APIDOC
## WINDOW-COLLECTION

### Description
Get hash table of open windows

### Generic Function Signature
`WINDOW-COLLECTION` (CLOG-OBJ)
```

--------------------------------

### Get CLOG Installation Directory

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Retrieve the installation directory for CLOG files. This is useful for locating source, tutorial, and demo files.

```common-lisp
CL-USER> (clog:clog-install-dir)
```

--------------------------------

### Grid Row Start

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Get or set the grid-row-start property for a CLOG element.

```APIDOC
## GRID-ROW-START

### Description
Get/Setf grid-row-start.

### Method
GET/SETF

### Endpoint
N/A (CLOG Element Function)
```

--------------------------------

### Grid Column Start

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Get or set the grid-column-start property for a CLOG element.

```APIDOC
## GRID-COLUMN-START

### Description
Get/Setf grid-column-start.

### Method
GET/SETF

### Endpoint
N/A (CLOG Element Function)
```

--------------------------------

### Load hello-builder with QuickLisp

Source: https://github.com/rabbibotton/clog/blob/main/tutorial/28-tutorial/README.md

Use this command to load the hello-builder system using QuickLisp. Ensure the hello-builder directory is in your QuickLisp search path.

```lisp
(ql:quickload :hello-builder)
```

--------------------------------

### Download QuickLisp Lisp File

Source: https://github.com/rabbibotton/clog/blob/main/WINDOWS.md

Use Git Bash to download the QuickLisp installer script. Ensure you are in your home directory before executing.

```bash
cd
curl -o /tmp/ql.lisp http://beta.quicklisp.org/quicklisp.lisp
```

--------------------------------

### initialize

Source: https://context7.com/rabbibotton/clog/llms.txt

Starts the CLOG server, registers an on-new-window handler, and sets the static-file root. It accepts various keyword arguments to configure the server.

```APIDOC
## initialize — Start the CLOG server

Starts the WebSocket/HTTP server, registers a handler called once per new browser connection (the "on-new-window" handler), and sets the static-file root. Accepts keyword arguments for host, port, server backend, SSL, long-polling, boot file, and middleware.

### Method
(initialize on-new-window-handler &key port static-root ...)

### Parameters
- **on-new-window-handler**: A function called for each new browser connection.
- **:port**: The port number for the server (default 8080).
- **:static-root**: The root directory for static files.

### Request Example
```lisp
(ql:quickload :clog)
(in-package :clog-user)

(defun on-new-window (body)
  "Called every time a browser connects."
  (setf (title (html-document body)) "My App")
  (create-div body :content "Hello, CLOG!"))

;; Start server on default port 8080, open browser automatically
(initialize #'on-new-window
            :port 8080
            :static-root (merge-pathnames "www/" (uiop:getcwd)))
(open-browser)
;; => browser opens http://127.0.0.1:8080/

;; Register an additional route
(set-on-new-window (lambda (body)
                     (create-div body :content "About page"))
                   :path "/about"
                   :boot-file "/boot.html")

;; Shut down when done
(shutdown)
```
```

--------------------------------

### Initialize CLOG GUI and Create Window

Source: https://context7.com/rabbibotton/clog/llms.txt

Installs the windowing system and creates a menu bar, an editable window, and dialog boxes. Requires `clog/tools`.

```lisp
(ql:quickload :clog/tools)
(use-package :clog-gui)

(defun on-new-window (body)
  (clog-gui-initialize body)   ; installs windowing system on this connection
  (add-class body "w3-light-grey")

  ;; Menu bar
  (let* ((mbar (create-gui-menu-bar body))
         (file (create-gui-menu-drop-down mbar :content "File"))
         (_    (create-gui-menu-item file :content "New"
                                    :on-click (lambda (obj)
                                                (create-gui-window obj :title "New Doc"
                                                                       :width 400 :height 300))))
         (_    (create-gui-menu-full-screen mbar)))
    (declare (ignore _)))

  ;; A window with content
  (let* ((win  (create-gui-window body
                                  :title "Editor"
                                  :width 500 :height 350
                                  :has-pinner t))
         (area (create-child (window-content win)
                             "<textarea style='width:100%;height:90%;'></textarea>"))) 
    (declare (ignore area))
    (window-center win)

    ;; Window events
    (set-on-window-close win
      (lambda (obj) (declare (ignore obj))
        (alert-toast body "Window closed" "Editor was closed" :time-out 3)))
    (set-on-window-can-size win
      (lambda (obj) (declare (ignore obj)) t)))   ; allow resize

  ;; Dialog boxes
  (confirm-dialog body "Save before exit?"
                  (lambda (result)
                    (if result
                        (alert-dialog body "Saved!")
                        (alert-toast  body "Discarded" "Changes discarded" :time-out 2)))
                  :ok-text "Save" :cancel-text "Discard")

  ;; Form dialog
  (form-dialog body "Register"
               '(("Name"  "name"  :text)
                 ("Email" "email" :email)
                 ("Role"  "role"  :select (("Admin" "admin") ("User" "user" :selected))))
               (lambda (data)
                 (format t "Got: ~A%" data))))

(initialize 'on-new-window)
(open-browser)
```

--------------------------------

### Install Homebrew Package Manager

Source: https://github.com/rabbibotton/clog/blob/main/MACOS.md

Install Homebrew, a package manager for macOS, which is used to install SBCL and other development tools.

```bash
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
```

--------------------------------

### Start CLOG Builder with QuickLisp

Source: https://github.com/rabbibotton/clog/blob/main/doc/v5.md

Load the CLOG builder using QuickLisp. Ensure QuickLisp is set up in your Lisp environment.

```lisp
(ql:quickload :clog/tools)(clog-tools:clog-builder)
```

--------------------------------

### Use Program

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Installs a program object as part of current WebGL rendering state.

```APIDOC
## USE-PROGRAM OBJ

### Description
Installs a program object as part of current WebGL rendering state.

### Function Signature
`USE-PROGRAM(OBJ)`
```

--------------------------------

### Run CLOG Tutorial in CLOG Builder REPL

Source: https://github.com/rabbibotton/clog/blob/main/tutorial/README.md

To run a tutorial when using the CLOG Builder, open a CLOG Builder REPL and execute this command.

```lisp
> (clog:run-tutorial 1)
```

--------------------------------

### Load CLOG Application with QuickLisp

Source: https://github.com/rabbibotton/clog/blob/main/tutorial/13-tutorial/README.md

Use this command to load the 'hello-clog' application using QuickLisp. Ensure the project is in a directory searchable by QuickLisp.

```lisp
(ql:quickload :hello-clog)
```

--------------------------------

### Initialize CLOG REPL with Debugging

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Sets up a /repl path that opens a blank page, directing the CLOG user body to the REPL. Enables debug mode with console logging and initializes CLOG-web/GUI. Optionally initializes the CLOG debugger.

```lisp
(clog-repl :clog-gui-initialize T :clog-web-initialize T :use-clog-debugger NIL :boot-file "/debug.html" :port 8080)
```

--------------------------------

### CLOG App Setup and Event Handling

Source: https://github.com/rabbibotton/clog/blob/main/README.md

Defines a CLOG application package, sets up a handler for new windows, and configures an on-click event for a created div.

```lisp
(defpackage #:clog-user               ; Setup a package for our work to exist in
  (:use #:cl #:clog)                  ; Use the Common Lisp language and CLOG
  (:export start-tutorial))           ; Export as public the start-tutorial function

(in-package :clog-user)               ; Tell the "reader" we are in the clog-user package


;; Define our CLOG application
(defun on-new-window (body)           ; Define the function called on-new-window
  "On-new-window handler."

  (let ((hello-element                ; hello-element is a local variable that
                                      ; will be bound to our new CLOG-Element

      ;; 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 later see 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>"))) 

    (set-on-click hello-element      ; Now we set a function to handle clicks
          (lambda (obj)              ; In this case we use an anonymous function
            (setf (color hello-element) "green"))))))

;; To see all the events one can set and the many properties and styles that
;; exist, refer to the CLOG manual or the file clog-element.lisp


(defun start-tutorial ()   ; Define the function called start-tutorial
  "Start tutorial."

  ;; Initialize the CLOG system
  (initialize #'on-new-window)
  ;; Set the function on-new-window to execute
  ;; every time a browser connection to our app.
  ;; #' tells Common Lisp to pass the function
  ;; to intialize and not to execute it.


  ;; Open a browser to http://12.0.0.1:8080 - the default for CLOG apps
  (open-browser))
```

--------------------------------

### Install and Run CLOG Builder

Source: https://github.com/rabbibotton/clog/blob/main/LINUX.md

Loads and runs the CLOG Builder tool, a rich GUI IDE for Common Lisp development, using QuickLisp.

```bash
sbcl --eval '(ql:quickload :clog/tools)' --eval '(clog-tools:clog-builder)'
```

--------------------------------

### Initialize CLOG Web Layout and Create Navigation

Source: https://context7.com/rabbibotton/clog/llms.txt

Loads w3.css, sets maximum page width, and creates a top navigation bar with a brand and an about item. Requires `clog/tools`.

```lisp
(ql:quickload :clog/tools)
(use-package :clog-web)

(defun on-new-window (body)
  (clog-web-initialize body)   ; loads w3.css
  (set-maximum-page-width-in-pixels body 1200)

  ;; Top navigation bar
  (let* ((nav   (create-web-menu-bar body))
         (brand (create-web-menu-item nav :content "MyApp"))
         (about (create-web-menu-item nav :content "About"))) 
    (declare (ignore brand))
    (set-on-click about (lambda (obj) (declare (ignore obj))
                          (clog-web-alert body "About" "CLOG Web Demo" :time-out 3))))

  ;; Two-column layout
  (let* ((row  (create-web-auto-row body))
         (side (create-web-auto-column row))
         (main (create-web-auto-column row))) 

    ;; Sidebar
    (let ((sb (create-web-sidebar side))) 
      (create-web-sidebar-item sb :content "Home")
      (create-web-sidebar-item sb :content "Docs")
      (create-web-sidebar-item sb :content "Contact"))

    ;; Main content with card look
    (let ((content (create-web-content main :content "Welcome to the app!"))) 
      (add-card-look content)
      (set-margin content :all "10px")

      ;; 12-column grid for a form section
      (let* ((grid-row (create-web-row main))
             (col-left  (create-web-container grid-row :column-size 4))
             (col-right (create-web-container grid-row :column-size 8))) 
        (create-div col-left  :content "<b>Label</b>")
        (let ((inp (create-form-element col-right :text))) 
          (setf (place-holder inp) "Enter value..."))))))

(initialize 'on-new-window)
(open-browser)
```

--------------------------------

### Run CLOG Tutorial

Source: https://github.com/rabbibotton/clog/blob/main/README.md

Execute a specific CLOG tutorial from the Common Lisp REPL. This is useful for learning CLOG's features and API.

```lisp
(clog:run-tutorial 1)
```

--------------------------------

### Start CLOG Server and Register Handler

Source: https://context7.com/rabbibotton/clog/llms.txt

Initializes the CLOG server, sets up an on-new-window handler, and defines the static file root. This snippet also shows how to open the browser and register additional routes.

```lisp
(ql:quickload :clog)
(in-package :clog-user)

(defun on-new-window (body)
  "Called every time a browser connects."
  (setf (title (html-document body)) "My App")
  (create-div body :content "Hello, CLOG!"))

;; Start server on default port 8080, open browser automatically
(initialize #'on-new-window
            :port 8080
            :static-root (merge-pathnames "www/" (uiop:getcwd)))
(open-browser)
;; => browser opens http://127.0.0.1:8080/

;; Register an additional route
(set-on-new-window (lambda (body)
                     (create-div body :content "About page"))
                   :path "/about"
                   :boot-file "/boot.html")

;; Shut down when done
(shutdown)
```

--------------------------------

### Launch CLOG Builder with QLOT

Source: https://github.com/rabbibotton/clog/blob/main/QLOT.md

After setting up your QLOT environment, use this command to load the CLOG tools and launch the CLOG builder for your project.

```lisp
(ql:quickload :qtest/tools)
(clog-tools:clog-builder :project :qtest)
```

--------------------------------

### Initialize CLOG and Create a Div

Source: https://github.com/rabbibotton/clog/blob/main/README.md

Basic REPL commands to set the background color and create a div element in CLOG.

```lisp
(setf (background-color *body*) "beige")
```

```lisp
(create-div *body* :content "Hello World!")
```

--------------------------------

### Load CLOG Tools and Run CLOG Builder

Source: https://github.com/rabbibotton/clog/blob/main/README.md

Load the CLOG tools and then run the CLOG builder from the SBCL command line. This is a quick way to start the CLOG development environment.

```lisp
sbcl --eval "(ql:quickload :clog/tools)" --eval "(clog-tools:clog-builder)"
```

--------------------------------

### Run CLOG Tutorial in a General REPL

Source: https://github.com/rabbibotton/clog/blob/main/tutorial/README.md

After loading CLOG, you can run a tutorial using this command in any Common Lisp REPL.

```lisp
CL-USER> (clog:run-tutorial 1)
Hunchentoot server is started.
Listening on 0.0.0.0:8080.
HTTP listening on : 0.0.0.0:8080
HTML Root         : static-files/
Boot file default : /boot.html
```

--------------------------------

### INFO-TYPE

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Gets the type of the active info.

```APIDOC
## INFO-TYPE CLOG-WEBGL-ACTIVE-INFO

### Description
Active Info Type
```

--------------------------------

### Smallest CLOG App - REPL Initialization

Source: https://github.com/rabbibotton/clog/blob/main/README.md

Loads CLOG and initializes a simple CLOG application that displays 'Hello World' in the browser.

```lisp
(ql:quickload :clog)
(in-package :clog-user)
(initialize (lambda (body) (create-div body :content "Hello World")))
```

--------------------------------

### INFO-SIZE

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Gets the size of the active info.

```APIDOC
## INFO-SIZE CLOG-WEBGL-ACTIVE-INFO

### Description
Active Info Size
```

--------------------------------

### INFO-NAME

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Gets the name of the active info.

```APIDOC
## INFO-NAME CLOG-WEBGL-ACTIVE-INFO

### Description
Active Info Name
```

--------------------------------

### Load CLOG Tools with QuickLisp

Source: https://github.com/rabbibotton/clog/blob/main/doc/v4.md

Use this command to load the CLOG tools system with QuickLisp, enabling the CLOG builder.

```lisp
ql:quickload :clog/tools)(clog-tools:clog-builder)
```

--------------------------------

### ACCESS-KEY

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Gets the access key for a CLOG-ELEMENT.

```APIDOC
## ACCESS-KEY

### Description
Get the access key for `CLOG-ELEMENT`.

### Method
Generic Function

### Parameters
- **CLOG-ELEMENT** (*CLOG-ELEMENT*) - The CLOG element to get the access key from.
```

--------------------------------

### CONNECTION-BODY

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Get connection's clog-body.

```APIDOC
## CONNECTION-BODY

Get connection's clog-body.
```

--------------------------------

### Start CLOG Builder

Source: https://github.com/rabbibotton/clog/blob/main/ANDROID-TERMUX.md

Launches the CLOG Builder IDE from the Common Lisp REPL.

```lisp
(ql:quickload :clog/tools) (clog-tools:clog-builder)
```

--------------------------------

### Ready State

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Gets the ready state of the document.

```APIDOC
## READY-STATE CLOG-DOCUMENT

### Description
Get ready-state. Returns 'loading'|'interactive'|'complete'. The state would only change if the boot-page was still loading css, graphics, etc. Under normal circumstance there is no need in CLOG to check if the state is ready as on-new-window is only called once one can interact with page. See also [`SET-ON-READY-STATE-CHANGE`](#CLOG:SET-ON-READY-STATE-CHANGE%20GENERIC-FUNCTION "CLOG:SET-ON-READY-STATE-CHANGE GENERIC-FUNCTION")

### Method
Generic Function

### Endpoint
N/A (Lisp Function)

### Parameters
- **CLOG-DOCUMENT** (CLOG-DOCUMENT) - The CLOG document object.

### Returns
- 'loading' | 'interactive' | 'complete' (string)
```

--------------------------------

### Current Window

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Get the current selected clog-gui-window.

```APIDOC
## CURRENT-WINDOW

### Description
Get the current selected clog-gui-window

### Generic Function Signature
`CURRENT-WINDOW` (CLOG-OBJ)
```

--------------------------------

### STYLE

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Gets or sets the CSS style for a CLOG-ELEMENT.

```APIDOC
## STYLE

### Description
Get/Setf css style.

### Method
Generic Function

### Parameters
- **CLOG-ELEMENT** (*CLOG-ELEMENT*) - The CLOG element to modify.
- **STYLE-NAME** (*String*) - The name of the CSS style property.
- **:DEFAULT-ANSWER** (*String*) - The default value if the style is not found.
```

--------------------------------

### Create and Control HTML5 Video/Audio Elements

Source: https://context7.com/rabbibotton/clog/llms.txt

Use `create-video` or `create-audio` to embed media. Control playback, volume, and seek using provided functions. Event callbacks like `set-on-time-update` and `set-on-ended` allow for dynamic updates based on media status.

```lisp
(defun on-new-window (body)
  (let* ((vid  (create-video body
                             :source "https://www.w3schools.com/html/mov_bbb.mp4"))
         (play (create-button body :content "▶ Play"))
         (stop (create-button body :content "⏸ Pause"))
         (vol  (create-form-element body :range))
         (pos  (create-span body :content "0.00s"))) 

    ;; Controls
    (set-on-click play (lambda (obj) (declare (ignore obj)) (play-media vid)))
    (set-on-click stop (lambda (obj) (declare (ignore obj)) (pause-media vid)))

    ;; Volume slider
    (setf (minimum vol) "0"
          (maximum vol) "1"
          (attribute vol "step") "0.01"
          (value vol) "1")
    (set-on-input vol
      (lambda (obj) (declare (ignore obj)) 
        (setf (media-volume vid) (value vol))))

    ;; Time update
    (set-on-time-update vid
      (lambda (obj) (declare (ignore obj)) 
        (setf (text pos) (format nil "~,2Fs / ~,2Fs"
                                 (media-position vid)
                                 (media-duration vid)))))

    ;; End of playback
    (set-on-ended vid
      (lambda (obj) (declare (ignore obj)) 
        (setf (text pos) "Done")))))
```

--------------------------------

### Visibility State

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Gets the visibility state of the browser window.

```APIDOC
## VISIBILITY-STATE CLOG-DOCUMENT

### Description
Get visibility-state. Returns the string 'visible' if browser is in non-minimized state and is partially visible and 'hidden' if browser is minimized or no part of page is visible including an OS screen lock.

### Method
Generic Function

### Endpoint
N/A (Lisp Function)

### Parameters
- **CLOG-DOCUMENT** (CLOG-DOCUMENT) - The CLOG document object.

### Returns
- 'visible' | 'hidden' (string)
```

--------------------------------

### SET-ON-NEW-WINDOW

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Sets or changes the handler for new window events for a specific path, optionally specifying a boot file.

```APIDOC
## SET-ON-NEW-WINDOW

### Description
Set or change the `ON-NEW-WINDOW-HANDLER` for `PATH` using `BOOT-FILE`. Paths should always begin with a forward slash '/'. If `PATH` is set to :default any path without another route and there is no static file matching the requested path `ON-NEW-WINDOW-HANDLER` and `BOOT-FILE` will be used. If `BOOT-FILE` is nil path is removed.

### Parameters

*   **ON-NEW-WINDOW-HANDLER**: The handler function for new windows.
*   **&KEY (PATH "/")**: The path to associate the handler with.
*   **&KEY (BOOT-FILE "/boot.html")**: The boot file to use for the path.
```

--------------------------------

### CLOG-WEB:CLOG-WEB-META FUNCTION

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Returns a boot-function for use with CLOG:INITIALIZE to add meta and no-script body information for search engines with DESCRIPTION.

```APIDOC
## CLOG-WEB-META FUNCTION

### Description
Provides a boot-function that can be used with `CLOG:INITIALIZE` to inject meta tags and no-script body content into the HTML document. This is useful for search engine optimization and providing alternative content.

### Parameters
- **DESCRIPTION** (string) - The content for the meta tags and no-script body.

### Usage
(CLOG:INITIALIZE ... (CLOG-WEB-META "Your meta description here"))
```

--------------------------------

### Menu Bar Height

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Get the height of the menu bar.

```APIDOC
## MENU-BAR-HEIGHT

### Description
Get menu-bar height

### Generic Function Signature
`MENU-BAR-HEIGHT` (CLOG-OBJ)
```

--------------------------------

### Load CLOG with Quicklisp

Source: https://github.com/rabbibotton/clog/blob/main/demos/README.md

Use this command to load the CLOG library using Quicklisp. Ensure CLOG is installed in your Quicklisp dist.

```lisp
CL-USER> (ql:quickload :clog)
To load "clog":
  Load 1 ASDF system:
    clog
; Loading "clog"
...........................
(:CLOG)
```

--------------------------------

### VALIDATE-ON-SUBMIT

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Gets or sets the form's validate-on-submit property.

```APIDOC
## VALIDATE-ON-SUBMIT

### Description
Get or set the form's validate-on-submit property.

### Syntax
```lisp
(VALIDATE-ON-SUBMIT CLOG-FORM)
(SETF (VALIDATE-ON-SUBMIT CLOG-FORM) value)
```

### Parameters
- `CLOG-FORM`: The CLOG form object.
- `value`: The boolean value to set for validate-on-submit.
```

--------------------------------

### Load CLOG and Run Demo

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Load the CLOG package and execute a specific demo. This is a way to explore CLOG's capabilities.

```common-lisp
CL-USER> (ql:quickload :clog)
CL-USER> (clog:run-demo 1)
```

--------------------------------

### ENCODING

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Gets or sets the encoding type for a CLOG form.

```APIDOC
## ENCODING

### Description
Get or set the encoding type for a CLOG form. Possible values are: 'application/x-www-form-urlencoded', 'multipart/form-data', 'text/plain'.

### Syntax
```lisp
(ENCODING CLOG-FORM)
(SETF (ENCODING CLOG-FORM) encoding-type)
```

### Parameters
- `CLOG-FORM`: The CLOG form object.
- `encoding-type`: The encoding type string.
```

--------------------------------

### Set Custom On-New-Window Handler

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Replaces the default handler for new browser windows with a custom function that creates a 'Hello World!' div. Use this to change how new windows behave.

```lisp
(set-on-new-window (lambda (body) (create-div body :content "Hello World!")))
```

--------------------------------

### AUTOCOMPLETEP

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Gets or sets the autocomplete property for a CLOG form.

```APIDOC
## AUTOCOMPLETEP

### Description
Get or set the autocomplete property for a CLOG form.

### Syntax
```lisp
(AUTOCOMPLETEP CLOG-FORM)
(SETF (AUTOCOMPLETEP CLOG-FORM) value)
```

### Parameters
- `CLOG-FORM`: The CLOG form object.
- `value`: The boolean value to set for autocomplete.
```

--------------------------------

### BACKGROUND-COLOR

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Gets or sets the background-color property of a CLOG element.

```APIDOC
## BACKGROUND-COLOR

### Description
Get/Setf background-color.

### Method
Generic Function

### Parameters
#### Path Parameters
- **CLOG-ELEMENT** (object) - The CLOG element.
- **BACKGROUND-COLOR** (string) - The background color value.
```

--------------------------------

### BACKGROUND-ATTACHMENT

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Gets or sets the background-attachment property of a CLOG element.

```APIDOC
## BACKGROUND-ATTACHMENT

### Description
Get/Setf background-attachment.

### Method
Generic Function

### Parameters
#### Path Parameters
- **CLOG-ELEMENT** (object) - The CLOG element.
- **BACKGROUND-ATTACHMENT** (string) - The background attachment value (e.g., 'scroll', 'fixed', 'local').
```

--------------------------------

### Configure QLOT for Project Development

Source: https://github.com/rabbibotton/clog/blob/main/QLOT.md

This REPL sequence configures your QLOT environment for development. It adds your project directory to local quicklisp directories, allowing you to work on your project within its private QLOT world.

```lisp
(ql:quickload :qlot)
(setf qlot:*project-root* (uiop:getcwd))
(qlot:init (uiop:getcwd))
(pushnew (uiop:getcwd) ql:*local-project-directories* :test #'equalp)
```

--------------------------------

### OPACITY

Source: https://github.com/rabbibotton/clog/blob/main/doc/clog-manual.html

Gets or sets the opacity property of a CLOG element.

```APIDOC
## OPACITY

### Description
Get/Setf opacity.

### Method
Generic Function

### Parameters
#### Path Parameters
- **CLOG-ELEMENT** (object) - The CLOG element.
- **OPACITY** (number) - The opacity value to set (typically between 0 and 1).
```