Update
This commit is contained in:
@@ -96,10 +96,14 @@
|
|||||||
|
|
||||||
<section class="side-controls">
|
<section class="side-controls">
|
||||||
<div class="links-block">
|
<div class="links-block">
|
||||||
<label>Participant Link</label>
|
<label for="share-link">Share Link</label>
|
||||||
<input id="participant-link" type="text" readonly>
|
<div class="share-link-row">
|
||||||
<label>Admin Link</label>
|
<input id="share-link" type="text" readonly>
|
||||||
<input id="admin-link" type="text" readonly>
|
<label class="share-admin-toggle">
|
||||||
|
<input id="share-admin-toggle" type="checkbox">
|
||||||
|
<span>Admin</span>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div id="admin-controls" class="admin-controls hidden">
|
<div id="admin-controls" class="admin-controls hidden">
|
||||||
<button type="button" id="reveal-btn" class="btn">Reveal</button>
|
<button type="button" id="reveal-btn" class="btn">Reveal</button>
|
||||||
|
|||||||
@@ -333,11 +333,37 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 0.45rem;
|
gap: 0.45rem;
|
||||||
|
min-width: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.links-block {
|
.links-block {
|
||||||
display: grid;
|
display: grid;
|
||||||
gap: 0.2rem;
|
gap: 0.2rem;
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.share-link-row {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: minmax(0, 1fr) auto;
|
||||||
|
gap: 0.35rem;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.share-admin-toggle {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.25rem;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
#share-link {
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#room-status {
|
||||||
|
min-width: 0;
|
||||||
|
overflow-wrap: anywhere;
|
||||||
|
word-break: break-word;
|
||||||
}
|
}
|
||||||
|
|
||||||
.admin-controls {
|
.admin-controls {
|
||||||
|
|||||||
@@ -16,8 +16,8 @@ const participantList = document.getElementById('participant-list');
|
|||||||
const adminControls = document.getElementById('admin-controls');
|
const adminControls = document.getElementById('admin-controls');
|
||||||
const revealBtn = document.getElementById('reveal-btn');
|
const revealBtn = document.getElementById('reveal-btn');
|
||||||
const resetBtn = document.getElementById('reset-btn');
|
const resetBtn = document.getElementById('reset-btn');
|
||||||
const participantLinkInput = document.getElementById('participant-link');
|
const shareLinkInput = document.getElementById('share-link');
|
||||||
const adminLinkInput = document.getElementById('admin-link');
|
const shareAdminToggle = document.getElementById('share-admin-toggle');
|
||||||
const roomStatus = document.getElementById('room-status');
|
const roomStatus = document.getElementById('room-status');
|
||||||
|
|
||||||
const joinPanel = document.getElementById('join-panel');
|
const joinPanel = document.getElementById('join-panel');
|
||||||
@@ -30,6 +30,7 @@ const joinError = document.getElementById('join-error');
|
|||||||
let participantID = params.get('participantId') || '';
|
let participantID = params.get('participantId') || '';
|
||||||
let adminToken = params.get('adminToken') || '';
|
let adminToken = params.get('adminToken') || '';
|
||||||
let eventSource = null;
|
let eventSource = null;
|
||||||
|
let latestLinks = { participantLink: '', adminLink: '' };
|
||||||
|
|
||||||
const savedUsername = localStorage.getItem(USERNAME_KEY) || '';
|
const savedUsername = localStorage.getItem(USERNAME_KEY) || '';
|
||||||
joinUsernameInput.value = savedUsername;
|
joinUsernameInput.value = savedUsername;
|
||||||
@@ -247,8 +248,8 @@ function renderState(state) {
|
|||||||
renderCards(state.cards, state.participants, state.revealed);
|
renderCards(state.cards, state.participants, state.revealed);
|
||||||
renderSummary(state);
|
renderSummary(state);
|
||||||
|
|
||||||
participantLinkInput.value = `${window.location.origin}${state.links.participantLink}`;
|
latestLinks = state.links || { participantLink: '', adminLink: '' };
|
||||||
adminLinkInput.value = state.links.adminLink ? `${window.location.origin}${state.links.adminLink}` : '';
|
updateShareLink();
|
||||||
|
|
||||||
if (state.viewerIsAdmin) {
|
if (state.viewerIsAdmin) {
|
||||||
adminControls.classList.remove('hidden');
|
adminControls.classList.remove('hidden');
|
||||||
@@ -261,6 +262,12 @@ function renderState(state) {
|
|||||||
roomStatus.textContent = `Votes: ${votedCount}/${totalParticipants}`;
|
roomStatus.textContent = `Votes: ${votedCount}/${totalParticipants}`;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function updateShareLink() {
|
||||||
|
const useAdmin = shareAdminToggle.checked && latestLinks.adminLink;
|
||||||
|
const raw = useAdmin ? latestLinks.adminLink : latestLinks.participantLink;
|
||||||
|
shareLinkInput.value = raw ? `${window.location.origin}${raw}` : '';
|
||||||
|
}
|
||||||
|
|
||||||
function connectSSE() {
|
function connectSSE() {
|
||||||
if (eventSource) {
|
if (eventSource) {
|
||||||
eventSource.close();
|
eventSource.close();
|
||||||
@@ -326,6 +333,7 @@ async function adminAction(action) {
|
|||||||
|
|
||||||
revealBtn.addEventListener('click', () => adminAction('reveal'));
|
revealBtn.addEventListener('click', () => adminAction('reveal'));
|
||||||
resetBtn.addEventListener('click', () => adminAction('reset'));
|
resetBtn.addEventListener('click', () => adminAction('reset'));
|
||||||
|
shareAdminToggle.addEventListener('change', updateShareLink);
|
||||||
|
|
||||||
joinForm.addEventListener('submit', async (event) => {
|
joinForm.addEventListener('submit', async (event) => {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
|
|||||||
Reference in New Issue
Block a user