Merge pull request #1148 from explorable-viz/website-update

More website deployment infrastructure

.github/workflows/build.yml

@@ -23,6 +23,4 @@ jobs:
         yarn install
         set -x -e
         yarn purs-tidy check src/**/*.purs test/**/*.purs
-        yarn build
-        yarn bundle-standalone-all
-        yarn test-all
+        yarn build-test

.github/workflows/deploy.yml

@@ -47,7 +47,7 @@ jobs:
       uses: peaceiris/actions-gh-pages@v3
       with:
         github_token: ${{ secrets.GITHUB_TOKEN }}
-        publish_dir: dist/
+        publish_dir: dist/website
         keep_files: true # student-projects and internships folders may exist in "release"
 
   deploy-ESOP-artifact:
@@ -64,5 +64,5 @@ jobs:
       uses: peaceiris/actions-gh-pages@v3
       with:
         github_token: ${{ secrets.GITHUB_TOKEN }}
-        publish_dir: dist/
+        publish_dir: dist/ESOP-artifact
         keep_files: false

package.json

@@ -21,12 +21,13 @@
   "scripts": {
     "tidy": "./script/tidy.sh",
     "build": "./script/build.sh",
+    "build-test": "./script/build-test.sh",
     "bundle-article": "./script/bundle-article.sh",
-    "bundle-bench": "./script/bundle.sh bench Test.Benchmark",
+    "bundle-bench": "./script/bundle-bench.sh",
     "bundle-ESOP-artifact": "./script/bundle-ESOP-artifact.sh",
     "bundle-standalone-all": "./script/bundle-standalone-all.sh",
     "bundle-standalone": "./script/bundle-standalone.sh",
-    "serve-website": "./script/serve.sh /",
+    "serve-website": "./script/serve.sh website",
     "serve-bench": "./script/serve.sh bench",
     "test": "./script/test.sh",
     "test-browser": "./script/test.sh --browsers=Chrome --singleRun=false",

puppeteer.js

@@ -4,7 +4,7 @@ require('http-shutdown').extend();
 
 const app = express();
 
-app.use(serve(__dirname + '/dist'));
+app.use(serve(__dirname + '/dist/' + process.argv[3]));
 
 const server = app.listen(8080, function() {
   console.log("Server running");

script/build-test.sh

@@ -0,0 +1,6 @@
+#!/usr/bin/env bash
+set -xe
+
+yarn build
+yarn bundle-standalone-all
+yarn test-all

script/build.sh

@@ -1,8 +1,13 @@
 #!/usr/bin/env bash
 set -xe
 
+WEBSITE=website
+
+rm -rf dist/
 ./script/compile.sh
 ./script/bundle-website.sh
 ./script/bundle.sh test Test.Test
+./script/util/copy-static.sh $WEBSITE
+cp -r web/pdf dist/$WEBSITE
 
 # Don't include standalone examples yet as they take a long time

script/bundle-ESOP-artifact.sh

@@ -2,11 +2,13 @@
 # run from project root
 set -xe
 
-mkdir -p dist
-cp -r fluid dist
-cp -r web/css dist
+WEBSITE=ESOP-artifact
 
-./script/bundle-standalone.sh EsopFig2
-./script/bundle-standalone.sh EsopFig4
+mkdir -p dist/$WEBSITE
+cp -r fluid dist/$WEBSITE
+cp -r web/css dist/$WEBSITE
 
-cp -r web/ESOP-artifact.html dist/index.html
+./script/bundle-standalone.sh EsopFig2 $WEBSITE
+./script/bundle-standalone.sh EsopFig4 $WEBSITE
+
+cp -r web/ESOP-artifact.html dist/$WEBSITE/index.html

script/bundle-article.sh

@@ -2,11 +2,9 @@
 # run from project root
 set -xe
 
-rm -rf dist/article
-mkdir -p dist/article
+WEBSITE=article
 
-cp -r fluid dist/article
-cp -r web/css dist/article
-cp web/template.html dist/article/index.html
-
-./script/util/bundle.sh article Standalone.Article
+. script/clean.sh $WEBSITE
+./script/util/copy-static.sh $WEBSITE
+cp web/template.html dist/$WEBSITE/index.html
+./script/util/bundle.sh $WEBSITE Standalone.Article

script/bundle-bench.sh

@@ -0,0 +1,10 @@
+#!/usr/bin/env bash
+# run from project root
+set -xe
+
+WEBSITE=bench
+
+. script/clean.sh $WEBSITE
+./script/bundle.sh $WEBSITE Test.Benchmark
+cp web/bench.html dist/$WEBSITE/index.html
+./script/util/copy-static.sh $WEBSITE

script/bundle-standalone-all.sh

@@ -3,7 +3,9 @@
 # set -x
 set -e
 
+WEBSITE=website
+
 for FILE in src/Standalone/*.purs; do
    NAME=$(basename $FILE .purs)
-   . script/bundle-standalone.sh $NAME
+   . script/bundle-standalone.sh $NAME $WEBSITE
    done

script/bundle-standalone.sh

@@ -4,25 +4,23 @@
 set -e
 
 NAME=$1
+WEBSITE=$2
 
 if [[ ! -e "src/Standalone/$NAME.purs" ]]; then
   echo "Error: '$NAME.purs' not found."
   exit 1
 fi
 
-cp -r fluid dist
-cp -r web/css dist
-
 NAME_LISP_CASE=$(echo $NAME | sed 's/\([A-Z]\)/-\1/g' | tr 'A-Z' 'a-z' | sed 's/^-//')
 echo "$1 -> $NAME_LISP_CASE"
 
-rm -rf dist/$NAME_LISP_CASE
-mkdir -p dist/$NAME_LISP_CASE
+rm -rf dist/$WEBSITE/$NAME_LISP_CASE
+mkdir -p dist/$WEBSITE/$NAME_LISP_CASE
 
-./script/util/bundle.sh $NAME_LISP_CASE Standalone.$NAME
+./script/util/bundle.sh $WEBSITE/$NAME_LISP_CASE Standalone.$NAME
 
 if [[ -e "src/Standalone/$NAME.html" ]]; then
-  cp src/Standalone/$NAME.html dist/$NAME_LISP_CASE/index.html
+  cp src/Standalone/$NAME.html dist/$WEBSITE/$NAME_LISP_CASE/index.html
 else
-  cp web/template.html dist/$NAME_LISP_CASE/index.html
+  cp web/template.html dist/$WEBSITE/$NAME_LISP_CASE/index.html
 fi

script/bundle-website.sh

@@ -1,9 +1,12 @@
 #!/usr/bin/env bash
 set -xe
 
-./script/bundle.sh / Standalone.Website
+WEBSITE=website
 
-# TODO: run build-standalone.sh for each separate page that features on the website
+./script/bundle.sh $WEBSITE Standalone.Website
 
-unzip archive/0.3.1.zip -d dist # already has 0.3.1 as top-level folder
-unzip archive/0.6.1.zip -d dist/0.6.1
+unzip archive/0.3.1.zip -d dist/$WEBSITE # already has 0.3.1 as top-level folder
+unzip archive/0.6.1.zip -d dist/$WEBSITE/0.6.1
+
+# until we have a more uniform structure:
+cp src/Standalone/Website.html dist/$WEBSITE/index.html

script/clean.sh

@@ -3,4 +3,3 @@ set -xe
 
 rm -rf dist/$1
 mkdir -p dist/$1
-. script/util/copy-static.sh $1   # not everything in here relevant to every target

script/test-all.sh

@@ -2,4 +2,4 @@
 set -xe
 
 . script/test.sh
-. script/test-standalone-all.sh
+. script/test-standalone-all.sh website

script/test-standalone-all.sh

@@ -2,8 +2,10 @@
 # run from project root
 set -e
 
+WEBSITE=$1
+
 for FILE in src/Standalone/Test/*.purs; do
    BASENAME=$(basename "$FILE" .purs)
    echo "$BASENAME Puppeteer tests"
-   . script/test-standalone.sh $BASENAME
+   . script/test-standalone.sh $BASENAME $WEBSITE
    done

script/test-standalone.sh

@@ -5,6 +5,7 @@ yarn puppeteer browsers install chrome
 yarn puppeteer browsers install firefox
 
 NAME=$1
+WEBSITE=$2
 
 if [ ! -e "src/Standalone/$NAME.purs" ]; then
   echo "Error: 'Standalone/$NAME.purs' not found."
@@ -13,4 +14,4 @@ fi
 
 # don't need to have "deployed" this to dist/
 # instead the following just picks up from output-es/
-node puppeteer.js Standalone.Test.$NAME
+node puppeteer.js Standalone.Test.$NAME $WEBSITE

script/util/copy-static.sh

@@ -1,10 +1,8 @@
 #!/usr/bin/env bash
 set -xe
 
-rm -rf dist/$1/fluid
-rm -rf dist/$1/css
-rm -rf dist/$1/pdf
-cp -r fluid dist/$1
-cp web/index.html dist/$1
-cp -r web/css dist/$1
-cp -r web/pdf dist/$1
+WEBSITE=$1
+
+cp -r fluid dist/$WEBSITE
+cp -r web/css dist/$WEBSITE
+cp web/favicon.ico dist/$WEBSITE

src/Standalone/Convolution.html

@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
+   <link rel="icon" href="/favicon.ico" type="image/x-icon">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">

src/Standalone/ConvolutionWrapped.html

@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
+   <link rel="icon" href="/favicon.ico" type="image/x-icon">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">

src/Standalone/EnergyScatter.html

@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
+   <link rel="icon" href="/favicon.ico" type="image/x-icon">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">

src/Standalone/MovingAverage.html

@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
+   <link rel="icon" href="/favicon.ico" type="image/x-icon">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">

src/Standalone/NonRenewables.html

@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
+   <link rel="icon" href="/favicon.ico" type="image/x-icon">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">

src/Standalone/RenewablesLinked.html

@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
+   <link rel="icon" href="/favicon.ico" type="image/x-icon">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">

src/Standalone/Website.html

@@ -0,0 +1,74 @@
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+   <link rel="icon" href="/favicon.ico" type="image/x-icon">
+   <meta charset="UTF-8">
+   <meta name="viewport" content="width=device-width, initial-scale=1.0">
+   <meta http-equiv="X-UA-Compatible" content="ie=edge">
+   <title>Fluid: Data-Linked Visualisations</title>
+   <link href="css/styles.css" rel="stylesheet" type="text/css">
+   <link href="css/view-styles.css" rel="stylesheet" type="text/css">
+   <script src="https://use.fontawesome.com/1091715d00.js"></script>
+   <script src="fluid.js"></script>
+   <script>
+      // move to PureScript
+      function toggle(id) {
+         const elem = document.getElementById(id)
+         if (elem.style.visibility == 'hidden')
+            elem.style.visibility = 'visible'
+         else
+            elem.style.visibility = 'hidden'
+      }
+   </script>
+</head>
+<body>
+
+<div class="grid-container">
+   <div></div>
+   <div class="flex-right-align">
+      <img src="https://i.ibb.co/bFjzrXR/Untitled.jpg" width="250px">
+      <img src="https://i.ibb.co/zNqHKg7/University-of-Bristol-logo.png" width="250px">
+      <img src="https://dorchard.github.io/images/iccs-full-logo.png" alt="ICCS logo" width="250px">
+   </div>
+   <div></div>
+   <div class="flex-left-align">
+      <nav>
+         <ul>
+            <li><a href="." class="active-page">Latest</a></li>
+            <li><a href="https://f.luid.org/0.3.1">v0.3.1</a></li>
+         </ul>
+      </nav>
+      <div>
+         <a href="https://github.com/explorable-viz/fluid">GitHub</a> ·
+         <a href="https://dl.acm.org/doi/10.1145/3498668">POPL 2022 paper</a> ·
+         <a href="https://www.youtube.com/watch?v=M_ePrtD9axk">POPL 2022 talk</a> ·
+         <a href="https://www.youtube.com/watch?v=2-S6yVyzypU">PROPL 2024 talk</a>
+      </div>
+      <h2>Fluid: data-linked visualisations</h2>
+   </div>
+
+   <div></div>
+   <div></div>
+   <div></div>
+   <div class="flex-left-align">
+      <h3 class="title lowercase">example 1</h3>
+      <p>Renewables example for related inputs:</p>
+   </div>
+
+   <div></div>
+   <div id="fig-4-input" class="flex-right-align data-pane"></div>
+   <div>
+      <div onclick="toggle('fig-4-input')"><span class="data-pane-button toggle-button">◀▶</span></div>
+   </div>
+   <div class="flex-left-align">
+      <div id="fig-4"></div>
+   </div>
+</div>
+
+<script>
+   // move to PureScript
+   toggle('fig-4-input')
+</script>
+</body>
+</html>

test/Util/Puppeteer.purs

@@ -64,12 +64,10 @@ waitForHidden selector page = do
    log' "-> found"
 
 puppeteerLogging :: Boolean
-puppeteerLogging = true
+puppeteerLogging = false
 
 log' :: forall m. MonadEffect m => String -> m Unit
-log' msg =
-   when (debug.logging || puppeteerLogging)
-      (log msg)
+log' = log >>> when (debug.logging || puppeteerLogging)
 
 goto :: T.URL -> T.Page -> Aff Unit
 goto (T.URL url) page = do

web/bench.html

@@ -0,0 +1,15 @@
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+   <link rel="icon" href="/favicon.ico" type="image/x-icon">
+   <meta charset="UTF-8">
+   <meta name="viewport" content="width=device-width, initial-scale=1.0">
+   <meta http-equiv="X-UA-Compatible" content="ie=edge">
+   <title>Fluid benchmarks</title>
+   <script src="fluid.js"></script>
+</head>
+<body>
+<h1>Fluid benchmarks</h1>
+</body>
+</html>

web/index.html

@@ -2,7 +2,7 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-   <link rel="shortcut icon" href="#"/>
+   <link rel="icon" href="/favicon.ico" type="image/x-icon">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">