Lanyon (#67)

* WIP

* Working locally

* Upgrade lanyon

* Upgrade Lanyon to v0.0.12

* Tweaks

* Simplify example scripts

.gitignore

@@ -16,3 +16,6 @@ website/.jekyll-metadata
 env.sh
 
 website/main.sh
+website/assets/build
+website/.lanyon
+website/.lanyon/vendor/bin

.travis.yml

@@ -21,7 +21,7 @@ script: test/acceptance.sh
 deploy:
   skip_cleanup: true
   provider: script
-  script: website/_bin/deploy.sh
+  script: website/_scripts/deploy.sh
   on:
     branch: master
     condition: $TRAVIS_OS_NAME = linux

FAQ.md

@@ -108,8 +108,8 @@ The source mainly consists of:
 - `./FAQ.md` (FAQ page)
 - `./CHANGELOG.md` (changelog page)
 - `./website/_layouts/default.html` (the design in which all pages are rendered)
-- `./website/public/app.js` (main JS file)
-- `./website/public/style.css` (main CSS file)
+- `./website/assets/app.js` (main JS file)
+- `./website/assets/style.css` (main CSS file)
 
 The rest is dark magic from which you should probably steer clear. : )
 

package.json

@@ -3,7 +3,7 @@
   "description": "Copypastable templates to write better bash scripts",
   "version": "2.1.0",
   "scripts": {
-    "deploy": "website/_bin/travis-deploy.sh",
+    "deploy": "website/_scripts/deploy.sh",
     "lint": "shellcheck --shell=bash $(find . -name '*.sh' -maxdepth 2)",
     "release:major": "env SEMANTIC=major npm run release",
     "release:minor": "env SEMANTIC=minor npm run release",
@@ -13,19 +13,28 @@
     "test": "test/acceptance.sh",
     "version:current": "node -e 'console.log(require(\"./package.json\").version)'",
     "version:replace": "replace 'v\\d+\\.\\d+\\.\\d+' \"v$(npm run --silent version:current)\" main.sh src/*.sh",
-    "web:build": "cd website && bundle exec jekyll build --incremental",
-    "web:inject": "./website/_bin/inject.sh",
-    "web:install": "npm install && cd website && bundle install --path ./_vendor",
-    "web:preview": "npm-run-all web:install --parallel web:watch web:serve",
-    "web:serve": "cd website/_site && browser-sync start --server --files .",
-    "web:watch": "nodemon --verbose --watch ./  --ignore 'website/*.md' --ignore 'website/_site/*' --ext html,json,md,js,css,png,jpg --exec 'npm-run-all web:inject web:build'"
+    "web:build:production": "LANYON_ENV=production lanyon build",
+    "web:serve:production": "LANYON_ENV=production lanyon serve",
+    "web:build": "lanyon build",
+    "web:inject": "./website/_scripts/inject.sh",
+    "web:injecter": "nodemon --verbose --watch ./  --ignore 'website/*.md' --ignore website/_site --ignore website/.lanyon --ext html,json,md,js,css,png,jpg --exec 'npm run web:inject'",
+    "web:start:production": "npm-run-all web:inject web:build:production web:serve:production",
+    "web:starter": "lanyon start",
+    "web:start": "npm-run-all --parallel web:injecter web:starter"
+  },
+  "lanyon": {
+    "projectDir": "website",
+    "entries": [
+      "app"
+    ]
   },
   "dependencies": {
-    "fakefile": "0.0.6"
+    "fakefile": "0.0.6",
+    "lanyon": "0.0.12"
   },
   "devDependencies": {
-    "cross-env": "1.0.7",
     "browser-sync": "2.11.0",
+    "cross-env": "1.0.7",
     "nodemon": "1.8.1",
     "npm-run-all": "2.1.1"
   }

website/.bundle/config

@@ -1,3 +0,0 @@
----
-BUNDLE_PATH: "./_vendor"
-BUNDLE_DISABLE_SHARED_GEMS: "true"

website/_bin/deploy.sh

@@ -1,75 +0,0 @@
-#!/usr/bin/env bash
-# This file:
-#
-#  - Let's inject.sh inject markdown files into the ./website directory
-#  - Syncs that to a temporary directory along with a git init
-#  - (in case of Travis CI) assumes a Git bot identity, and uses an overriden GHPAGES_URL containing its token thanks to `travis encrypt`
-#  - Force pushes that to the gh-pages branch
-#
-# Usage:
-#
-#  ./deploy.sh
-#
-# Based on a template by BASH3 Boilerplate v2.0.0
-# http://bash3boilerplate.sh/#authors
-#
-# The MIT License (MIT)
-# Copyright (c) 2013 Kevin van Zonneveld and contributors
-# You are not obligated to bundle the LICENSE file with your b3bp projects as long
-# as you leave these references intact in the header comments of your source files.
-
-# Exit on error. Append || true if you expect an error.
-set -o errexit
-# Exit on error inside any functions or subshells.
-set -o errtrace
-# Do not allow use of undefined vars. Use ${VAR:-} to use an undefined VAR
-set -o nounset
-# Catch the error in case mysqldump fails (but gzip succeeds) in `mysqldump |gzip`
-set -o pipefail
-# Turn on traces, useful while debugging but commented out by default
-# set -o xtrace
-
-# Set magic variables for current file, directory, os, etc.
-__dir="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
-__file="${__dir}/$(basename "${BASH_SOURCE[0]}")"
-__base="$(basename ${__file} .sh)"
-
-ghpages_repo=${GHPAGES_REPO:-"kvz/bash3boilerplate"}
-ghpages_branch=${GHPAGES_BRANCH:-"gh-pages"}
-ghpages_url=${GHPAGES_URL:-"git@github.com:${ghpages_repo}.git"}
-
-echo "--> Deploying to GitHub pages.."
-
-${__dir}/inject.sh
-
-if [ "${TRAVIS:-}" = "true" ]; then
-  git config --global user.name 'lekevbot'
-  git config --global user.email 'bot@kvz.io'
-fi
-
-mkdir -p /tmp/deploy-${ghpages_repo}
-
-# Custom steps
-rsync \
-  --archive \
-  --delete \
-  --exclude=.git* \
-  --exclude=node_modules \
-  --exclude=lib \
-  --checksum \
-  --no-times \
-  --no-group \
-  --no-motd \
-  --no-owner \
-./website/ /tmp/deploy-${ghpages_repo} > /dev/null
-
-echo 'This branch is just a deploy target. Do not edit. You changes will be lost.' \
-  |tee /tmp/deploy-${ghpages_repo}/README.md
-
-(cd /tmp/deploy-${ghpages_repo} \
-  && git init && git checkout -B ${ghpages_branch} && git add --all . \
-  && git commit -nm "Update ${ghpages_repo} website by ${USER}" \
-  && (git remote add origin ${ghpages_url}|| true)  \
-  && git push origin ${ghpages_branch}:refs/heads/${ghpages_branch} --force) > /dev/null
-
-rm -rf /tmp/deploy-${ghpages_repo}

website/_config.yml

@@ -1,2 +1,4 @@
+title: BASH3 Boilerplate
+
 gems:
   - jekyll-redirect-from

website/_layouts/default.html

@@ -2,13 +2,18 @@
 <html>
   <head>
     <meta charset="utf-8">
+    {% if page.url == "/" %}
+      <title>{{page.title}}</title>
+    {% else %}
+      <title>{{page.title}} | {{site.title}}</title>
+    {% endif %}
+
     <title>{{page.title}}</title>
     <meta name="keywords" content="bash, template, scripting, command-line">
     <meta name="description" content="BASH3 Boilerplate">
     <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700' rel='stylesheet' type='text/css'>
     <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
-    <link rel="stylesheet" href="/public/style.css" media="screen" charset="utf-8">
-    <link rel="stylesheet" href="/public/syntax.css" media="screen" charset="utf-8">
+    <link rel="stylesheet" href="/assets/build/app.css" media="screen" charset="utf-8">
   </head>
   <body>
     <header>
@@ -66,7 +71,7 @@
     </section>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.1.0/highlight.min.js"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.1.0/languages/bash.min.js"></script>
-    <script src="/public/app.js"></script>
+    <script src="/assets/build/app.js"></script>
     <script>
       (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
       (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),

website/_scripts/deploy.sh

@@ -0,0 +1,49 @@
+#!/usr/bin/env bash
+# This file:
+#
+#  - Builds website for production
+#  - Force pushes that to the gh-pages branch
+#  - On travis, make sure you have encrypted the GHPAGES_URL var
+#
+# Usage:
+#
+#  ./deploy.sh
+#
+# Based on a template by BASH3 Boilerplate v2.0.0
+# http://bash3boilerplate.sh/#authors
+#
+# The MIT License (MIT)
+# Copyright (c) 2013 Kevin van Zonneveld and contributors
+# You are not obligated to bundle the LICENSE file with your b3bp projects as long
+# as you leave these references intact in the header comments of your source files.
+
+set -o errexit
+set -o errtrace
+set -o nounset
+set -o pipefail
+set -o xtrace
+
+echo "--> Deploying to GitHub pages.."
+
+if [ "${TRAVIS:-}" = "true" ]; then
+  git config --global user.name 'lekevbot'
+  git config --global user.email 'bot@kvz.io'
+fi
+
+if type yarn; then
+  yarn
+else
+  npm install
+fi
+
+npm run web:build:production
+
+pushd website/_site
+  [ -d .git ] || git init
+  echo 'This branch is just a deploy target. Do not edit. You changes will be lost.' |tee README.md
+  git checkout -B gh-pages
+  git add --all .
+  git commit -nm "Update website by ${USER}" || true
+  git remote add origin ${GHPAGES_URL} || true
+  git push origin gh-pages:refs/heads/gh-pages || git push origin gh-pages:refs/heads/gh-pages --force > /dev/null
+popd

website/_scripts/inject.sh

@@ -58,14 +58,16 @@ title: ${subtitle}BASH3 Boilerplate – Template for writing better Bash scripts
 warning: This page is generated by ${__base}.sh based on ${doc}.md, please don't edit ${targetName}.md directly.
 ---
 EOF
-  # http://stackoverflow.com/a/7104422/151666
+  # If '<!--more-->' exists, only inject what comes after it, so you can have e.g. a ToC or buildbuttons
+  # on GitHub, without that also rendering in the site (site may have its own ToC rendering for instance)
   if grep '<!--more-->' ${doc}.md; then
     cat ${doc}.md |sed -n -e '/<!--more-->/,$p' | tail -n +2 >> website/${targetName}.md
   else
     cat ${doc}.md >> website/${targetName}.md
   fi
 
+  # Add a "<- Back Home" link, if any
   echo -e $backLink >> website/${targetName}.md
 
-  echo "written website/${targetName}.md"
+  echo "--> written website/${targetName}.md"
 done

website/assets/app.js

@@ -0,0 +1,3 @@
+require('./main.js')
+require('./style.css')
+require('./syntax.css')

website/assets/main.js

@@ -20,7 +20,7 @@ if (!background) {
 
 // Body class for background.
 var el = document.getElementById('header-overlay')
-el.style.backgroundImage = 'url(/public/images/' + background + '.jpg)'
+el.style.backgroundImage = 'url(/assets/images/' + background + '.jpg)'
 
 // Attach class to #menu element depending on page offset.
 document.addEventListener('DOMContentLoaded', chooseMenuColor)

website/assets/style.css

@@ -48,7 +48,7 @@ body.background-1 #header-overlay {
 }
 
 body.background-4 #header-overlay {
-  background-image: url(images/4.jpg);
+  background-image: url(images/1.jpg);
 }
 
 #logo {