diff --git a/assets/js/friends.js b/assets/js/friends.js new file mode 100644 index 0000000..8564d74 --- /dev/null +++ b/assets/js/friends.js @@ -0,0 +1,57 @@ +const dom = document.getElementById('friends') + +const topk = '{{.Site.Params.friends.topk}}' +const raw = '{{.Site.Params.friends.feeds}}' + +const feeds = raw.replace(/^\[|\]$/g, '').split(' ') + +feeds.forEach(v => fetch(v).then(r => r.text()).then(r => rss(r))) + +/** + * @param {string} xml + */ +function rss(xml) { + xml = xml.trim().replace(/\n/g, '') + const g = xml.matchAll(/<(item|entry)>.*?<\/(item|entry)>/g) + let n = +topk || 2; + while (n) { + const next = g.next() + if (next.done) { + break + } + + // title + const title = next.value[0].match(/(?<=).*(?=<\/title>)/)[0] + + // link + const link = next.value[0].match(/(?<=<(link|id)>).*(?=<\/(link|id)>)/)[0] + + // date + const date = next.value[0].match(/(?<=<(pubDate|updated)>).*(?=<\/(pubDate|updated)>)/)[0] + + // innsert dom + const div = document.createElement('div') + div.className = 'flex justify-between sm:flex-col-reverse my-4 sm:mb-6 sm:mt-3' + div.innerHTML = template(link, title, date) + dom.appendChild(div) + + n--; + } +} + +/** + * @param {string} date + */ +function format(date) { + const d = new Date(date) + return d.toDateString() +} + + +function template() { + const a = arguments + return ` + <a href=${a[0]}>${a[1]}</a> + <div class="sm:mb-2 sm:text-xs">${format(a[2])}</div> + `.trim() +} \ No newline at end of file diff --git a/assets/js/main.js b/assets/js/main.js index 1c8e586..5243f52 100644 --- a/assets/js/main.js +++ b/assets/js/main.js @@ -1,3 +1,4 @@ import "./theme"; import "./style"; -import "./selectable"; \ No newline at end of file +import "./selectable"; +import "./friends"; \ No newline at end of file diff --git a/assets/sass/main.scss b/assets/sass/main.scss index 1afa378..8e948e0 100644 --- a/assets/sass/main.scss +++ b/assets/sass/main.scss @@ -74,6 +74,7 @@ p code { } a { + line-height: 1.5; text-decoration: none; color: inherit; } diff --git a/exampleSite/config.toml b/exampleSite/config.toml index be5e996..b3d1634 100644 --- a/exampleSite/config.toml +++ b/exampleSite/config.toml @@ -97,6 +97,16 @@ name = "rss" url = "/index.xml" svg = "" +# If set, titles and links of the topk newest posts extracted from +# the feeds will be displayed in the home page. Note that the feeds +# providers have to make their 'Access-Control-Allow-Origin' contain +# your domain, otherwise the feeds cannot be fetched. +[params.friends] +feeds = ["https://is.boxmoe.cn/atom.xml", "https://xiabor.com/atom.xml"] +topk = 3 +title = "Friends' Posts" + + # Menu.main is an array that's used to decide what entries can be shown # on the navigator of yur blog. You can use a weight to make them ordered. diff --git a/layouts/index.html b/layouts/index.html index 4e643bb..84b96ad 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -15,5 +15,7 @@ {{ end }} {{ partial "paginator.html" . }} </div> + <h3 class="my-6">{{ .Site.Params.friends.title }}</h3> + <div id="friends"></div> </main> {{ end }} \ No newline at end of file diff --git a/layouts/partials/list.html b/layouts/partials/list.html index 5377082..695712e 100644 --- a/layouts/partials/list.html +++ b/layouts/partials/list.html @@ -1,10 +1,10 @@ -<div class="flex justify-between sm:flex-col-reverse my-4 sm:mb-6 sm:mt-3"> +<div class="flex justify-between sm:flex-col-reverse my-3 sm:mb-6 sm:mt-3"> {{ if .Page.Params.link }} <a class="" href="{{ .Page.Params.link }}">{{ .Title }}</a> {{ else }} <a class="" href="{{ .RelPermalink }}">{{ .Title }}</a> {{ end }} {{ if .Site.Params.displayDate }} - <div class="sm:mb-2 sm:text-sm">{{ dateFormat .Site.Params.timeformat .Date }}</div> + <div class="sm:mb-1 sm:text-xs">{{ dateFormat .Site.Params.timeformat .Date }}</div> {{ end }} </div> \ No newline at end of file diff --git a/testdata/rss.xml b/testdata/rss.xml new file mode 100644 index 0000000..e69de29