tim/autonomous.contact
1
0
Fork 0
forked from andyburke/autonomous.contact
Code Pull requests Activity

refactor: rework the frontend to move topics to the top

Browse source
This commit is contained in:
Andy Burke 2025-09-10 19:38:38 -07:00
parent fac8f409f4
commit 11ecd86bb9
14 changed files with 362 additions and 292 deletions
Download patch file Download diff file Expand all files Collapse all files

70
public/tabs/chat/chat.html
View file

@ -4,7 +4,7 @@
name="top-level-tabs"
id="chat-tab-input"
class="tab-switch"
data-hash="/chat"
data-view="chat"
/>
<label for="chat-tab-input" class="tab-label"
><div class="icon chat"></div>
@ -17,74 +17,6 @@
<script src="/js/external/mimetypes.js" type="text/javascript"></script>
<script src="/js/external/punycode.js" type="text/javascript"></script>
<script src="/tabs/chat/chat.js" type="text/javascript"></script>
<div class="sidebar resizable">
<input type="checkbox" id="sidebar-toggle" />
<label id="sidebar-toggle-icon" for="sidebar-toggle">
<div class="icon right"></div>
</label>
<div id="topic-creation-container" data-requires-permission="topics.create">
<button
id="toggle-topic-creation-form-button"
onclick="((event) => {
event.preventDefault();
const topic_create_form = document.getElementById( 'topic-create' );
topic_create_form.style[ 'height' ] = topic_create_form.style[ 'height' ] === '5rem' ? '0' : '5rem';
})(event)"
>
<div class="icon plus"></div>
</button>
<form
id="topic-create"
data-smart="true"
action="/api/topics"
method="POST"
style="
margin-top: 1rem;
width: 100%;
overflow: hidden;
height: 0;
overflow: hidden;
transition: all 0.5s;
"
>
<input
id="new-topic-name-input"
type="text"
name="name"
value=""
placeholder="new topic"
/>
<!-- <button class="primary" type="submit">
<div class="icon plus"></div>
</button> -->
<input type="submit" hidden />
<script>
{
const form = document.currentScript.closest("form");
const topic_create_form = document.getElementById("topic-create");
const new_topic_name_input =
document.getElementById("new-topic-name-input");
form.on_reply = (new_topic) => {
const topic_list = document.getElementById("topic-list");
topic_list.insertAdjacentHTML(
"beforeend",
`<li id="topic-selector-${new_topic.id}" class="topic"><a href="#/topic/${new_topic.id}">${new_topic.name}</a></li>`,
);
new_topic_name_input.value = "";
window.location.hash = `/chat/topic/${new_topic.id}`;
topic_create_form.style["height"] = "0";
};
}
</script>
</form>
</div>
<div>
<span class="title">chat topics</span>
</div>
<ul id="topic-list" class="topic-list"></ul>
</div>
<div id="topic-chat-container">
<div id="topic-chat-content"></div>
<div id="topic-chat-entry-container">