Add en-US translations

This commit is contained in:
Nolway 2021-12-19 16:01:51 +01:00 committed by Alexis Faizeau
parent 31b92da6ce
commit bd01a35cc6
45 changed files with 539 additions and 158 deletions

View file

@ -1,6 +1,7 @@
<script lang="ts">
import { gameManager } from "../../Phaser/Game/GameManager";
import { onMount } from "svelte";
import { translator } from "../../Translator/Translator";
let gameScene = gameManager.getCurrentGameScene();
@ -11,7 +12,7 @@
let mapName: string = "";
let mapLink: string = "";
let mapDescription: string = "";
let mapCopyright: string = "The map creator did not declare a copyright for the map.";
let mapCopyright: string = translator._("menu.about.copyrights.map.empty");
let tilesetCopyright: string[] = [];
let audioCopyright: string[] = [];
@ -62,41 +63,37 @@
</script>
<div class="about-room-main">
<h2>Information on the map</h2>
<h2>{translator._("menu.about.map-info")}</h2>
<section class="container-overflow">
<h3>{mapName}</h3>
<p class="string-HTML">{mapDescription}</p>
{#if mapLink}
<p class="string-HTML">&gt; <a href={mapLink} target="_blank">link to this map</a> &lt;</p>
<p class="string-HTML">
&gt; <a href={mapLink} target="_blank">{translator._("menu.about.map-link")}</a> &lt;
</p>
{/if}
<h3 class="nes-pointer hoverable" on:click={() => (expandedMapCopyright = !expandedMapCopyright)}>
Copyrights of the map
{translator._("menu.about.copyrights.map.title")}
</h3>
<p class="string-HTML" hidden={!expandedMapCopyright}>{mapCopyright}</p>
<h3 class="nes-pointer hoverable" on:click={() => (expandedTilesetCopyright = !expandedTilesetCopyright)}>
Copyrights of the tilesets
{translator._("menu.about.copyrights.tileset.title")}
</h3>
<section hidden={!expandedTilesetCopyright}>
{#each tilesetCopyright as copyright}
<p class="string-HTML">{copyright}</p>
{:else}
<p>
The map creator did not declare a copyright for the tilesets. This doesn't mean that those tilesets
have no license.
</p>
<p>{translator._("menu.about.copyrights.tileset.empty")}</p>
{/each}
</section>
<h3 class="nes-pointer hoverable" on:click={() => (expandedAudioCopyright = !expandedAudioCopyright)}>
Copyrights of audio files
{translator._("menu.about.copyrights.audio.title")}
</h3>
<section hidden={!expandedAudioCopyright}>
{#each audioCopyright as copyright}
<p class="string-HTML">{copyright}</p>
{:else}
<p>
The map creator did not declare a copyright for audio files. This doesn't mean that those tilesets
have no license.
</p>
<p>{translator._("menu.about.copyrights.audio.empty")}</p>
{/each}
</section>
</section>

View file

@ -4,6 +4,7 @@
import { AdminMessageEventTypes } from "../../Connexion/AdminMessagesService";
import uploadFile from "../images/music-file.svg";
import type { PlayGlobalMessageInterface } from "../../Connexion/ConnexionModels";
import { translator } from "../../Translator/Translator";
interface EventTargetFiles extends EventTarget {
files: Array<File>;
@ -76,7 +77,7 @@
<img
class="nes-pointer"
src={uploadFile}
alt="Upload a file"
alt={translator._("menu.global-audio.upload-info")}
on:click|preventDefault={() => {
fileInput.click();
}}
@ -85,7 +86,7 @@
<p>{fileName} : {fileSize}</p>
{/if}
{#if errorFile}
<p class="err">No file selected. You need to upload a file before sending it.</p>
<p class="err">{translator._("menu.global-audio.error")}</p>
{/if}
<input
type="file"

View file

@ -1,4 +1,7 @@
<script lang="ts">
import { contactPageStore } from "../../Stores/MenuStore";
import { translator } from "../../Translator/Translator";
function goToGettingStarted() {
const sparkHost = "https://workadventu.re/getting-started";
window.open(sparkHost, "_blank");
@ -8,25 +11,24 @@
const sparkHost = "https://workadventu.re/map-building/";
window.open(sparkHost, "_blank");
}
import { contactPageStore } from "../../Stores/MenuStore";
</script>
<div class="create-map-main">
<section class="container-overflow">
<section>
<h3>Getting started</h3>
<p>
WorkAdventure allows you to create an online space to communicate spontaneously with others. And it all
starts with creating your own space. Choose from a large selection of prefabricated maps by our team.
</p>
<button type="button" class="nes-btn is-primary" on:click={goToGettingStarted}>Getting started</button>
<h3>{translator._("menu.contact.getting-started.title")}</h3>
<p>{translator._("menu.contact.getting-started.description")}</p>
<button type="button" class="nes-btn is-primary" on:click={goToGettingStarted}
>{translator._("menu.contact.getting-started.title")}</button
>
</section>
<section>
<h3>Create your map</h3>
<p>You can also create your own custom map by following the step of the documentation.</p>
<button type="button" class="nes-btn" on:click={goToBuildingMap}>Create your map</button>
<h3>{translator._("menu.contact.create-map.title")}</h3>
<p>{translator._("menu.contact.create-map.description")}</p>
<button type="button" class="nes-btn" on:click={goToBuildingMap}
>{translator._("menu.contact.create-map.title")}</button
>
</section>
<iframe

View file

@ -1,6 +1,7 @@
<script lang="ts">
import TextGlobalMessage from "./TextGlobalMessage.svelte";
import AudioGlobalMessage from "./AudioGlobalMessage.svelte";
import { translator } from "../../Translator/Translator";
let handleSendText: { sendTextMessage(broadcast: boolean): void };
let handleSendAudio: { sendAudioMessage(broadcast: boolean): Promise<void> };
@ -35,14 +36,14 @@
<button
type="button"
class="nes-btn {inputSendTextActive ? 'is-disabled' : ''}"
on:click|preventDefault={activateInputText}>Text</button
on:click|preventDefault={activateInputText}>{translator._("menu.global-message.text")}</button
>
</section>
<section>
<button
type="button"
class="nes-btn {uploadAudioActive ? 'is-disabled' : ''}"
on:click|preventDefault={activateUploadAudio}>Audio</button
on:click|preventDefault={activateUploadAudio}>{translator._("menu.global-message.audio")}</button
>
</section>
</div>
@ -57,10 +58,12 @@
<div class="global-message-footer">
<label>
<input type="checkbox" class="nes-checkbox is-dark nes-pointer" bind:checked={broadcastToWorld} />
<span>Broadcast to all rooms of the world</span>
<span>{translator._("menu.global-message.warning")}</span>
</label>
<section>
<button class="nes-btn is-primary" on:click|preventDefault={send}>Send</button>
<button class="nes-btn is-primary" on:click|preventDefault={send}
>{translator._("menu.global-message.send")}</button
>
</section>
</div>
</div>

View file

@ -1,4 +1,6 @@
<script lang="ts">
import { translator } from "../../Translator/Translator";
function copyLink() {
const input: HTMLInputElement = document.getElementById("input-share-link") as HTMLInputElement;
input.focus();
@ -21,14 +23,18 @@
<div class="guest-main">
<section class="container-overflow">
<section class="share-url not-mobile">
<h3>Share the link of the room!</h3>
<h3>{translator._("menu.invite.description")}</h3>
<input type="text" readonly id="input-share-link" value={location.toString()} />
<button type="button" class="nes-btn is-primary" on:click={copyLink}>Copy</button>
<button type="button" class="nes-btn is-primary" on:click={copyLink}
>{translator._("menu.invite.copy")}</button
>
</section>
<section class="is-mobile">
<h3>Share the link of the room!</h3>
<h3>{translator._("menu.invite.description")}</h3>
<input type="hidden" readonly id="input-share-link" value={location.toString()} />
<button type="button" class="nes-btn is-primary" on:click={shareLink}>Share</button>
<button type="button" class="nes-btn is-primary" on:click={shareLink}
>{translator._("menu.invite.share")}</button
>
</section>
</section>
</div>

View file

@ -18,6 +18,7 @@
import { get } from "svelte/store";
import type { Unsubscriber } from "svelte/store";
import { sendMenuClickedEvent } from "../../Api/iframe/Ui/MenuItem";
import { translator } from "../../Translator/Translator";
let activeSubMenu: string = SubMenusInterface.profile;
let activeComponent: typeof ProfileSubMenu | typeof CustomSubMenu = ProfileSubMenu;
@ -82,18 +83,26 @@
function closeMenu() {
menuVisiblilityStore.set(false);
}
function onKeyDown(e: KeyboardEvent) {
if (e.key === "Escape") {
closeMenu();
}
}
function translateMenuName(menuName: string) {
const nameFormatted = "menu.sub." + menuName.toLowerCase().replaceAll(" ", "-");
const translation = translator._(nameFormatted);
return translation === nameFormatted ? menuName : translation;
}
</script>
<svelte:window on:keydown={onKeyDown} />
<div class="menu-container-main">
<div class="menu-nav-sidebar nes-container is-rounded" transition:fly={{ x: -1000, duration: 500 }}>
<h2>Menu</h2>
<h2>{translator._("menu.title")}</h2>
<nav>
{#each $subMenusStore as submenu}
<button
@ -101,14 +110,14 @@
class="nes-btn {activeSubMenu === submenu ? 'is-disabled' : ''}"
on:click|preventDefault={() => switchMenu(submenu)}
>
{submenu}
{translateMenuName(submenu)}
</button>
{/each}
</nav>
</div>
<div class="menu-submenu-container nes-container is-rounded" transition:fly={{ y: -1000, duration: 500 }}>
<button type="button" class="nes-btn is-error close" on:click={closeMenu}>&times</button>
<h2>{activeSubMenu}</h2>
<h2>{translateMenuName(activeSubMenu)}</h2>
<svelte:component this={activeComponent} {...props} />
</div>
</div>

View file

@ -9,6 +9,7 @@
import { get } from "svelte/store";
import { ADMIN_URL } from "../../Enum/EnvironmentVariable";
import { showShareLinkMapModalStore } from "../../Stores/ModalStore";
import { translator } from "../../Translator/Translator";
function showMenu() {
menuVisiblilityStore.set(!get(menuVisiblilityStore));
@ -29,11 +30,31 @@
<main class="menuIcon">
{#if $limitMapStore}
<img src={logoInvite} alt="open menu" class="nes-pointer" on:click|preventDefault={showInvite} />
<img src={logoRegister} alt="open menu" class="nes-pointer" on:click|preventDefault={register} />
<img
src={logoInvite}
alt={translator._("menu.icon.open.invite")}
class="nes-pointer"
on:click|preventDefault={showInvite}
/>
<img
src={logoRegister}
alt={translator._("menu.icon.open.register")}
class="nes-pointer"
on:click|preventDefault={register}
/>
{:else}
<img src={logoWA} alt="open menu" class="nes-pointer" on:click|preventDefault={showMenu} />
<img src={logoTalk} alt="open menu" class="nes-pointer" on:click|preventDefault={showChat} />
<img
src={logoWA}
alt={translator._("menu.icon.open.menu")}
class="nes-pointer"
on:click|preventDefault={showMenu}
/>
<img
src={logoTalk}
alt={translator._("menu.icon.open.chat")}
class="nes-pointer"
on:click|preventDefault={showChat}
/>
{/if}
</main>

View file

@ -17,6 +17,7 @@
import btnProfileSubMenuCompanion from "../images/btn-menu-profile-companion.svg";
import Woka from "../Woka/Woka.svelte";
import Companion from "../Companion/Companion.svelte";
import { translator } from "../../Translator/Translator";
function disableMenuStores() {
menuVisiblilityStore.set(false);
@ -62,20 +63,20 @@
<div class="submenu">
<section>
<button type="button" class="nes-btn" on:click|preventDefault={openEditNameScene}>
<img src={btnProfileSubMenuIdentity} alt="Edit your name" />
<span class="btn-hover">Edit your name</span>
<img src={btnProfileSubMenuIdentity} alt={translator._("menu.profile.edit.name")} />
<span class="btn-hover">{translator._("menu.profile.edit.name")}</span>
</button>
<button type="button" class="nes-btn" on:click|preventDefault={openEditSkinScene}>
<Woka userId={-1} placeholderSrc="" width="26px" height="26px" />
<span class="btn-hover">Edit your WOKA</span>
<span class="btn-hover">{translator._("menu.profile.edit.woka")}</span>
</button>
<button type="button" class="nes-btn" on:click|preventDefault={openEditCompanionScene}>
<Companion userId={-1} placeholderSrc={btnProfileSubMenuCompanion} width="26px" height="26px" />
<span class="btn-hover">Edit your companion</span>
<span class="btn-hover">{translator._("menu.profile.edit.companion")}</span>
</button>
<button type="button" class="nes-btn" on:click|preventDefault={openEnableCameraScene}>
<img src={btnProfileSubMenuCamera} alt="Edit your camera" />
<span class="btn-hover">Edit your camera</span>
<img src={btnProfileSubMenuCamera} alt={translator._("menu.profile.edit.camera")} />
<span class="btn-hover">{translator._("menu.profile.edit.camera")}</span>
</button>
</section>
</div>
@ -88,11 +89,13 @@
{/if}
</section>
<section>
<button type="button" class="nes-btn" on:click|preventDefault={logOut}>Log out</button>
<button type="button" class="nes-btn" on:click|preventDefault={logOut}
>{translator._("menu.profile.logout")}</button
>
</section>
{:else}
<section>
<a type="button" class="nes-btn" href="/login">Sign in</a>
<a type="button" class="nes-btn" href="/login">{translator._("menu.profile.login")}</a>
</section>
{/if}
</div>

View file

@ -4,6 +4,7 @@
import { HtmlUtils } from "../../WebRtc/HtmlUtils";
import { isMobile } from "../../Enum/EnvironmentVariable";
import { menuVisiblilityStore } from "../../Stores/MenuStore";
import { translator } from "../../Translator/Translator";
let fullscreen: boolean = localUserStore.getFullscreen();
let notification: boolean = localUserStore.getNotification() === "granted";
@ -73,34 +74,64 @@
<div class="settings-main" on:submit|preventDefault={saveSetting}>
<section>
<h3>Game quality</h3>
<h3>{translator._("menu.settings.game-quality.title")}</h3>
<div class="nes-select is-dark">
<select bind:value={valueGame}>
<option value={120}>{isMobile() ? "High (120 fps)" : "High video quality (120 fps)"}</option>
<option value={60}
>{isMobile() ? "Medium (60 fps)" : "Medium video quality (60 fps, recommended)"}</option
<option value={120}
>{isMobile()
? translator._("menu.settings.game-quality.short.high")
: translator._("menu.settings.game-quality.long.high")}</option
>
<option value={60}
>{isMobile()
? translator._("menu.settings.game-quality.short.medium")
: translator._("menu.settings.game-quality.long.medium")}</option
>
<option value={40}
>{isMobile()
? translator._("menu.settings.game-quality.short.minimum")
: translator._("menu.settings.game-quality.long.minimum")}</option
>
<option value={20}
>{isMobile()
? translator._("menu.settings.game-quality.short.small")
: translator._("menu.settings.game-quality.long.small")}</option
>
<option value={40}>{isMobile() ? "Minimum (40 fps)" : "Minimum video quality (40 fps)"}</option>
<option value={20}>{isMobile() ? "Small (20 fps)" : "Small video quality (20 fps)"}</option>
</select>
</div>
</section>
<section>
<h3>Video quality</h3>
<h3>{translator._("menu.settings.video-quality.title")}</h3>
<div class="nes-select is-dark">
<select bind:value={valueVideo}>
<option value={30}>{isMobile() ? "High (30 fps)" : "High video quality (30 fps)"}</option>
<option value={20}
>{isMobile() ? "Medium (20 fps)" : "Medium video quality (20 fps, recommended)"}</option
<option value={30}
>{isMobile()
? translator._("menu.settings.video-quality.short.high")
: translator._("menu.settings.video-quality.long.high")}</option
>
<option value={20}
>{isMobile()
? translator._("menu.settings.video-quality.short.medium")
: translator._("menu.settings.video-quality.long.medium")}</option
>
<option value={10}
>{isMobile()
? translator._("menu.settings.video-quality.short.minimum")
: translator._("menu.settings.video-quality.long.minimum")}</option
>
<option value={5}
>{isMobile()
? translator._("menu.settings.video-quality.short.small")
: translator._("menu.settings.video-quality.long.small")}</option
>
<option value={10}>{isMobile() ? "Minimum (10 fps)" : "Minimum video quality (10 fps)"}</option>
<option value={5}>{isMobile() ? "Small (5 fps)" : "Small video quality (5 fps)"}</option>
</select>
</div>
</section>
<section class="settings-section-save">
<p>(Saving these settings will restart the game)</p>
<button type="button" class="nes-btn is-primary" on:click|preventDefault={saveSetting}>Save</button>
<p>{translator._("menu.settings.save.warning")}</p>
<button type="button" class="nes-btn is-primary" on:click|preventDefault={saveSetting}
>{translator._("menu.settings.save.button")}</button
>
</section>
<section class="settings-section-noSaveOption">
<label>
@ -110,7 +141,7 @@
bind:checked={fullscreen}
on:change={changeFullscreen}
/>
<span>Fullscreen</span>
<span>{translator._("menu.settings.fullscreen")}</span>
</label>
<label>
<input
@ -119,7 +150,7 @@
bind:checked={notification}
on:change={changeNotification}
/>
<span>Notifications</span>
<span>{translator._("menu.settings.notifications")}</span>
</label>
<label>
<input
@ -128,7 +159,7 @@
bind:checked={forceCowebsiteTrigger}
on:change={changeForceCowebsiteTrigger}
/>
<span>Always ask before opening websites and Jitsi Meet rooms</span>
<span>{translator._("menu.settings.cowebsite-trigger")}</span>
</label>
<label>
<input
@ -137,7 +168,7 @@
bind:checked={ignoreFollowRequests}
on:change={changeIgnoreFollowRequests}
/>
<span>Ignore requests to follow other users</span>
<span>{translator._("menu.settings.ignore-follow-request")}</span>
</label>
</section>
</div>

View file

@ -5,6 +5,7 @@
import { AdminMessageEventTypes } from "../../Connexion/AdminMessagesService";
import type { Quill } from "quill";
import type { PlayGlobalMessageInterface } from "../../Connexion/ConnexionModels";
import { translator } from "../../Translator/Translator";
//toolbar
const toolbarOptions = [
@ -58,7 +59,7 @@
const { default: Quill } = await import("quill"); // eslint-disable-line @typescript-eslint/no-explicit-any
quill = new Quill(QUILL_EDITOR, {
placeholder: "Enter your message here...",
placeholder: translator._("menu.global-message.enter"),
theme: "snow",
modules: {
toolbar: toolbarOptions,