fix: aplayer base url

4 files changed, 182 insertions, 165 deletions

diff --git a/exampleSite/config.toml b/exampleSite/config.toml
index 33c6c30..24dd7bb 100644
--- a/exampleSite/config.toml
+++ b/exampleSite/config.toml
@@ -9,8 +9,8 @@ disableKinds = ["taxonomy"]
 ignoreErrors = ["error-disable-taxonomy"]
 
 ## Change this two to switch between different language
-languageCode = "en"  # For RSS, view https://www.rssboard.org/rss-language-codes
-defaultContentLanguage = "en"  # For HTML page, now support: en, zh-hans, zh-hant, ja, nl, pl, it
+languageCode = "en"           # For RSS, view https://www.rssboard.org/rss-language-codes
+defaultContentLanguage = "en" # For HTML page, now support: en, zh-hans, zh-hant, ja, nl, pl, it
 
 summaryLength = 100 # Custom summary length, add <!--more--> in post file to custom split point
 paginate = 10
@@ -18,133 +18,139 @@ paginate = 10
 # googleAnalytics = "UA-000000000-0" # Set your Google Analytics UA here
 
 [outputFormats]
-  [outputFormats.SearchIndex]
-    isPlainText = true
-    notAlternative = true
-    mediaType = "application/json"
-    path = "/search/"
+[outputFormats.SearchIndex]
+isPlainText = true
+notAlternative = true
+mediaType = "application/json"
+path = "/search/"
 
 [outputs]
-  home = ["HTML", "RSS", "SearchIndex"]
+home = ["HTML", "RSS", "SearchIndex"]
 
 [permalinks]
-  post = "/:section/:filename/" # Custom post links, e.g. "/:year/:month/:title/"
+post = "/:section/:filename/" # Custom post links, e.g. "/:year/:month/:title/"
 
 [params]
-  author = "DSRKafuU" # You can also set author in post front matter individually
-  subTitle = "A minimal Hugo theme."
-  defaultTheme = "auto" # default theme when first visit (auto|dark|light)
-
-  # Source URL of the website, will appear in the footer
-  sourceURL = "https://github.com/dsrkafuu/hugo-theme-fuji"
-
-  # Use CloudFlare Workers to accelerate the Google Analytics
-  # If you are using this please comment the googleAnalytics above
-  # Check https://github.com/SukkaW/cloudflare-workers-async-google-analytics for more details
-  # googleAnalyticsTid = "UA-000000000-0"
-  # googleAnalyticsRoute = "https://*.*.workers.dev/"
-
-  # Google AdSense
-  # The AdSense code will be inserted between the head tags of your site.
-  # googleAdsense = "0000000000000000"
-
-  # Word counter and read time indicator in post metadata
-  showWordCounter = true
-  showReadTime = false
-
-  # License in the footer
-  showLicenseInFooter = false
-
-  # License at the end of each post
-  showLicense = true
-  showToc = true
-
-  # Copyright
-  copyrightStartYear = "2020"
-
-  # Open Graph & Twitter Card variables
-  # You can also set description and images in post front matter individually
-  description = "A minimal Hugo theme with nice theme color."
-  og = "/img/og.png" # This will use the image called og.png in static/img folder
-
-  # Posts shown in homepage
-  mainSections = ["post"]
-
-  # Bangumi image chart id
-  # bgmImageChart = "000000"
-
-  # License
-  license = "CC BY-NC-SA 4.0"
-  licenseLink = "http://creativecommons.org/licenses/by-nc-sa/4.0/"
-
-  # Comments
-  # utterances, see: https://utteranc.es/
-  # utterancesRepo = "*/*"
-  # utterancesIssueTerm = "pathname"
-
-  # Disqus, see: https://disqus.com/admin/install/platforms/universalcode/
-  # disqusShortname = "*********"
-  # Also use DisqusJS for accessing from Mainland China, see: https://github.com/SukkaW/DisqusJS
-  # If you want to set multiple api key, see theme's README for more details
-  # disqusJSApi = "https://*********/"
-  # disqusJSApikey = "**********"
-
-  # custom lazyload placeholder
-  # 16:9
-  lazyPlaceholder = "/assets/lazyload/dsrca_loading_480x270.svg"
-  # 32:9
-  lazyPlaceholderRow = "/assets/lazyload/dsrca_loading_960x270.svg"
-  # 8:9
-  lazyPlaceholderCol = "/assets/lazyload/dsrca_loading_480x540.svg"
-
-  # Let images display in full brightness under dark mode
-  # disableDarkImage = true
+author = "DSRKafuU"                # You can also set author in post front matter individually
+subTitle = "A minimal Hugo theme."
+defaultTheme = "auto"              # default theme when first visit (auto|dark|light)
+
+# Source URL of the website, will appear in the footer
+sourceURL = "https://github.com/dsrkafuu/hugo-theme-fuji"
+
+# Use CloudFlare Workers to accelerate the Google Analytics
+# If you are using this please comment the googleAnalytics above
+# Check https://github.com/SukkaW/cloudflare-workers-async-google-analytics for more details
+# googleAnalyticsTid = "UA-000000000-0"
+# googleAnalyticsRoute = "https://*.*.workers.dev/"
+
+# Google AdSense
+# The AdSense code will be inserted between the head tags of your site.
+# googleAdsense = "0000000000000000"
+
+# Word counter and read time indicator in post metadata
+showWordCounter = true
+showReadTime = false
+
+# License in the footer
+showLicenseInFooter = false
+
+# License at the end of each post
+showLicense = true
+showToc = true
+
+# Copyright
+copyrightStartYear = "2020"
+
+# Open Graph & Twitter Card variables
+# You can also set description and images in post front matter individually
+description = "A minimal Hugo theme with nice theme color."
+og = "/img/og.png"                                          # This will use the image called og.png in static/img folder
+
+# Posts shown in homepage
+mainSections = ["post"]
+
+# Bangumi image chart id
+# bgmImageChart = "000000"
+
+# License
+license = "CC BY-NC-SA 4.0"
+licenseLink = "http://creativecommons.org/licenses/by-nc-sa/4.0/"
+
+# Comments
+# utterances, see: https://utteranc.es/
+# utterancesRepo = "*/*"
+# utterancesIssueTerm = "pathname"
+
+# Disqus, see: https://disqus.com/admin/install/platforms/universalcode/
+# disqusShortname = "*********"
+# Also use DisqusJS for accessing from Mainland China, see: https://github.com/SukkaW/DisqusJS
+# If you want to set multiple api key, see theme's README for more details
+# disqusJSApi = "https://*********/"
+# disqusJSApikey = "**********"
+
+# custom lazyload placeholder
+# 16:9
+lazyPlaceholder = "/assets/lazyload/dsrca_loading_480x270.svg"
+# 32:9
+lazyPlaceholderRow = "/assets/lazyload/dsrca_loading_960x270.svg"
+# 8:9
+lazyPlaceholderCol = "/assets/lazyload/dsrca_loading_480x540.svg"
+
+# Let images display in full brightness under dark mode
+# disableDarkImage = true
 
 [markup]
-  [markup.goldmark]
-    [markup.goldmark.renderer]
-      unsafe = true  # Enable user to embed HTML snippets in Markdown content
-  [markup.highlight]
-    codeFences = false  # Disable Hugo's code highlighter
+[markup.goldmark]
+[markup.goldmark.renderer]
+unsafe = true # Enable user to embed HTML snippets in Markdown content
+[markup.highlight]
+codeFences = false # Disable Hugo's code highlighter
 
-  [markup.tableOfContents]
-    startLevel = 2
-    endLevel = 3
+[markup.tableOfContents]
+startLevel = 2
+endLevel = 3
 
 [taxonomies]
-  tag = "tags"
+tag = "tags"
 
 [menu]
-  [[menu.nav]]
-    name = "Home"
-    url = "/"
-    weight = 1
-  [[menu.nav]]
-    name = "Archives"
-    url = "/archives/"
-    weight = 2
-  [[menu.nav]]
-    name = "About"
-    url = "/about/"
-    weight = 3
-  [[menu.nav]]
-    name = "Search"
-    url = "/search/"
-    weight = 4
-  [[menu.nav]]
-    name = "RSS"
-    url = "/index.xml"
-    weight = 5
-
-  [[menu.link]]
-    name = "GitHub"
-    url = "https://github.com/dsrkafuu"
-    weight = 1
-  [[menu.link]]
-    name = "Twitter"
-    url = "https://twitter.com/dsrkafuu"
-    weight = 2
-  [[menu.link]]
-    name = "bilibili"
-    url = "https://space.bilibili.com/19767474"
-    weight = 3
+[[menu.nav]]
+name = "Home"
+url = "/"
+weight = 1
+[[menu.nav]]
+name = "Archives"
+url = "/archives/"
+weight = 2
+[[menu.nav]]
+name = "About"
+url = "/about/"
+weight = 3
+[[menu.nav]]
+name = "Search"
+url = "/search/"
+weight = 4
+[[menu.nav]]
+name = "RSS"
+url = "/index.xml"
+weight = 5
+
+[[menu.link]]
+name = "GitHub"
+url = "https://github.com/dsrkafuu"
+weight = 1
+[[menu.link]]
+name = "Twitter"
+url = "https://twitter.com/dsrkafuu"
+weight = 2
+[[menu.link]]
+name = "bilibili"
+url = "https://space.bilibili.com/19767474"
+weight = 3
+
+[build]
+noJSConfigInAssets = true
+
+[security]
+enableInlineShortcodes = true
diff --git a/exampleSite/content/post/aplayer-test.md b/exampleSite/content/post/aplayer-test.md
index c4dfd1c..a50409c 100644
--- a/exampleSite/content/post/aplayer-test.md
+++ b/exampleSite/content/post/aplayer-test.md
@@ -7,7 +7,7 @@ aplayer = true
 showLicense = false
 +++
 
-{{< aplayer urls="/theme/hugo-theme-fuji/aplayer/berlin.mp3" names="Berlin" artists="Crowander" covers="/theme/hugo-theme-fuji/aplayer/crowander.jpg" >}}
+{{< aplayer urls="/aplayer/berlin.mp3" names="Berlin" artists="Crowander" covers="/aplayer/crowander.jpg" >}}
 
 This post is for in-post APlayer test, above is previous post-player.
 
@@ -17,17 +17,18 @@ Music files are all downloaded from [Free Music Archive](https://freemusicarchiv
 
 ## Single file
 
-{{< aplayer urls="/theme/hugo-theme-fuji/aplayer/fluid.mp3" names="Fluid" artists="Crowander" covers="/theme/hugo-theme-fuji/aplayer/crowander.jpg" >}}
+{{< aplayer urls="/aplayer/fluid.mp3" names="Fluid" artists="Crowander" covers="/aplayer/crowander.jpg" >}}
 
 ## Multiple files
 
 You can open the playlist to check other musics.
 
-{{< aplayer
-    urls="/theme/hugo-theme-fuji/aplayer/berlin.mp3, /theme/hugo-theme-fuji/aplayer/fluid.mp3, /theme/hugo-theme-fuji/aplayer/morning.mp3"
-    names="Berlin, Fluid, Morning"
-    artists="Crowander, Crowander, Crowander"
-    covers="/theme/hugo-theme-fuji/aplayer/crowander.jpg, /theme/hugo-theme-fuji/aplayer/crowander.jpg, /theme/hugo-theme-fuji/aplayer/crowander.jpg"
+{{<
+  aplayer
+  urls="/aplayer/berlin.mp3, /aplayer/fluid.mp3, /aplayer/morning.mp3"
+  names="Berlin, Fluid, Morning"
+  artists="Crowander, Crowander, Crowander"
+  covers="/aplayer/crowander.jpg, /aplayer/crowander.jpg, /aplayer/crowander.jpg"
 >}}
 
 Spaces between multiple items can be omited.
diff --git a/layouts/partials/scripts-end.html b/layouts/partials/scripts-end.html
index 11329ef..ec4cbfe 100644
--- a/layouts/partials/scripts-end.html
+++ b/layouts/partials/scripts-end.html
@@ -17,48 +17,57 @@
 {{ with .Params.aplayer }}
 <script src="https://cdn.jsdelivr.net/npm/aplayer@1.10.1/dist/APlayer.min.js"></script>
 <script>
-  // in-post aplayer
-  var pContainers = document.querySelectorAll('.content article .post-aplayer');
-  if (pContainers && pContainers.length > 0) {
-    pContainers.forEach(function (container) {
-      var attrs = ['urls', 'names', 'artists', 'covers'];
-      attrs = attrs.map(function (attr) {
-        var arr = container.getAttribute('data-' + attr).replace(/( |%20)/ig, '').split(',');
-        if (arr.length > 0){
-          return arr.map(function (val) {
-            return String(val).trim();
-          });
-        } else {
-          return attr;
+  (function () {
+    function parseBasePath(basePath, rawURL) {
+      if (!/^\/[^/]/.test(rawURL)) {
+        return rawURL;
+      }
+      return rawURL.replace(/^\//, basePath + '/').replace(/\/\//g, '/');
+    }
+    // in-post aplayer
+    var pContainers = document.querySelectorAll('.content article .post-aplayer');
+    if (pContainers && pContainers.length > 0) {
+      pContainers.forEach(function (container) {
+        var attrs = ['urls', 'names', 'artists', 'covers', 'base'];
+        attrs = attrs.map(function (attr) {
+          var arr = container.getAttribute('data-' + attr).replace(/( |%20)/ig, '').split(',');
+          if (arr.length > 0){
+            return arr.map(function (val) {
+              return String(val).trim();
+            });
+          } else {
+            return attr;
+          }
+        });
+        var basePath = new URL(attrs[4][0] || '/', 'https://example.org').pathname;
+        var audio = [];
+        for (var i = 0; i < attrs[0].length; i++) {
+          var a = {
+            name: attrs[1][i],
+            url: parseBasePath(basePath, attrs[0][i]),
+          };
+          (typeof attrs[2] !== 'string') && (a.artist = attrs[2][i]);
+          (typeof attrs[3] !== 'string') && (a.cover = parseBasePath(basePath, attrs[3][i]));
+          audio.push(a);
         }
+        new APlayer({
+          container: container,
+          theme: '#8f82bc',
+          volume: 0.1,
+          listFolded: true,
+          audio: audio
+        });
       });
-      var audio = [];
-      for (var i = 0; i < attrs[0].length; i++) {
-        var a = {
-          name: attrs[1][i],
-          url: attrs[0][i],
-        };
-        (typeof attrs[2] !== 'string') && (a.artist = attrs[2][i]);
-        (typeof attrs[3] !== 'string') && (a.cover = attrs[3][i]);
-        audio.push(a);
+    }
+    // aplayer toc anchors fix
+    // see https://github.com/MoePlayer/APlayer/issues/242#issuecomment-602471423
+    document.addEventListener('DOMContentLoaded', function () {
+      var issueTocEle = document.querySelector('.sidebar-toc');
+      if (issueTocEle) {
+        var newTocEle = issueTocEle.cloneNode(true);
+        issueTocEle.parentNode.replaceChild(newTocEle, issueTocEle);
       }
-      new APlayer({
-        container: container,
-        theme: '#8f82bc',
-        volume: 0.1,
-        listFolded: true,
-        audio: audio
-      });
     });
-  }
-  // aplayer toc anchors fix
-  // see https://github.com/MoePlayer/APlayer/issues/242#issuecomment-602471423
-  document.addEventListener('DOMContentLoaded', function () {
-    var issueTocEle = document.querySelector('.sidebar-toc');
-    if (issueTocEle) {
-      var newTocEle = issueTocEle.cloneNode(true);
-      issueTocEle.parentNode.replaceChild(newTocEle, issueTocEle);
-    }
-  });
+  })();
 </script>
 {{ end }}
diff --git a/layouts/shortcodes/aplayer.html b/layouts/shortcodes/aplayer.html
index 37ed544..e02adce 100644
--- a/layouts/shortcodes/aplayer.html
+++ b/layouts/shortcodes/aplayer.html
@@ -1,6 +1,7 @@
 <div class="post-player-wrapper">
   <div
     class="post-aplayer"
+    data-base="{{- .Site.BaseURL -}}"
     data-urls="{{- .Get "urls" -}}"
     data-names="{{- .Get "names" -}}"
     {{ with .Get "artists" -}}data-artists="{{- . -}}"{{- end }}