olcxjas-softworks/LarpixClient
2
0
Fork 1
Code Issues Pull requests 1 Projects Releases Packages Wiki Activity Actions 3

Fix sidebar jitter & improve ui
All checks were successful
Android Build / publish (push) Successful in 27s
Details
Linux Build / publish (push) Successful in 51s
Details

Browse source
This commit is contained in:
olcxja 2026-05-13 12:39:10 +02:00
commit 8402564b28
4 changed files with 107 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

82
webroot/main.js
View file

@ -49,6 +49,18 @@ try {
var roomContentBar = roomContent.children[0];
var roomTopBar = document.getElementsByTagName("roomtopbar")[1];
var sidebarProfile = document.getElementById("sidebar-profile");
var sidebarProfileButton = sidebarProfile.children.item(1);
var sidebarProfileIndicator = sidebarProfile.children.item(0);
var sidebarInbox = document.getElementById("sidebar-inbox");
var sidebarInboxButton = sidebarInbox.children.item(1);
var sidebarInboxIndicator = sidebarInbox.children.item(0);
} catch (e) {
}
@ -519,6 +531,8 @@ collapseGroupsBtn.addEventListener("click", () => {
});
addDmBtn.addEventListener("click", () => {
roomTopBar.innerHTML = "Invite to dm";
roomDetailsBar.style.display = "none";
roomContentMain.innerHTML =
`
<div style="display: flex;justify-content: center;align-items: center;height:100%;flex-direction: column;text-align: center;">
@ -528,7 +542,7 @@ addDmBtn.addEventListener("click", () => {
<br>
<div class="input-group">
<label for="addchat-username">Username</label>
<input type="text" id="addchat-username" placeholder="@username:serverhost" class="forminput">
<input type="text" id="addchat-username" placeholder="username:serverhost" class="forminput">
</div>
<div class="input-group">
<button class="submit-button" onclick="addDm()">
@ -536,10 +550,29 @@ addDmBtn.addEventListener("click", () => {
</button>
</div>
</div>
`
`;
});
addGroupBtn.addEventListener("click", () => {
roomTopBar.innerHTML = "Create group";
roomDetailsBar.style.display = "none";
roomContentMain.innerHTML =
`
<div style="display: flex;justify-content: center;align-items: center;height:100%;flex-direction: column;text-align: center;">
<svg xmlns="http://www.w3.org/2000/svg" width="3rem" viewBox="0 -960 960 960" fill="var(--text-color)"><path d="M500-482q29-32 44.5-73t15.5-85q0-44-15.5-85T500-798q60 8 100 53t40 105q0 60-40 105t-100 53Zm220 322v-120q0-36-16-68.5T662-406q51 18 94.5 46.5T800-280v120h-80Zm80-280v-80h-80v-80h80v-80h80v80h80v80h-80v80h-80Zm-593-87q-47-47-47-113t47-113q47-47 113-47t113 47q47 47 47 113t-47 113q-47 47-113 47t-113-47ZM0-160v-112q0-34 17.5-62.5T64-378q62-31 126-46.5T320-440q66 0 130 15.5T576-378q29 15 46.5 43.5T640-272v112H0Zm320-400q33 0 56.5-23.5T400-640q0-33-23.5-56.5T320-720q-33 0-56.5 23.5T240-640q0 33 23.5 56.5T320-560ZM80-240h480v-32q0-11-5.5-20T540-306q-54-27-109-40.5T320-360q-56 0-111 13.5T100-306q-9 5-14.5 14T80-272v32Zm240-400Zm0 400Z"/></svg>
<herotitle>Create Group</herotitle>
<p>Create a private, encrypted group</p>
<br>
<div class="input-group">
<label for="creategroup-name">Name</label>
<input type="text" id="creategroup-name" placeholder="My group" class="forminput">
</div>
<div class="input-group">
<button class="submit-button" onclick="createGroup()">
Create group
</button>
</div>
</div>
`;
});
@ -557,3 +590,46 @@ sidebarAddButton.addEventListener("mouseleave", () => {
sidebarAddIndicator.classList.remove("hover");
});
sidebarProfileButton.addEventListener("mouseenter", () => {
sidebarProfileIndicator.classList.add("hover");
});
sidebarProfileButton.addEventListener("mouseleave", () => {
sidebarProfileIndicator.classList.remove("hover");
});
sidebarInboxButton.addEventListener("mouseenter", () => {
sidebarInboxIndicator.classList.add("hover");
});
sidebarInboxButton.addEventListener("mouseleave", () => {
sidebarInboxIndicator.classList.remove("hover");
});
function gotoSideProfilePopup() {
}
function gotoCreateSpace() {
roomTopBar.innerHTML = "Create space";
roomDetailsBar.style.display = "none";
roomContentMain.innerHTML =
`
<div style="display: flex;justify-content: center;align-items: center;height:100%;flex-direction: column;text-align: center;">
<svg xmlns="http://www.w3.org/2000/svg" width="3rem" viewBox="0 -960 960 960" fill="var(--text-color)"><path d="M80-120v-720h400v160h400v320h-80v-240H480v80h80v80h-80v80h80v80h-80v80h160v80H80Zm80-80h80v-80h-80v80Zm0-160h80v-80h-80v80Zm0-160h80v-80h-80v80Zm0-160h80v-80h-80v80Zm160 480h80v-80h-80v80Zm0-160h80v-80h-80v80Zm0-160h80v-80h-80v80Zm0-160h80v-80h-80v80ZM800-40v-80h-80v-80h80v-80h80v80h80v80h-80v80h-80ZM640-440v-80h80v80h-80Zm0 160v-80h80v80h-80Z"/></svg>
<herotitle>Create Space</herotitle>
<p>Create a space for your community</p>
<br>
<div class="input-group">
<label for="addgroup-name">Name</label>
<input type="text" id="createspace-name" placeholder="My space" class="forminput">
</div>
<div class="input-group">
<button class="submit-button" onclick="createGroup()">
Create space
</button>
</div>
</div>
`;
}
function gotoHome() {
}