Updates

content/meta.json

@@ -23,7 +23,7 @@
   "nostr": "npub1qv02xpsc3lhxxx5x7xswf88w3u7kykft9ea7t78tz7ywxf7mxs9qrxujnc",
   "nostrTalk": "npub1talku5l4z88dys5eg8zvz8em2qxv8nfxxanjszzdsrmke0ssaekqqxvkq9",
   "ticker": [
-    "Sende uns einen Shout-Out: 21.000 Sats und du bist dabei",
+    "Sende uns einen Shoutout: 21.000 Sats und du bist dabei",
     "\"Hosp oder top!\" ist Spiel des Jahres 2020",
     "Sei kein Holger, lass einen Fullnode laufen!",
     "Sei kein Vollknoten, komm in die Gruppe!",

helpers.js

@@ -37,17 +37,10 @@ const truncate = (str, wordCount) => {
   return [head, tail]
 }
 
-const memberUrl = member => {
-  if (member.url) return member.url
-  else if (member.nostr) return `https://snort.social/p/${member.nostr}`
-  else if (member.twitter) return `https://twitter.com/${member.twitter}`
-}
-
 module.exports = {
   markdown: mdTransformer.render,
   replacements,
   slugify,
   stripHTML,
-  truncate,
+  truncate
-  memberUrl
 }

src/css/sections/meetups.css

@@ -15,8 +15,7 @@
     margin-top: var(--space-xl);
 
     & img,
-    & .dot,
+    & .dot {
-    & .tooltip {
       display: none;
     }
   }
@@ -80,16 +79,6 @@
         animation-name: pulse;
       }
     }
-
-    & .tooltip {
-      position: absolute;
-      z-index: 2;
-      min-width: 7rem;
-      font-size: .65rem;
-      padding: var(--space-xs) var(--space-m);
-      background: var(--color-overlay-bg);
-      border-radius: var(--border-radius);
-    }
   }
 }
 

src/css/sections/team.css

@@ -1,53 +1,22 @@
 #team {
-  & .members {
-    display: grid;
-    grid-gap: var(--space-xl);
-    margin: 0;
-    list-style: none;
-
-    @media (--up_to_M) {
-      grid-template-columns: 1fr;
-    }
-    @media (--M_and_up) {
-      grid-template-columns: 1fr 1fr;
-    }
-  }
-
   & .member {
-    margin: 0;
+    display: flex;
-    padding: var(--space-xl);
+    flex-wrap: wrap;
-    border-radius: var(--space-l);
+    gap: var(--space-l);
-    background-color: var(--color-card-bg);
-    transition-property: background-color;
-    transition-duration: var(--transition-duration-fast);
 
     & img {
-      display: inline-block;
       border-radius: 50%;
       height: 100px;
       width: 100px;
     }
 
-    & header {
+    & .info {
-      display: flex;
+      flex: 1 0 17rem;
-      flex-wrap: wrap;
+      min-width: 10rem;
-      align-items: center;
-      justify-content: space-between;
-      margin-top: var(--space-l);
-    }
-
-    & h2 {
-      font-size: var(--font-size-xl);
-      margin: 0 var(--space-l) var(--space-l) 0;
-    }
-
-    & p {
-      margin-bottom: 0;
     }
 
     & .links {
       display: flex;
-      margin-bottom: var(--space-l);
 
       & a {
         color: var(--color-secondary);

src/episode.pug

@@ -26,17 +26,3 @@ block main
 
       .content
         !=episode.content
-
-        if episode.participants.length
-          h2 Teilnehmer
-          ul.partcipants
-            for participant in episode.participants
-              - const member = team[participant.toLowerCase()]
-              li
-                if member
-                  a(href=memberUrl(member))
-                    img.avatar(src=assetPath(member.image || "/img/avatar.svg") alt=member.name)
-                    span= member.name
-                else
-                  img.avatar(src=assetPath("/img/avatar.svg") alt=participant)
-                  span= participant

src/includes/mixins.pug

@@ -18,27 +18,6 @@ mixin categories(current)
     li: a(href="/podcast/on-tour/" class=(current === 'On Tour' && 'current')).on-tour On Tour
     li: a(href="/podcast/verschiedenes/" class=(current === 'Verschiedenes' && 'current')).verschiedenes Verschiedenes
 
-mixin member(m)
-  li.member(id=m.name)
-    img(src=assetPath(m.image || "/img/avatar.svg") alt=m.name loading="lazy")
-    header
-      h2=m.name
-      .links
-        if m.nostr
-          a(href=`https://snort.social/p/${m.nostr}` target="_blank" rel="nofollow noopener" title=`${m.name} on Nostr`)
-            +sprite("nostr")
-        if m.twitter
-          a(href=`https://twitter.com/${m.twitter}` target="_blank" rel="nofollow noopener" title=`${m.name} on Twitter`)
-            +sprite("twitter")
-        if m.github
-          a(href=`https://github.com/${m.github}` target="_blank" rel="nofollow noopener" title=`${m.name} on GitHub`)
-            +sprite("github")
-        if m.url
-          a(href=m.url target="_blank" rel="nofollow noopener")
-            +sprite("url")
-    if m.text
-      !=markdown(m.text)
-
 mixin map(id, markers)
   - const modalId = `modal-${id}`
   .vectorMap(id=id)
@@ -127,16 +106,17 @@ mixin spende(d, trunc = false)
 
 mixin participants(ps, link)
   .participants
-    for participant in ps
+    for name in ps
-      - const member = team[participant.toLowerCase()]
+      - const id = name.toLowerCase()
+      - const member = team[id]
       if member
         if link
-          a(href=memberUrl(member))
+          a(href=`/team/${slugify(id)}` title=member.name)
             img.avatar(src=assetPath(member.image || "/img/avatar.svg") alt=member.name)
         else
           img.avatar(src=assetPath(member.image || "/img/avatar.svg") alt=member.name)
       else
-        img.avatar(src=assetPath("/img/avatar.svg") alt=participant)
+        img.avatar(src=assetPath("/img/avatar.svg") alt=name)
 
 mixin episodeItem(e)
   article.episodeItem&attributes(attributes)

src/includes/template.pug

@@ -27,17 +27,17 @@ html(lang="de")
                 a(href="/meetups/" class=(navCurrent === 'meetups' && 'current')) Meetups
                 a(href="https://portal.einundzwanzig.space/de/event/overview?l=de" rel="nofollow noopener") Events
                 a(href="https://portal.einundzwanzig.space/de/school/city?l=de" rel="nofollow noopener") Kurse
-                a(href="/spenden/" class=(navCurrent === 'spenden' && 'current')) Spenden
                 a(href="/telegram/" class=(navCurrent === 'telegram' && 'current')) Telegram
                 a(href="/shops/" class=(navCurrent === 'shops' && 'current')) Shops
                 a(href=site.meta.youtubeUrl target="_blank" rel="nofollow noopener") YouTube
-                a(href=site.meta.shoutoutUrl target="_blank" rel="nofollow noopener") Shout-Out
+                a(href=site.meta.shoutoutUrl target="_blank" rel="nofollow noopener") Shoutout
             .navItem
               a(href="#" onclick="return false;") Mehr
               .more
+                a(href="/verein/" class=(navCurrent === 'verein' && 'current')) Verein
+                a(href="/spenden/" class=(navCurrent === 'spenden' && 'current')) Spenden
                 a(href="/media/" class=(navCurrent === 'media' && 'current')) Media
                 a(href="/soundboard/" class=(navCurrent === 'soundboard' && 'current')) Sounds
-                a(href="/verein/" class=(navCurrent === 'verein' && 'current')) Verein
                 a(href="/kontakt/" class=(navCurrent === 'kontakt' && 'current')) Kontakt
           button(type="button").theme
             +sprite("theme")

src/index.pug

@@ -79,12 +79,12 @@ block main
       :markdown-it(html linkify typographer)
         ## 🗣 Sei laut, shout out!
 
-        Wenn du möchtest, dass wir im Podcast deinen "Shout-Out" vorlesen, dann bist du mit 21.000 Sats dabei!
+        Wenn du möchtest, dass wir im Podcast deinen Shoutout vorlesen, dann bist du mit 21.000 Sats dabei!
         Wir sammeln alle Einnahmen bis die 1.000.000 Sats voll sind. Dann lassen wir in unserer Telegram-Gruppe
         darüber abstimmen welches Bitcoin-Projekt aus Deutschland diese kostbaren Sats bekommen soll.
-        Wenn du also einen Shout-Out in unserem Podcast kaufst, [unterstützt](/spenden/) du damit auch ein Bitcoin Projekt.
+        Wenn du also einen Shoutout in unserem Podcast kaufst, [unterstützt](/spenden/) du damit auch ein Bitcoin Projekt.
 
-      a.button(href=site.meta.shoutoutUrl target="_blank" rel="nofollow noopener") Shout-Out senden
+      a.button(href=site.meta.shoutoutUrl target="_blank" rel="nofollow noopener") Shoutout senden
 
     section#youtube
       :markdown-it(html linkify typographer)

src/kurse.pug

@@ -1,45 +0,0 @@
-extends /template.pug
-
-block vars
-  - const title = 'Bitcoin-Kurse'
-  - const description = 'Eine Liste von Bitcoin-Kursen und Lehrveranstaltungen im D/A/CH-Raum.'
-  - const filterUnmapped = (list) => list.filter(kurs => !kurs.top || !kurs.left)
-  - const unmapped = filterUnmapped(kurse)
-  - const style = m => m.top && m.left ? `top:${m.top}%;left:${m.left}%;` : null
-  - const clss = m => m.top && m.left ? null : 'unmapped'
-  - let j = 0
-
-block main
-  #kurse.wrap
-    section
-      h1= title
-      p= description
-
-      :markdown-it(html linkify typographer)
-        Neue Kurse können gerne [per Pull Request](https://github.com/Einundzwanzig-Podcast/einundzwanzig.space/edit/master/content/kurse.json) hinzugefügt werden.
-        Hier gibt es ein [Video-Tutorial](https://www.youtube.com/watch?v=BNJc9LExEzU), wie ein neuer Pull Request erstellt werden kann.
-        Die Werte für `top/left` geben prozentual die Position des Ortes auf der Karte an.
-
-        Außerdem findest du hier unsere [Präsentationsvorlage](https://github.com/Einundzwanzig-Podcast/slides) mit der du eine Ausgangsbasis für deine Vorträge hast.
-
-      #map
-        h2 Lehrveranstaltungen im D/A/CH-Raum
-        ul.kurse
-          each m in kurse
-            li.official(class=clss(m) style=style(m))
-              a(href=m.url target="_blank" rel="nofollow noopener")
-                .dot(style=`animation-delay:${((j*2000) + random(3000))}ms;animation-duration:${kurse.length*2}s;`)
-                = m.name
-              - j++
-
-        img#dach(src=assetPath('/img/dach.svg') alt="DE, AT, CH")
-        #tooltip.tooltip(hidden)
-
-      if unmapped.length
-        #unmapped
-          h2 Weitere Kurse
-          ul.kurse
-            each m in unmapped
-              li(class=clss(m) style=style(m))
-                a(href=m.url target="_blank" rel="nofollow noopener")
-                  = m.name

src/member.pug

@@ -0,0 +1,35 @@
+extends /template.pug
+
+block vars
+  - const title = member.name
+  - const description = member.text
+block main
+  #team.wrap
+    section
+      h1= title
+
+      .member
+        img(src=assetPath(member.image || "/img/avatar.svg") alt=member.name)
+        .info
+          if member.text
+            !=markdown(member.text)
+          .links
+            if member.nostr
+              a(href=`https://snort.social/p/${member.nostr}` target="_blank" rel="nofollow noopener" title=`${member.name} on Nostr`)
+                +sprite("nostr")
+            if member.twitter
+              a(href=`https://twitter.com/${member.twitter}` target="_blank" rel="nofollow noopener" title=`${member.name} on Twitter`)
+                +sprite("twitter")
+            if member.github
+              a(href=`https://github.com/${member.github}` target="_blank" rel="nofollow noopener" title=`${member.name} on GitHub`)
+                +sprite("github")
+            if member.url
+              a(href=member.url target="_blank" rel="nofollow noopener")
+                +sprite("url")
+
+    if episodes.length
+      section
+        h2= `Episoden mit ${member.name}`
+        .episodes
+          each e in episodes
+            +episodeItem(e)

src/spenden.pug

@@ -2,7 +2,7 @@ extends /template.pug
 
 block vars
   - const title = 'Spenden'
-  - const description = 'Die folgenden Projekte, Initiativen und Entwickler haben wir mit den Shout-Out-Beiträgen der Community bereits unterstützt.'
+  - const description = 'Die folgenden Projekte, Initiativen und Entwickler haben wir mit den Shoutout-Beiträgen der Community bereits unterstützt.'
 
 block main
   #spenden.wrap

static/js/main.js

@@ -161,20 +161,4 @@ document.addEventListener("DOMContentLoaded", () => {
   document.querySelectorAll('[data-modal]').forEach(modalLink => {
     modalLink.addEventListener('click', e => toggleModal(modalLink.dataset.modal))
   })
-
-  // Map
-  const map = document.getElementById('map')
-  const mapImg = document.getElementById('dach')
-  const tooltip = document.getElementById('tooltip')
-  if (map && mapImg && tooltip) {
-    mapImg.onclick = e => {
-      const top = Math.round((e.offsetY / e.target.height) * 100) - 2
-      const left = Math.round((e.offsetX / e.target.width) * 100) + 1
-      console.log({ top, left }, map)
-      tooltip.innerText = `Top: ${top} / Left: ${left}`
-      tooltip.removeAttribute('hidden')
-      tooltip.style.top = `${top + 1}%`
-      tooltip.style.left = `${left}%`
-    }
-  }
 })

tasks/fetch_feed.js

@@ -1,6 +1,6 @@
 const { writeFileSync } = require('fs')
 const { join, resolve } = require('path')
-const { replacements, slugify, stripHTML, memberUrl } = require('../helpers')
+const { replacements, slugify, stripHTML } = require('../helpers')
 const { masterFeedUrl, publicFeedUrl } = require('../content/meta.json')
 const team = require('../content/team.json')
 const request = require('sync-request')
@@ -67,7 +67,7 @@ const parseEpisode = e => {
   const duration = e['itunes:duration']
   const enclosure = e.enclosure.__attr
   const [, participantsString] =
-    firstLine.match(/(?:(?:von\sund\s)?mit\s)([^.]*)/i) || []
+    firstLine.match(/[-–—]\s?(?:(?:von\sund\s)?mit\s)([^.]*)/i) || []
   const participants = participantsString
     ? participantsString
         .replace(/(\s*,\s*|\s*und\s*|\s*&\s*)/gi, '%')
@@ -107,15 +107,8 @@ const parseEpisode = e => {
 
   const feed = parser.parse(xml)
   const episodes = []
-  const _noParticipants = [],
+  const _noParticipants = [], _noNode = []
-    _noNode = []
+  const members = [team.dennis, team.fab, team.gigi, team.markus, team.daniel]
-  const members = [
-    { name: 'Dennis', ...team.dennis.v4v },
-    { name: 'Fab', ...team.fab.v4v },
-    { name: 'Gigi', ...team.gigi.v4v },
-    { name: 'Markus', ...team.markus.v4v },
-    { name: 'Daniel', ...team.daniel.v4v }
-  ]
 
   // remove invalid tag
   delete feed.rss.channel.author
@@ -128,9 +121,10 @@ const parseEpisode = e => {
     },
     'podcast:valueRecipient': members.map(p => ({
       __attr: {
-        ...p,
+        name: p.name,
         type: 'node',
-        split: Math.round(100 / members.length)
+        split: Math.round(100 / members.length),
+        ...p.v4v
       }
     }))
   }

tasks/generate_pages.js

@@ -1,14 +1,13 @@
 const pug = require('pug')
 const { mkdirSync, writeFileSync } = require('fs')
 const { dirname, resolve } = require('path')
-
+const { slugify } = require('../helpers')
 const config = require('../pug.config')
 const site = require('../generated/site-data.json')
 const episodes = require('../generated/episodes.json')
 const spendenregister = require('../generated/spendenregister.json')
 const spendenuebersicht = require('../content/spendenuebersicht.json').reverse()
 const team = require('../content/team.json')
-const kurse = require('../content/kurse.json')
 const shops = require('../content/shops.json')
 const soundboard = require('../content/soundboard.json')
 const adventskalender = require('../content/adventskalender-2022.json')
@@ -44,7 +43,6 @@ renderPage('index', 'index', { navCurrent: 'index', currentEpisode: episodes[0],
 renderPage('podcast', 'podcast', { navCurrent: 'podcast', episodes: [...episodes], team })
 renderPage('adventskalender', 'adventskalender', { adventskalender })
 renderPage('meetups', 'meetups', { navCurrent: 'meetups', meetups: site.meetups })
-renderPage('kurse', 'kurse', { navCurrent: 'kurse', kurse })
 renderPage('spenden', 'spenden', { navCurrent: 'spenden', spendenregister, spendenuebersicht })
 renderPage('media', 'media', { navCurrent: 'media' })
 renderPage('soundboard', 'soundboard', { navCurrent: 'soundboard', soundboard })
@@ -56,4 +54,10 @@ renderPage('datenschutz', 'datenschutz', { navCurrent: 'datenschutz' })
 renderPage('adventskalender', 'adventskalender', { adventskalender })
 
 episodes.forEach(episode => renderPage('episode', `podcast/${episode.slug}`, { navCurrent: 'podcast', episode, team }))
-Object.keys(categories).forEach(category => renderPage('category', `podcast/${category}`, { navCurrent: 'podcast', category, categoryName: categories[category], episodes: episodes.filter(e => e.category === category), team }))
+Object.keys(categories).forEach(category => renderPage('category', `podcast/${slugify(categories[category])}`, { navCurrent: 'podcast', category, categoryName: categories[category], episodes: episodes.filter(e => e.category === category), team }))
+Object.keys(team).forEach(id => {
+  const member = team[id]
+  const alias = member.name.toLowerCase()
+  const eps = episodes.filter(e => e.participants.find(p => [id, alias].includes(p.toLowerCase())))
+  renderPage('member', `team/${slugify(id)}`, { navCurrent: 'podcast', member, episodes: eps, team })
+})