|
|
@ -3,20 +3,14 @@ window.addEventListener('DOMContentLoaded', (event) => { |
|
|
|
const isThread = /\/\w+\/thread\/\d+.html/.test(window.location.pathname); |
|
|
|
const isThread = /\/\w+\/thread\/\d+.html/.test(window.location.pathname); |
|
|
|
|
|
|
|
|
|
|
|
if (isThread) { |
|
|
|
if (isThread) { |
|
|
|
const posts = document.getElementsByClassName('anchor'); |
|
|
|
const anchors = document.getElementsByClassName('anchor'); |
|
|
|
if (posts.length === 0) { |
|
|
|
if (anchors.length === 0) { |
|
|
|
return; //url matches, but on a 404 page
|
|
|
|
return; //url matches, but on a 404 page so dont bother with the rest
|
|
|
|
} |
|
|
|
} |
|
|
|
const roomParts = window.location.pathname.replace(/\.html$/, '').split('/'); |
|
|
|
let lastPostId = anchors[anchors.length - 1].id; |
|
|
|
const room = `${roomParts[1]}-${roomParts[3]}`; |
|
|
|
const newPost = (data) => { |
|
|
|
const thread = document.querySelector('.thread'); |
|
|
|
|
|
|
|
const socket = io({ transports: ['websocket'] }); |
|
|
|
|
|
|
|
socket.on('connect', function() { |
|
|
|
|
|
|
|
console.log('joined room', room); |
|
|
|
|
|
|
|
socket.emit('room', room); |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
socket.on('newPost', function(data) { |
|
|
|
|
|
|
|
console.log('got new post'); |
|
|
|
console.log('got new post'); |
|
|
|
|
|
|
|
lastPostId = data.postId; |
|
|
|
const postData = data; |
|
|
|
const postData = data; |
|
|
|
//create a new post
|
|
|
|
//create a new post
|
|
|
|
const postHtml = post({ post: postData }); |
|
|
|
const postHtml = post({ post: postData }); |
|
|
@ -50,9 +44,44 @@ window.addEventListener('DOMContentLoaded', (event) => { |
|
|
|
postId: postData.postId |
|
|
|
postId: postData.postId |
|
|
|
} |
|
|
|
} |
|
|
|
}); |
|
|
|
}); |
|
|
|
//dispatch the ervent so quote click handlers, image expand, etc can be added in separate scripts by listening to the event
|
|
|
|
//dispatch the event so quote click handlers, image expand, etc can be added in separate scripts by listening to the event
|
|
|
|
window.dispatchEvent(newPostEvent); |
|
|
|
window.dispatchEvent(newPostEvent); |
|
|
|
}); |
|
|
|
} |
|
|
|
|
|
|
|
const jsonPath = window.location.pathname.replace(/\.html$/, '.json'); |
|
|
|
|
|
|
|
const jsonCatchup = async () => { |
|
|
|
|
|
|
|
console.log('catching up after reconnect'); |
|
|
|
|
|
|
|
let json; |
|
|
|
|
|
|
|
try { |
|
|
|
|
|
|
|
json = await fetch(jsonPath).then(res => res.json()); |
|
|
|
|
|
|
|
} catch (e) { |
|
|
|
|
|
|
|
return console.error(e); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
if (json && json.replies && json.replies.length > 0) { |
|
|
|
|
|
|
|
const newPosts = json.replies.filter(r => r.postId > lastPostId); //filter to only newer posts
|
|
|
|
|
|
|
|
if (newPosts.length > 0) { |
|
|
|
|
|
|
|
for (let i = 0; i < newPosts.length; i++) { |
|
|
|
|
|
|
|
newPost(newPosts[i]); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
const roomParts = window.location.pathname.replace(/\.html$/, '').split('/'); |
|
|
|
|
|
|
|
const room = `${roomParts[1]}-${roomParts[3]}`; |
|
|
|
|
|
|
|
const thread = document.querySelector('.thread'); |
|
|
|
|
|
|
|
const socket = io({ transports: ['websocket'] }); //no polling
|
|
|
|
|
|
|
|
socket.on('connect', () => { |
|
|
|
|
|
|
|
console.log('joined room', room); |
|
|
|
|
|
|
|
socket.emit('room', room); |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
socket.on('disconnect', () => { |
|
|
|
|
|
|
|
console.log('lost connection to room'); |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
socket.on('reconnect', () => { |
|
|
|
|
|
|
|
console.log('reconnected to room'); |
|
|
|
|
|
|
|
jsonCatchup(); |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
socket.on('newPost', newPost); |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
}); |
|
|
|
}); |
|
|
|