Kraut.World/server
3
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Lint & Prettier fixes on Svelte files

Browse source
This commit is contained in:
Alexis Faizeau 2021-12-06 16:12:37 +01:00
parent 6cd76b9c1b
commit c95e20c677
46 changed files with 1852 additions and 1695 deletions
Download patch file Download diff file Expand all files Collapse all files

15
front/src/Components/ReportMenu/BlockSubMenu.svelte
View file

@ -1,7 +1,7 @@
<script lang="ts">
import {blackListManager} from "../../WebRtc/BlackListManager";
import {showReportScreenStore, userReportEmpty} from "../../Stores/ShowReportScreenStore";
import {onMount} from "svelte";
import { blackListManager } from "../../WebRtc/BlackListManager";
import { showReportScreenStore, userReportEmpty } from "../../Stores/ShowReportScreenStore";
import { onMount } from "svelte";
export let userUUID: string | undefined;
export let userName: string;
@ -14,7 +14,7 @@
} else {
userIsBlocked = blackListManager.isBlackListed(userUUID);
}
})
});
function blockUser(): void {
if (userUUID === undefined) {
@ -32,13 +32,12 @@
<h3>Block</h3>
<p>Block any communication from and to {userName}. This can be reverted.</p>
<button type="button" class="nes-btn is-error" on:click|preventDefault={blockUser}>
{userIsBlocked ? 'Unblock this user' : 'Block this user'}
{userIsBlocked ? "Unblock this user" : "Block this user"}
</button>
</div>
<style lang="scss">
div.block-container {
text-align: center;
text-align: center;
}
</style>
</style>

140
front/src/Components/ReportMenu/ReportMenu.svelte
View file

@ -1,20 +1,20 @@
<script lang="ts">
import {showReportScreenStore, userReportEmpty} from "../../Stores/ShowReportScreenStore";
import { showReportScreenStore, userReportEmpty } from "../../Stores/ShowReportScreenStore";
import BlockSubMenu from "./BlockSubMenu.svelte";
import ReportSubMenu from "./ReportSubMenu.svelte";
import {onDestroy, onMount} from "svelte";
import type {Unsubscriber} from "svelte/store";
import {playersStore} from "../../Stores/PlayersStore";
import {connectionManager} from "../../Connexion/ConnectionManager";
import {GameConnexionTypes} from "../../Url/UrlManager";
import {get} from "svelte/store";
import { onDestroy, onMount } from "svelte";
import type { Unsubscriber } from "svelte/store";
import { playersStore } from "../../Stores/PlayersStore";
import { connectionManager } from "../../Connexion/ConnectionManager";
import { GameConnexionTypes } from "../../Url/UrlManager";
import { get } from "svelte/store";
let blockActive = true;
let blockActive = true;
let reportActive = !blockActive;
let anonymous: boolean = false;
let userUUID: string | undefined = playersStore.getPlayerById(get(showReportScreenStore).userId)?.userUuid;
let userName = "No name";
let unsubscriber: Unsubscriber
let unsubscriber: Unsubscriber;
onMount(() => {
unsubscriber = showReportScreenStore.subscribe((reportScreenStore) => {
@ -25,15 +25,15 @@
console.error("Could not find UUID for user with ID " + reportScreenStore.userId);
}
}
})
});
anonymous = connectionManager.getConnexionType === GameConnexionTypes.anonymous;
})
});
onDestroy(() => {
if (unsubscriber) {
unsubscriber();
}
})
});
function close() {
showReportScreenStore.set(userReportEmpty);
@ -49,14 +49,14 @@
reportActive = true;
}
function onKeyDown(e:KeyboardEvent) {
if (e.key === 'Escape') {
function onKeyDown(e: KeyboardEvent) {
if (e.key === "Escape") {
close();
}
}
</script>
<svelte:window on:keydown={onKeyDown}/>
<svelte:window on:keydown={onKeyDown} />
<div class="report-menu-main nes-container is-rounded">
<section class="report-menu-title">
@ -67,75 +67,83 @@
</section>
<section class="report-menu-action {anonymous ? 'hidden' : ''}">
<section class="justify-center">
<button type="button" class="nes-btn {blockActive ? 'is-disabled' : ''}" on:click|preventDefault={activateBlock}>Block</button>
<button
type="button"
class="nes-btn {blockActive ? 'is-disabled' : ''}"
on:click|preventDefault={activateBlock}>Block</button
>
</section>
<section class="justify-center">
<button type="button" class="nes-btn {reportActive ? 'is-disabled' : ''}" on:click|preventDefault={activateReport}>Report</button>
<button
type="button"
class="nes-btn {reportActive ? 'is-disabled' : ''}"
on:click|preventDefault={activateReport}>Report</button
>
</section>
</section>
<section class="report-menu-content">
{#if blockActive}
<BlockSubMenu userUUID="{userUUID}" userName="{userName}"/>
<BlockSubMenu {userUUID} {userName} />
{:else if reportActive}
<ReportSubMenu userUUID="{userUUID}"/>
{:else }
<ReportSubMenu {userUUID} />
{:else}
<p>ERROR : There is no action selected.</p>
{/if}
</section>
</div>
<style lang="scss">
.nes-container {
padding: 5px;
}
.nes-container {
padding: 5px;
}
section.justify-center {
display: flex;
justify-content: center;
align-items: center;
}
div.report-menu-main {
font-family: "Press Start 2P";
pointer-events: auto;
background-color: #333333;
color: whitesmoke;
position: relative;
height: 70vh;
width: 50vw;
top: 10vh;
margin: auto;
section.report-menu-title {
display: grid;
grid-template-columns: calc(100% - 45px) 40px;
margin-bottom: 20px;
h2 {
section.justify-center {
display: flex;
justify-content: center;
align-items: center;
}
}
section.report-menu-action {
display: grid;
grid-template-columns: 50% 50%;
margin-bottom: 20px;
}
section.report-menu-action.hidden {
display: none;
}
}
@media only screen and (max-width: 800px) {
div.report-menu-main {
top: 21vh;
height: 60vh;
width: 100vw;
font-size: 0.5em;
font-family: "Press Start 2P";
pointer-events: auto;
background-color: #333333;
color: whitesmoke;
position: relative;
height: 70vh;
width: 50vw;
top: 10vh;
margin: auto;
section.report-menu-title {
display: grid;
grid-template-columns: calc(100% - 45px) 40px;
margin-bottom: 20px;
h2 {
display: flex;
justify-content: center;
align-items: center;
}
}
section.report-menu-action {
display: grid;
grid-template-columns: 50% 50%;
margin-bottom: 20px;
}
section.report-menu-action.hidden {
display: none;
}
}
}
</style>
@media only screen and (max-width: 800px) {
div.report-menu-main {
top: 21vh;
height: 60vh;
width: 100vw;
font-size: 0.5em;
}
}
</style>

32
front/src/Components/ReportMenu/ReportSubMenu.svelte
View file

@ -1,22 +1,22 @@
<script lang="ts">
import {showReportScreenStore, userReportEmpty} from "../../Stores/ShowReportScreenStore";
import {gameManager} from "../../Phaser/Game/GameManager";
import { showReportScreenStore, userReportEmpty } from "../../Stores/ShowReportScreenStore";
import { gameManager } from "../../Phaser/Game/GameManager";
export let userUUID: string | undefined;
let reportMessage: string;
let hiddenError = true;
function submitReport() {
if (reportMessage === '') {
if (reportMessage === "") {
hiddenError = true;
} else {
hiddenError = false;
if( userUUID === undefined) {
console.error('User UUID is not valid.');
if (userUUID === undefined) {
console.error("User UUID is not valid.");
return;
}
gameManager.getCurrentGameScene().connection?.emitReportPlayerMessage(userUUID, reportMessage);
showReportScreenStore.set(userReportEmpty)
showReportScreenStore.set(userReportEmpty);
}
}
</script>
@ -28,9 +28,9 @@
<section>
<label>
<span>Your message: </span>
<textarea type="text" class="nes-textarea" bind:value={reportMessage}></textarea>
<textarea type="text" class="nes-textarea" bind:value={reportMessage} />
</label>
<p hidden="{hiddenError}">Report message cannot to be empty.</p>
<p hidden={hiddenError}>Report message cannot to be empty.</p>
</section>
<section>
<button type="submit" class="nes-btn is-error" on:click={submitReport}>Report this user</button>
@ -40,16 +40,16 @@
<style lang="scss">
div.report-container-main {
text-align: center;
text-align: center;
textarea {
height: clamp(100px, 15vh, 300px);
}
textarea {
height: clamp(100px, 15vh, 300px);
}
}
@media only screen and (max-height: 630px) {
div.report-container-main textarea {
height: 50px;
}
div.report-container-main textarea {
height: 50px;
}
}
</style>
</style>