refactor: first pass on getting the client back into working order
(still broken, but loading as a baseline)
This commit is contained in:
parent
a5707e2f81
commit
afeb6f75e8
23 changed files with 358 additions and 322 deletions
|
|
@ -1,5 +1,5 @@
|
|||
const HASH_EXTRACTOR = /^\#\/topic\/(?<topic_id>[A-Za-z\-]+)\/?(?<view>\w+)?/gm;
|
||||
const UPDATE_TOPICS_FREQUENCY = 60_000;
|
||||
const HASH_EXTRACTOR = /^\#\/(?<view>\w+)(?:\/channel\/(?<channel_id>[A-Za-z\-]+)\/?)?/gm;
|
||||
const UPDATE_CHANNELS_FREQUENCY = 60_000;
|
||||
|
||||
const APP = {
|
||||
user: undefined,
|
||||
|
|
@ -52,7 +52,7 @@ const APP = {
|
|||
extract_url_hash_info: async function () {
|
||||
HASH_EXTRACTOR.lastIndex = 0; // ugh, need this to have this work on multiple exec calls
|
||||
const {
|
||||
groups: { topic_id, view },
|
||||
groups: { view, channel_id },
|
||||
} = HASH_EXTRACTOR.exec(window.location.hash ?? "") ?? {
|
||||
groups: {},
|
||||
};
|
||||
|
|
@ -61,36 +61,36 @@ const APP = {
|
|||
console.dir({
|
||||
url: window.location.href,
|
||||
hash: window.location.hash,
|
||||
topic_id,
|
||||
view,
|
||||
channel_id,
|
||||
});
|
||||
*/
|
||||
|
||||
if (!document.body.dataset.topic || document.body.dataset.topic !== topic_id) {
|
||||
const previous = document.body.dataset.topic;
|
||||
if (!document.body.dataset.channel || document.body.dataset.channel !== channel_id) {
|
||||
const previous = document.body.dataset.channel;
|
||||
|
||||
/*
|
||||
console.dir({
|
||||
topic_changed: {
|
||||
channel_changed: {
|
||||
detail: {
|
||||
previous,
|
||||
topic_id,
|
||||
channel_id,
|
||||
},
|
||||
},
|
||||
});
|
||||
*/
|
||||
|
||||
document.body.dataset.topic = topic_id;
|
||||
document.body.dataset.channel = channel_id;
|
||||
|
||||
this._emit( 'topic_changed', {
|
||||
this._emit( 'channel_changed', {
|
||||
previous,
|
||||
topic_id
|
||||
channel_id
|
||||
});
|
||||
|
||||
if (!topic_id) {
|
||||
const first_topic_id = this.TOPICS.TOPIC_LIST[0]?.id;
|
||||
if (first_topic_id) {
|
||||
window.location.hash = `/topic/${first_topic_id}/chat`; // TODO: allow a different default than chat
|
||||
if (!channel_id) {
|
||||
const first_channel_id = this.CHANNELS.CHANNEL_LIST[0]?.id;
|
||||
if (first_channel_id) {
|
||||
window.location.hash = `/chat/channel/${first_channel_id}`; // TODO: allow a different default than chat
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -149,7 +149,7 @@ const APP = {
|
|||
}
|
||||
|
||||
window.addEventListener("locationchange", this.extract_url_hash_info.bind( this ));
|
||||
window.addEventListener("locationchange", this.TOPICS.update );
|
||||
window.addEventListener("locationchange", this.CHANNELS.update );
|
||||
|
||||
this.check_if_logged_in();
|
||||
this.extract_url_hash_info();
|
||||
|
|
@ -162,7 +162,7 @@ const APP = {
|
|||
document.body.dataset.user = JSON.stringify(user);
|
||||
document.body.dataset.perms = user.permissions.join(":");
|
||||
|
||||
this.TOPICS.update();
|
||||
this.CHANNELS.update();
|
||||
|
||||
this.user_servers = [];
|
||||
try {
|
||||
|
|
@ -231,56 +231,56 @@ const APP = {
|
|||
},
|
||||
},
|
||||
|
||||
TOPICS: {
|
||||
_last_topic_update: undefined,
|
||||
_update_topics_timeout: undefined,
|
||||
TOPIC_LIST: [],
|
||||
CHANNELS: {
|
||||
_last_channel_update: undefined,
|
||||
_update_channels_timeout: undefined,
|
||||
CHANNEL_LIST: [],
|
||||
|
||||
update: async () => {
|
||||
const now = new Date();
|
||||
const time_since_last_update = now - (APP.TOPICS._last_topic_update ?? 0);
|
||||
if (time_since_last_update < UPDATE_TOPICS_FREQUENCY / 2) {
|
||||
const time_since_last_update = now - (APP.CHANNELS._last_channel_update ?? 0);
|
||||
if (time_since_last_update < UPDATE_CHANNELS_FREQUENCY / 2) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (APP.TOPICS._update_topics_timeout) {
|
||||
clearTimeout(APP.TOPICS._update_topics_timeout);
|
||||
APP.TOPICS._update_topics_timeout = undefined;
|
||||
if (APP.CHANNELS._update_channels_timeout) {
|
||||
clearTimeout(APP.CHANNELS._update_channels_timeout);
|
||||
APP.CHANNELS._update_channels_timeout = undefined;
|
||||
}
|
||||
|
||||
try {
|
||||
const topics_response = await api.fetch("/api/topics");
|
||||
if (topics_response.ok) {
|
||||
const new_topics = await topics_response.json();
|
||||
const channels_response = await api.fetch("/api/channels");
|
||||
if (channels_response.ok) {
|
||||
const new_channels = await channels_response.json();
|
||||
const has_differences =
|
||||
APP.TOPICS.TOPIC_LIST.length !== new_topics.length ||
|
||||
new_topics.some((topic, index) => {
|
||||
APP.CHANNELS.CHANNEL_LIST.length !== new_channels.length ||
|
||||
new_channels.some((channel, index) => {
|
||||
return (
|
||||
APP.TOPICS.TOPIC_LIST[index]?.id !== topic.id ||
|
||||
APP.TOPICS.TOPIC_LIST[index]?.name !== topic.name
|
||||
APP.CHANNELS.CHANNEL_LIST[index]?.id !== channel.id ||
|
||||
APP.CHANNELS.CHANNEL_LIST[index]?.name !== channel.name
|
||||
);
|
||||
});
|
||||
|
||||
if (has_differences) {
|
||||
APP.TOPICS.TOPIC_LIST = [...new_topics];
|
||||
APP.CHANNELS.CHANNEL_LIST = [...new_channels];
|
||||
|
||||
APP._emit( 'topics_updated', {
|
||||
topics: APP.TOPICS.TOPIC_LIST
|
||||
APP._emit( 'channels_updated', {
|
||||
channels: APP.CHANNELS.CHANNEL_LIST
|
||||
});
|
||||
}
|
||||
|
||||
APP.TOPICS._last_topic_update = now;
|
||||
APP.CHANNELS._last_channel_update = now;
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
|
||||
APP.TOPICS._update_topics_timeout = setTimeout(
|
||||
APP.TOPICS.update,
|
||||
UPDATE_TOPICS_FREQUENCY,
|
||||
APP.CHANNELS._update_channels_timeout = setTimeout(
|
||||
APP.CHANNELS.update,
|
||||
UPDATE_CHANNELS_FREQUENCY,
|
||||
);
|
||||
|
||||
// now that we have topics, make sure our url is all good
|
||||
// now that we have channels, make sure our url is all good
|
||||
APP.extract_url_hash_info();
|
||||
},
|
||||
},
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue