mirror of
https://github.com/by-jp/www.byjp.me.git
synced 2025-08-10 19:05:41 +01:00
Adding interactions to clap count
This means that people appreciating my posts on other platforms get a single clap per interaction type (eg. comment or star or repost etc.)
This commit is contained in:
parent
2ab15519b2
commit
aa3c92b9db
8 changed files with 29 additions and 14 deletions
|
@ -33,9 +33,10 @@ const performClap = (e) => {
|
||||||
return data;
|
return data;
|
||||||
})
|
})
|
||||||
.then(data => {
|
.then(data => {
|
||||||
localStorage.setItem(clapKey(btn.parentElement.action), data.claps);
|
const clapCount = addInteractions(btn, data.claps);
|
||||||
|
localStorage.setItem(clapKey(btn.parentElement.action), clapCount);
|
||||||
forEveryClapButton((btn) => {
|
forEveryClapButton((btn) => {
|
||||||
setClapCount(btn, data.claps);
|
setClapCount(btn, clapCount);
|
||||||
}, btn.parentElement.action)
|
}, btn.parentElement.action)
|
||||||
btn.parentElement.classList.add('clapped')
|
btn.parentElement.classList.add('clapped')
|
||||||
btn.disabled = false;
|
btn.disabled = false;
|
||||||
|
@ -54,6 +55,8 @@ const performClap = (e) => {
|
||||||
|
|
||||||
const clapKey = (action) => `clap:${(new URL(action)).pathname}`;
|
const clapKey = (action) => `clap:${(new URL(action)).pathname}`;
|
||||||
|
|
||||||
|
const addInteractions = (btn, claps) => (claps + (btn.dataset.interactions || 0));
|
||||||
|
|
||||||
const setClapCount = (btn, clapCount) => {
|
const setClapCount = (btn, clapCount) => {
|
||||||
if (clapCount === 0) {
|
if (clapCount === 0) {
|
||||||
return
|
return
|
||||||
|
@ -100,8 +103,9 @@ document.addEventListener("DOMContentLoaded", () => {
|
||||||
return res.json()
|
return res.json()
|
||||||
})
|
})
|
||||||
.then(data => {
|
.then(data => {
|
||||||
|
const clapCount = addInteractions(btn, data.claps);
|
||||||
forEveryClapButton((btn) => {
|
forEveryClapButton((btn) => {
|
||||||
setClapCount(btn, data.claps);
|
setClapCount(btn, clapCount);
|
||||||
}, action)
|
}, action)
|
||||||
})
|
})
|
||||||
.catch(console.error)
|
.catch(console.error)
|
||||||
|
|
|
@ -65,12 +65,12 @@ date = ["date", "publishDate", "lastmod", ":git"]
|
||||||
|
|
||||||
[params.defaultSVG]
|
[params.defaultSVG]
|
||||||
post = "document"
|
post = "document"
|
||||||
bookmarks = "bookmark"
|
bookmark = "bookmark"
|
||||||
article-bookmark = "bookmark"
|
article-bookmark = "bookmark"
|
||||||
game-bookmark = "game"
|
game-bookmark = "game"
|
||||||
video-bookmark = "video"
|
video-bookmark = "video"
|
||||||
product-bookmark = "package"
|
product-bookmark = "package"
|
||||||
notes = "message"
|
note = "message"
|
||||||
photo = "camera"
|
photo = "camera"
|
||||||
calendar = "calendar"
|
calendar = "calendar"
|
||||||
review = "review"
|
review = "review"
|
||||||
|
@ -78,8 +78,7 @@ date = ["date", "publishDate", "lastmod", ":git"]
|
||||||
contact = "email"
|
contact = "email"
|
||||||
curiosities = "star"
|
curiosities = "star"
|
||||||
memex = "brain"
|
memex = "brain"
|
||||||
photos = "camera"
|
reading-list = "book"
|
||||||
reading-lists = "book"
|
|
||||||
|
|
||||||
[params.defaultEmoji]
|
[params.defaultEmoji]
|
||||||
posts = "📔"
|
posts = "📔"
|
||||||
|
|
|
@ -1,7 +1,8 @@
|
||||||
{{- $relperma := .url -}}
|
{{- $relperma := .url -}}
|
||||||
{{- $style := .style | default "clap" -}}
|
{{- $style := .style | default "clap" -}}
|
||||||
|
{{- $interactionCount := partial "interaction-count.obj" page -}}
|
||||||
<form class="claps" action="https://{{ site.Params.clapsHost }}{{ $relperma }}" method="post">
|
<form class="claps" action="https://{{ site.Params.clapsHost }}{{ $relperma }}" method="post">
|
||||||
<button type="submit" title="Show appreciation for the post on this page">
|
<button type="submit" title="Show appreciation for the post on this page" data-interactions="{{ $interactionCount }}">
|
||||||
{{- partial "svg.html" (dict "name" $style) -}}
|
{{- partial "svg.html" (dict "name" $style) -}}
|
||||||
{{- $url := printf "https://%s" site.Params.clapsHost -}}
|
{{- $url := printf "https://%s" site.Params.clapsHost -}}
|
||||||
{{- $cacheKey := print $url (now.Format "-2006-01-02-15") -}}
|
{{- $cacheKey := print $url (now.Format "-2006-01-02-15") -}}
|
||||||
|
@ -10,7 +11,8 @@
|
||||||
{{- errorf "%s" . -}}
|
{{- errorf "%s" . -}}
|
||||||
{{- else -}}
|
{{- else -}}
|
||||||
{{- $data := .Content | transform.Unmarshal -}}
|
{{- $data := .Content | transform.Unmarshal -}}
|
||||||
{{- with (index $data $relperma) }}<span>{{ . }}</span>{{ end -}}
|
{{- $clapCount := add $interactionCount ((index $data $relperma) | default 0) -}}
|
||||||
|
{{- with $clapCount }}<span>{{ . }}</span>{{ end -}}
|
||||||
{{- end -}}
|
{{- end -}}
|
||||||
{{- else -}}
|
{{- else -}}
|
||||||
{{- errorf "Unable to get all clap counts" -}}
|
{{- errorf "Unable to get all clap counts" -}}
|
||||||
|
|
8
layouts/partials/interaction-count.obj
Normal file
8
layouts/partials/interaction-count.obj
Normal file
|
@ -0,0 +1,8 @@
|
||||||
|
{{- $interactionIndex := (split .Path "/") | after 1 -}}
|
||||||
|
{{- $interactionCount := 0 -}}
|
||||||
|
{{- if gt (len $interactionIndex) 1 -}}
|
||||||
|
{{- with (index site.Data.interactions $interactionIndex) -}}
|
||||||
|
{{- $interactionCount = len .interactions -}}
|
||||||
|
{{- end -}}
|
||||||
|
{{- end -}}
|
||||||
|
{{- return $interactionCount -}}
|
|
@ -2,7 +2,7 @@
|
||||||
<ul class="menu__inner">
|
<ul class="menu__inner">
|
||||||
{{- $page := .Page -}}
|
{{- $page := .Page -}}
|
||||||
{{ range .Site.Menus.main -}}
|
{{ range .Site.Menus.main -}}
|
||||||
<li class="micro{{ if hasPrefix $page.RelPermalink .URL }} active{{ end }}"><a href="{{ .URL }}" title="{{ .Name }}">{{ partial "svg.html" (dict "name" (index site.Params.defaultSVG .Identifier)) }}<span> {{ .Name }}</span></a></li>
|
<li class="micro{{ if hasPrefix $page.RelPermalink .URL }} active{{ end }}"><a href="{{ .URL }}" title="{{ .Name }}">{{ partial "svg.html" (dict "name" (index site.Params.defaultSVG (.Identifier | singularize))) }}<span> {{ .Name }}</span></a></li>
|
||||||
{{- end }}
|
{{- end }}
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
|
@ -5,7 +5,7 @@
|
||||||
{{- $posts := where .Site.RegularPages "Section" "in" (slice "posts" "bookmarks" "poetry" "reviews") -}}
|
{{- $posts := where .Site.RegularPages "Section" "in" (slice "posts" "bookmarks" "poetry" "reviews") -}}
|
||||||
{{- range $posts.ByDate.Reverse | first 6 -}}
|
{{- range $posts.ByDate.Reverse | first 6 -}}
|
||||||
{{- $postType := partial "post-type.txt" . -}}
|
{{- $postType := partial "post-type.txt" . -}}
|
||||||
{{- $typeSVG := index .Site.Params.defaultSVG ( partial "kebab.txt" $postType) -}}
|
{{- $typeSVG := index .Site.Params.defaultSVG ( partial "kebab.txt" ($postType | singularize)) -}}
|
||||||
<li>
|
<li>
|
||||||
{{ partial "svg.html" (dict "name" $typeSVG) }}
|
{{ partial "svg.html" (dict "name" $typeSVG) }}
|
||||||
<a href="{{.RelPermalink}}">
|
<a href="{{.RelPermalink}}">
|
||||||
|
|
|
@ -8,7 +8,8 @@
|
||||||
{{- $data := .Content | transform.Unmarshal -}}
|
{{- $data := .Content | transform.Unmarshal -}}
|
||||||
{{- $claps := slice -}}
|
{{- $claps := slice -}}
|
||||||
{{- range $path, $count := $data -}}
|
{{- range $path, $count := $data -}}
|
||||||
{{ $claps = $claps | append (dict "path" $path "count" $count) }}
|
{{- $interactionCount := partial "interaction-count.obj" (site.GetPage $path) -}}
|
||||||
|
{{ $claps = $claps | append (dict "path" $path "count" (add $interactionCount $count)) }}
|
||||||
{{- end -}}
|
{{- end -}}
|
||||||
{{- range (sort $claps "count" "desc" | first $count) -}}
|
{{- range (sort $claps "count" "desc" | first $count) -}}
|
||||||
{{- $count := .count -}}
|
{{- $count := .count -}}
|
||||||
|
|
|
@ -8,14 +8,15 @@
|
||||||
{{- $data := .Content | transform.Unmarshal -}}
|
{{- $data := .Content | transform.Unmarshal -}}
|
||||||
{{- $claps := slice -}}
|
{{- $claps := slice -}}
|
||||||
{{- range $path, $count := $data -}}
|
{{- range $path, $count := $data -}}
|
||||||
{{ $claps = $claps | append (dict "path" $path "count" $count) }}
|
{{- $interactionCount := partial "interaction-count.obj" (site.GetPage $path) -}}
|
||||||
|
{{ $claps = $claps | append (dict "path" $path "count" (add $interactionCount $count)) }}
|
||||||
{{- end -}}
|
{{- end -}}
|
||||||
<ol class="small-post-list">
|
<ol class="small-post-list">
|
||||||
{{- range (sort $claps "count" "desc" | first $count) -}}
|
{{- range (sort $claps "count" "desc" | first $count) -}}
|
||||||
{{- $count := .count -}}
|
{{- $count := .count -}}
|
||||||
{{- with site.GetPage .path -}}
|
{{- with site.GetPage .path -}}
|
||||||
{{- $postType := partial "post-type.txt" . -}}
|
{{- $postType := partial "post-type.txt" . -}}
|
||||||
{{- $typeSVG := index site.Params.defaultSVG ( partial "kebab.txt" $postType) -}}
|
{{- $typeSVG := index site.Params.defaultSVG (partial "kebab.txt" ($postType | singularize)) -}}
|
||||||
<li>
|
<li>
|
||||||
{{ partial "svg.html" (dict "name" $typeSVG) }}
|
{{ partial "svg.html" (dict "name" $typeSVG) }}
|
||||||
<a href="{{.RelPermalink}}">
|
<a href="{{.RelPermalink}}">
|
||||||
|
|
Loading…
Reference in a new issue