_Bastler/partey_workadventure
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Co-Wesbite

Browse Source
This commit is contained in:
_Bastler 2022-02-15 08:13:53 +01:00
parent 5451fc788d
commit d63a32e94e
13 changed files with 63 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
front/dist/index.ejs vendored
View File

@ -29,9 +29,8 @@
<script src="/env-config.js"></script> <script src="/env-config.js"></script>
<base href="/"> <base href="/">
<link href="https://unpkg.com/nes.css@2.3.0/css/nes.min.css" rel="stylesheet" />
<title>WorkAdventure</title> <title>Partey</title>
</head> </head>
<body id="body" style="margin: 0; background-color: #000"> <body id="body" style="margin: 0; background-color: #000">
<div class="main-container" id="main-container"> <div class="main-container" id="main-container">

1
front/src/Api/Events/OpenCoWebsiteEvent.ts
View File

@ -9,6 +9,7 @@ export const isOpenCoWebsiteEvent = new tg.IsInterface()
position: tg.isOptional(tg.isNumber), position: tg.isOptional(tg.isNumber),
closable: tg.isOptional(tg.isBoolean), closable: tg.isOptional(tg.isBoolean),
lazy: tg.isOptional(tg.isBoolean), lazy: tg.isOptional(tg.isBoolean),
hint: tg.isOptional(tg.isString),
}) })
.get(); .get();

4
front/src/Api/iframe/nav.ts
View File

@ -48,7 +48,8 @@ export class WorkadventureNavigationCommands extends IframeApiContribution<Worka
widthPercent?: number, widthPercent?: number,
position?: number, position?: number,
closable?: boolean, closable?: boolean,
lazy?: boolean lazy?: boolean,
hint?: string
): Promise<CoWebsite> { ): Promise<CoWebsite> {
const result = await queryWorkadventure({ const result = await queryWorkadventure({
type: "openCoWebsite", type: "openCoWebsite",
@ -60,6 +61,7 @@ export class WorkadventureNavigationCommands extends IframeApiContribution<Worka
position, position,
closable, closable,
lazy, lazy,
hint,
}, },
}); });
return new CoWebsite(result.id); return new CoWebsite(result.id);

33
front/src/Components/EmbedScreens/CoWebsiteThumbnailSlot.svelte
View File

@ -8,6 +8,8 @@
import { JitsiCoWebsite } from "../../WebRtc/CoWebsite/JitsiCoWebsite"; import { JitsiCoWebsite } from "../../WebRtc/CoWebsite/JitsiCoWebsite";
import { iframeStates } from "../../WebRtc/CoWebsiteManager"; import { iframeStates } from "../../WebRtc/CoWebsiteManager";
import { coWebsiteManager } from "../../WebRtc/CoWebsiteManager"; import { coWebsiteManager } from "../../WebRtc/CoWebsiteManager";
import { HtmlUtils } from "../../WebRtc/HtmlUtils";
import { i18nJson } from "../../i18n/locales";
export let index: number; export let index: number;
export let coWebsite: CoWebsite; export let coWebsite: CoWebsite;
@ -65,6 +67,17 @@
return false; return false;
} }
function i18n(text: string | undefined): string {
if (typeof text === "string") {
return i18nJson(text);
}
return "";
}
function sanitize(html : string | undefined): string {
return HtmlUtils.sanitize(html);
}
let isHighlight: boolean = false; let isHighlight: boolean = false;
let isMain: boolean = false; let isMain: boolean = false;
$: { $: {
@ -188,6 +201,12 @@
/> />
</rect> </rect>
</svg> </svg>
{#if coWebsite.getHint() && !isMain && !isHighlight }
<div class="cowebsite-thumbnail-hint nes-balloon from-left">
<p>{@html sanitize(i18n(coWebsite.getHint()))}</p>
</div>
{/if}
</div> </div>
<style lang="scss"> <style lang="scss">
@ -320,5 +339,19 @@
padding: 7px; padding: 7px;
} }
} }
.cowebsite-thumbnail-hint {
display: none;
position:absolute;
padding: 8px 4px;
text-align: center;
bottom: 50px;
width: clamp(150px, 15vw, 15vw);
left: -10px;
}
&:hover .cowebsite-thumbnail-hint {
display: inline-block;
}
} }
</style> </style>

2
front/src/Components/EmbedScreens/CoWebsitesContainer.svelte
View File

@ -22,8 +22,6 @@
position: absolute; position: absolute;
bottom: 5px; bottom: 5px;
left: 2%; left: 2%;
overflow-x: auto;
overflow-y: hidden;
&.vertical { &.vertical {
height: auto !important; height: auto !important;

3
front/src/Connexion/ConnectionManager.ts
View File

@ -378,9 +378,8 @@ class ConnectionManager {
} catch (err) { } catch (err) {
console.warn("Could not set locale", err); console.warn("Could not set locale", err);
} }
} else {
console.log("no locale", locale);
} }
//user connected, set connected store for menu at true //user connected, set connected store for menu at true
userIsConnected.set(true); userIsConnected.set(true);
} }

1
front/src/Phaser/Game/GameMapProperties.ts
View File

@ -24,6 +24,7 @@ export enum GameMapProperties {
OPEN_WEBSITE_POSITION = "openWebsitePosition", OPEN_WEBSITE_POSITION = "openWebsitePosition",
OPEN_WEBSITE_TRIGGER = "openWebsiteTrigger", OPEN_WEBSITE_TRIGGER = "openWebsiteTrigger",
OPEN_WEBSITE_TRIGGER_MESSAGE = "openWebsiteTriggerMessage", OPEN_WEBSITE_TRIGGER_MESSAGE = "openWebsiteTriggerMessage",
OPEN_WEBSITE_HINT = "openWebsiteHint",
PLAY_AUDIO = "playAudio", PLAY_AUDIO = "playAudio",
PLAY_AUDIO_LOOP = "playAudioLoop", PLAY_AUDIO_LOOP = "playAudioLoop",
READABLE_BY = "readableBy", READABLE_BY = "readableBy",

10
front/src/Phaser/Game/GameMapPropertiesListener.ts
View File

@ -194,6 +194,7 @@ export class GameMapPropertiesListener {
let websitePositionProperty: number | undefined; let websitePositionProperty: number | undefined;
let websiteTriggerProperty: string | undefined; let websiteTriggerProperty: string | undefined;
let websiteTriggerMessageProperty: string | undefined; let websiteTriggerMessageProperty: string | undefined;
let websiteHintProperty: string | undefined;
layer.properties.forEach((property) => { layer.properties.forEach((property) => {
switch (property.name) { switch (property.name) {
@ -218,6 +219,9 @@ export class GameMapPropertiesListener {
case GameMapProperties.OPEN_WEBSITE_TRIGGER_MESSAGE: case GameMapProperties.OPEN_WEBSITE_TRIGGER_MESSAGE:
websiteTriggerMessageProperty = property.value as string | undefined; websiteTriggerMessageProperty = property.value as string | undefined;
break; break;
case GameMapProperties.OPEN_WEBSITE_HINT:
websiteHintProperty = property.value as string | undefined;
break;
} }
}); });
@ -251,7 +255,8 @@ export class GameMapPropertiesListener {
allowApiProperty, allowApiProperty,
websitePolicyProperty, websitePolicyProperty,
websiteWidthProperty, websiteWidthProperty,
false false,
websiteHintProperty
); );
coWebsiteOpen.coWebsite = coWebsite; coWebsiteOpen.coWebsite = coWebsite;
@ -284,7 +289,8 @@ export class GameMapPropertiesListener {
allowApiProperty, allowApiProperty,
websitePolicyProperty, websitePolicyProperty,
websiteWidthProperty, websiteWidthProperty,
false false,
websiteHintProperty
); );
coWebsiteOpen.coWebsite = coWebsite; coWebsiteOpen.coWebsite = coWebsite;

3
front/src/Phaser/Game/GameScene.ts
View File

@ -1218,7 +1218,8 @@ export class GameScene extends DirtyScene {
openCoWebsite.allowApi, openCoWebsite.allowApi,
openCoWebsite.allowPolicy, openCoWebsite.allowPolicy,
openCoWebsite.widthPercent, openCoWebsite.widthPercent,
openCoWebsite.closable ?? true openCoWebsite.closable ?? true,
openCoWebsite.hint
); );
if (openCoWebsite.lazy === undefined || !openCoWebsite.lazy) { if (openCoWebsite.lazy === undefined || !openCoWebsite.lazy) {

1
front/src/WebRtc/CoWebsite/CoWesbite.ts
View File

@ -12,6 +12,7 @@ export interface CoWebsite {
getLoadIframe(): CancelablePromise<HTMLIFrameElement> | undefined; getLoadIframe(): CancelablePromise<HTMLIFrameElement> | undefined;
getWidthPercent(): number | undefined; getWidthPercent(): number | undefined;
isClosable(): boolean; isClosable(): boolean;
getHint(): string;
load(): CancelablePromise<HTMLIFrameElement>; load(): CancelablePromise<HTMLIFrameElement>;
unload(): Promise<void>; unload(): Promise<void>;
} }

8
front/src/WebRtc/CoWebsite/SimpleCoWebsite.ts
View File

@ -14,8 +14,9 @@ export class SimpleCoWebsite implements CoWebsite {
protected allowPolicy?: string; protected allowPolicy?: string;
protected widthPercent?: number; protected widthPercent?: number;
protected closable: boolean; protected closable: boolean;
protected hint: string;
constructor(url: URL, allowApi?: boolean, allowPolicy?: string, widthPercent?: number, closable?: boolean) { constructor(url: URL, allowApi?: boolean, allowPolicy?: string, widthPercent?: number, closable?: boolean, hint?: string) {
this.id = coWebsiteManager.generateUniqueId(); this.id = coWebsiteManager.generateUniqueId();
this.url = url; this.url = url;
this.state = writable("asleep" as CoWebsiteState); this.state = writable("asleep" as CoWebsiteState);
@ -23,6 +24,7 @@ export class SimpleCoWebsite implements CoWebsite {
this.allowPolicy = allowPolicy; this.allowPolicy = allowPolicy;
this.widthPercent = widthPercent; this.widthPercent = widthPercent;
this.closable = closable ?? false; this.closable = closable ?? false;
this.hint = hint ?? '';
} }
getId(): string { getId(): string {
@ -57,6 +59,10 @@ export class SimpleCoWebsite implements CoWebsite {
return this.closable; return this.closable;
} }
getHint(): string {
return this.hint;
}
load(): CancelablePromise<HTMLIFrameElement> { load(): CancelablePromise<HTMLIFrameElement> {
this.loadIframe = new CancelablePromise((resolve, reject, cancel) => { this.loadIframe = new CancelablePromise((resolve, reject, cancel) => {
this.state.set("loading"); this.state.set("loading");

4
front/style/cowebsite/_global.scss
View File

@ -43,6 +43,10 @@
flex: 1; flex: 1;
justify-content: start; justify-content: start;
.nes-btn {
font-size: 16px;
}
#cowebsite-swipe { #cowebsite-swipe {
display: none; display: none;
img { img {

1
front/style/style.scss
View File

@ -2,7 +2,6 @@ body {
overflow: hidden; overflow: hidden;
font-size: 10px; font-size: 10px;
} }
body button:focus, body button:focus,
body img:focus, body img:focus,
body input:focus { body input:focus {