Co-Wesbite
This commit is contained in:
parent
5451fc788d
commit
d63a32e94e
3
front/dist/index.ejs
vendored
3
front/dist/index.ejs
vendored
@ -29,9 +29,8 @@
|
||||
|
||||
<script src="/env-config.js"></script>
|
||||
<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>
|
||||
<body id="body" style="margin: 0; background-color: #000">
|
||||
<div class="main-container" id="main-container">
|
||||
|
@ -9,6 +9,7 @@ export const isOpenCoWebsiteEvent = new tg.IsInterface()
|
||||
position: tg.isOptional(tg.isNumber),
|
||||
closable: tg.isOptional(tg.isBoolean),
|
||||
lazy: tg.isOptional(tg.isBoolean),
|
||||
hint: tg.isOptional(tg.isString),
|
||||
})
|
||||
.get();
|
||||
|
||||
|
@ -48,7 +48,8 @@ export class WorkadventureNavigationCommands extends IframeApiContribution<Worka
|
||||
widthPercent?: number,
|
||||
position?: number,
|
||||
closable?: boolean,
|
||||
lazy?: boolean
|
||||
lazy?: boolean,
|
||||
hint?: string
|
||||
): Promise<CoWebsite> {
|
||||
const result = await queryWorkadventure({
|
||||
type: "openCoWebsite",
|
||||
@ -60,6 +61,7 @@ export class WorkadventureNavigationCommands extends IframeApiContribution<Worka
|
||||
position,
|
||||
closable,
|
||||
lazy,
|
||||
hint,
|
||||
},
|
||||
});
|
||||
return new CoWebsite(result.id);
|
||||
|
@ -8,6 +8,8 @@
|
||||
import { JitsiCoWebsite } from "../../WebRtc/CoWebsite/JitsiCoWebsite";
|
||||
import { iframeStates } from "../../WebRtc/CoWebsiteManager";
|
||||
import { coWebsiteManager } from "../../WebRtc/CoWebsiteManager";
|
||||
import { HtmlUtils } from "../../WebRtc/HtmlUtils";
|
||||
import { i18nJson } from "../../i18n/locales";
|
||||
|
||||
export let index: number;
|
||||
export let coWebsite: CoWebsite;
|
||||
@ -65,6 +67,17 @@
|
||||
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 isMain: boolean = false;
|
||||
$: {
|
||||
@ -188,6 +201,12 @@
|
||||
/>
|
||||
</rect>
|
||||
</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>
|
||||
|
||||
<style lang="scss">
|
||||
@ -320,5 +339,19 @@
|
||||
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>
|
||||
|
@ -22,8 +22,6 @@
|
||||
position: absolute;
|
||||
bottom: 5px;
|
||||
left: 2%;
|
||||
overflow-x: auto;
|
||||
overflow-y: hidden;
|
||||
|
||||
&.vertical {
|
||||
height: auto !important;
|
||||
|
@ -378,9 +378,8 @@ class ConnectionManager {
|
||||
} catch (err) {
|
||||
console.warn("Could not set locale", err);
|
||||
}
|
||||
} else {
|
||||
console.log("no locale", locale);
|
||||
}
|
||||
}
|
||||
|
||||
//user connected, set connected store for menu at true
|
||||
userIsConnected.set(true);
|
||||
}
|
||||
|
@ -24,6 +24,7 @@ export enum GameMapProperties {
|
||||
OPEN_WEBSITE_POSITION = "openWebsitePosition",
|
||||
OPEN_WEBSITE_TRIGGER = "openWebsiteTrigger",
|
||||
OPEN_WEBSITE_TRIGGER_MESSAGE = "openWebsiteTriggerMessage",
|
||||
OPEN_WEBSITE_HINT = "openWebsiteHint",
|
||||
PLAY_AUDIO = "playAudio",
|
||||
PLAY_AUDIO_LOOP = "playAudioLoop",
|
||||
READABLE_BY = "readableBy",
|
||||
|
@ -194,6 +194,7 @@ export class GameMapPropertiesListener {
|
||||
let websitePositionProperty: number | undefined;
|
||||
let websiteTriggerProperty: string | undefined;
|
||||
let websiteTriggerMessageProperty: string | undefined;
|
||||
let websiteHintProperty: string | undefined;
|
||||
|
||||
layer.properties.forEach((property) => {
|
||||
switch (property.name) {
|
||||
@ -218,6 +219,9 @@ export class GameMapPropertiesListener {
|
||||
case GameMapProperties.OPEN_WEBSITE_TRIGGER_MESSAGE:
|
||||
websiteTriggerMessageProperty = property.value as string | undefined;
|
||||
break;
|
||||
case GameMapProperties.OPEN_WEBSITE_HINT:
|
||||
websiteHintProperty = property.value as string | undefined;
|
||||
break;
|
||||
}
|
||||
});
|
||||
|
||||
@ -251,7 +255,8 @@ export class GameMapPropertiesListener {
|
||||
allowApiProperty,
|
||||
websitePolicyProperty,
|
||||
websiteWidthProperty,
|
||||
false
|
||||
false,
|
||||
websiteHintProperty
|
||||
);
|
||||
|
||||
coWebsiteOpen.coWebsite = coWebsite;
|
||||
@ -284,7 +289,8 @@ export class GameMapPropertiesListener {
|
||||
allowApiProperty,
|
||||
websitePolicyProperty,
|
||||
websiteWidthProperty,
|
||||
false
|
||||
false,
|
||||
websiteHintProperty
|
||||
);
|
||||
|
||||
coWebsiteOpen.coWebsite = coWebsite;
|
||||
|
@ -1218,7 +1218,8 @@ export class GameScene extends DirtyScene {
|
||||
openCoWebsite.allowApi,
|
||||
openCoWebsite.allowPolicy,
|
||||
openCoWebsite.widthPercent,
|
||||
openCoWebsite.closable ?? true
|
||||
openCoWebsite.closable ?? true,
|
||||
openCoWebsite.hint
|
||||
);
|
||||
|
||||
if (openCoWebsite.lazy === undefined || !openCoWebsite.lazy) {
|
||||
|
@ -12,6 +12,7 @@ export interface CoWebsite {
|
||||
getLoadIframe(): CancelablePromise<HTMLIFrameElement> | undefined;
|
||||
getWidthPercent(): number | undefined;
|
||||
isClosable(): boolean;
|
||||
getHint(): string;
|
||||
load(): CancelablePromise<HTMLIFrameElement>;
|
||||
unload(): Promise<void>;
|
||||
}
|
||||
|
@ -14,8 +14,9 @@ export class SimpleCoWebsite implements CoWebsite {
|
||||
protected allowPolicy?: string;
|
||||
protected widthPercent?: number;
|
||||
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.url = url;
|
||||
this.state = writable("asleep" as CoWebsiteState);
|
||||
@ -23,6 +24,7 @@ export class SimpleCoWebsite implements CoWebsite {
|
||||
this.allowPolicy = allowPolicy;
|
||||
this.widthPercent = widthPercent;
|
||||
this.closable = closable ?? false;
|
||||
this.hint = hint ?? '';
|
||||
}
|
||||
|
||||
getId(): string {
|
||||
@ -57,6 +59,10 @@ export class SimpleCoWebsite implements CoWebsite {
|
||||
return this.closable;
|
||||
}
|
||||
|
||||
getHint(): string {
|
||||
return this.hint;
|
||||
}
|
||||
|
||||
load(): CancelablePromise<HTMLIFrameElement> {
|
||||
this.loadIframe = new CancelablePromise((resolve, reject, cancel) => {
|
||||
this.state.set("loading");
|
||||
|
@ -43,6 +43,10 @@
|
||||
flex: 1;
|
||||
justify-content: start;
|
||||
|
||||
.nes-btn {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
#cowebsite-swipe {
|
||||
display: none;
|
||||
img {
|
||||
|
@ -2,7 +2,6 @@ body {
|
||||
overflow: hidden;
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
body button:focus,
|
||||
body img:focus,
|
||||
body input:focus {
|
||||
|
Loading…
Reference in New Issue
Block a user