2022-03-17 17:34:14 +05:30
|
|
|
/*
|
2022-03-17 17:37:55 +05:30
|
|
|
Copyright 2022 The Matrix.org Foundation C.I.C.
|
2022-03-17 17:34:14 +05:30
|
|
|
|
|
|
|
Licensed under the Apache License, Version 2.0 (the "License");
|
|
|
|
you may not use this file except in compliance with the License.
|
|
|
|
You may obtain a copy of the License at
|
|
|
|
|
|
|
|
http://www.apache.org/licenses/LICENSE-2.0
|
|
|
|
|
|
|
|
Unless required by applicable law or agreed to in writing, software
|
|
|
|
distributed under the License is distributed on an "AS IS" BASIS,
|
|
|
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
|
|
See the License for the specific language governing permissions and
|
|
|
|
limitations under the License.
|
|
|
|
*/
|
|
|
|
|
2022-04-26 17:57:28 +05:30
|
|
|
import {AvatarSource} from "../../AvatarSource";
|
2022-03-17 17:37:55 +05:30
|
|
|
import {ViewModel, Options as BaseOptions} from "../../ViewModel";
|
2022-04-26 17:57:28 +05:30
|
|
|
import {getStreamVideoTrack, getStreamAudioTrack} from "../../../matrix/calls/common";
|
|
|
|
import {avatarInitials, getIdentifierColorNumber, getAvatarHttpUrl} from "../../avatar";
|
2022-04-26 21:26:46 +05:30
|
|
|
import {EventObservableValue} from "../../../observable/value/EventObservableValue";
|
|
|
|
import {ObservableValueMap} from "../../../observable/map/ObservableValueMap";
|
2022-03-17 17:34:14 +05:30
|
|
|
import type {GroupCall} from "../../../matrix/calls/group/GroupCall";
|
2022-03-17 17:37:55 +05:30
|
|
|
import type {Member} from "../../../matrix/calls/group/Member";
|
|
|
|
import type {BaseObservableList} from "../../../observable/list/BaseObservableList";
|
2022-04-13 22:04:01 +05:30
|
|
|
import type {Stream} from "../../../platform/types/MediaDevices";
|
2022-04-26 17:57:28 +05:30
|
|
|
import type {MediaRepository} from "../../../matrix/net/MediaRepository";
|
2022-03-17 17:34:14 +05:30
|
|
|
|
2022-04-26 17:57:28 +05:30
|
|
|
type Options = BaseOptions & {
|
|
|
|
call: GroupCall,
|
|
|
|
mediaRepository: MediaRepository
|
|
|
|
};
|
2022-03-17 17:34:14 +05:30
|
|
|
|
2022-03-17 17:37:55 +05:30
|
|
|
export class CallViewModel extends ViewModel<Options> {
|
2022-04-26 21:26:46 +05:30
|
|
|
public readonly memberViewModels: BaseObservableList<IStreamViewModel>;
|
2022-03-17 17:34:14 +05:30
|
|
|
|
2022-03-17 17:37:55 +05:30
|
|
|
constructor(options: Options) {
|
2022-03-17 17:34:14 +05:30
|
|
|
super(options);
|
2022-04-26 17:57:28 +05:30
|
|
|
const ownMemberViewModelMap = new ObservableValueMap("self", new EventObservableValue(this.call, "change"))
|
|
|
|
.mapValues(call => new OwnMemberViewModel(this.childOptions({call: this.call, mediaRepository: this.getOption("mediaRepository")})), () => {});
|
|
|
|
this.memberViewModels = this.call.members
|
2022-04-07 20:25:26 +05:30
|
|
|
.filterValues(member => member.isConnected)
|
2022-04-26 17:57:28 +05:30
|
|
|
.mapValues(member => new CallMemberViewModel(this.childOptions({member, mediaRepository: this.getOption("mediaRepository")})))
|
|
|
|
.join(ownMemberViewModelMap)
|
2022-03-21 21:00:13 +05:30
|
|
|
.sortValues((a, b) => a.compare(b));
|
2022-03-17 17:34:14 +05:30
|
|
|
}
|
|
|
|
|
2022-03-24 18:22:19 +05:30
|
|
|
private get call(): GroupCall {
|
|
|
|
return this.getOption("call");
|
|
|
|
}
|
|
|
|
|
2022-03-17 17:34:14 +05:30
|
|
|
get name(): string {
|
2022-03-24 18:22:19 +05:30
|
|
|
return this.call.name;
|
2022-03-17 17:37:55 +05:30
|
|
|
}
|
|
|
|
|
2022-03-21 21:00:13 +05:30
|
|
|
get id(): string {
|
2022-03-24 18:22:19 +05:30
|
|
|
return this.call.id;
|
2022-03-21 21:00:13 +05:30
|
|
|
}
|
|
|
|
|
2022-04-26 17:57:28 +05:30
|
|
|
get stream(): Stream | undefined {
|
2022-04-13 22:04:01 +05:30
|
|
|
return this.call.localMedia?.userMedia;
|
2022-03-24 18:22:19 +05:30
|
|
|
}
|
|
|
|
|
|
|
|
leave() {
|
|
|
|
if (this.call.hasJoined) {
|
|
|
|
this.call.leave();
|
|
|
|
}
|
2022-03-17 17:37:55 +05:30
|
|
|
}
|
2022-04-15 02:49:44 +05:30
|
|
|
|
2022-04-26 17:57:28 +05:30
|
|
|
get isCameraMuted(): boolean {
|
|
|
|
return this.call.muteSettings.camera;
|
|
|
|
}
|
|
|
|
|
|
|
|
get isMicrophoneMuted(): boolean {
|
|
|
|
return this.call.muteSettings.microphone;
|
|
|
|
}
|
|
|
|
|
2022-04-15 02:49:44 +05:30
|
|
|
async toggleVideo() {
|
2022-04-22 19:18:14 +05:30
|
|
|
this.call.setMuted(this.call.muteSettings.toggleCamera());
|
2022-04-15 02:49:44 +05:30
|
|
|
}
|
2022-03-17 17:37:55 +05:30
|
|
|
}
|
|
|
|
|
2022-04-26 17:57:28 +05:30
|
|
|
type OwnMemberOptions = BaseOptions & {
|
|
|
|
call: GroupCall,
|
|
|
|
mediaRepository: MediaRepository
|
|
|
|
}
|
2022-03-17 17:37:55 +05:30
|
|
|
|
2022-04-26 17:57:28 +05:30
|
|
|
class OwnMemberViewModel extends ViewModel<OwnMemberOptions> implements IStreamViewModel {
|
|
|
|
get stream(): Stream | undefined {
|
|
|
|
return this.call.localMedia?.userMedia;
|
|
|
|
}
|
|
|
|
|
|
|
|
private get call(): GroupCall {
|
|
|
|
return this.getOption("call");
|
|
|
|
}
|
|
|
|
|
|
|
|
get isCameraMuted(): boolean {
|
|
|
|
return this.call.muteSettings.camera ?? !!getStreamVideoTrack(this.stream);
|
|
|
|
}
|
|
|
|
|
|
|
|
get isMicrophoneMuted(): boolean {
|
|
|
|
return this.call.muteSettings.microphone ?? !!getStreamAudioTrack(this.stream);
|
|
|
|
}
|
|
|
|
|
|
|
|
get avatarLetter(): string {
|
|
|
|
return "I";
|
|
|
|
}
|
|
|
|
|
|
|
|
get avatarColorNumber(): number {
|
|
|
|
return 3;
|
|
|
|
}
|
|
|
|
|
|
|
|
avatarUrl(size: number): string | undefined {
|
|
|
|
return undefined;
|
|
|
|
}
|
|
|
|
|
|
|
|
get avatarTitle(): string {
|
2022-04-26 21:26:46 +05:30
|
|
|
return "Me";
|
2022-04-26 17:57:28 +05:30
|
|
|
}
|
|
|
|
|
|
|
|
compare(other: OwnMemberViewModel | CallMemberViewModel): number {
|
|
|
|
return -1;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
type MemberOptions = BaseOptions & {member: Member, mediaRepository: MediaRepository};
|
|
|
|
|
|
|
|
export class CallMemberViewModel extends ViewModel<MemberOptions> implements IStreamViewModel {
|
2022-04-13 22:04:01 +05:30
|
|
|
get stream(): Stream | undefined {
|
|
|
|
return this.member.remoteMedia?.userMedia;
|
2022-03-24 18:22:19 +05:30
|
|
|
}
|
|
|
|
|
|
|
|
private get member(): Member {
|
|
|
|
return this.getOption("member");
|
2022-03-17 17:34:14 +05:30
|
|
|
}
|
2022-03-21 21:00:13 +05:30
|
|
|
|
2022-04-26 17:57:28 +05:30
|
|
|
get isCameraMuted(): boolean {
|
|
|
|
return this.member.remoteMuteSettings?.camera ?? !getStreamVideoTrack(this.stream);
|
|
|
|
}
|
|
|
|
|
|
|
|
get isMicrophoneMuted(): boolean {
|
|
|
|
return this.member.remoteMuteSettings?.microphone ?? !getStreamAudioTrack(this.stream);
|
|
|
|
}
|
|
|
|
|
|
|
|
get avatarLetter(): string {
|
|
|
|
return avatarInitials(this.member.member.name);
|
|
|
|
}
|
|
|
|
|
|
|
|
get avatarColorNumber(): number {
|
|
|
|
return getIdentifierColorNumber(this.member.userId);
|
|
|
|
}
|
|
|
|
|
|
|
|
avatarUrl(size: number): string | undefined {
|
|
|
|
const {avatarUrl} = this.member.member;
|
|
|
|
const mediaRepository = this.getOption("mediaRepository");
|
|
|
|
return getAvatarHttpUrl(avatarUrl, size, this.platform, mediaRepository);
|
|
|
|
}
|
|
|
|
|
|
|
|
get avatarTitle(): string {
|
|
|
|
return this.member.member.name;
|
|
|
|
}
|
|
|
|
|
|
|
|
compare(other: OwnMemberViewModel | CallMemberViewModel): number {
|
|
|
|
if (other instanceof OwnMemberViewModel) {
|
|
|
|
return -other.compare(this);
|
|
|
|
}
|
2022-03-24 18:22:19 +05:30
|
|
|
const myUserId = this.member.member.userId;
|
|
|
|
const otherUserId = other.member.member.userId;
|
2022-03-21 21:00:13 +05:30
|
|
|
if(myUserId === otherUserId) {
|
|
|
|
return 0;
|
|
|
|
}
|
|
|
|
return myUserId < otherUserId ? -1 : 1;
|
|
|
|
}
|
2022-03-17 17:34:14 +05:30
|
|
|
}
|
2022-04-26 17:57:28 +05:30
|
|
|
|
|
|
|
export interface IStreamViewModel extends AvatarSource, ViewModel {
|
|
|
|
get stream(): Stream | undefined;
|
|
|
|
get isCameraMuted(): boolean;
|
|
|
|
get isMicrophoneMuted(): boolean;
|
|
|
|
}
|