diff --git a/front/src/Components/Video/VideoMediaBox.svelte b/front/src/Components/Video/VideoMediaBox.svelte
index cc7fb424..88634a9f 100644
--- a/front/src/Components/Video/VideoMediaBox.svelte
+++ b/front/src/Components/Video/VideoMediaBox.svelte
@@ -7,6 +7,8 @@
import {videoFocusStore} from "../../Stores/VideoFocusStore";
import {showReportScreenStore} from "../../Stores/ShowReportScreenStore";
import {getColorByString, srcObject} from "./utils";
+ import {localStreamStore, 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);
+
@@ -37,7 +46,7 @@
Report/Block
-
+
{#if $constraintStore && $constraintStore.audio !== false}
diff --git a/front/src/Stores/MediaStore.ts b/front/src/Stores/MediaStore.ts
index 10e4523d..8e70a1af 100644
--- a/front/src/Stores/MediaStore.ts
+++ b/front/src/Stores/MediaStore.ts
@@ -576,3 +576,8 @@ localStreamStore.subscribe((streamResult) => {
}
}
});
+
+/**
+ * A store containing the real active media is mobile
+ */
+export const obtainedMediaConstraintIsMobileStore = writable(false);
diff --git a/front/src/WebRtc/ScreenSharingPeer.ts b/front/src/WebRtc/ScreenSharingPeer.ts
index 18810182..1bb8cdcc 100644
--- a/front/src/WebRtc/ScreenSharingPeer.ts
+++ b/front/src/WebRtc/ScreenSharingPeer.ts
@@ -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() }))
+ );
}
}
diff --git a/front/src/WebRtc/SimplePeer.ts b/front/src/WebRtc/SimplePeer.ts
index 510918a2..04075df2 100644
--- a/front/src/WebRtc/SimplePeer.ts
+++ b/front/src/WebRtc/SimplePeer.ts
@@ -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") {
diff --git a/front/src/WebRtc/VideoPeer.ts b/front/src/WebRtc/VideoPeer.ts
index aee3f735..bdf8ec16 100644
--- a/front/src/WebRtc/VideoPeer.ts
+++ b/front/src/WebRtc/VideoPeer.ts
@@ -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) {
diff --git a/front/style/mobile-style.scss b/front/style/mobile-style.scss
index 1b37053a..7f1e770f 100644
--- a/front/style/mobile-style.scss
+++ b/front/style/mobile-style.scss
@@ -28,8 +28,8 @@
height: 80%;
&> div {
- max-height: 120px;
min-width: 200px;
+ max-height: 21vh;
}
.video-container{
diff --git a/front/style/style.scss b/front/style/style.scss
index 6c8574b7..9b37e122 100644
--- a/front/style/style.scss
+++ b/front/style/style.scss
@@ -47,6 +47,11 @@ body .message-info.warning{
height: 100%;
max-height: 90vh;
cursor: url('./images/cursor_pointer.png'), pointer;
+
+ &.mobile{
+ width: 100%;
+ height: 21vh;
+ }
}
i {