Merge branch 'develop' of github.com:thecodingmachine/workadventure
This commit is contained in:
_Bastler
commit
ab470ab18d
@ -30,10 +30,11 @@
|
||||
{#if $statusStore === "error"}
|
||||
<div class="rtc-error" />
|
||||
{/if}
|
||||
{#if $streamStore === null}
|
||||
<i style="background-color: {getColorByString(name)};">{name}</i>
|
||||
{:else}
|
||||
{#if $streamStore !== null}
|
||||
<!-- svelte-ignore a11y-media-has-caption -->
|
||||
<i class="container">
|
||||
<span style="background-color: {getColorByString(name)};">{name}</span>
|
||||
</i>
|
||||
<video
|
||||
use:srcObject={$streamStore}
|
||||
autoplay
|
||||
@ -48,5 +49,10 @@
|
||||
video {
|
||||
width: 100%;
|
||||
}
|
||||
i {
|
||||
span {
|
||||
padding: 2px 32px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -58,15 +58,12 @@
|
||||
<div class="rtc-error" />
|
||||
{/if}
|
||||
<!-- {#if !$constraintStore || $constraintStore.video === false} -->
|
||||
<i
|
||||
class="container"
|
||||
class:has-video={$constraintStore && $constraintStore.video === true}
|
||||
class:minimized={(!$constraintStore || $constraintStore.video !== true) && minimized}
|
||||
style="background-color: {getColorByString(name)};"
|
||||
>
|
||||
<span style="noselect">{peer.userName}</span>
|
||||
<div class="woka-icon"><Woka userId={peer.userId} placeholderSrc={""} /></div>
|
||||
<i class="container">
|
||||
<span style="background-color: {getColorByString(name)};">{name}</span>
|
||||
</i>
|
||||
<div class="woka-icon {($constraintStore && $constraintStore.video !== false) || minimized ? '' : 'no-video'}">
|
||||
<Woka userId={peer.userId} placeholderSrc={""} />
|
||||
</div>
|
||||
<!-- {/if} -->
|
||||
{#if $constraintStore && $constraintStore.audio === false}
|
||||
<img
|
||||
@ -99,22 +96,6 @@
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding-top: 15px;
|
||||
|
||||
&.has-video {
|
||||
left: auto;
|
||||
transform: scale(0.5);
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
&.minimized {
|
||||
transform: scale(0.5);
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.woka-icon {
|
||||
margin-right: 3px;
|
||||
}
|
||||
}
|
||||
video.no-video {
|
||||
visibility: collapse;
|
||||
|
||||
@ -187,14 +187,14 @@ class ConnectionManager {
|
||||
window.location.hash;
|
||||
}
|
||||
|
||||
//Set last room visited! (connected or nor, must to be saved in localstorage and cache API)
|
||||
//use href to keep # value
|
||||
await localUserStore.setLastRoomUrl(new URL(roomPath).href);
|
||||
|
||||
//get detail map for anonymous login and set texture in local storage
|
||||
//before set token of user we must load room and all information. For example the mandatory authentication could be require on current room
|
||||
this._currentRoom = await Room.createRoom(new URL(roomPath));
|
||||
|
||||
//Set last room visited! (connected or nor, must to be saved in localstorage and cache API)
|
||||
//use href to keep # value
|
||||
await localUserStore.setLastRoomUrl(this._currentRoom.href);
|
||||
|
||||
//todo: add here some kind of warning if authToken has expired.
|
||||
if (!this.authToken && !this._currentRoom.authenticationMandatory) {
|
||||
await this.anonymousLogin();
|
||||
|
||||
@ -1648,7 +1648,10 @@ export class GameScene extends DirtyScene {
|
||||
this.sharedVariablesManager?.close();
|
||||
this.embeddedWebsiteManager?.close();
|
||||
|
||||
mediaManager.hideMyCamera();
|
||||
//When we leave game, the camera is stop to be reopen after.
|
||||
// I think that we could keep camera status and the scene can manage camera setup
|
||||
//TODO find wy chrome don't manage correctly a multiple ask mediaDevices
|
||||
//mediaManager.hideMyCamera();
|
||||
|
||||
for (const iframeEvents of this.iframeSubscriptionList) {
|
||||
iframeEvents.unsubscribe();
|
||||
|
||||
@ -41,7 +41,7 @@ export class PlayerMovement {
|
||||
oldX: this.startPosition.x,
|
||||
oldY: this.startPosition.y,
|
||||
direction: this.endPosition.direction,
|
||||
moving: this.endPosition.moving,
|
||||
moving: this.isOutdated(tick) ? false : this.endPosition.moving,
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
@ -8,8 +8,6 @@ import LL from "../../i18n/i18n-svelte";
|
||||
import { get } from "svelte/store";
|
||||
import { localeDetector } from "../../i18n/locales";
|
||||
|
||||
const $LL = get(LL);
|
||||
|
||||
export const EntrySceneName = "EntryScene";
|
||||
|
||||
/**
|
||||
@ -43,6 +41,7 @@ export class EntryScene extends Scene {
|
||||
this.scene.start(nextSceneName);
|
||||
})
|
||||
.catch((err) => {
|
||||
const $LL = get(LL);
|
||||
if (err.response && err.response.status == 404) {
|
||||
ErrorScene.showError(
|
||||
new WAError(
|
||||
|
||||
@ -96,6 +96,7 @@ export class MapStore<K, V> extends Map<K, V> implements Readable<Map<K, V>> {
|
||||
const unsubscribe = storeByKey.subscribe((newMapValue) => {
|
||||
if (unsubscribeDeepStore) {
|
||||
unsubscribeDeepStore();
|
||||
unsubscribeDeepStore = undefined;
|
||||
}
|
||||
if (newMapValue === undefined) {
|
||||
set(undefined);
|
||||
@ -115,6 +116,7 @@ export class MapStore<K, V> extends Map<K, V> implements Readable<Map<K, V>> {
|
||||
unsubscribe();
|
||||
if (unsubscribeDeepStore) {
|
||||
unsubscribeDeepStore();
|
||||
unsubscribeDeepStore = undefined;
|
||||
}
|
||||
};
|
||||
});
|
||||
|
||||
@ -2,7 +2,7 @@ import type * as SimplePeerNamespace from "simple-peer";
|
||||
import type { RoomConnection } from "../Connexion/RoomConnection";
|
||||
import { MESSAGE_TYPE_CONSTRAINT, PeerStatus } from "./VideoPeer";
|
||||
import type { UserSimplePeerInterface } from "./SimplePeer";
|
||||
import { Readable, readable } from "svelte/store";
|
||||
import { Readable, readable, writable, Writable } from "svelte/store";
|
||||
import { getIceServersConfig } from "../Components/Video/utils";
|
||||
import { highlightedEmbedScreen } from "../Stores/EmbedScreensStore";
|
||||
import { isMediaBreakpointUp } from "../Utils/BreakpointsUtils";
|
||||
@ -22,7 +22,7 @@ export class ScreenSharingPeer extends Peer {
|
||||
public readonly userId: number;
|
||||
public readonly uniqueId: string;
|
||||
public readonly streamStore: Readable<MediaStream | null>;
|
||||
public readonly statusStore: Readable<PeerStatus>;
|
||||
public readonly statusStore: Writable<PeerStatus>;
|
||||
|
||||
constructor(
|
||||
user: UserSimplePeerInterface,
|
||||
@ -70,7 +70,7 @@ export class ScreenSharingPeer extends Peer {
|
||||
};
|
||||
});
|
||||
|
||||
this.statusStore = readable<PeerStatus>("connecting", (set) => {
|
||||
this.statusStore = writable<PeerStatus>("connecting", (set) => {
|
||||
const onConnect = () => {
|
||||
set("connected");
|
||||
};
|
||||
@ -141,6 +141,12 @@ export class ScreenSharingPeer extends Peer {
|
||||
if (!stream) {
|
||||
this.isReceivingStream = false;
|
||||
} else {
|
||||
//Check if the peer connection is already connected status. In this case, the status store must be set to 'connected'.
|
||||
//In the case or player A send stream and player B send a stream, it's same peer connection, also the status must be changed to connect.
|
||||
//TODO add event listening when the stream is ready for displaying and change the status
|
||||
if (this._connected) {
|
||||
this.statusStore.set("connected");
|
||||
}
|
||||
this.isReceivingStream = true;
|
||||
}
|
||||
}
|
||||
|
||||
@ -259,7 +259,7 @@ export class SimplePeer {
|
||||
console.warn(
|
||||
"closeScreenSharingConnection => Tried to close connection for user " +
|
||||
userId +
|
||||
" but could not find user"
|
||||
" but could not find user or no peer connection started"
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
@ -34,7 +34,6 @@ body .message-info.warning{
|
||||
.video-container {
|
||||
display: flex;
|
||||
transition: all 0.2s ease;
|
||||
|
||||
width: 100%;
|
||||
|
||||
video {
|
||||
@ -47,25 +46,67 @@ body .message-info.warning{
|
||||
width: 100%;
|
||||
height: 21vh;
|
||||
}
|
||||
&:focus{
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
|
||||
i {
|
||||
position: absolute;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
left: calc(50% - 50px);
|
||||
top: calc(50% - 50px);
|
||||
height: auto;
|
||||
left: -6px;
|
||||
top: calc(100% - 28px);
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
color: white;
|
||||
span{
|
||||
font-size: 14px;
|
||||
margin: 2px;
|
||||
background-color: white;
|
||||
border: solid 3px black;
|
||||
border-radius: 8px;
|
||||
font-style: normal;
|
||||
}
|
||||
}
|
||||
|
||||
.woka-icon{
|
||||
position: absolute;
|
||||
left: 90px;
|
||||
top: calc(100% - 24px);
|
||||
height: 23px;
|
||||
overflow: hidden;
|
||||
border-radius: 50%;
|
||||
transition: all 0.2s ease;
|
||||
&.no-video{
|
||||
left: calc(50% - 30px);
|
||||
top: calc(50% - 30px);
|
||||
height: auto;
|
||||
img{
|
||||
height: 60px;
|
||||
width: 60px;
|
||||
}
|
||||
}
|
||||
img{
|
||||
height: 40px;
|
||||
width: 40px;
|
||||
}
|
||||
}
|
||||
&:hover{
|
||||
.woka-icon{
|
||||
top: calc(100% - 30px);
|
||||
height: 30px;
|
||||
&.no-video{
|
||||
top: calc(100% - 32px);
|
||||
height: 35px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
position: absolute;
|
||||
display: none;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
left: 5px;
|
||||
bottom: 5px;
|
||||
padding: 10px;
|
||||
@ -126,10 +167,6 @@ body .message-info.warning{
|
||||
width: 160px;
|
||||
}
|
||||
}
|
||||
|
||||
video:focus{
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
|
||||
.sound-progress{
|
||||
|
||||
Loading…
Reference in New Issue
Block a user