Not yet doing anything useful, but ground has been cut.

.gitignore

@@ -1,3 +1,4 @@
+*-init.clj
 /resources/public/js/compiled/**
 figwheel_server.log
 pom.xml
@@ -6,9 +7,12 @@ pom.xml
 /classes/
 /out/
 /target/
+.clj-kondo/
 .lein-deps-sum
 .lein-repl-history
 .lein-plugins/
+.lsp/
+.rebel_readline_history
 .repl
 .nrepl-port
 

project.clj

@@ -6,7 +6,9 @@
 
   :min-lein-version "2.9.1"
 
-  :dependencies [[org.clojure/clojure "1.11.1"]
+  :dependencies [[cljsjs/snapsvg "0.4.1-0"]
+                 [hiccups "0.3.0"]
+                 [org.clojure/clojure "1.11.1"]
                  [org.clojure/clojurescript "1.11.60"]
                  [org.clojure/core.async  "1.6.673"]]
 

resources/public/css/style.css

@@ -1,2 +1,25 @@
 /* some style */
 
+body,
+.app {
+    padding: 0;
+    margin: 0;
+}
+
+.desktop {
+    background-color: gray;
+}
+
+.executive {
+    background-color: black;
+    color: green;
+}
+
+.titlebar {
+    background-color: cornflowerblue;
+}
+
+.window {
+    background-color: whitesmoke;
+    color: darkslategrey;
+}

resources/public/index.html

@@ -11,6 +11,7 @@
       <h2>Figwheel template</h2>
       <p>Checkout your developer console.</p>
     </div>
-    <script src="js/compiled/svd.js" type="text/javascript"></script>
+    <script src="js/compiled/svd.js" type="text/javascript">
+    </script>
   </body>
 </html>

src/svd/core.cljs

@@ -1,5 +1,7 @@
 (ns svd.core
-    (:require ))
+  (:require [hiccups.runtime :as hiccupsrt]
+            [svd.desktop :refer [render]])
+  (:require-macros [hiccups.core :refer [html]]))
 
 (enable-console-print!)
 
@@ -7,11 +9,19 @@
 
 ;; define your app data so that it doesn't get over-written on reload
 
-(defonce app-state (atom {:text "Hello world!"}))
+(defonce app-state (atom {:text "Hello world!"}
-
+                         :desktop (render)))
 
 (defn on-js-reload []
   ;; optionally touch your app-state to force rerendering depending on
   ;; your application
-  ;; (swap! app-state update-in [:__figwheel_counter] inc)
+  (swap! app-state update-in [:__figwheel_counter] inc)
-)
+  (-> js/document
+      (.getElementById "app")
+      (.-innerHTML)
+      (set! (html (render)))))
+
+(-> js/document
+    (.getElementById "app")
+    (.-innerHTML)
+    (set! (html (render))))

src/svd/desktop.cljs

@@ -0,0 +1,31 @@
+(ns svd.desktop
+  (:require [svd.window :refer [rect-window]]))
+
+(declare desktop)
+
+(defn ^:export render
+  "With no args, render the current state of the desktop."
+  ([]
+   (render (deref desktop)))
+  ([w]
+   (let [f (:render-fn w)]
+     (if f (apply (:render-fn w) (list w))
+         f))))
+
+(def desktop
+  (atom {:attributes {:id "desktop"
+                      :class "desktop"
+                      :viewBox (str "0 0 " 
+                                    (.-innerWidth js/window) 
+                                    " " 
+                                    (.-innerHeight js/window))}
+         :windows (list (rect-window :title "Window One")
+                        (rect-window :title "Window Two"))
+         :render-fn (fn [dt]
+                      (apply
+                       vector
+                       (concat (list :svg (:attributes dt))
+                               (map
+                                render
+                                (:windows dt)))))}))
+

src/svd/window.cljs

@@ -0,0 +1,34 @@
+(ns svd.window
+  (:require [devtools.defaults :as defaults]))
+
+(def defaults
+  {:title-height 20})
+
+(defn rect-window
+  [& {:keys [x y corner-radius width height render-fn title title-fn]
+      :or {x (rand (/ (.-innerWidth js/window) 2))
+           y (rand (/ (.-innerHeight js/window) 2))
+           width 100
+           height 100
+           corner-radius 10
+           title "Untitled Window"}}]
+  (let [id (gensym)
+        th (:title-height defaults)]
+    [:rect {:id (str "window" id)
+            :class "window"
+            :x x
+            :y y
+            :width width
+            :height (+ height th)
+            :rx corner-radius}
+     [:rect {:id (str "title" id)
+             :class "title"
+             :x 0 :y 0 :width width :height th}
+      title]
+     [:rect {:id (str "workspace" id)
+             :class "workspace"
+             :x 0
+             :y th
+             :width width
+             :height height}
+      "There's nothing here"]]))