feat: init asciinema-player

wolfogre · wolfogre · commit c7b31a1a5451 · 2023-01-13T17:20:35.000+08:00
diff --git a/modules/markup/asciicast/asciicast.go b/modules/markup/asciicast/asciicast.go
@@ -32,8 +32,8 @@ func (Renderer) Extensions() []string {
 }
 
 const (
-	playerClassName = "asciicast-player-container"
-	playerSrcAttr   = "data-asciicast-player-src"
+	playerClassName = "asciinema-player-container"
+	playerSrcAttr   = "data-asciinema-player-src"
 )
 
 // SanitizerRules implements markup.Renderer
diff --git a/web_src/js/asciinema/player.js b/web_src/js/asciinema/player.js
@@ -0,0 +1,14 @@
+import * as AsciinemaPlayer from 'asciinema-player';
+
+export function initAsciinemaPlayer() {
+  const players = document.getElementsByClassName('asciinema-player-container');
+  console.log('start');
+  for (const player of players) {
+    console.log('init');
+    AsciinemaPlayer.create(player.getAttribute('data-asciinema-player-src'), player, {
+      fit: 'both',
+      preload: true,
+      poster: 'npt:100:0:0',
+    });
+  }
+}
diff --git a/web_src/js/index.js b/web_src/js/index.js
@@ -90,6 +90,7 @@ import {initRepoCommentForm, initRepository} from './features/repo-legacy.js';
 import {initFormattingReplacements} from './features/formatting.js';
 import {initMcaptcha} from './features/mcaptcha.js';
 import {initCopyContent} from './features/copycontent.js';
+import {initAsciinemaPlayer} from './asciinema/player.js';
 
 // Run time-critical code as soon as possible. This is safe to do because this
 // script appears at the end of <body> and rendered HTML is accessible at that point.
@@ -198,4 +199,6 @@ $(document).ready(() => {
   initUserSettings();
   initViewedCheckboxListenerFor();
   checkAppUrl();
+
+  initAsciinemaPlayer();
 });

Original file line number	Diff line number	Diff line change
`@@ -32,8 +32,8 @@ func (Renderer) Extensions() []string {`
`32`	`32`	`}`
`33`	`33`
`34`	`34`	`const (`
`35`		`- playerClassName = "asciicast-player-container"`
`36`		`- playerSrcAttr = "data-asciicast-player-src"`
	`35`	`+ playerClassName = "asciinema-player-container"`
	`36`	`+ playerSrcAttr = "data-asciinema-player-src"`
`37`	`37`	`)`
`38`	`38`
`39`	`39`	`// SanitizerRules implements markup.Renderer`