Support mp4 videos for demos

For all videos but the first video in the readme we want to use mp4 because it's faster, better quality,
smaller, and allows you to play/pause (don't quote me on the smaller part).

HOWEVER: github won't let us reference mp4s stored in our repo from the readme, like it does for gifs
(who knows why). This is annoying because it prevents us from easily re-recording things if the UI
changes. So I've got the logic for recording to mp4 but I'm thinking of sticking to gifs for now

1 files changed, 49 insertions, 9 deletions

diff --git a/demo/record_demo.sh b/demo/record_demo.sh
index 0ef379377..97d5c2f36 100755
--- a/demo/record_demo.sh
+++ b/demo/record_demo.sh
@@ -1,15 +1,44 @@
 #!/bin/sh
 
-TEST=$1
-
 set -e
 
+TYPE=$1
+TEST=$2
+
+usage() {
+    echo "Usage: $0 [gif|mp4] <test path>"
+    echo "e.g. using full path: $0 gif pkg/integration/tests/demo/nuke_working_tree.go"
+    exit 1
+}
+
+if [ "$#" -ne 2 ]
+then
+    usage
+fi
+
+if [ "$TYPE" != "gif" ] && [ "$TYPE" != "mp4" ]
+then
+    usage
+    exit 1
+fi
+
 if [ -z "$TEST" ]
 then
-    echo "Usage: $0 <test>"
+    usage
+fi
+
+WORKTREE_PATH=$(git worktree list | grep assets | awk '{print $1}')
+
+if [ -z "$WORKTREE_PATH" ]
+then
+    echo "Could not find assets worktree. You'll need to create a worktree for the assets branch using the following command:"
+    echo "git worktree add .worktrees/assets assets"
+    echo "The assets branch has no shared history with the main branch: it exists to store assets which are too large to store in the main branch."
     exit 1
 fi
 
+OUTPUT_DIR="$WORKTREE_PATH/demo"
+
 if ! command -v terminalizer &> /dev/null
 then
     echo "terminalizer could not be found"
@@ -24,18 +53,29 @@ then
     exit 1
 fi
 
-# get last part of the test path and set that as the output name
+# Get last part of the test path and set that as the output name
 # example test path: pkg/integration/tests/01_basic_test.go
 # For that we want: NAME=01_basic_test
 NAME=$(echo "$TEST" | sed -e 's/.*\///' | sed -e 's/\..*//')
 
+# Add the demo to the tests list (if missing) so that it can be run
 go generate pkg/integration/tests/tests.go
 
-mkdir -p demo/output
+mkdir -p "$OUTPUT_DIR"
+
+# First we record the demo into a yaml representation
+terminalizer -c demo/config.yml record --skip-sharing -d "go run cmd/integration_test/main.go cli --slow $TEST" "$OUTPUT_DIR/$NAME"
+# Then we render it into a gif
+terminalizer render "$OUTPUT_DIR/$NAME" -o "$OUTPUT_DIR/$NAME.gif"
 
-terminalizer -c demo/config.yml record --skip-sharing -d "go run cmd/integration_test/main.go cli --slow $TEST" "demo/output/$NAME"
-terminalizer render "demo/output/$NAME" -o "demo/output/$NAME.gif"
-COMPRESSED_PATH="demo/output/$NAME-compressed.gif"
-gifsicle --colors 256 --use-col=web -O3 < "demo/output/$NAME.gif" > "$COMPRESSED_PATH"
+# Then we convert it to either an mp4 or gif based on the command line argument
+if [ "$TYPE" = "mp4" ]
+then
+    COMPRESSED_PATH="$OUTPUT_DIR/$NAME.mp4"
+    ffmpeg -y -i "$OUTPUT_DIR/$NAME.gif" -movflags faststart -pix_fmt yuv420p -vf "scale=trunc(iw/2)*2:trunc(ih/2)*2" "$COMPRESSED_PATH"
+else
+    COMPRESSED_PATH="$OUTPUT_DIR/$NAME-compressed.gif"
+    gifsicle --colors 256 --use-col=web -O3 < "$OUTPUT_DIR/$NAME.gif" > "$COMPRESSED_PATH"
+fi
 
 echo "Demo recorded to $COMPRESSED_PATH"