diff --git a/deps.edn b/deps.edn
index dc34219..0a6ef88 100644
--- a/deps.edn
+++ b/deps.edn
@@ -1,8 +1,11 @@
{:deps {org.clojure/clojure {:mvn/version "1.10.0"}
org.clojure/clojurescript {:mvn/version "1.11.60"}
org.clojure/core.async {:mvn/version "1.6.673"}
+ org.clojure/data.xml {:mvn/version "0.2.0-alpha8"}
funcool/promesa {:mvn/version "9.0.494"}
+ ;; simpler date time
+ tick/tick {:mvn/version "0.6.2"}
;;ajax requests
cljs-ajax/cljs-ajax {:mvn/version "0.8.1"}
@@ -25,7 +28,7 @@
org.babashka/sci {:mvn/version "0.7.39"}
org.babashka/sci.configs {:git/url "https://github.com/babashka/sci.configs"
:sha "33bd51e53700b224b4cb5bda59eb21b62f962745"}
- datascript/datascript {:mvn/version "1.4.2"}
+ datascript/datascript {:mvn/version "1.5.1"}
com.bhauman/figwheel-main {:mvn/version "0.2.18"}}
diff --git a/package.json b/package.json
index cdd2fe7..37e1ff5 100644
--- a/package.json
+++ b/package.json
@@ -7,6 +7,9 @@
"@codemirror/state": "^6.2.0",
"@codemirror/theme-one-dark": "^6.1.2",
"@codemirror/view": "^6.10.1",
+ "@js-joda/core": "3.2.0",
+ "@js-joda/locale_en-us": "3.1.1",
+ "@js-joda/timezone": "2.5.0",
"@nextjournal/lang-clojure": "^1.0.0",
"axe-core": "4.7.0",
"react": "^18.2.0",
diff --git a/readme.org b/readme.org
index db78047..05c30ab 100644
--- a/readme.org
+++ b/readme.org
@@ -1,3 +1,9 @@
+
+Future Content
+
+ - Dynamic html with macro for frontend generation on build.
+ - Complete frontend backend example wth ring retit reagent
+
clj -m figwheel.main --build dev --repl
https://www.clojuriststogether.org/news/call-for-new-proposals.-june-survey-results./
diff --git a/resources/public/documents/examples-maps.org b/resources/public/documents/examples-maps.org
index d4fec31..b1d5a5b 100644
--- a/resources/public/documents/examples-maps.org
+++ b/resources/public/documents/examples-maps.org
@@ -3,13 +3,21 @@
* Introduction
+Below you will find some simple examples of using map api's inside clojure, you can use the inline eval for some of the example where sci supports a specific library.
Install npm dependencies
+
+** Setup for downloaded version
+Install the npm dependencies for react then launch shadow via the terminal or jack in via your IDE.
+#+BEGIN_SRC html :results silent :exports none :tangle readme.org
+Install dependencies with.
npm install
-Run the project
+Run the project with the below command
npx shadow-cljs server app
+Alternatively jack into the project from your ide.
+
* Google Maps
@@ -86,6 +94,8 @@ You will need to provide your own api key, the examples are blank and render a w
** Load in the google maps script by adding it to the dom
+Code pulled from google
+
#+BEGIN_SRC clojurescript :results output :tangle src/clojure_demo/core.cljs
(defn load-google-maps-script [api-key]
(let [script (.createElement js/document "script")]
diff --git a/resources/public/documents/examples-xml-sitemap.org b/resources/public/documents/examples-xml-sitemap.org
new file mode 100644
index 0000000..92ff243
--- /dev/null
+++ b/resources/public/documents/examples-xml-sitemap.org
@@ -0,0 +1,182 @@
+#+TITLE: Generating xml to produce a sitemap
+
+* Introduction
+In this example we generate a sitemap the example uses reader conditionals so the code works in clojure and clojurescript it also has a simple macro to output the file if used in the frontend.
+
+#+BEGIN_SRC html :results silent :exports none :tangle readme.org
+Install dependencies with.
+npm install
+
+Run the project with the below command
+npx shadow-cljs server app
+
+Alternatively jack into the project from your ide.
+#+END_SRC
+
+#+BEGIN_SRC edn :results silent :exports none :tangle deps.edn
+{:paths ["src" "resources"]
+ :deps
+ {org.clojure/clojure {:mvn/version "1.10.0"}
+ org.clojure/clojurescript {:mvn/version "1.11.60"}
+ org.clojure/data.xml {:mvn/version "0.2.0-alpha8"}
+
+ tick/tick {:mvn/version "0.6.2"}
+ reagent/reagent {:mvn/version "1.2.0"}
+ thheller/shadow-cljs {:mvn/version "2.24.0"}}}
+#+END_SRC
+
+#+BEGIN_SRC edn :results silent :exports none :tangle shadow-cljs.edn
+{:deps {:aliases [:dev]}
+ :dev-http {8080 ["resources/public/" "classpath:public"]}
+ :source ["src" "../../components"]
+ :builds {:app {:output-dir "resources/public/cljs-out/"
+ :asset-path "/cljs-out"
+ :target :browser
+ :compiler-options {:infer-externs :auto
+ :externs ["datascript/externs.js"]
+ :output-feature-set :es6}
+ :modules {:main_bundle {:init-fn clojure-demo.core/startup!}}
+ :devtools {:after-load app.main/reload!}}}}
+#+END_SRC
+
+#+BEGIN_SRC json :results silent :exports none :tangle package.json
+{
+ "dependencies": {
+ "react": "^18.2.0",
+ "react-dom": "^18.2.0"
+ },
+ "devDependencies": {
+ "shadow-cljs": "^2.23.3",
+ "webpack": "^5.74.0",
+ "webpack-cli": "^4.10.0"
+ }
+}
+#+END_SRC
+
+#+BEGIN_SRC html :results silent :exports none :tangle resources/public/index.html
+
+
+
+
+ Clojure demos
+
+
+
+
+ App loading here
+
+
+
+
+#+END_SRC
+
+** Clojure(script) sitemap generation function
+This will work in clojure and clojurescript, the code is slightly different to account for missing feature in the clojurescript version.
+
+We can use a macro to generate a sitemap from a client side app on startup, or just use it directly if generating on a server.
+#+BEGIN_SRC clojure :exports none :tangle src/clojure_demo/sitemap.cljc
+(ns clojure-demo.sitemap
+ (:require
+ [clojure.data.xml :as xml]
+ [tick.core :as tick]))
+
+#+END_SRC
+
+#+BEGIN_SRC clojure :results value :tangle src/clojure_demo/sitemap.cljc
+;;#?(:clj (xml/alias-uri 'sitem "http://www.sitemaps.org/schemas/sitemap/0.9"))
+
+(defn pwa-sitemap [domain routes]
+ #?(:cljs (xml/emit-str
+ {:tag :urlset
+ :attrs {#_#_:xmlns "http://www.sitemaps.org/schemas/sitemap/0.9"}
+ :content
+ (mapv (fn [r]
+ {:tag :url
+ :attrs {}
+ :content [{:tag :loc :attrs {} :content [(str domain r)]}
+ {:tag :lastmod :attrs {} :content [(tick/format :iso-zoned-date-time (tick/zoned-date-time))]}]}
+ ) routes)})
+ :clj (xml/indent-str
+ {:tag :urlset
+ :attrs {:xmlns "http://www.sitemaps.org/schemas/sitemap/0.9"}
+ :content
+ (mapv (fn [r]
+ {:tag :url
+ :attrs {}
+ :content [{:tag :loc :attrs {} :content [(str domain r)]}
+ {:tag :lastmod :attrs {} :content [(tick/format :iso-zoned-date-time (tick/zoned-date-time))]}]}
+ ) routes)})))
+
+(defmacro spit-pwa-sitemap
+ "Generate the sitemap and outut to the provided path"
+ {:arglists '([body] [options & body]), :style/indent 0}
+ [path domain urls]
+ #?(:clj (spit path (pwa-sitemap domain urls))
+ :cljs nil))
+
+
+(comment
+ (pwa-sitemap "https://example.com/" ["/one" "/two"])
+ (spit-pwa-sitemap "sitemap.xml" "https://example.com/" ["/one" "/two"]))
+
+#+END_SRC
+
+** Clojurescript usage
+This is an example of creating the sitemap inside a frontend application, it call the macro which is evaluated at build and outputs the sitemap.xml
+
+When working with data.xml it is very important to set the xml namespace to avoid an alias being appended to your xml, the namespace should be set in the root xml element and via =alias-uri= then make sure all element tag value are called via the namespace.
+
+Also note namespacing is not supported in clojurescript so alias-uri is not available
+Look into why :xmlns breaks sci rendering
+Adding the k
+#+BEGIN_SRC clojurescript :exports none :tangle src/clojure_demo/core.cljs
+(ns clojure-demo.core
+ (:require
+ [clojure.data.xml :as xml]
+ ["react-dom/client" :refer [createRoot]]
+ [reagent.core :as reagent]
+ [clojure-demo.sitemap :refer [pwa-sitemap]])
+ (:require-macros [clojure-demo.sitemap :refer [spit-pwa-sitemap]]))
+#+END_SRC
+
+Because our routes are just data we could add a =:sitemap= key for the handler maps and filter the routes based on the key or even run custom functions to build up the sitemap dynamically when the contest is generated from a database.
+
+You can reuse the code in the cljc file the sitemap function is replicated here as sci does not work with the reader conditionals in the code.
+#+BEGIN_SRC clojurescript :results value :tangle src/clojure_demo/core.cljs
+;;Should be set in clojure but it is not supported in clojurescript currently
+;;(xml/alias-uri 'sitemap "http://www.sitemaps.org/schemas/sitemap/0.9")
+(def routes
+ [["/"
+ {:name ::frontpage
+ :view prn}]
+
+ ["/about"
+ {:name ::about
+ :view prn}]
+
+ ["/item/:id"
+ {:name ::item
+ :view prn
+ :parameters {:path {:id int?}}}]])
+
+;; map first over the routes so we only get strings
+(->> routes
+ (mapv first)
+ (pwa-sitemap "https://example.com" ))
+#+END_SRC
+
+#+BEGIN_SRC clojure :exports none :tangle src/clojure_demo/core.cljs
+(defn current-page []
+ [:pre (str (pwa-sitemap "https://example.com" ["/one" "/two"]))])
+
+(defn mount-root-page []
+ ;; this select the main node from the html file and injects your page content
+ (.render
+ (createRoot (.getElementById js/document "app"))
+ (reagent/as-element [current-page])))
+
+;; call our macro to generate the sitemap file
+(spit-pwa-sitemap "sitemap.xml" "https://example.com" ["/one" "/two"])
+
+(def startup! (mount-root-page))
+#+END_SRC
diff --git a/src/clojure_demo/core.cljs b/src/clojure_demo/core.cljs
index 1f9003d..8968155 100644
--- a/src/clojure_demo/core.cljs
+++ b/src/clojure_demo/core.cljs
@@ -8,6 +8,7 @@
["@nextjournal/lang-clojure" :refer [clojure]]
["react-dom/client" :refer [createRoot]]
["tarts" :as tarts]
+ [tick.core :as t]
[cljs.core.async :as async]
[cljs.core.async.interop :as async-in]
[shadow.cljs.modern :refer [js-await]]
@@ -16,6 +17,7 @@
[cl-eorg.parser :as o :refer [parse]]
[cl-eorg.themes.tachyon :refer [tachyon-theme]]
[clojure.string :as str]
+ [clojure.data.xml :as xml]
[honey.sql :as sql]
[honey.sql.helpers :as sqlh]
[reagent.core :as reagent]
@@ -62,6 +64,8 @@
(def sql-ns (sci/create-ns 'honey.sql.core nil))
(def sqlh-ns (sci/create-ns 'honey.sql.helpers nil))
(def shadow-ns (sci/create-ns 'shadow.cljs.modern nil))
+(def xml-ns (sci/create-ns 'clojure.data.xml nil))
+(def tick-ns (sci/create-ns 'tick.core nil))
;; core async does not work with sci
(def async-ns (sci/create-ns 'cljs.core.async nil))
@@ -70,6 +74,7 @@
(def sci-ctx
(sci/init
{:classes {'js js/globalThis :allow :all}
+ :features #{:cljs}
:namespaces
{'reagent sci-reagent/reagent-namespace
'promesa sci-promesa/promesa-namespace
@@ -79,6 +84,13 @@
'shadow {'js-await (sci/copy-var my-js-await shadow-ns)}
;'async-in {'] children)
))})))
(defn code-editor
- [{:keys [export class results]} content]
+ [{:keys [exports class results]} content]
(let [language class
editor (atom nil)
evaled-result (reagent/atom nil)
@@ -177,7 +189,7 @@
:parent @editor})))))
:component-will-unmount (fn [_] (.destroy @view))
:reagent-render (fn []
- (if export
+ (if (= exports "none")
nil
[:div.mb-8
[:div.ba.ma-0.f5.b--black-05.pa2.overflow-auto.editor {:ref #(reset! editor %)}]
@@ -297,9 +309,13 @@
:intro "Some example applications"
:key ::examples
:demos [{:title "Maps"
- :description ""
- :page "example-maps"
- :icon-image "https://avatars.githubusercontent.com/u/2181346?s=200&v=4"}]}
+ :description "Some quick examples using frontend map api's like google maps."
+ :page "example-maps"
+ :icon-image "https://avatars.githubusercontent.com/u/2181346?s=200&v=4"}
+ {:title "XML sitemap"
+ :description "Using data.xml to generate a sitemap"
+ :page "example-xml-sitemap"
+ :icon-image "https://avatars.githubusercontent.com/u/2181346?s=200&v=4"}]}
:terminology {:title "Terminology"
:intro ""
:key ::terminology}
@@ -318,7 +334,9 @@
:ci-demo
{:file "documents/ci-demo.org" :git-link "https://github.com/atomjuice/dsl-demo"}
:example-maps
- {:file "documents/examples-maps.org" :git-link "https://github.com/atomjuice/dsl-demo"}
+ {:file "documents/examples-maps.org" :git-link ""}
+ :example-xml-sitemap
+ {:file "documents/examples-xml-sitemap.org" :git-link "https://github.com/atomjuice/dsl-demo"}
:containers
{:file "documents/containers.org" :git-link "https://github.com/atomjuice/containers"}}})