McSchneidarandFlorian Ostertag
336d08040e
* Replace the WCF webserver with an ASP.NET Core webserver (VocaluxeWeb) - New project VocaluxeWeb: ASP.NET Core 2.3 (Kestrel) on .NET Framework 4.8.1, HTTP or HTTPS with a self-signed certificate, REST API (/api/v1) with Swagger, live events (Server-Sent Events) - Access to the game only through IVocaluxeRemote; requests run on the main thread once per frame - Sessions with roles (guest, player, admin) and configurable permissions, PINs hashed with PBKDF2 - Queue as a playlist with requesters and singers, fair order (one song per person and round) - Admin: settings, server status, logged-in devices, activate/deactivate and delete profiles - Profile pictures: own photo or one of the Vocaluxe avatars - Game: WebApp queue screen (song options, playlist group) to start the next song with the chosen singers, return to it after singing, warning when the webserver is off, remote keyboard - Old WCF server, WebserverInitalConfig and URL reservations removed; libraries moved to libs/managed - Unit tests for PIN hashing, settings and permissions, queue order and device names - AppVeyor: Visual Studio 2022 image and Node.js 24 (the build compiles the WebApp) - Documentation in VocaluxeWeb/README.md * New WebApp (Vue 3, TypeScript, Vite) replacing the old jQuery Mobile website - Login with profile and PIN, create profiles - Songs with search, filters, sorting and 30 second previews - Queue: add songs with game mode, audio and singers, edit, reorder, start in the game - Playlists: create, edit, add to the queue - Now playing with live updates, remote control and keyboard - Players: own profile with picture (photo or Vocaluxe avatar), roles for admins - Admin settings: permissions, server status, devices, profiles - Help page, responsive layout for phones, tablets and desktops, light and dark mode - Texts in WebApp/src/locales/en.json, translated with Transifex - Old website and PhoneGap config removed --------- Co-authored-by: Florian Ostertag <flokuep@users.noreply.github.com>
50 lines
1.2 KiB
Vue
50 lines
1.2 KiB
Vue
<script setup lang="ts">
|
|
import { computed } from 'vue'
|
|
import { useI18n } from 'vue-i18n'
|
|
import AppIcon, { type IconName } from '@/components/AppIcon.vue'
|
|
import { session } from '@/stores/session'
|
|
|
|
const { t } = useI18n()
|
|
const queueName = computed(() => session.state.server?.queuePlaylistName ?? 'WebApp Queue')
|
|
|
|
const sections: { icon: IconName; key: string }[] = [
|
|
{ icon: 'queue', key: 'queue' },
|
|
{ icon: 'music', key: 'game' },
|
|
{ icon: 'mic', key: 'start' },
|
|
{ icon: 'playlist', key: 'playlists' },
|
|
{ icon: 'play', key: 'preview' },
|
|
{ icon: 'globe', key: 'connect' },
|
|
{ icon: 'lock', key: 'https' }
|
|
]
|
|
</script>
|
|
|
|
<template>
|
|
<div class="page">
|
|
<header class="page-header">
|
|
<h1>{{ t('help.title') }}</h1>
|
|
</header>
|
|
<section v-for="s in sections" :key="s.key" class="card section">
|
|
<h2><AppIcon :name="s.icon" :size="20" /> {{ t(`help.${s.key}Title`) }}</h2>
|
|
<p>{{ t(`help.${s.key}Text`, { name: queueName }) }}</p>
|
|
</section>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.section {
|
|
display: grid;
|
|
gap: 8px;
|
|
}
|
|
|
|
.section h2 {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
}
|
|
|
|
.section p {
|
|
margin: 0;
|
|
color: var(--text-muted);
|
|
}
|
|
</style>
|