storm/skald
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixed problems with radio button grouping. Also added headings to chat area.

Browse Source
This commit is contained in:
Storm Dragon
2025-11-28 00:11:51 -05:00
parent ef2eeb073f
commit 5e4b9ae439
2 changed files with 33 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/galene.html
+22 -19
View File
@@ -29,7 +29,7 @@
<header>
<nav class="topnav navbar navbar-expand navbar-light fixed-top">
<div id="header">
<button class="collapse" aria-label="Collapse left panel" id="sidebarCollapse">
<button class="collapse" aria-label="Toggle left panel" aria-expanded="true" id="sidebarCollapse">
<i class="fas fa-align-left" aria-hidden="true"></i>
</button>
<h1 id="title" class="header-title">Galène</h1>
@@ -73,6 +73,7 @@
<button class="close-chat" id="close-chat" aria-label="Hide chat">
<span class="close-icon"></span>
</button>
<h2 id="chat-history-heading" class="sr-only">Chat History</h2>
<div id="box"></div>
<div id="chat-announcements" aria-live="polite" aria-atomic="true" class="sr-only"></div>
<div class="reply">
@@ -116,21 +117,23 @@
<input id="password" type="password" name="password"
autocomplete="current-password" class="form-control"/>
</div>
<label>Enable at start:</label>
<div class="present-switch">
<p class="switch-radio">
<input id="presentoff" type="radio" name="presentradio" value="" checked/>
<label for="presentoff">Nothing</label>
</p>
<p class="switch-radio">
<input id="presentmike" type="radio" name="presentradio" value="mike"/>
<label for="presentmike">Microphone</label>
</p>
<p class="switch-radio">
<input id="presentboth" type="radio" name="presentradio" value="both"/>
<label for="presentboth">Camera and microphone</label>
</p>
</div>
<fieldset>
<legend>Enable at start:</legend>
<div class="present-switch">
<p class="switch-radio">
<input id="presentoff" type="radio" name="presentradio" value="" checked/>
<label for="presentoff">Nothing</label>
</p>
<p class="switch-radio">
<input id="presentmike" type="radio" name="presentradio" value="mike"/>
<label for="presentmike">Microphone</label>
</p>
<p class="switch-radio">
<input id="presentboth" type="radio" name="presentradio" value="both"/>
<label for="presentboth">Camera and microphone</label>
</p>
</div>
</fieldset>
<div class="clear"></div>
<div class="connect">
<input id="connectbutton" type="submit" class="btn btn-blue" value="Connect"/>
@@ -159,11 +162,11 @@
<div class="profile-info">
<span id="userspan"></span>
<span id="permspan"></span>
<span id="chpwspan" class="invisible"><a id="change-password">Change password</a></span>
<span id="chpwspan" class="invisible"><a id="change-password" aria-label="Change password">Change password</a></span>
</div>
<div class="user-logout">
<a id="disconnectbutton">
<span class="logout-icon"><i class="fas fa-sign-out-alt"></i></span>
<a id="disconnectbutton" aria-label="Logout">
<span class="logout-icon"><i class="fas fa-sign-out-alt" aria-hidden="true"></i></span>
<span class="logout-text">Logout</span>
</a>
</div>
static/galene.js
+11 -3
View File
@@ -3441,7 +3441,7 @@ function addToChatbox(id, peerId, dest, nick, time, privileged, history, kind, m
}
if(doHeader) {
let header = document.createElement('p');
let header = document.createElement('h3');
let user = document.createElement('span');
let u = dest && serverConnection.users[dest];
let name = (u && u.username);
@@ -4523,15 +4523,23 @@ function closeNav() {
}
document.getElementById('sidebarCollapse').onclick = function(e) {
document.getElementById("left-sidebar").classList.toggle("active");
let sidebar = document.getElementById("left-sidebar");
sidebar.classList.toggle("active");
document.getElementById("mainrow").classList.toggle("full-width-active");
// Update aria-expanded to reflect the state
let isCollapsed = sidebar.classList.contains("active");
e.currentTarget.setAttribute("aria-expanded", isCollapsed ? "false" : "true");
};
document.getElementById('sidebarCollapse').onkeydown = function(e) {
if(e.key === 'Enter' || e.key === ' ') {
e.preventDefault();
document.getElementById("left-sidebar").classList.toggle("active");
let sidebar = document.getElementById("left-sidebar");
sidebar.classList.toggle("active");
document.getElementById("mainrow").classList.toggle("full-width-active");
// Update aria-expanded to reflect the state
let isCollapsed = sidebar.classList.contains("active");
e.currentTarget.setAttribute("aria-expanded", isCollapsed ? "false" : "true");
}
};