Merge pull request #12 from n2o/release/1.4.0

Release v1.4.0

.github/workflows/clojure.yml

@@ -1,5 +1,4 @@
 name: Clojure CI
-
 on: [push]
 
 jobs:
@@ -9,7 +8,7 @@ jobs:
       - uses: actions/checkout@v1
       - uses: actions/setup-java@v1
         with:
-          java-version: '13'
+          java-version: '14'
       - name: Setup Clojure
         uses: DeLaGuardo/[email protected]
         with:
@@ -25,4 +24,31 @@ jobs:
         continue-on-error: true
         with:
           clj-kondo-args: --lint src
-          github_token: ${{ secrets.GITHUB_TOKEN }}
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+
+  deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout 🛎️
+        uses: actions/checkout@v2
+        with:
+          persist-credentials: false
+      - uses: actions/setup-java@v1
+        with:
+          java-version: '14'
+      - name: Setup Clojure
+        uses: DeLaGuardo/[email protected]
+        with:
+          tools-deps: '1.10.1.469'
+      - uses: actions/setup-node@v1
+        with:
+          node-version: '12'
+      - name: Build Project
+        run: |
+          make web
+      - name: Deploy 🚀
+        uses: JamesIves/github-pages-deploy-action@releases/v3
+        with:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          BRANCH: gh-pages # The branch the action should deploy to.
+          FOLDER: resources/public # The folder the action should deploy.

README.md

@@ -1,19 +1,25 @@
 # reveal-cljs
 
+![Clojure CI](https://github.com/n2o/reveal-cljs/workflows/Clojure%20CI/badge.svg)
 [![https://github.com/n2o/reveal-cljs/releases](https://img.shields.io/github/release/n2o/reveal-cljs.svg)](https://github.com/n2o/reveal-cljs/releases)
 [![https://github.com/n2o/reveal-cljs/blob/master/LICENSE](https://img.shields.io/github/license/n2o/reveal-cljs.svg)](https://github.com/n2o/reveal-cljs/blob/master/LICENSE)
 
 Inspired by the great work on [reveal.js](https://github.com/hakimel/reveal.js/)
 and the dislike towards JavaScript, this small project was created to provide a
-simple wrapper in ClojureScript to create awesome presentations.
+simple wrapper in ClojureScript to create awesome presentations. All features
+from reveal.js can be used. Check the
+[official documentation of reveal.js](https://revealjs.com/) for more
+information about it.
+
+🌅 Find a demo of reveal-cljs on this page: https://n2o.github.io/reveal-cljs/
 
 It uses Hiccup-syntax for templating, which makes it very easy to create slides.
 
 Start the project with `make repl` and see your live
 slides. Start *speaker-mode* by pressing <kbd>s</kbd> in the slides in your
 browser.
 
-![sample.png](img/sample.png)
+[![sample.png](img/sample.png)](https://n2o.github.io/reveal-cljs/)
 
 ## Requirements
 
@@ -75,6 +81,16 @@ is all put into one task:
 
 Follow the steps on the terminal to find your prepared presentation.  
 
+## Software
+
+This project uses external packages, which can be removed by you, since most
+of them are not essential:
+
+* [reveal.js](https://github.com/hakimel/reveal.js) ([MIT License](https://github.com/hakimel/reveal.js/blob/master/LICENSE))
+* [Bootstrap Grid](https://github.com/twbs/bootstrap) ([MIT License](https://github.com/twbs/bootstrap/blob/main/LICENSE))
+* [Font-Awesome](https://github.com/FortAwesome/Font-Awesome/tree/master/js-packages/%40fortawesome/fontawesome-free) ([License](https://github.com/FortAwesome/Font-Awesome/blob/master/js-packages/%40fortawesome/fontawesome-free/LICENSE.txt))
+* [Clojure](https://clojure.org/) ([EPL-1.0 License](https://opensource.org/licenses/eclipse-1.0.php))
+
 ## License
 
 Copyright © 2016 – 2020 Christian Meter and Contributors

deps.edn

@@ -1,12 +1,12 @@
 {:deps {org.clojure/clojure {:mvn/version "1.10.1"}
-        org.clojure/clojurescript {:mvn/version "1.10.520"}
-        com.bhauman/figwheel-main {:mvn/version "0.2.4"}
+        org.clojure/clojurescript {:mvn/version "1.10.773"}
+        com.bhauman/figwheel-main {:mvn/version "0.2.9"}
         com.bhauman/rebel-readline-cljs {:mvn/version "0.1.4"}
-        org.clojure/core.async {:mvn/version "1.1.587"}
+        org.clojure/core.async {:mvn/version "1.2.603"}
         hiccups {:mvn/version "0.3.0"}}
  :paths ["src" "target" "resources"]
  :aliases {:fig {:main-opts ["-m" "figwheel.main" "-b" "dev" "--repl"]}
            :fig/simple {:main-opts ["-m" "figwheel.main" "-O" "simple" "-bo" "dev"]}
            :fig/min {:main-opts ["-m" "figwheel.main" "-O" "advanced" "-bo" "dev"]}
-           :outdated {:extra-deps {olical/depot {:mvn/version "1.8.4"}}
+           :outdated {:extra-deps {olical/depot {:mvn/version "2.0.1"}}
                       :main-opts ["-m" "depot.outdated.main"]}}}

package.json

@@ -4,7 +4,9 @@
   "description": "A ClojureScript wrapper for reveal.js",
   "main": "reveal.core",
   "dependencies": {
-    "reveal.js": "hakimel/reveal.js#3.9.2"
+    "@fortawesome/fontawesome-free": "^5.13.0",
+    "bootstrap-4-grid": "^3.4.0",
+    "reveal.js": "hakimel/reveal.js#4.0.2"
   },
   "devDependencies": {},
   "repository": {
@@ -13,4 +15,4 @@
   },
   "author": "Christian Meter",
   "license": "MIT"
-}
+}

resources/public/css/main.css

@@ -0,0 +1,19 @@
+.statement {
+    color: #ffc107;
+}
+
+.issue {
+    color: #546e7a;
+}
+
+.pro {
+    color: #81c784;
+}
+
+.con {
+    color: #f44336;
+}
+
+.mr {
+    margin-right: 0.5em;
+}

resources/public/index.html

@@ -1,18 +1,30 @@
 <!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="stylesheet" href="node_modules/reveal.js/css/reveal.css">
-    <link rel="stylesheet" href="node_modules/reveal.js/css/theme/white.css">
-    <link rel="icon" href="img/favicon.ico">
-  </head>
-  <body>
-    <div class="reveal">
-      <div class="slides" id="slides"></div>
-    </div>
+<html lang="en">
+<head>
+  <title>reveal-cljs</title>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link href="node_modules/reveal.js/dist/reset.css" rel="stylesheet">
+  <link href="node_modules/reveal.js/dist/reveal.css" rel="stylesheet">
+  <link href="node_modules/reveal.js/dist/theme/black.css" rel="stylesheet">
 
-    <script src="node_modules/reveal.js/js/reveal.js" type="text/javascript"></script>
-    <script src="cljs-out/dev-main.js" type="text/javascript"></script>
-  </body>
+  <!-- Optional -->
+  <link rel="stylesheet" href="node_modules/bootstrap-4-grid/css/grid.min.css">
+  <script src="node_modules/@fortawesome/fontawesome-free/js/all.min.js"></script>
+
+  <link rel="stylesheet" href="css/main.css">
+
+  <link rel="icon" href="img/favicon.ico">
+</head>
+<body>
+<div class="reveal">
+  <div class="slides" id="slides"></div>
+</div>
+
+<script src="node_modules/reveal.js/dist/reveal.js" type="text/javascript"></script>
+<script src="node_modules/reveal.js/plugin/highlight/highlight.js" type="text/javascript"></script>
+<link href="node_modules/reveal.js/plugin/highlight/zenburn.css" rel="stylesheet">
+<script src="node_modules/reveal.js/plugin/notes/notes.js" type="text/javascript"></script>
+<script src="cljs-out/dev-main.js" type="text/javascript"></script>
+</body>
 </html>

src/reveal/core.cljs

@@ -7,12 +7,13 @@
 
 
 ;; When changing comments, you manually need to refresh your browser
-(def options (clj->js {:controls    true
-                       :progress    true
-                       :transition  "fade"                    ; e.g. none/fade/slide/convex/concave/zoom
-                       :slideNumber false
-                       :dependencies [{:src "node_modules/reveal.js/plugin/notes/notes.js"
-                                       :async true}]}))
+(def options (clj->js {:hash true
+                       :controls true
+                       :controlsTutorial true
+                       :progress false
+                       :transition "fade"                   ; e.g. none/fade/slide/convex/concave/zoom
+                       :slideNumber "c"
+                       :plugins [js/RevealNotes]}))
 
 
 ;; -----------------------------------------------------------------------------

src/reveal/slides.cljs

@@ -7,6 +7,54 @@
    [:p "Based on "
     [:a {:href "http://lab.hakim.se/reveal-js/"} "reveal.js"]]])
 
+(def ^:private argument
+  [:div.argument
+   [:i.mr.statement.fas.fa-circle {:data-id "premise"}]
+   [:i.mr.pro.fas.fa-long-arrow-alt-right {:data-id "relation"}]
+   [:i.statement.fas.fa-circle {:data-id "conclusion"}]])
+
+(def slide-auto-animate
+  [:section
+   [:section {:data-auto-animate "data-auto-animate"}
+    [:h2 "Auto Animate"]
+    [:p "Automatically animate CSS / SVGs on a slide"
+     [:small "Press " [:code "space"] " for next animation step"]]
+    (last argument)]
+   [:section {:data-auto-animate "data-auto-animate"}
+    argument]
+   [:section {:data-auto-animate "data-auto-animate"}
+    [:i.statement.fas.fa-circle {:data-id "conclusion"}]
+    [:div.row
+     [:div.offset-4.col-2
+      [:i.relation.pro.fas.fa-long-arrow-alt-right {:data-id "relation" :data-fa-transform "rotate--40"}]]
+     [:div.col-2
+      [:i.relation.con.fas.fa-long-arrow-alt-left {:data-id "relation-con" :data-fa-transform "rotate-40"}]]]
+    [:div.row
+     [:div.offset-3.col-2
+      [:i.statement.fas.fa-circle {:data-id "premise"}]]
+     [:div.offset-2.col-2
+      [:i.statement.fas.fa-circle {:data-id "premise-con"}]]]]
+   [:section {:data-auto-animate "data-auto-animate"}
+    [:div.row
+     [:div.col-12
+      [:i.issue.fas.fa-circle {:data-id "issue"}]]]
+    [:div.row
+     [:div.col-12
+      [:i.relation.issue.fas.fa-long-arrow-alt-up {:data-id "relation-position"}]]]
+    [:div.row
+     [:div.col-12
+      [:i.statement.fas.fa-circle {:data-id "conclusion"}]]]
+    [:div.row
+     [:div.offset-4.col-2
+      [:i.relation.pro.fas.fa-long-arrow-alt-right {:data-id "relation" :data-fa-transform "rotate--40"}]]
+     [:div.col-2
+      [:i.relation.con.fas.fa-long-arrow-alt-left {:data-id "relation-con" :data-fa-transform "rotate-40"}]]]
+    [:div.row
+     [:div.offset-3.col-2
+      [:i.statement.fas.fa-circle {:data-id "premise"}]]
+     [:div.offset-2.col-2
+      [:i.statement.fas.fa-circle {:data-id "premise-con"}]]]]])
+
 (def slide-2
   [:section
    [:section
@@ -16,10 +64,11 @@
    [:section
     [:h2 "Tutorial"]
     [:p "Watch the full tutorial of reveal.js "
-     [:a {:href "https://github.com/hakimel/reveal.js/blob/master/demo.html"} "on this site"]]]])
+     [:a {:href "https://revealjs.com"} "on revealjs.com"]]]])
 
 (defn all
   "Add here all slides you want to see in your presentation."
   []
   [slide-1
-   slide-2])
+   slide-auto-animate
+   slide-2])

yarn.lock

@@ -2,6 +2,16 @@
 # yarn lockfile v1
 
 
-reveal.js@hakimel/reveal.js#3.9.2:
-  version "3.9.2"
-  resolved "https://codeload.github.com/hakimel/reveal.js/tar.gz/94d98ff7d89e35c7d5b289ba387cdb0d42b30793"
+"@fortawesome/fontawesome-free@^5.13.0":
+  version "5.13.1"
+  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-free/-/fontawesome-free-5.13.1.tgz#c53b4066edae16cd1fd669f687baf031b45fb9d6"
+  integrity sha512-D819f34FLHeBN/4xvw0HR0u7U2G7RqjPSggXqf7LktsxWQ48VAfGwvMrhcVuaZV2fF069c/619RdgCCms0DHhw==
+
+bootstrap-4-grid@^3.4.0:
+  version "3.4.0"
+  resolved "https://registry.yarnpkg.com/bootstrap-4-grid/-/bootstrap-4-grid-3.4.0.tgz#62769a992484b9338a0e7219842c90aa70e62f54"
+  integrity sha512-0bemukOEqWgO3Fd1SPFd2yUTEuqLBsPOfX7haNTw4iAbZAqW8doSbqu7VBo1sKBP73mAJMLquIgGCRVBPTDZ8A==
+
+reveal.js@hakimel/reveal.js#4.0.2:
+  version "4.0.2"
+  resolved "https://codeload.github.com/hakimel/reveal.js/tar.gz/bd19860b4d6e85ff98067546faa4ffd87527a0ba"