Reveal presentation builder

Tools to build reveal web-based presentations for scientific visualisations. Those slide-decks can be navigated as a grid of slides and deployed as static websites.

An example of a such a slide deck can be found here: here.

Installation

Install node.js and npm on your machine.

Clone the reveal.js javascript repository:

git clone [email protected]:oliche/reveal.js.git -b ibl
cd reveal.js
npm install

Clone the reveal python repository and install in place:

git clone [email protected]:int-brain-lab/reveal.git
pip install -e .

Tutorial

In this tutorial we will create a new presentation from scratch and serve it on a development server. In a second time we will deploy the presentation to an S3 bucket and serve it as a static website.

Create the slide deck and serve it locally

Create a new project for the slide deck

In the directory of your choice, here ~/Documents/JS, clone the directory

cd ~/Documents/JS
PROJECT_NAME=slide_deck_tutorial
git clone https://github.com/oliche/reveal.js.git -b ibl $PROJECT_NAME
cd $PROJECT_NAME
#ln -s ../reveal.js/node_modules node_modules  # optional to avoid duplication of node_modules engine
mkdir img
npm install

Create a 2 rows and 3 columns slide deck

./examples/getting_started.py

eventually run a local server to look at the slides

npm start -- --port=8001

Serve the slide deck on a static website on AWS S3

aws --profile ibl s3 sync ~/Documents/JS/reveal.js s3://reveal.internationalbrainlab.org --delete --exclude reveal.js/node_modules

Create a new website

aws --profile ibl s3 sync ~/Documents/JS/reveal.js s3://reveal.internationalbrainlab.org --exclude reveal.js/node_modules http://reveal.internationalbrainlab.org.s3-website-us-east-1.amazonaws.com

dirname='critical'
bucket=$dirname.internationalbrainlab.org
aws --profile ibl s3api create-bucket --bucket=$bucket --acl=public-read
aws --profile ibl s3 website s3://$bucket/ --index-document index.html

echo '{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "PublicReadGetObject",
            "Effect": "Allow",
            "Principal": "*",
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::'$bucket'/*"
        }
    ]
}' > /tmp/bucket_policy.json
aws --profile ibl s3api put-bucket-policy --bucket $bucket --policy file:///tmp/bucket_policy.json
aws --profile ibl s3 sync ~/Documents/JS/$dirname s3://$bucket

echo http://$bucket.s3-website-us-east-1.amazonaws.com

Update a website

bucket=reveal.internationalbrainlab.org
aws --profile ibl s3 sync ~/Documents/JS/reveal s3://reveal.internationalbrainlab.org --delete
echo http://$bucket.s3-website-us-east-1.amazonaws.com --exclude reveal.js/node_modules`