feat(*): Add share room link button

This commit is contained in:
Josh Creek
2023-07-12 11:59:01 +00:00
parent 6dc835f4c9
commit f71bfcfb66
+28 -2
View File
@@ -142,14 +142,21 @@
onMount(() => { onMount(() => {
socket = connectToWebSocket(data.roomId, onMessageReceived); socket = connectToWebSocket(data.roomId, onMessageReceived);
}); });
async function copyToClipboard() {
try {
await navigator.clipboard.writeText(window.location.href);
alert('Room link copied to clipboard!');
} catch (err) {
console.error('Failed to copy: ', err);
}
}
</script> </script>
{#if showModal} {#if showModal}
<Modal {closeModal} {joinRoom} /> <Modal {closeModal} {joinRoom} />
{/if} {/if}
<UsersList bind:this={usersList} {users} {showEstimates} {userId} {handleEmojiTrigger} /> <UsersList bind:this={usersList} {users} {showEstimates} {userId} {handleEmojiTrigger} />
<div class="button-container"> <div class="button-container">
@@ -169,6 +176,10 @@
{/if} {/if}
</div> </div>
<button id="copy-link-btn" class="button button-white" on:click={copyToClipboard}
>Share Room Link</button
>
<Estimates onEstimateClick={handleEstimateClick} /> <Estimates onEstimateClick={handleEstimateClick} />
{#if Object.keys(estimateGroups).length > 0} {#if Object.keys(estimateGroups).length > 0}
@@ -230,4 +241,19 @@
.button-red:hover { .button-red:hover {
background-color: #a2021f; background-color: #a2021f;
} }
.button-white {
background-color: #ffffff;
color: black;
}
.button-white:hover {
background-color: #E6E6E6;
}
#copy-link-btn {
position: fixed;
top: 10px;
right: 10px;
}
</style> </style>