sugary/LarpixClient
1
0
Fork 0
forked from olcxjas-softworks/LarpixClient
Code Pull requests Activity

Add switchDetailsContent function

Browse source
This commit is contained in:
olcxja 2026-05-15 10:31:09 +02:00
commit 3b2d474f3d
7 changed files with 145 additions and 35 deletions
Download patch file Download diff file Expand all files Collapse all files

6
android/app/src/main/assets/public/index.html
View file

@ -55,21 +55,21 @@
</sidebar>
<sidebar class="second" id="roomsbar">
<roomtopbar>
<inherit></inherit>
<inherit style="display: flex;"></inherit>
</roomtopbar>
<roomcontent2>
</roomcontent2>
</sidebar>
<roomcontent>
<roomtopbar>
<inherit></inherit>
<inherit style="display: flex;"></inherit>
</roomtopbar>
<roomcontent2>
</roomcontent2>
</roomcontent>
<sidebar class="second" id="roomdetailsbar" style="display: none;">
<roomtopbar>
<inherit></inherit>
<inherit style="display: flex;"></inherit>
</roomtopbar>
<roomcontent2>
</roomcontent2>

55
android/app/src/main/assets/public/main.js
View file

@ -47,10 +47,13 @@ try {
var roomContentMain = document.getElementsByTagName("roomcontent2")[1];
var roomDetailsMain = document.getElementsByTagName("roomcontent2")[2];
var roomContentBar = roomContent.children[0];
var roomsTopBar = document.getElementsByTagName("roomtopbar")[0];
var roomTopBar = document.getElementsByTagName("roomtopbar")[1];
var detailsTopBar = document.getElementsByTagName("roomtopbar")[2];
var sidebarProfile = document.getElementById("sidebar-profile");
var sidebarProfileButton = sidebarProfile.children.item(1);
@ -786,6 +789,58 @@ async function switchRoomContent(title, content, showRoomBar, icon = "", skipMob
roomsTopBarTransition.style.opacity = "";
}
async function switchDetailsContent(title, content)
{
let roomsTopBarTransition = detailsTopBar.children.item(0);
roomDetailsMain.style.transform = "scale(0.85)";
roomDetailsMain.style.opacity = "0";
roomsTopBarTransition.style.transform = "scale(0.85)";
roomsTopBarTransition.style.opacity = "0";
const rem = parseFloat(getComputedStyle(document.documentElement).fontSize);
if (window.innerWidth <= 52 * rem && !skipMobileSlide) {
}
else
{
await delay(200);
}
roomsTopBarTransition.innerHTML = processBlah(title);
let parser = new DOMParser();
let doc = parser.parseFromString(content, "text/html");
let blahTags = doc.getElementsByTagName("blah");
for (let i = 0; i < blahTags.length; i++) {
blahTags[i].innerHTML = processBlah(blahTags[i].innerHTML);
}
blahTags = doc.getElementsByClassName("blah");
for (let i = 0; i < blahTags.length; i++) {
blahTags[i].innerHTML = processBlah(blahTags[i].innerHTML);
}
let placeholders = doc.querySelectorAll("[placeholder]");
for (let i = 0; i < placeholders.length; i++) {
if (placeholders[i].placeholder.startsWith("{blah("))
{
let value = placeholders[i].placeholder.split("{blah(")[1].split(")}")[0];
placeholders[i].placeholder = processBlah(value);
}
}
roomDetailsMain.innerHTML = doc.body.innerHTML;
roomDetailsMain.style.transform = "";
roomDetailsMain.style.opacity = "";
roomsTopBarTransition.style.transform = "";
roomsTopBarTransition.style.opacity = "";
}
function clickCollapseDms()
{

62
android/app/src/main/assets/public/screens.js
View file

@ -76,38 +76,38 @@ var joinSpaceScreen = `
//roombars
var homeRoomBar = `
<div class="sidebar-section-header">
<button class="collapse-text-button" id="collapse-dms" onclick="clickCollapseDms()">
<span><blah>title.dms</blah></span>
<svg class="chevron" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"
stroke="var(--text-color)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polyline points="6 9 12 15 18 9"></polyline>
</svg>
</button>
<button class="add-action-button" id="add-dm-btn" onclick="clickAddDm()">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="var(--text-color)"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="12" y1="5" x2="12" y2="19"></line>
<line x1="5" y1="12" x2="19" y2="12"></line>
</svg>
</button>
</div>
<button class="collapse-text-button" id="collapse-dms" onclick="clickCollapseDms()">
<span><blah>title.dms</blah></span>
<svg class="chevron" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"
stroke="var(--text-color)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polyline points="6 9 12 15 18 9"></polyline>
</svg>
</button>
<button class="add-action-button" id="add-dm-btn" onclick="clickAddDm()">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="var(--text-color)"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="12" y1="5" x2="12" y2="19"></line>
<line x1="5" y1="12" x2="19" y2="12"></line>
</svg>
</button>
</div>
<div class="sidebar-section-header">
<button class="collapse-text-button" id="collapse-groups" onclick="clickCollapseGroups()">
<span><blah>title.groups</blah></span>
<svg class="chevron" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"
stroke="var(--text-color)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polyline points="6 9 12 15 18 9"></polyline>
</svg>
</button>
<button class="add-action-button" id="add-group-btn" onclick="clickAddGroup()">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="var(--text-color)"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="12" y1="5" x2="12" y2="19"></line>
<line x1="5" y1="12" x2="19" y2="12"></line>
</svg>
</button>
</div>
<div class="sidebar-section-header">
<button class="collapse-text-button" id="collapse-groups" onclick="clickCollapseGroups()">
<span><blah>title.groups</blah></span>
<svg class="chevron" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"
stroke="var(--text-color)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polyline points="6 9 12 15 18 9"></polyline>
</svg>
</button>
<button class="add-action-button" id="add-group-btn" onclick="clickAddGroup()">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="var(--text-color)"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="12" y1="5" x2="12" y2="19"></line>
<line x1="5" y1="12" x2="19" y2="12"></line>
</svg>
</button>
</div>
`;

2
android/app/src/main/assets/public/style.css
View file

@ -374,7 +374,7 @@ blah, inherit, .inherit {
all: inherit;
padding: 0;
margin: 0;
display: flex;
display: inline;
opacity: 1;
border: none;
}

BIN
electron/assets/icon.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 14 KiB

Before After
Before After

BIN
icons/icon.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 14 KiB

Before After
Before After

55
webroot/main.js
View file

@ -47,10 +47,13 @@ try {
var roomContentMain = document.getElementsByTagName("roomcontent2")[1];
var roomDetailsMain = document.getElementsByTagName("roomcontent2")[2];
var roomContentBar = roomContent.children[0];
var roomsTopBar = document.getElementsByTagName("roomtopbar")[0];
var roomTopBar = document.getElementsByTagName("roomtopbar")[1];
var detailsTopBar = document.getElementsByTagName("roomtopbar")[2];
var sidebarProfile = document.getElementById("sidebar-profile");
var sidebarProfileButton = sidebarProfile.children.item(1);
@ -786,6 +789,58 @@ async function switchRoomContent(title, content, showRoomBar, icon = "", skipMob
roomsTopBarTransition.style.opacity = "";
}
async function switchDetailsContent(title, content)
{
let roomsTopBarTransition = detailsTopBar.children.item(0);
roomDetailsMain.style.transform = "scale(0.85)";
roomDetailsMain.style.opacity = "0";
roomsTopBarTransition.style.transform = "scale(0.85)";
roomsTopBarTransition.style.opacity = "0";
const rem = parseFloat(getComputedStyle(document.documentElement).fontSize);
if (window.innerWidth <= 52 * rem && !skipMobileSlide) {
}
else
{
await delay(200);
}
roomsTopBarTransition.innerHTML = processBlah(title);
let parser = new DOMParser();
let doc = parser.parseFromString(content, "text/html");
let blahTags = doc.getElementsByTagName("blah");
for (let i = 0; i < blahTags.length; i++) {
blahTags[i].innerHTML = processBlah(blahTags[i].innerHTML);
}
blahTags = doc.getElementsByClassName("blah");
for (let i = 0; i < blahTags.length; i++) {
blahTags[i].innerHTML = processBlah(blahTags[i].innerHTML);
}
let placeholders = doc.querySelectorAll("[placeholder]");
for (let i = 0; i < placeholders.length; i++) {
if (placeholders[i].placeholder.startsWith("{blah("))
{
let value = placeholders[i].placeholder.split("{blah(")[1].split(")}")[0];
placeholders[i].placeholder = processBlah(value);
}
}
roomDetailsMain.innerHTML = doc.body.innerHTML;
roomDetailsMain.style.transform = "";
roomDetailsMain.style.opacity = "";
roomsTopBarTransition.style.transform = "";
roomsTopBarTransition.style.opacity = "";
}
function clickCollapseDms()
{