forked from andyburke/autonomous.contact
fix: make sure things load properly on login/signup
This commit is contained in:
parent
f760156651
commit
e52a9e997c
5 changed files with 81 additions and 61 deletions
|
|
@ -48,14 +48,14 @@ export function get_events_collection_for_topic(topic_id: string): FSDB_COLLECTI
|
||||||
organize: (id) => {
|
organize: (id) => {
|
||||||
TOPIC_EVENT_ID_MATCHER.lastIndex = 0;
|
TOPIC_EVENT_ID_MATCHER.lastIndex = 0;
|
||||||
|
|
||||||
const {
|
const groups: Record<string, string> | undefined = TOPIC_EVENT_ID_MATCHER.exec(id ?? '')?.groups;
|
||||||
groups: {
|
|
||||||
event_type,
|
if (!groups) {
|
||||||
event_id
|
throw new Error('Could not parse event id: ' + id);
|
||||||
}
|
}
|
||||||
} = TOPIC_EVENT_ID_MATCHER.exec(id ?? '') ?? {
|
|
||||||
groups: {}
|
const event_type = groups.event_type;
|
||||||
};
|
const event_id = groups.event_id;
|
||||||
|
|
||||||
return [
|
return [
|
||||||
event_type,
|
event_type,
|
||||||
|
|
|
||||||
|
|
@ -184,16 +184,15 @@ textarea:focus {
|
||||||
form div {
|
form div {
|
||||||
position: relative;
|
position: relative;
|
||||||
display: flex;
|
display: flex;
|
||||||
margin-bottom: 1em;
|
margin-bottom: 1.5em;
|
||||||
}
|
}
|
||||||
|
|
||||||
form label {
|
form label {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 10px;
|
top: 0;
|
||||||
font-size: 30px;
|
font-size: large;
|
||||||
margin: 10px;
|
margin: 10px;
|
||||||
padding: 0 10px;
|
padding: 0 10px;
|
||||||
background-color: var(--bg);
|
|
||||||
-webkit-transition:
|
-webkit-transition:
|
||||||
top 0.2s ease-in-out,
|
top 0.2s ease-in-out,
|
||||||
font-size 0.2s ease-in-out;
|
font-size 0.2s ease-in-out;
|
||||||
|
|
@ -204,8 +203,10 @@ form label {
|
||||||
|
|
||||||
form input:focus ~ label,
|
form input:focus ~ label,
|
||||||
form input:valid ~ label {
|
form input:valid ~ label {
|
||||||
top: -25px;
|
top: -1.6rem;
|
||||||
font-size: 20px;
|
font-size: small;
|
||||||
|
border: 1px solid rgba(128, 128, 128, 0.2);
|
||||||
|
border-bottom: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
form input:focus {
|
form input:focus {
|
||||||
|
|
|
||||||
|
|
@ -114,62 +114,71 @@
|
||||||
update_topics_timeout = undefined;
|
update_topics_timeout = undefined;
|
||||||
}
|
}
|
||||||
|
|
||||||
const topics_response = await api.fetch("/api/topics");
|
try {
|
||||||
if (topics_response.ok) {
|
const topics_response = await api.fetch("/api/topics");
|
||||||
const topic_list = document.getElementById("topic-list");
|
if (topics_response.ok) {
|
||||||
topic_list.innerHTML = "";
|
const topic_list = document.getElementById("topic-list");
|
||||||
|
topic_list.innerHTML = "";
|
||||||
|
|
||||||
const new_topics = await topics_response.json();
|
const new_topics = await topics_response.json();
|
||||||
const has_differences = TOPICS.length !== new_topics.length || new_topics.some( (topic, index) => {
|
const has_differences = TOPICS.length !== new_topics.length || new_topics.some( (topic, index) => {
|
||||||
return ( TOPICS[ index ]?.id !== topic.id || TOPICS[ index ]?.name !== topic.name );
|
return ( TOPICS[ index ]?.id !== topic.id || TOPICS[ index ]?.name !== topic.name );
|
||||||
});
|
});
|
||||||
|
|
||||||
if ( has_differences ) {
|
if ( has_differences ) {
|
||||||
TOPICS = new_topics;
|
TOPICS = new_topics;
|
||||||
|
|
||||||
document.dispatchEvent(new CustomEvent("topics_updated", { detail: { topics: TOPICS } }));
|
document.dispatchEvent(new CustomEvent("topics_updated", { detail: { topics: TOPICS } }));
|
||||||
|
}
|
||||||
|
|
||||||
|
last_topic_update = now;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
last_topic_update = now;
|
catch( error ) {
|
||||||
|
console.error( error );
|
||||||
}
|
}
|
||||||
|
|
||||||
update_topics_timeout = setTimeout( update_topics, UPDATE_TOPICS_FREQUENCY);
|
update_topics_timeout = setTimeout( update_topics, UPDATE_TOPICS_FREQUENCY);
|
||||||
|
|
||||||
|
// now that we have topics, make sure our url is all good
|
||||||
|
extract_url_hash_info();
|
||||||
}
|
}
|
||||||
|
|
||||||
document.addEventListener("DOMContentLoaded", async () => {
|
document.addEventListener("DOMContentLoaded", async () => {
|
||||||
/* check if we are logged in */
|
window.addEventListener("locationchange", update_topics);
|
||||||
(async () => {
|
document.addEventListener( 'user_logged_in', update_topics );
|
||||||
try {
|
|
||||||
const session_response = await api.fetch("/api/users/me");
|
|
||||||
|
|
||||||
if (!session_response.ok) {
|
/* check if we are logged in */
|
||||||
const error_body = await session_response.json();
|
(async () => {
|
||||||
const error = error_body?.error;
|
try {
|
||||||
|
const session_response = await api.fetch("/api/users/me");
|
||||||
|
|
||||||
console.dir({
|
if (!session_response.ok) {
|
||||||
error_body,
|
const error_body = await session_response.json();
|
||||||
error,
|
const error = error_body?.error;
|
||||||
});
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const user = await session_response.json();
|
|
||||||
|
|
||||||
document.body.dataset.user = JSON.stringify( user );
|
|
||||||
document.body.dataset.perms = user.permissions.join(":");
|
|
||||||
|
|
||||||
document.dispatchEvent(new CustomEvent("user_logged_in", { detail: { user } }));
|
|
||||||
|
|
||||||
} catch (error) {
|
|
||||||
console.dir({
|
console.dir({
|
||||||
|
error_body,
|
||||||
error,
|
error,
|
||||||
});
|
});
|
||||||
|
return;
|
||||||
}
|
}
|
||||||
})();
|
|
||||||
|
|
||||||
window.addEventListener("locationchange", update_topics);
|
const user = await session_response.json();
|
||||||
await update_topics();
|
|
||||||
extract_url_hash_info();
|
document.body.dataset.user = JSON.stringify( user );
|
||||||
|
document.body.dataset.perms = user.permissions.join(":");
|
||||||
|
|
||||||
|
document.dispatchEvent(new CustomEvent("user_logged_in", { detail: { user } }));
|
||||||
|
|
||||||
|
} catch (error) {
|
||||||
|
console.dir({
|
||||||
|
error,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
})();
|
||||||
|
|
||||||
|
extract_url_hash_info();
|
||||||
});
|
});
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -299,6 +299,8 @@
|
||||||
delete document.body.dataset.user;
|
delete document.body.dataset.user;
|
||||||
delete document.body.dataset.perms;
|
delete document.body.dataset.perms;
|
||||||
window.location = "/";
|
window.location = "/";
|
||||||
|
|
||||||
|
document.dispatchEvent(new CustomEvent("user_logged_out", { detail: {} }));
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -24,14 +24,15 @@
|
||||||
#signup-login-wall .limiter {
|
#signup-login-wall .limiter {
|
||||||
width: 95%;
|
width: 95%;
|
||||||
position: relative;
|
position: relative;
|
||||||
background: rgba(128, 128, 128, 0.5);
|
background: hsl(from var(--bg) h s 15);
|
||||||
max-width: 40em;
|
max-width: 40em;
|
||||||
min-height: 22rem;
|
min-height: 22rem;
|
||||||
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
#signup-login-wall form {
|
#signup-login-wall form {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 1rem;
|
padding: 1.5rem;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
|
@ -54,10 +55,13 @@
|
||||||
{
|
{
|
||||||
const form = document.currentScript.closest("form");
|
const form = document.currentScript.closest("form");
|
||||||
form.on_reply = (response) => {
|
form.on_reply = (response) => {
|
||||||
// TODO: we should hold the session secret only in memory, not the cookie?
|
const user = response.user;
|
||||||
document.body.dataset.user = JSON.stringify(response.user);
|
document.body.dataset.user = JSON.stringify(user);
|
||||||
document.body.dataset.perms =
|
document.body.dataset.perms = user.permissions.join(":");
|
||||||
response.user.permissions.join(":");
|
|
||||||
|
document.dispatchEvent(
|
||||||
|
new CustomEvent("user_logged_in", { detail: { user } }),
|
||||||
|
);
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
@ -91,9 +95,13 @@
|
||||||
{
|
{
|
||||||
const form = document.currentScript.closest("form");
|
const form = document.currentScript.closest("form");
|
||||||
form.on_reply = (response) => {
|
form.on_reply = (response) => {
|
||||||
document.body.dataset.user = JSON.stringify(response.user);
|
const user = response.user;
|
||||||
document.body.dataset.perms =
|
document.body.dataset.user = JSON.stringify(user);
|
||||||
response.user.permissions.join(":");
|
document.body.dataset.perms = user.permissions.join(":");
|
||||||
|
|
||||||
|
document.dispatchEvent(
|
||||||
|
new CustomEvent("user_logged_in", { detail: { user } }),
|
||||||
|
);
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue