using asciinema.

fiatjaf · Oct 26, 2022 · 2a3a108 · 2a3a108
1 parent 4a9b6df
commit 2a3a108
Show file tree

Hide file tree

Showing 3 changed files with 103 additions and 77 deletions.
diff --git a/.github/workflows/repro.yml b/.github/workflows/repro.yml
@@ -4,7 +4,7 @@ on:
     paths-ignore:
     # Changes to these artifacts are autogenerated by this workflow
     # ignore them to prevent an infinite CI loop
-    - '*/*.webm'
+    - '*/*.cast'
     - 'index.html'
 jobs:
   reproBuild:
@@ -26,9 +26,9 @@ jobs:
           # start xvfb in the background
           sudo /usr/bin/Xvfb $DISPLAY -screen 0 "${RESOLUTION}x24" &
 
-      - name: Setup ffmpeg for video capture
+      - name: Setup asciinema and ffmpeg for terminal capture
         run: |
-          sudo apt install -y ffmpeg
+          sudo apt install -y ffmpeg asciinema
 
       - name: Checkout source
         uses: actions/checkout@v2
@@ -56,7 +56,7 @@ jobs:
         if: ${{ matrix.project == 'bitbox02-firmware' }}
         run: |
           sudo apt install -y libhidapi-dev cmake protobuf-compiler python3-protobuf
-          
+
           ( cd /usr/local/bin && ln -s `which arm-none-eabi-gcc` arm-none-eabi-gcc )
           echo "/usr/local/bin" >> $GITHUB_PATH
 
@@ -95,7 +95,7 @@ jobs:
         with:
           poetry-version: 1.1.11
 
-      - name: Setup deps for Trezor (2/2) 
+      - name: Setup deps for Trezor (2/2)
         if: ${{ matrix.project == 'trezor-firmware' }}
         run: |
           sudo apt install -y protobuf-compiler libsdl2-dev
@@ -141,11 +141,12 @@ jobs:
         run: |
           REPO_ROOT_DIR=`pwd`
           cd ${PROJECT}
-          VERSION=`perl -ne 'print "$1\n" if /^VERSION="?([^"]*)"?$/' artifacts.sh`
+          . artifacts.sh
+
           # Only run if the project and version have not already been included
           if ! grep -q -i "${PROJECT}.*${VERSION}.*build bot" ../index.html ; then
             ffmpeg -nostats -y -video_size $RESOLUTION -framerate ${FRAMERATE} -f x11grab -i $DISPLAY ${PROJECT}-${VERSION}-video-original.webm &
-            xterm -display $DISPLAY -e "cd ${REPO_ROOT_DIR}/${PROJECT} && ./steps.sh 2>&1 | tee log.out"
+            xterm -display $DISPLAY -e "asciinema rec -c 'cd ${REPO_ROOT_DIR}/${PROJECT} && ./steps.sh 2>&1 | tee log.out' --overwrite ${PROJECT}-${VERSION}.cast"
             # wait for steps to run
             pkill -f ffmpeg
 
@@ -166,11 +167,12 @@ jobs:
                 ffmpeg -nostats -y -i ${PROJECT}-${VERSION}-video-original.mp4 -movflags faststart -pix_fmt yuv420p -filter:v "setpts=(139/${ORIGINAL_DURATION})*PTS" ${PROJECT}-${VERSION}-video.mp4
             fi
 
-            ./artifacts.sh >> ${PROJECT}-output.txt
+
+            ASCIINEMA_CAST_URL="https://github.com/${GITHUB_REPOSITORY}/raw/${GITHUB_REF_NAME}/${PROJECT}/${PROJECT}-${VERSION}.cast"
+            echo "<li><a href='${REPO}/releases/tag/${VERSION}'>${DATE}</a> | <a href='${URL}' class='project-name'>${PROJECT}</a> | <a href='${REPO}/releases/tag/${VERSION}'>${VERSION}</a> | <a href='${CHECKSUM_SOURCE}'> factory ${SHA256} </a>| <a href='${ASCIINEMA_CAST_URL}'>terminal recording</a> | <a href='https://github.com/coinkite/bitcoinbinary.org/blob/main/${PROJECT}/artifacts.sh' class="bot">build bot</a></li>" > ${PROJECT}-output.txt
             cat log.out
 
             # Create a txt file artifact that forms part of the tweet composed in reproTweet step.
-            TWITTER_NAME=`perl -ne 'print "$1\n" if /^TWITTER_NAME="?([^"]*)"?$/' artifacts.sh`
             if [ ! -z "$TWITTER_NAME" ]; then
                 echo "${TWITTER_NAME} ${VERSION}" > "${PROJECT}-${VERSION}-tweet-entry.txt"
             fi
@@ -181,60 +183,15 @@ jobs:
         with:
           name: ${{ matrix.project }}
           path: |
-            ${{ matrix.project }}/${{ matrix.project }}*-video.webm
             ${{ matrix.project }}/${{ matrix.project }}*-video.mp4
+            ${{ matrix.project }}/${{ matrix.project }}*.cast
             ${{ matrix.project }}/${{ matrix.project }}-output.txt
             ${{ matrix.project }}/${{ matrix.project }}*-tweet-entry.txt
 
-  reproCommit:
+  reproTweetAndCommit:
     needs:
       - reproBuild
     runs-on: ubuntu-latest
-    steps:
-      - name: Checkout source
-        uses: actions/checkout@v2
-
-      - name: Gather artifacts from jobs
-        uses: actions/download-artifact@v3
-        with:
-          path: artifacts
-
-      - name: Commit updates
-        run: |
-          PATTERN="artifacts/*/*output.txt"
-
-          # Run only if any artifacts were found
-          if ls $PATTERN 1> /dev/null 2>&1; then
-              # Append each new output line to the HTML table
-              for o in `ls artifacts/*/*output.txt` ; do
-                TEXT=`cat ${o}` ;
-                perl -pi -e "s+^<ul class=\"log\">$+<ul class=\"log\">\n     ${TEXT}+" index.html ;
-              done
-
-              # Check in each new video artifact
-              for dir in `ls -d artifacts/*` ; do
-                p=`echo ${dir} | cut -f 2 -d '/'`
-                mv artifacts/${p}/${p}*-video.webm ${p}/ ;
-                git add ${p}/*-video.webm ;
-              done
-
-              git add index.html
-              git config --local user.email '[email protected]'
-              git config --local user.name 'GitHub Action'
-              git commit -m 'Add latest build artifacts'
-          else
-              echo "No new artifacts to commit"
-          fi
-
-      - name: Push updates
-        uses: ad-m/github-push-action@master
-        with:
-          github_token: ${{ secrets.GITHUB_TOKEN }}
-
-  reproTweet:
-    needs:
-      - reproCommit
-    runs-on: ubuntu-latest
     env:
       TWITTER_API_KEY: ${{ secrets.TWITTER_API_KEY }}
       TWITTER_API_SECRET: ${{ secrets.TWITTER_API_SECRET }}
@@ -264,14 +221,14 @@ jobs:
 
               for t in `ls $PATTERN` ; do
                 PROJECT=$(echo "$t" | sed -e 's/..\/artifacts\///g' -e 's/\/.*//g')
-                VERSION=$(perl -ne 'print "$1\n" if /^VERSION="?([^"]*)"?$/' "../${PROJECT}/artifacts.sh")
+                . ../${PROJECT}/artifacts.sh
 
                 MP4_VIDEO_FILENAME="${t/tweet-entry.txt/video.mp4}"
-                WEBM_VIDEO_URL="https://github.com/${GITHUB_REPOSITORY}/raw/${GITHUB_REF_NAME}/${PROJECT}/${PROJECT}-${VERSION}-video.webm"
-                
+                ASCIINEMA_CAST_URL="https://github.com/${GITHUB_REPOSITORY}/raw/${GITHUB_REF_NAME}/${PROJECT}/${PROJECT}-${VERSION}.cast"
+
                 printf "New successful build on bitcoinbinary.org!\n\n" > tweet.txt
                 printf "`cat ${t}`\n\n" >> tweet.txt
-                printf "Original video proof: $WEBM_VIDEO_URL\n" >> tweet.txt
+                printf "Original terminal recording: $ASCIINEMA_CAST_URL\n" >> tweet.txt
 
                 echo
                 echo "Tweeting the following:"
@@ -280,8 +237,42 @@ jobs:
                 echo "---------------------------------"
                 echo
 
-                python send_tweet.py tweet.txt $MP4_VIDEO_FILENAME $WEBM_VIDEO_URL
+                python send_tweet.py tweet.txt $MP4_VIDEO_FILENAME
+                TWEET_URL=$(cat tweet_url)
+                sed -i "s#</li># | <a href='${TWEET_URL}' class='tweet'>tweet</a></li>#" ../artifacts/${PROJECT}/*-output.txt
               done
           else
               echo "No new successful builds to tweet (or TWITTER_NAME not set in artifacts.sh)."
           fi
+
+      - name: Commit updates
+        run: |
+          PATTERN="artifacts/*/*output.txt"
+
+          # Run only if any artifacts were found
+          if ls $PATTERN 1> /dev/null 2>&1; then
+              # Append each new output line to the HTML table
+              for o in `ls artifacts/*/*output.txt` ; do
+                TEXT=`cat ${o}` ;
+                perl -pi -e "s+^<ul class=\"log\">$+<ul class=\"log\">\n     ${TEXT}+" index.html ;
+              done
+
+              # Check in each new video artifact
+              for dir in `ls -d artifacts/*` ; do
+                p=`echo ${dir} | cut -f 2 -d '/'`
+                mv artifacts/${p}/${p}*.cast ${p}/ ;
+                git add ${p}/*.cast;
+              done
+
+              git add index.html
+              git config --local user.email '[email protected]'
+              git config --local user.name 'GitHub Action'
+              git commit -m 'Add latest build artifacts'
+          else
+              echo "No new artifacts to commit"
+          fi
+
+      - name: Push updates
+        uses: ad-m/github-push-action@master
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
diff --git a/index.html b/index.html
@@ -1,5 +1,6 @@
 <title>BitcoinBinary.org - A repository of Reproducible Build Proofs for Bitcoin Projects</title>
 <link rel="icon" href="bitcoinbinary.org.png">
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/bundle/asciinema-player.css">
 <style>
 
 html, body, div, span, applet, object, iframe,
@@ -165,15 +166,31 @@
   margin:20px auto;
   text-align: center;	
 }
+.asciinema-wrapper {
+  display: flex;
+  padding: 18px;
+  align-items: center;
+  justify-items: center;
+}
 .bot{
-    color: #ff8300;
-    display: inline-block;
-    padding: 1px 5px 0;
-    font-size: 0.75em;
-    background: #fff6ef;
-    border: 1px solid #ff8300;
-    border-radius: 5px;
-    margin-top: -4px;
+  color: #ff8300;
+  display: inline-block;
+  padding: 1px 5px 0;
+  font-size: 0.75em;
+  background: #fff6ef;
+  border: 1px solid #ff8300;
+  border-radius: 5px;
+  margin-top: -4px;
+}
+.tweet{
+  color: #1d9bf0;
+  display: inline-block;
+  padding: 1px 5px 0;
+  font-size: 0.75em;
+  background: #fff6ef;
+  border: 1px solid #1d9bf0;
+  border-radius: 5px;
+  margin-top: -4px;
 }
 </style>
 
@@ -223,6 +240,10 @@
 --->
 <hr>
 
+<div id="asciinema-wrapper">
+  <div id="asciinema" style="display: none"></div>
+</div>
+
 <h2>Binary Log:</h2>
 <ul class="log">
      <li><a href='https://github.com/Coldcard/firmware/releases/tag/2022-07-29T1817-v5.0.7'>2022-10-12</a> | <a href='https://coldcard.com' class='project-name'>coldcard</a> | <a href='https://github.com/Coldcard/firmware/releases/tag/2022-07-29T1817-v5.0.7'>v5.0.7</a> | <a href="https://twitter.com/AVirgovic/status/1580213069393063937">tweet</a> | <a href='https://raw.githubusercontent.com/Coldcard/firmware/master/releases/signatures.txt'> factory 010827a60ebfc25b8a6e2bb94cc69b938419957ac6d4a9b6c0b1357c4c6c8632</a>| <a href='https://www.youtube.com/watch?v=HVraLYxMsA4'>video proof</a> | <a href='https://github.com/coinkite/bitcoinbinary.org/blob/main/coldcard/artifacts.sh' class=bot>build bot</a></li>
@@ -342,10 +363,23 @@ <h2>Definitions from reproducible-builds.org</h2>
 other distributor.</p>
 
 
-
-<script type="text/javascript">
-	function darkMode() {
-	   var element = document.body;
-	   element.classList.toggle("dark-mode");
-	}
+<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/index.min.js"></script>
+<script>
+function darkMode() {
+   var element = document.body;
+   element.classList.toggle("dark-mode");
+}
+document.addEventListener('click', (ev) => {
+  if (ev.target.href.endsWith('.cast')) {
+    let container = document.getElementById('asciinema')
+    container.style.display = 'block'
+    let player = AsciinemaPlayer.create(ev.target.href, container);
+    player.play()
+    player.addEventListener('ended', () => {
+      setTimeout(() => {
+        container.style.display = 'none'
+      }, 1500)
+    })
+  }
+})
 </script>
diff --git a/twitter_bot/send_tweet.py b/twitter_bot/send_tweet.py
@@ -5,8 +5,6 @@
 tweet_file = open(sys.argv[1], "r")
 tweet_text = tweet_file.read()
 
-video_file = open(sys.argv[2], "r")
-
 auth = tweepy.OAuth1UserHandler(
     os.environ["TWITTER_API_KEY"],
     os.environ["TWITTER_API_SECRET"],
@@ -40,3 +38,6 @@
     print(
         f"Tweeted without video: https://twitter.com/{my_screen_name}/status/{tweet.data['id']}\n"
     )
+
+tweet_url = f"https://twitter.com/{my_screen_name}/status/{tweet.data['id']}"
+open("tweet_url", "w").write(tweet_url)