From 2b4b6a516005267a98b604644b594d317fa56f31 Mon Sep 17 00:00:00 2001
From: Eltrac <hi@guhub.cn>
Date: Mon, 2 Jun 2025 10:58:11 +0800
Subject: feat: add aPlayer shortcode

Former-commit-id: 4ded783eeb4fdda0d56525f8e36dd4384f0e3c90
---
 layouts/shortcodes/aplayer.html | 23 +++++++++++++++++++++++
 1 file changed, 23 insertions(+)
 create mode 100644 layouts/shortcodes/aplayer.html

(limited to 'layouts/shortcodes')

diff --git a/layouts/shortcodes/aplayer.html b/layouts/shortcodes/aplayer.html
new file mode 100644
index 00000000..b335e462
--- /dev/null
+++ b/layouts/shortcodes/aplayer.html
@@ -0,0 +1,23 @@
+{{ with resources.Get "css/aplayer.css" }}
+<style>{{ .Content | safeCSS }}</style>
+{{ end }}
+<div id="aplayer{{ with .Get "id" }}-{{ . }}{{ end }}" style="margin: 1rem 0;"></div>
+<script src="https://unpkg.com/aplayer@1.10.1/dist/APlayer.min.js"></script>
+<script>
+const ap = new APlayer({
+    container: document.getElementById('aplayer'),
+    audio: [{
+        name: '{{ .Get "name" }}',
+        artist: '{{ .Get "artist" }}',
+        url: '{{ .Get "url" }}',
+        cover: '{{ .Get "cover" }}'
+    }]
+});
+
+ap.on('play', function () {
+  umami.track('🎵 Play music with aPlayer')
+});
+ap.on('ended', function () {
+  umami.track('🎵 Played entiresong with aPlayer')
+});
+</script>
-- 
cgit v1.2.3


From 7f3f6b0c82f8a5187159e01b39ac8fa609c30321 Mon Sep 17 00:00:00 2001
From: Eltrac <hi@guhub.cn>
Date: Mon, 2 Jun 2025 12:44:37 +0800
Subject: perf: load aPlayer after the whole page

Former-commit-id: 7d16aff90a25e744544834a42776368b55903ea6
---
 layouts/shortcodes/aplayer.html | 32 +++++++++-----------------------
 1 file changed, 9 insertions(+), 23 deletions(-)

(limited to 'layouts/shortcodes')

diff --git a/layouts/shortcodes/aplayer.html b/layouts/shortcodes/aplayer.html
index b335e462..84c83002 100644
--- a/layouts/shortcodes/aplayer.html
+++ b/layouts/shortcodes/aplayer.html
@@ -1,23 +1,9 @@
-{{ with resources.Get "css/aplayer.css" }}
-<style>{{ .Content | safeCSS }}</style>
-{{ end }}
-<div id="aplayer{{ with .Get "id" }}-{{ . }}{{ end }}" style="margin: 1rem 0;"></div>
-<script src="https://unpkg.com/aplayer@1.10.1/dist/APlayer.min.js"></script>
-<script>
-const ap = new APlayer({
-    container: document.getElementById('aplayer'),
-    audio: [{
-        name: '{{ .Get "name" }}',
-        artist: '{{ .Get "artist" }}',
-        url: '{{ .Get "url" }}',
-        cover: '{{ .Get "cover" }}'
-    }]
-});
-
-ap.on('play', function () {
-  umami.track('🎵 Play music with aPlayer')
-});
-ap.on('ended', function () {
-  umami.track('🎵 Played entiresong with aPlayer')
-});
-</script>
+<div
+  class="lazy-aplayer"
+  data-name="{{ .Get "name" }}"
+  data-artist="{{ .Get "artist" }}"
+  data-url="{{ .Get "url" }}"
+  data-cover="{{ .Get "cover" }}"
+  {{ with .Get "id" }}data-id="{{ . }}"{{ end }}
+  style="margin: 1rem 0;"
+></div>
-- 
cgit v1.2.3