diff options
| author | Doge <[email protected]> | 2021-05-08 01:21:15 +0800 |
|---|---|---|
| committer | Doge <[email protected]> | 2021-05-08 01:21:15 +0800 |
| commit | 04ecc3472802ec02f943a63683d3e311bfc19613 (patch) | |
| tree | c540479c0d72b6ded8ee25eb6cea95b474079870 /layout | |
| parent | e93cc42f9225f22094a19746f01f5cca99eeba1f (diff) | |
| download | chromate-04ecc3472802ec02f943a63683d3e311bfc19613.tar.gz chromate-04ecc3472802ec02f943a63683d3e311bfc19613.tar.bz2 chromate-04ecc3472802ec02f943a63683d3e311bfc19613.zip | |
Add podcast player support
Thanks to Shikwasa :+1:
Diffstat (limited to 'layout')
| -rw-r--r-- | layout/_partial/scripts.ejs | 2 | ||||
| -rw-r--r-- | layout/index.ejs | 13 | ||||
| -rw-r--r-- | layout/post.ejs | 23 |
3 files changed, 30 insertions, 8 deletions
diff --git a/layout/_partial/scripts.ejs b/layout/_partial/scripts.ejs index 1b20314..a60011f 100644 --- a/layout/_partial/scripts.ejs +++ b/layout/_partial/scripts.ejs @@ -19,7 +19,7 @@ <!-- Highlight.js support --> <% if (theme.highlight.enable === true) { %> - <script src="https://cdn.jsdelivr.net/npm/[email protected]/highlight.pack.min.js"></script> + <script defer src="https://cdn.jsdelivr.net/npm/[email protected]/highlight.pack.min.js"></script> <link id="highlight-light-theme" rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/styles/<%= theme.highlight.lightmode %>.min.css"> <link id="highlight-dark-theme" rel="stylesheet" diff --git a/layout/index.ejs b/layout/index.ejs index ae1db98..42f1a4f 100644 --- a/layout/index.ejs +++ b/layout/index.ejs @@ -24,14 +24,15 @@ <!-- Post meta --> <div class="post-meta"> - <% if (post.podcast && theme.podcast && post.duration) { %> + <% if (post.podcast && theme.podcast) { %> <% - const hour = Math.floor(post.duration / 3600); - const minute = Math.floor((post.duration / 60) % 60); - const second = Math.floor(post.duration % 60); - const duration = hour + ':' + String(minute).padStart(2, '0') + ':' + String(second).padStart(2, '0'); + const duration = post.podcast.duration; + const hour = Math.floor(duration / 3600); + const minute = Math.floor((duration / 60) % 60); + const second = Math.floor(duration % 60); + const viewstr = hour + ':' + String(minute).padStart(2, '0') + ':' + String(second).padStart(2, '0'); %> - <div class="post-duration"><%- duration %></div> + <div class="post-duration"><%- viewstr %></div> <% } %> <div class="post-time"> <%- date(post.date, "MMM, D YYYY") %> diff --git a/layout/post.ejs b/layout/post.ejs index 0de6e5a..d83d694 100644 --- a/layout/post.ejs +++ b/layout/post.ejs @@ -2,10 +2,31 @@ <!-- Post thumbnail with lazayload support --> <div class="post-thumbnail" style="background-image: url('<%= page.thumbnail %>');"></div> + <!-- Podcast Player using Shikwasa --> + <% if (page.podcast) { %> + <div class="post-podcast-player"></div> + <script> + window.addEventListener("load", () => { + const player = new Shikwasa({ + container: () => document.querySelector('.post-podcast-player'), + audio: { + title: "<%= page.title %>", + artist: "<%= page.podcast.author %>", + cover: "<%= page.podcast.thumbnail %>", + src: "<%= page.podcast.media %>" + }, + fixed: { + type: "static" + } + }); + }, false); + </script> + <% } %> + <!-- Post title and content --> <div class="post-meta"> <div class="post-time"> - <%- date(page.date, "MMM, D YYYY" ) %> + <%- date(page.date, "MMM, D YYYY") %> </div> </div> <h1 class="post-title"><%= page.title %></h1> |