live-reloading

[magomimmo]

Hello, thank so much for your hard work on this very appreciated project. One of the few things I miss, when compared with Hugo, is a live reloading of the resources in the browser when something changes in the src or in the resources/templates paths.

Do you have a smart idea on how I could eventually do this live-reloading (like figwheel for cljs or boot-realod with boot)?

Thanks!

[yogthos]

This would be possible in principle, but a bit tricky. For live reloading to work, you'd need some way to notify the browser when the file content changes. Right now the pages are static, so you'd have to wrap them with something that opens a WebSocket to the server and reloads the content.

Personally, I tend to just use a MarkDown aware editor like MacDown when I write posts, and then look over them on the blog just to make sure everything looks right as the last step.

[magomimmo]

Could be the following a couple of runnable options even if cryogen does not currently use CLJS?

1. instrument the project.clj with figwheel
2. port cryogen from leiningen to boot and add the boot-reload task

What I'm looking for is something competitive with Hugo but using CLJ/CLJS instead of Go Language. To me the current issue with live-reloading is not while writing content, it's while creating themes. Imagine cryogen with a bunch of very nice themes and live reloading feature....

[yogthos]

Reloading CSS live would be fairly easy using Figwheel. However, to reload individual tags on the page would be a bit with odds with the current design. Right now Cryogen uses static server side templates. Using ClojureScript for templating would require completely redesigning how that works unfortunately. So, the best you could do with the current approach is to reload the whole page when a change is detected.

[ieugen]

Hi,

I think this can be done with Live reload extension on Chrome and Firefox + a live reload compatible server. The extension connects to the local server and will monitor files. If the files change, the server will update the extension and refresh.

The live reload server can live inside clojure (easy setup, familiar) or outside - already available.

inside clojure: https://github.com/bhurlow/clj-livereload/blob/master/example/clj_livereload/test.clj
external tooling: https://github.com/guard/guard-livereload

I have not tried any approach. I will try to make the clojure integration and submit a patch. My clojure Fu is weak though and if I don't make it - you won't see a reply here :).

[ieugen]

So, I've tested out clj-livereload with the example in the docs and it works ok for static files.
I've added the clj-livereload to my project and it starts the server but sends different paths to livereload extension. Not sure how to fix this yet.

project.clj

            :dependencies [
                           ....
                           [cryogen-core "0.3.1"]
                           [clj-livereload "0.2.0"]] ; <<<<< This was added <<<<<< 

server clj

(ns cryogen.server
  (:require 
     ...
     [clj-livereload.server :as live-reload]
))

(defn init []
  (load-plugins)
  (compile-assets-timed)
  (let [ignored-files (-> (resolve-config) :ignored-files)]
    (start-watcher! "content" ignored-files compile-assets-timed)
    (start-watcher! "themes" ignored-files compile-assets-timed)
    ;; This was added:
    (println "Start Live Reload")
    (live-reload/start! {:paths ["content", "themes", "public"]
                         :debug? true}))
  )

I have installed this Firefox extension: https://github.com/twolfson/livereload-extensions via
https://addons.mozilla.org/en-US/firefox/addon/livereload-web-extension/

I get this when the server starts:

tart Live Reload
Starting LiveReload server
Watching directories...
2020-05-09 14:45:56.888:INFO:oejs.Server:main: jetty-9.2.21.v20170120
2020-05-09 14:45:57.099:INFO:oejs.ServerConnector:main: Started ServerConnector@8615860{HTTP/1.1}{0.0.0.0:3000}
2020-05-09 14:45:57.099:INFO:oejs.Server:main: Started @8099ms
Started server on port 3000
Received message: {:command hello, :protocols [http://livereload.com/protocols/official-6 http://livereload.com/protocols/official-7], :ver 2.2.2, :ext Firefox, :extver 20.3.0}
Received message: {:command info, :plugins {:less {:disable false, :version 1.0}}, :url http://localhost:3000/blog}
Received message: {:command hello, :protocols [http://livereload.com/protocols/connection-check-1]}
Received message: {:command hello, :protocols [http://livereload.com/protocols/official-6 http://livereload.com/protocols/official-7], :ver 2.2.2, :ext Firefox, :extver 20.3.0}
Received message: {:command info, :plugins {:less {:disable false, :version 1.0}}, :url http://localhost:3000/blog}

I connect to it and then when I change the title I get 404 Page not found.
Logs look like this:

Reloading: 2016-01-07-docs.md
Sending changes to 2 clients
compiling assets...
compiling sass
copying theme resources
	 themes/blue/css --> public/blog/css
	 themes/blue/js --> public/blog/js
	 themes/blue/html/404.html --> public/blog/404.html
copying resources
	 content/img --> public/blog/img
	 content/md/posts --> public/blog/posts
	 content/md/pages --> public/blog/pages
compiling pages
--> /blog/pages-output/about/
--> /blog/pages-output/another-page/
compiling posts
--> /blog/posts-output/2016-01-07-docs/
--> /blog/posts-output/2014-11-04-second-post/
--> /blog/posts-output/2014-03-10-first-post/
compiling tags
--> /blog/tags-output/cryogen/
--> /blog/tags-output/very fetch/
--> /blog/tags-output/not fetch/
compiling tags page
compiling index
compiling archives
generating authors views
compiling authors
--> /blog/authors-output/(Eugen Stan 4)/
generating site map
generating main rss
generating filtered rss
	--> /blog/cryogen.xml
"Elapsed time: 386.067682 msecs"
Received message: {:command hello, :protocols [http://livereload.com/protocols/official-6 http://livereload.com/protocols/official-7], :ver 2.2.2, :ext Firefox, :extver 20.3.0}
Received message: {:command info, :plugins {:less {:disable false, :version 1.0}}, :url http://localhost:3000/blog}

[ieugen]

I have it working. Aditionally from what I mentioned above, I had commented out the xxx-root-uri in config.edn configuration. I don't understant why they are needed

;;  :post-root-uri                "posts-output"
;;  :page-root-uri                "pages-output"
;;  :tag-root-uri                 "tags-output"
;;  :author-root-uri              "authors-output"

[lacarmen]

@ieugen glad to hear you got it working! The -root-uri params are explained here

The folder where the compiler will output compiled (blog posts|pages|tag pages).

[ieugen]

There are some issues with the current integration.
Quite often I get a Page not found error.

I believe they are caused by the amount of writes done by cryogen.
More specifically this whipe: https://github.com/cryogen-project/cryogen-core/blob/1b44acd0c3b467578975f454fe1be79317d90784/src/cryogen_core/compiler.clj#L589 .

I believe the wipe triggers a reload notification for LiveReload and the compilation is not fast enough to generate the page before LiveReload does the reload.

@lacarmen : Could we work without the wipe? Would plain file overwrite work?

Also, I do hope that incremental compilation will make things work better: cryogen-project/cryogen-core#149

[holyjak]

FYI https://github.com/metasoarous/toto has reportedly a very nice hot-blog reload

[holyjak]

Kind of available now soon: #242