From 8de28ae8f97902ead3a9b56ed12a197926107dd6 Mon Sep 17 00:00:00 2001
From: Balakrishnan Balasubramanian <git.user@balki.me>
Date: Mon, 26 May 2025 18:07:41 -0400
Subject: [PATCH] improve asciinmea

---
 layouts/_shortcodes/asciinema.html | 36 +++++++++++++++++-------------
 1 file changed, 20 insertions(+), 16 deletions(-)

diff --git a/layouts/_shortcodes/asciinema.html b/layouts/_shortcodes/asciinema.html
index 9d096f3..b82491f 100644
--- a/layouts/_shortcodes/asciinema.html
+++ b/layouts/_shortcodes/asciinema.html
@@ -1,19 +1,23 @@
-<div id='{{ .Get "key" }}'></div>
+<div id='{{ .Get "key" }}_asciinema_cast'></div>
 <script>
-    AsciinemaPlayer.create('casts/{{ .Get "key" }}.cast', document.getElementById('{{ .Get "key" }}'), {
-        {{ if .Get "cols" }}cols: "{{ .Get "cols" }}",{{ end }}
-        {{ if .Get "rows" }}rows: "{{ .Get "rows" }}",{{ end }}
-        {{ if .Get "autoPlay" }}autoPlay: "{{ .Get "autoPlay" }}",{{ end }}
-        {{ if .Get "preload" }}preload: "{{ .Get "preload" }}",{{ end }}
-        {{ if .Get "loop" }}loop: "{{ .Get "loop" }}",{{ end }}
-        {{ if .Get "startAt" }}startAt: "{{ .Get "startAt" }}",{{ end }}
-        {{ if .Get "speed" }}speed: "{{ .Get "speed" }}",{{ end }}
-        {{ if .Get "idleTimeLimit" }}idleTimeLimit: "{{ .Get "idleTimeLimit" }}",{{ end }}
-        {{ if .Get "theme" }}theme: "{{ .Get "theme" }}",{{ end }}
-        {{ if .Get "poster" }}poster: "{{ .Get "poster" }}",{{ end }}
-        {{ if .Get "fit" }}fit: "{{ .Get "fit" }}",{{ end }}
-        {{ if .Get "terminalFontSize" }}terminalFontSize: "{{ .Get "terminalFontSize" }}",{{ end }}
-        {{ if .Get "terminalFontFamily" }}terminalFontFamily: "{{ .Get "terminalFontFamily" }}",{{ end }}
-        {{ if .Get "terminalLineHeight" }}terminalLineHeight: "{{ .Get "terminalLineHeight" }}",{{ end }}
+  {{- /* Doc: https://docs.asciinema.org/manual/player/options/ */ -}}
+    AsciinemaPlayer.create('casts/{{ .Get "key" }}.cast', document.getElementById('{{ .Get "key" }}_asciinema_cast'), {
+        {{- if .Get "cols" }}cols: "{{ .Get "cols" }}",{{ end }}
+        {{- if .Get "rows" }}rows: "{{ .Get "rows" }}",{{ end }}
+        {{- if .Get "autoPlay" }}autoPlay: "{{ .Get "autoPlay" }}",{{ end }}
+        {{- if .Get "preload" }}preload: "{{ .Get "preload" }}",{{ end }}
+        {{- if .Get "loop" }}loop: "{{ .Get "loop" }}",{{ end }}
+        {{- if .Get "startAt" }}startAt: "{{ .Get "startAt" }}",{{ end }}
+        {{- if .Get "speed" }}speed: "{{ .Get "speed" }}",{{ end }}
+        {{- if .Get "idleTimeLimit" }}idleTimeLimit: "{{ .Get "idleTimeLimit" }}",{{ end }}
+        {{- if .Get "theme" }}theme: "{{ .Get "theme" }}",{{ end }}
+        {{- if .Get "poster" }}poster: "{{ .Get "poster" }}",{{ end }}
+        {{- if .Get "fit" }}fit: "{{ .Get "fit" }}",{{ end }}
+        {{- if .Get "controls" }}controls: "{{ .Get "controls" }}",{{ end }}
+      {{- /* markers is an array. Not sure if possible to pass in hugo. Embed directly in cast file */ -}}
+        {{- if .Get "pauseOnMarkers" }}pauseOnMarkers: "{{ .Get "pauseOnMarkers" }}",{{ end }}
+        {{- if .Get "terminalFontSize" }}terminalFontSize: "{{ .Get "terminalFontSize" }}",{{ end }}
+        {{- if .Get "terminalFontFamily" }}terminalFontFamily: "{{ .Get "terminalFontFamily" }}",{{ end }}
+        {{- if .Get "terminalLineHeight" }}terminalLineHeight: "{{ .Get "terminalLineHeight" }}",{{ end }}
      });
 </script>