diff options
| -rw-r--r-- | layout/_partial/scripts.ejs | 5 | ||||
| -rw-r--r-- | layout/post.ejs | 29 |
2 files changed, 33 insertions, 1 deletions
diff --git a/layout/_partial/scripts.ejs b/layout/_partial/scripts.ejs index da0a8a1..2efb659 100644 --- a/layout/_partial/scripts.ejs +++ b/layout/_partial/scripts.ejs @@ -41,6 +41,11 @@ <% if (is_post() && theme.podcast && page.podcast) { %> <script defer src="https://cdn.jsdelivr.net/npm/shikwasa/dist/shikwasa.min.js"></script> <link media="none" onload="media='all'" rel="stylesheet" href="https://cdn.jsdelivr.net/npm/shikwasa/dist/shikwasa.min.css"> + <% if (page.podcast.chapters) { %> + <script defer src="https://cdn.jsdelivr.net/npm/shikwasa/dist/shikwasa.chapter.min.js"></script> + <link media="none" onload="media='all'" rel="stylesheet" + href="https://cdn.jsdelivr.net/npm/shikwasa/dist/shikwasa.chapter.min.css"> + <% } %> <% } %> <!-- Font Awesome delay loading --> diff --git a/layout/post.ejs b/layout/post.ejs index 1e75de4..a9b1f8a 100644 --- a/layout/post.ejs +++ b/layout/post.ejs @@ -17,16 +17,43 @@ <%= page.title %> </h2> <% if (page.podcast) { %> + <script>let chapters = [];</script> <div class="post-podcast-player"></div> + <% if (page.podcast.chapters) { %> + <% + let final = page.podcast.duration; + let timestamps = []; + let data = page.podcast.chapters; + let chapters = []; + (data).forEach((chapter) => { + timestamps.push(chapter[1]); + }); + timestamps.push(final); + for (let index = 0; index < timestamps.length - 1; index++) { + let start = timestamps[index]; + let end = timestamps[index + 1]; + chapters.push({ + title: data[index][0], + startTime: start, endTime: end + }); + }; + %> + <script> + chapters = JSON.parse('<%- JSON.stringify(chapters) %>'); + </script> + <% } %> <script> window.addEventListener("load", () => { + if (chapters !== []) + Shikwasa.use(Chapter); const player = new Shikwasa({ container: () => document.querySelector('.post-podcast-player'), audio: { title: "<%= page.title %>", artist: "<%= page.podcast.authors %>", cover: "<%= page.podcast.cover %>", - src: "<%= page.podcast.media.url %>" + src: "<%= page.podcast.media.url %>", + chapters: chapters }, fixed: { type: "auto", |