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

Merge branch 'develop' of github.com:thecodingmachine/workadventure into MenuSvelte

Browse source
This commit is contained in:
GRL 2021-08-11 14:13:31 +02:00
commit e86892b9a5
18 changed files with 98 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

13
front/src/Components/Video/VideoMediaBox.svelte
View file

@ -7,6 +7,8 @@
import {videoFocusStore} from "../../Stores/VideoFocusStore";
import {showReportScreenStore} from "../../Stores/ShowReportScreenStore";
import {getColorByString, srcObject} from "./utils";
import {obtainedMediaConstraintIsMobileStore} from "../../Stores/MediaStore";
import {onDestroy} from "svelte";
export let peer: VideoPeer;
let streamStore = peer.streamStore;
@ -18,6 +20,13 @@
showReportScreenStore.set({ userId:peer.userId, userName: peer.userName });
}
let isMobile : boolean|null;
const unsubscribe = obtainedMediaConstraintIsMobileStore.subscribe(value => {
console.log('unsubscribe => obtainedMediaConstraintIsMobileStore', value);
isMobile = value;
});
onDestroy(unsubscribe);
</script>
<div class="video-container">
@ -31,13 +40,13 @@
<i style="background-color: {getColorByString(name)};">{name}</i>
{/if}
{#if $constraintStore && $constraintStore.audio === false}
<img src={microphoneCloseImg} alt="Muted">
<img src={microphoneCloseImg} class="active" alt="Muted">
{/if}
<button class="report" on:click={() => openReport(peer)}>
<img alt="Report this user" src={reportImg}>
<span>Report/Block</span>
</button>
<video use:srcObject={$streamStore} autoplay playsinline on:click={() => videoFocusStore.toggleFocus(peer)}></video>
<video class:mobile="{isMobile === true}" use:srcObject={$streamStore} autoplay playsinline on:click={() => videoFocusStore.toggleFocus(peer)}></video>
<img src={blockSignImg} class="block-logo" alt="Block" />
{#if $constraintStore && $constraintStore.audio !== false}
<SoundMeterWidget stream={$streamStore}></SoundMeterWidget>

1
front/src/Enum/EnvironmentVariable.ts
View file

@ -17,6 +17,7 @@ const MAX_EXTRAPOLATION_TIME = 100; // Extrapolate a maximum of 250ms if no new
export const MAX_USERNAME_LENGTH = parseInt(process.env.MAX_USERNAME_LENGTH || "") || 8;
export const MAX_PER_GROUP = parseInt(process.env.MAX_PER_GROUP || "4");
export const DISPLAY_TERMS_OF_USE = process.env.DISPLAY_TERMS_OF_USE == "true";
export const NODE_ENV = process.env.NODE_ENV || "development";
export const isMobile = (): boolean => window.innerWidth <= 800 || window.innerHeight <= 600;

16
front/src/Network/ServiceWorker.ts
View file

@ -1,3 +1,5 @@
import { NODE_ENV } from "../Enum/EnvironmentVariable";
export class _ServiceWorker {
constructor() {
if ("serviceWorker" in navigator) {
@ -6,8 +8,20 @@ export class _ServiceWorker {
}
init() {
//Check node env and if is development, use service worker dev file
if (NODE_ENV === "development") {
navigator.serviceWorker
.register("/service-worker-dev.js")
.then((serviceWorker) => {
console.info("Service Worker registered: ", serviceWorker);
})
.catch((error) => {
console.error("Error registering the Service Worker: ", error);
});
return;
}
navigator.serviceWorker
.register("/service-worker.js")
.register("/service-worker-prod.js")
.then((serviceWorker) => {
console.info("Service Worker registered: ", serviceWorker);
})

5
front/src/Stores/MediaStore.ts
View file

@ -576,3 +576,8 @@ localStreamStore.subscribe((streamResult) => {
}
}
});
/**
* A store containing the real active media is mobile
*/
export const obtainedMediaConstraintIsMobileStore = writable(false);

5
front/src/WebRtc/ScreenSharingPeer.ts
View file

@ -5,6 +5,7 @@ import type { UserSimplePeerInterface } from "./SimplePeer";
import { Readable, readable } from "svelte/store";
import { videoFocusStore } from "../Stores/VideoFocusStore";
import { getIceServersConfig } from "../Components/Video/utils";
import { isMobile } from "../Enum/EnvironmentVariable";
const Peer: SimplePeerNamespace.SimplePeer = require("simple-peer");
@ -175,6 +176,8 @@ export class ScreenSharingPeer extends Peer {
public stopPushingScreenSharingToRemoteUser(stream: MediaStream) {
this.removeStream(stream);
this.write(new Buffer(JSON.stringify({ type: MESSAGE_TYPE_CONSTRAINT, streamEnded: true })));
this.write(
new Buffer(JSON.stringify({ type: MESSAGE_TYPE_CONSTRAINT, streamEnded: true, isMobile: isMobile() }))
);
}
}

9
front/src/WebRtc/SimplePeer.ts
View file

@ -13,6 +13,7 @@ import { screenSharingLocalStreamStore } from "../Stores/ScreenSharingStore";
import { discussionManager } from "./DiscussionManager";
import { playersStore } from "../Stores/PlayersStore";
import { newChatMessageStore } from "../Stores/ChatStore";
import { isMobile } from "../Enum/EnvironmentVariable";
export interface UserSimplePeerInterface {
userId: number;
@ -391,7 +392,13 @@ export class SimplePeer {
}
PeerConnection.write(
new Buffer(JSON.stringify({ type: MESSAGE_TYPE_CONSTRAINT, ...streamResult.constraints }))
new Buffer(
JSON.stringify({
type: MESSAGE_TYPE_CONSTRAINT,
...streamResult.constraints,
isMobile: isMobile(),
})
)
);
if (streamResult.type === "error") {

14
front/src/WebRtc/VideoPeer.ts
View file

@ -5,10 +5,11 @@ import { blackListManager } from "./BlackListManager";
import type { Subscription } from "rxjs";
import type { UserSimplePeerInterface } from "./SimplePeer";
import { get, readable, Readable, Unsubscriber } from "svelte/store";
import { obtainedMediaConstraintStore } from "../Stores/MediaStore";
import { obtainedMediaConstraintIsMobileStore, obtainedMediaConstraintStore } from "../Stores/MediaStore";
import { playersStore } from "../Stores/PlayersStore";
import { chatMessagesStore, chatVisibilityStore, newChatMessageStore } from "../Stores/ChatStore";
import { getIceServersConfig } from "../Components/Video/utils";
import { isMobile } from "../Enum/EnvironmentVariable";
const Peer: SimplePeerNamespace.SimplePeer = require("simple-peer");
@ -167,6 +168,9 @@ export class VideoPeer extends Peer {
} else {
mediaManager.disabledVideoByUserId(this.userId);
}
if (message.isMobile != undefined) {
obtainedMediaConstraintIsMobileStore.set(message.isMobile);
}
} else if (message.type === MESSAGE_TYPE_MESSAGE) {
if (!blackListManager.isBlackListed(this.userUuid)) {
chatMessagesStore.addExternalMessage(this.userId, message.message);
@ -281,7 +285,13 @@ export class VideoPeer extends Peer {
private pushVideoToRemoteUser(localStream: MediaStream | null) {
try {
this.write(
new Buffer(JSON.stringify({ type: MESSAGE_TYPE_CONSTRAINT, ...get(obtainedMediaConstraintStore) }))
new Buffer(
JSON.stringify({
type: MESSAGE_TYPE_CONSTRAINT,
...get(obtainedMediaConstraintStore),
isMobile: isMobile(),
})
)
);
if (!localStream) {