tgpholly/t00-multiuser
1
0
Fork 0
Code Issues Pull requests Activity Actions

party ui

Browse source
This commit is contained in:
Holly Stubbs 2024-04-24 00:06:42 +01:00
parent 771a5ca97a
commit 0c27648d3b
Signed by: tgpholly
GPG key ID: B8583C4B7D18119E
1 changed files with 121 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

121
client/Terminal-00-Multiuser.user.js
View file

@ -88,6 +88,85 @@ if (!window.TE_ACTIVE) {
height: 64px;
z-index: -1!important;
}
.grouphidden {
right: -12rem!important;
}
.groupui {
position: fixed;
top: 2rem;
right: 0px;
height: 25rem;
width: 12rem;
background-color: black;
color: white;
z-index:9999998;
}
.groupui-popper {
position: absolute;
top: 0px;
left: -1rem;
width: 1rem;
height: 100%;
opacity: 0.25;
background-color: black;
border: 1px solid white;
color: white;
}
.groupui-title {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
text-align: center;
height: 2rem;
line-height: 2rem;
background-color: rgba(255,255,255,0.1);
}
.groupui-scrollbox {
position: absolute;
top: 2rem;
left: 0px;
width: 100%;
height: calc(100% - 2rem);
overflow-y: scroll;
}
.groupui-user {
position: relative;
width: 100%;
height: 2rem;
background-color: rgba(255,255,255,0.2);
}
.groupui-user:nth-child(2n) {
background-color: rgba(255,255,255,0.15);
}
.groupui-user p {
position: absolute;
line-height: 2rem;
margin: 0;
margin-left: .5rem;
}
.groupui-user .buttons {
position: absolute;
height: 100%;
top: 0px;
right: 0px;
margin-right: .5rem;
}
.groupui-user .buttons button {
margin-left: .5rem;
margin-top: .2rem;
}
`.split("\n").join("").split("\r").join("").split("\t").join("");
document.head.appendChild(styles);
@ -95,6 +174,48 @@ if (!window.TE_ACTIVE) {
otherCursors.id = "otherCursors";
document.body.appendChild(otherCursors);
const groupUIBase = document.createElement("div");
groupUIBase.style = "display:none";
groupUIBase.classList.add("groupui");
groupUIBase.classList.add("grouphidden");
const groupPopper = document.createElement("button");
groupPopper.classList.add("groupui-popper");
groupPopper.onclick = () => {
groupUIBase.classList.toggle("grouphidden");
groupPopper.innerText = groupUIBase.classList.contains("grouphidden") ? "<" : ">";
};
groupPopper.innerText = "<";
groupUIBase.appendChild(groupPopper);
const groupTitle = document.createElement("div");
groupTitle.classList.add("groupui-title");
groupTitle.innerText = "GROUP_NAME";
groupUIBase.appendChild(groupTitle);
const groupUsers = document.createElement("div");
groupUsers.classList.add("groupui-scrollbox");
groupUIBase.appendChild(groupUsers);
document.body.appendChild(groupUIBase);
function createGroupUser(username, location) {
const user = document.createElement("div");
user.classList.add("groupui-user");
const usernameBox = document.createElement("p");
usernameBox.innerText = username;
user.appendChild(usernameBox);
const buttonBox = document.createElement("div");
buttonBox.classList.add("buttons");
user.appendChild(buttonBox);
const followButton = document.createElement("button");
followButton.innerText = "F";
buttonBox.appendChild(followButton);
const gotoButton = document.createElement("button");
gotoButton.innerText = "G";
buttonBox.appendChild(gotoButton);
groupUsers.appendChild(user);
}
let clientWidth = document.body.getBoundingClientRect().width
setInterval(() => {