fullscreen button (#66)

Author: larsen

README.md

@@ -33,7 +33,7 @@ Add `rando-planner` as a dependency in your project. For example:
 
 ```
 {:paths ["src"]
- :deps {org.clojure/clojure {:mvn/version "1.10.3"}
+ :deps {org.clojure/clojure {:mvn/version "1.12.0"}
         rando-planner/rando-planner {:git/url "https://github.com/larsen/rando-planner.git"
                                      :git/tag "tagname"
                                      :git/sha "xxxxxxxx"}}}
@@ -57,27 +57,29 @@ provided by rando-planner.
 ### Defining a plan
 
 ```clojure
-(def plan-start-19
-  {:description "Starting on April 19th"
-   :gpx "gpx/route.gpx"
-   :average-speed 20
-   :daily-plans [{:label "Day 1"
-                  :date "2024-04-19"
-                  :activities [{:start "15:00" :length 6 :type :ride}]}
-                 {:label "Day 2"
-                  :date "2024-04-20"
-                  :activities [{:start "07:00" :length 5 :type :ride}
-                               {:start "17:00" :length 3 :type :ride}]}
-                 {:label "Day 3"
-                  :date "2024-04-21"
-                  :activities [{:start "08:00" :length 6 :type :ride}]}]})
-```
+(def example-plan
+  {:gpx "gpx/be-rostock.gpx"
+   :daily-plans [{:date "2024-04-01"
+                  :label "First day"
+                  :average-speed 20
+                  :color "red"
+                  :activities [{:start "10:00" :type :ride :length 3}
+                               {:start "17:00" :type :ride :length 2}
+                               {:start "20:00" :type :ride :length 3}]}
+                 {:date "2024-04-02"
+                  :label "Second day"
+                  :average-speed 18
+                  :activities [{:start "10:00" :type :ride :length 4}
+                               {:start "16:00" :type :ride :length 2.5}]}]})
+ ```
 
 ### Usage examples
 
 The screenshots below were automatically generated using
-`plan-start-19`, as defined above.
+`example-plan`, as defined above.
 
 ![Example: plan diagram](rando-planner-example.png)
 
 ![Example: route with markers on a map](rando-planner-example-gpx.png)
+
+![Example: elevation diagram](rando-planner-example-elevation.png)

rando-planner-example-elevation.png

@@ -10,7 +10,8 @@
                 (fn [include-fn]
                   (fn [state]
                     (concat (include-fn state)
-                            (list (hiccup.page/include-css "https://unpkg.com/[email protected]/dist/leaflet.css"))))))
+                            (list (hiccup.page/include-css "https://unpkg.com/[email protected]/dist/leaflet.css")
+                                  (hiccup.page/include-css "https://unpkg.com/[email protected]/Control.FullScreen.css"))))))
 
 (defn points->path
   "Turn a sequence of points into an SVG path string."

rando-planner-example-gpx.png

@@ -73,7 +73,8 @@
    :render-fn '(fn [value]
                  (when value
                    [nextjournal.clerk.render/with-d3-require
-                    {:package ["[email protected]/dist/leaflet.min.js"]}
+                    {:package ["[email protected]/dist/leaflet.min.js"
+                               "[email protected]/Control.FullScreen.min.js"]}
                     (fn [leaflet]
                       (let [map-div-id (str (gensym))
                             m (atom nil)
@@ -95,7 +96,7 @@
                                                                              :iconAnchor [16, 45]}))
                                               tile-layer (.tileLayer js/L "https://tile.openstreetmap.org/{z}/{x}/{y}.png"
                                                                      (clj->js {:attribution attribution}))]
-                                          (reset! m (.map js/L map-div-id))
+                                          (reset! m (.map js/L map-div-id (clj->js {:fullscreenControl true}) ))
                                           (if (:bounds value)
                                             (.fitBounds @m (clj->js (:bounds value)))
                                             (.setView @m (clj->js (:center value)) (:zoom value)))