blog/layouts/shortcodes/aplayer.html

99 lines
2.4 KiB
HTML

<!-- require APlayer -->
<link rel="stylesheet" href="/css/APlayer.css">
<script src="/js/APlayer.js"></script>
<div id="aplayer"></div>
<script>
const ap = new APlayer({
container: document.getElementById('aplayer'),
{{ with .Get "fixed" }}
fixed: {{- . -}},
{{ end }}
{{ with .Get "mini" }}
mini: {{- . -}},
{{ end }}
{{ with .Get "autoplay" }}
autoplay: {{- . -}},
{{ end }}
{{ with .Get "cover" }}
cover: "{{ . }}",
{{ end }}
{{ with .Get "theme" }}
theme: "{{ . }}",
{{ end }}
{{ with .Get "loop" }}
loop: "{{ . }}",
{{ end }}
{{ with .Get "order" }}
order: "{{ . }}",
{{ end }}
{{ with .Get "preload" }}
preload: "{{ . }}",
{{ end }}
{{ with .Get "volume" }}
volume: {{- . -}},
{{ end }}
{{ with .Get "mutex" }}
mutex: {{- . -}},
{{ end }}
{{ with .Get "lrc-type" }}
lrcType: {{- . -}},
{{ end }}
{{ with .Get "lrc-folded" }}
listFolded: {{- . -}},
{{ end }}
{{ with .Get "list-max-height" }}
listMaxHeight: {{- . -}},
{{ end }}
{{ with .Get "storage-name" }}
storageName: "{{ . }}",
{{ end }}
audio: [
{{- range $i, $v := split ($.Get "name") "," -}}
{{ if $i}},{{ end }}
{
name: "{{ $v }}",
url: "{{ index (split ($.Get "url") ",") $i }}",
{{ with index (split ($.Get "duration") ",") $i }}
duration: "{{ . }}",
{{ end }}
{{ with index (split ($.Get "artist") ",") $i }}
artist: "{{ . }}",
{{ end }}
{{ with index (split ($.Get "cover") ",") $i }}
cover: "{{ . }}",
{{ end }}
{{ with index (split ($.Get "lrc") ",") $i }}
lrc: "{{ . }}"
{{ end }}
}
{{- end -}}
]
});
// You can call Aplayer APIs directly in your inner shortcodes.
{{ .Inner | safeJS }}
</script>