@@ -1,7 +1,7 @@
1'use strict'
1'use strict'
3const re_channel = /(\s|^)\/([a-zA-Z0-9]+)/g
3const re_channel = /(\s|^)\/([a-zA-Z0-9]+)/g
4−const re_user = /(\s|^)\@([a-zA-Z0-9]+)/g
4+const re_user = /((\s|^)@<[a-zA-Z0-9./:\-_\+~#= ]*>)/g
5const re_tag = /([^&]|^)\#([a-zA-Z0-9]+)/g
5const re_tag = /([^&]|^)\#([a-zA-Z0-9]+)/g
6const re_url = /((https?):\/\/(([-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b)([-a-zA-Z0-9@:%_\+.~#?&//=]*)))/g
6const re_url = /((https?):\/\/(([-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b)([-a-zA-Z0-9@:%_\+.~#?&//=]*)))/g
@@ -10,7 +10,8 @@ function Hallway (sites) {
10 this.sites = sites
10 this.sites = sites
11 this.el = document.createElement('div')
11 this.el = document.createElement('div')
12 this.el.id = 'hallway'
12 this.el.id = 'hallway'
13− this.filter = window.location.hash.replace('#', '').trim()
13+ const filterAndPage = window.location.hash.split('^')
14+ this.finder = { filter: filterAndPage[0].trim().replace('#', ''), page: filterAndPage[1] || 1 }
14 this.cache = null
15 this.cache = null
16 this.install = function (host) {
17 this.install = function (host) {
@@ -25,24 +26,30 @@ function Hallway (sites) {
26 this.refresh = function (feeds = this.cache) {
27 this.refresh = function (feeds = this.cache) {
27 const entries = this.findEntries(feeds)
28 const entries = this.findEntries(feeds)
28− const channels = this.findChannels(entries)
29+ const channels = this.find(entries, 'channel')
29− const users = this.findUsers(entries)
30+ const users = this.find(entries, 'author')
30 const tags = this.findTags(entries)
31 const tags = this.findTags(entries)
32+ const relevantEntries = entries.filter(val => !this.finder.filter || (val.author === this.finder.filter || val.channel === this.finder.filter || val.tags.includes(this.finder.filter)))
32 this.el.innerHTML = `
34 this.el.innerHTML = `
33− <ul id='entries'>
35+ <div id='entries'>
34− ${entries.filter((val, id) => { return !this.filter || (val.author === this.filter || val.channel === this.filter || val.tags.includes(this.filter)) }).filter((val, id) => { return id < 50 }).reduce((acc, val, id) => { return acc + this.templateEntry(val) + '\n' }, '')}
37+ ${entries.filter((val) => !this.finder.filter || (val.author === this.finder.filter || val.channel === this.finder.filter || val.tags.includes(this.finder.filter))).filter((_, id) => id < Number(this.finder.page) * 20 && id >= (Number(this.finder.page) - 1) * 20).reduce((acc, val) => acc + this.templateEntry(val) + '\n', '')}
39+ <div id='pagination'>
40+ ${[...Array(Math.ceil(relevantEntries.length / 20)).keys()].reduce((acc, num) => `${acc}<span class='${Number(hallway.finder.page) === num + 1 ? 'selected' : ''}' onclick='filter("${this.finder.filter}^${num + 1}")'>${num + 1}</span>`, '')}
36 <div id='sidebar'>
43 <div id='sidebar'>
37 <ul id='channels'>
44 <ul id='channels'>
38− <li onclick='filter("")' class='${hallway.filter === '' ? 'selected' : ''}'><a href='#'>hallway <span class='right'>${entries.length}</span></a></li>
45+ <li onclick='filter("")' class='${hallway.finder.filter === '' ? 'selected' : ''}'><a href='#'>hallway <span class='right'>${entries.length}</span></a></li>
39− ${Object.keys(channels).reduce((acc, val, id) => { return acc + `<li onclick='filter("${val}")' class='${hallway.filter === val ? 'selected' : ''}'><a href='#${val}'>${val} <span class='right'>${channels[val]}</span></a></li>\n` }, '')}
46+ ${Object.keys(channels).slice(0, 15).reduce((acc, val) => acc + `<li onclick='filter("${val}")' class='${hallway.finder.filter === val ? 'selected' : ''}'><a href='#${val}'>${val} <span class='right'>${channels[val]}</span></a></li>\n`, '')}
41 <ul id='users'>
48 <ul id='users'>
42− ${Object.keys(users).reduce((acc, val, id) => { return acc + `<li onclick='filter("${val}")' class='${hallway.filter === val ? 'selected' : ''}' href='#${val}'>${val} <span class='right'>${users[val]}</span></li>\n` }, '')}
49+ ${Object.keys(users).slice(0, 15).reduce((acc, val) => acc + `<li onclick='filter("${val}")' class='${hallway.finder.filter === val ? 'selected' : ''}' href='#${val}'>${val} <span class='right'>${users[val]}</span></li>\n`, '')}
44 <ul id='tags'>
51 <ul id='tags'>
45− ${Object.keys(tags).reduce((acc, val, id) => { return acc + `<li onclick='filter("${val}")' class='${hallway.filter === val ? 'selected' : ''}' href='#${val}'>#${val} <span class='right'>${tags[val]}</span></li>\n` }, '')}
52+ ${Object.keys(tags).slice(0, 15).reduce((acc, val) => acc + `<li onclick='filter("${val}")' class='${hallway.finder.filter === val ? 'selected' : ''}' href='#${val}'>#${val} <span class='right'>${tags[val]}</span></li>\n`, '')}
48 <p>The <b>Hallway</b> is a decentralized forum, to join the conversation, simply create yourself a <a href="https://twtxt.readthedocs.io/en/stable/user/twtxtfile.html">twtxt</a> feed and <a href="https://github.com/XXIIVV/Webring/">add it</a> to your entry in the <a href="index.html">webring</a>.</p>`
55 <p>The <b>Hallway</b> is a decentralized forum, to join the conversation, simply create yourself a <a href="https://twtxt.readthedocs.io/en/stable/user/twtxtfile.html">twtxt</a> feed and <a href="https://github.com/XXIIVV/Webring/">add it</a> to your entry in the <a href="index.html">webring</a>.</p>`
@@ -54,26 +61,15 @@ function Hallway (sites) {
55 // Entries
62 // Entries
57− this.findChannels = function (entries) {
64+ this.find = function (entries, p) {
58− const channels = {}
65+ const h = {}
59 for (const id in entries) {
66 for (const id in entries) {
60− const entry = entries[id]
67+ if (entries[id] && entries[id][p]) { h[entries[id][p]] = h[entries[id][p]] ? h[entries[id][p]] + 1 : 1 }
61− if (!entry.channel) { continue }
62− channels[entry.channel] = channels[entry.channel] ? channels[entry.channel] + 1 : 1
64− return channels
69+ return h
67− this.findUsers = function (entries) {
69− for (const id in entries) {
70− const entry = entries[id]
71− users[entry.author] = users[entry.author] ? users[entry.author] + 1 : 1
76− this.findTags = function (entries){
72+ this.findTags = function (entries) {
77 const tags = {}
73 const tags = {}
78 for (const id in entries) {
74 for (const id in entries) {
79 const entry = entries[id]
75 const entry = entries[id]
@@ -91,29 +87,33 @@ function Hallway (sites) {
91 a.push(feeds[id].content[i])
87 a.push(feeds[id].content[i])
94− return a.sort( (a, b) => a.offset - b.offset )
90+ return a.sort((a, b) => a.offset - b.offset)
93+ this.findMention = function (found) {
94+ const mention = Object.keys(feeds).filter(user => found.indexOf(feeds[user].path) > -1)
95+ return mention.length === 1 ? ` <span class='user'>@${mention[0]}</span>` : ` <span class='user'>${found}</span>`
97 this.templateEntry = function (entry) {
98 this.templateEntry = function (entry) {
98 entry.html = entry.body
99 entry.html = entry.body
99 .replace(re_channel, `$1<span class='channel'>/$2</span>`)
100 .replace(re_channel, `$1<span class='channel'>/$2</span>`)
100− .replace(re_user, `$1<span class='user'>@$2</span>`)
101+ .replace(re_user, this.findMention)
101 .replace(re_tag, `$1<span class='tag'>#$2</span>`)
102 .replace(re_tag, `$1<span class='tag'>#$2</span>`)
102 .replace(re_url, `<a target="_blank" href='$1'>$1</a>`)
103 .replace(re_url, `<a target="_blank" href='$1'>$1</a>`)
104 const filter = window.location.hash.substr(1).replace(/\+/g, ' ').toLowerCase()
105 const filter = window.location.hash.substr(1).replace(/\+/g, ' ').toLowerCase()
105 const highlight = filter === entry.author.toLowerCase()
106 const highlight = filter === entry.author.toLowerCase()
106 const origin = feeds[entry.author].path
107 const origin = feeds[entry.author].path
108 return `<li class='entry ${highlight ? 'highlight' : ''}'><span class='date'>${timeAgo(Date.parse(entry.date))}</span> <a class='author' href='${origin}' target='_blank'>${entry.author}</a> <span class='body'>${entry.html}</span></li>`
109 return `<li class='entry ${highlight ? 'highlight' : ''}'><span class='date'>${timeAgo(Date.parse(entry.date))}</span> <a class='author' href='${origin}' target='_blank'>${entry.author}</a> <span class='body'>${entry.html}</span></li>`
113 this.findFeeds = function () {
114 this.findFeeds = function () {
114 console.log('Finding feeds..')
115 console.log('Finding feeds..')
115− for (const id in sites) {
116+ for (const site of sites) {
116− const site = sites[id]
117 if (site.feed && site.author) {
117 if (site.feed && site.author) {
118 feeds[site.author] = { path: site.feed }
118 feeds[site.author] = { path: site.feed }
@@ -141,7 +141,7 @@ function Hallway (sites) {
143 function parseFeed (author, feed) {
143 function parseFeed (author, feed) {
144− const lines = feed.split('\n')
144+ const lines = feed.split('\n').filter((line) => line.substr(0, 1) !== '#')
145 const entries = []
145 const entries = []
146 for (const id in lines) {
146 for (const id in lines) {
147 const line = lines[id].trim()
147 const line = lines[id].trim()
@@ -150,7 +150,7 @@ function Hallway (sites) {
150 const date = parts[0].trim()
150 const date = parts[0].trim()
151 const body = escapeHtml(parts[1].trim()).trim()
151 const body = escapeHtml(parts[1].trim()).trim()
152 const channel = body.substr(0, 1) === '/' ? body.split(' ')[0].substr(1).toLowerCase() : body.substr(0, 1) === '@' ? 'veranda' : 'lobby'
152 const channel = body.substr(0, 1) === '/' ? body.split(' ')[0].substr(1).toLowerCase() : body.substr(0, 1) === '@' ? 'veranda' : 'lobby'
153− const tags = (body.match(re_tag)||[]).map(a => a.substr(a.indexOf('#')+1).toLowerCase())
153+ const tags = (body.match(re_tag) || []).map(a => a.substr(a.indexOf('#') + 1).toLowerCase())
154 const offset = new Date() - new Date(date)
154 const offset = new Date() - new Date(date)
155 entries.push({ date, body, author, offset, channel, tags })
155 entries.push({ date, body, author, offset, channel, tags })
@@ -159,9 +159,8 @@ function Hallway (sites) {
160 function timeAgo (dateParam) {
160 function timeAgo (dateParam) {
161 const date = typeof dateParam === 'object' ? dateParam : new Date(dateParam)
161 const date = typeof dateParam === 'object' ? dateParam : new Date(dateParam)
162− const DAY_IN_MS = 86400000 // 24 * 60 * 60 * 1000
163 const today = new Date()
162 const today = new Date()
164− const yesterday = new Date(today - DAY_IN_MS)
163+ const yesterday = new Date(today - 86400000)
165 const seconds = Math.round((today - date) / 1000)
164 const seconds = Math.round((today - date) / 1000)
166 const minutes = Math.round(seconds / 60)
165 const minutes = Math.round(seconds / 60)
167 const isToday = today.toDateString() === date.toDateString()
166 const isToday = today.toDateString() === date.toDateString()
@@ -183,14 +182,15 @@ function Hallway (sites) {
184 return `${Math.floor(minutes / 1440)} days ago`
183 return `${Math.floor(minutes / 1440)} days ago`
187− function escapeHtml (unsafe) {
187+function escapeHtml (unsafe) {
188− return unsafe.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>').replace(/"/g, '"').replace(/'/g, ''')
188+ return unsafe.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>').replace(/"/g, '"').replace(/'/g, ''')
192function filter (name) {
191function filter (name) {
193 window.location.hash = name
192 window.location.hash = name
194− hallway.filter = window.location.hash.replace('#', '').trim()
193+ const filterAndPage = window.location.hash.split('^')
194+ hallway.finder = { filter: filterAndPage[0].trim().replace('#', ''), page: filterAndPage[1] || 1 }
195 hallway.refresh()
195 hallway.refresh()