Added lobby-music

This commit is contained in:
Mawoka
2022-09-18 11:28:28 +02:00
parent 7b677f5eba
commit 1d6dceab82
7 changed files with 128 additions and 31 deletions
+34 -29
View File
@@ -11,6 +11,7 @@
import { navbarVisible } from '$lib/stores';
import type { PlayerAnswer, Player } from '$lib/admin.ts';
import SomeAdminScreen from '$lib/admin.svelte';
import AudioPlayer from '$lib/play/audio_player.svelte';
import { browser } from '$app/environment';
import { onMount } from 'svelte';
@@ -36,6 +37,7 @@
let success = false;
let dataexport_download_a;
let warnToLeave = true;
let play_music = false;
const connect = async () => {
socket.emit('register_as_admin', {
@@ -128,37 +130,40 @@
<p class="text-red-700">{errorMessage}</p>
{/if}
{:else if !game_started}
<img
alt="QR code to join the game"
src="/api/v1/utils/qr/{quiz_data.game_pin}?dark_mode={darkMode}"
class="block mx-auto w-1/6"
/>
<p class="text-3xl text-center ">{$t('words.pin')}: {quiz_data.game_pin}</p>
<div class="flex justify-center w-full mt-4">
<ul class="list-disc pl-8">
{#if players.length > 0}
{#each players as player}
<li>
<span>{player.username}</span>
<!-- <button>{$t('words.kick')}</button>-->
</li>
{/each}
{/if}
</ul>
</div>
{#if players.length > 0}
<div class="w-full h-full">
<AudioPlayer bind:play={play_music} />
<img
alt="QR code to join the game"
src="/api/v1/utils/qr/{quiz_data.game_pin}?dark_mode={darkMode}"
class="block mx-auto w-1/6"
/>
<p class="text-3xl text-center ">{$t('words.pin')}: {quiz_data.game_pin}</p>
<div class="flex justify-center w-full mt-4">
<button
class="ml-4 px-4 py-2 leading-5 text-white transition-colors duration-200 transform bg-gray-700 rounded text-center hover:bg-gray-600 focus:outline-none disabled:cursor-not-allowed disabled:opacity-50"
id="startGame"
on:click={() => {
socket.emit('start_game', '');
game_started = true;
}}
>{$t('admin_page.start_game')}
</button>
<ul class="list-disc pl-8">
{#if players.length > 0}
{#each players as player}
<li>
<span>{player.username}</span>
<!-- <button>{$t('words.kick')}</button>-->
</li>
{/each}
{/if}
</ul>
</div>
{/if}
{#if players.length > 0}
<div class="flex justify-center w-full mt-4">
<button
class="ml-4 px-4 py-2 leading-5 text-white transition-colors duration-200 transform bg-gray-700 rounded text-center hover:bg-gray-600 focus:outline-none disabled:cursor-not-allowed disabled:opacity-50"
id="startGame"
on:click={() => {
socket.emit('start_game', '');
game_started = true;
}}
>{$t('admin_page.start_game')}
</button>
</div>
{/if}
</div>
{:else}
<SomeAdminScreen
bind:final_results