2020-08-05 18:38:55 +02:00
|
|
|
/*
|
|
|
|
Copyright 2020 Bruno Windels <bruno@windels.cloud>
|
2020-08-17 16:34:25 +02:00
|
|
|
Copyright 2020 The Matrix.org Foundation C.I.C.
|
2020-08-05 18:38:55 +02:00
|
|
|
|
|
|
|
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.
|
|
|
|
*/
|
|
|
|
|
2020-04-20 21:26:39 +02:00
|
|
|
import {TimelineViewModel} from "./timeline/TimelineViewModel.js";
|
2020-08-14 14:33:13 +02:00
|
|
|
import {avatarInitials, getIdentifierColorNumber} from "../../avatar.js";
|
2020-05-04 19:23:11 +02:00
|
|
|
import {ViewModel} from "../../ViewModel.js";
|
2019-02-27 22:50:08 +01:00
|
|
|
|
2020-05-04 19:23:11 +02:00
|
|
|
export class RoomViewModel extends ViewModel {
|
|
|
|
constructor(options) {
|
|
|
|
super(options);
|
2020-10-14 14:53:52 +02:00
|
|
|
const {room, ownUserId} = options;
|
2019-02-27 22:50:08 +01:00
|
|
|
this._room = room;
|
2019-06-16 10:53:23 +02:00
|
|
|
this._ownUserId = ownUserId;
|
2019-06-01 18:29:23 +02:00
|
|
|
this._timelineVM = null;
|
2019-02-27 22:50:08 +01:00
|
|
|
this._onRoomChange = this._onRoomChange.bind(this);
|
2019-03-09 00:43:43 +01:00
|
|
|
this._timelineError = null;
|
2020-03-30 21:33:04 +02:00
|
|
|
this._sendError = null;
|
2020-05-04 22:23:43 +02:00
|
|
|
this._composerVM = new ComposerViewModel(this);
|
2020-08-21 11:57:49 +02:00
|
|
|
this._clearUnreadTimout = null;
|
2020-10-16 13:02:21 +02:00
|
|
|
this._closeUrl = this.urlCreator.urlUntilSegment("session");
|
2020-10-14 14:53:52 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
get closeUrl() {
|
|
|
|
return this._closeUrl;
|
2019-02-27 22:50:08 +01:00
|
|
|
}
|
|
|
|
|
2019-06-26 23:14:39 +02:00
|
|
|
async load() {
|
2019-02-27 22:50:08 +01:00
|
|
|
this._room.on("change", this._onRoomChange);
|
2019-03-09 00:43:43 +01:00
|
|
|
try {
|
2020-10-19 13:39:19 +02:00
|
|
|
const timelineVM = this.track(new TimelineViewModel(this.childOptions({
|
2020-05-04 19:23:11 +02:00
|
|
|
room: this._room,
|
2020-10-19 12:57:21 +02:00
|
|
|
timeline: this._room.openTimeline(),
|
2020-05-04 19:23:11 +02:00
|
|
|
ownUserId: this._ownUserId,
|
2020-10-19 12:57:21 +02:00
|
|
|
})));
|
2020-10-19 13:39:19 +02:00
|
|
|
await timelineVM.load();
|
|
|
|
this._timelineVM = timelineVM;
|
2020-05-04 19:23:11 +02:00
|
|
|
this.emitChange("timelineViewModel");
|
2019-03-09 00:43:43 +01:00
|
|
|
} catch (err) {
|
2019-06-02 14:59:30 +02:00
|
|
|
console.error(`room.openTimeline(): ${err.message}:\n${err.stack}`);
|
2019-03-09 00:43:43 +01:00
|
|
|
this._timelineError = err;
|
2020-05-04 19:23:11 +02:00
|
|
|
this.emitChange("error");
|
2019-03-09 00:43:43 +01:00
|
|
|
}
|
2020-10-07 12:30:46 +02:00
|
|
|
this._clearUnreadAfterDelay();
|
|
|
|
}
|
|
|
|
|
|
|
|
async _clearUnreadAfterDelay() {
|
|
|
|
if (this._clearUnreadTimout) {
|
|
|
|
return;
|
|
|
|
}
|
2020-08-21 11:57:49 +02:00
|
|
|
this._clearUnreadTimout = this.clock.createTimeout(2000);
|
|
|
|
try {
|
|
|
|
await this._clearUnreadTimout.elapsed();
|
|
|
|
await this._room.clearUnread();
|
2020-10-07 12:30:46 +02:00
|
|
|
this._clearUnreadTimout = null;
|
2020-08-21 11:57:49 +02:00
|
|
|
} catch (err) {
|
|
|
|
if (err.name !== "AbortError") {
|
|
|
|
throw err;
|
|
|
|
}
|
|
|
|
}
|
2019-02-27 22:50:08 +01:00
|
|
|
}
|
|
|
|
|
2020-10-07 12:30:46 +02:00
|
|
|
focus() {
|
|
|
|
this._clearUnreadAfterDelay();
|
|
|
|
}
|
|
|
|
|
2019-06-26 23:14:39 +02:00
|
|
|
dispose() {
|
2020-09-10 17:43:01 +02:00
|
|
|
super.dispose();
|
2020-10-14 11:26:10 +02:00
|
|
|
this._room.off("change", this._onRoomChange);
|
2020-08-21 11:57:49 +02:00
|
|
|
if (this._clearUnreadTimout) {
|
|
|
|
this._clearUnreadTimout.abort();
|
|
|
|
this._clearUnreadTimout = null;
|
|
|
|
}
|
2019-02-27 22:50:08 +01:00
|
|
|
}
|
|
|
|
|
2020-09-10 17:43:01 +02:00
|
|
|
// called from view to close room
|
|
|
|
// parent vm will dispose this vm
|
2019-06-26 23:14:39 +02:00
|
|
|
close() {
|
|
|
|
this._closeCallback();
|
|
|
|
}
|
|
|
|
|
2019-02-27 22:50:08 +01:00
|
|
|
// room doesn't tell us yet which fields changed,
|
|
|
|
// so emit all fields originating from summary
|
|
|
|
_onRoomChange() {
|
2020-05-04 19:23:11 +02:00
|
|
|
this.emitChange("name");
|
2019-02-27 22:50:08 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
get name() {
|
2020-08-21 18:14:32 +02:00
|
|
|
return this._room.name || this.i18n`Empty Room`;
|
2019-02-27 22:50:08 +01:00
|
|
|
}
|
|
|
|
|
2020-10-07 14:36:08 +02:00
|
|
|
get id() {
|
|
|
|
return this._room.id;
|
|
|
|
}
|
|
|
|
|
2019-06-01 18:29:23 +02:00
|
|
|
get timelineViewModel() {
|
|
|
|
return this._timelineVM;
|
2019-02-27 22:50:08 +01:00
|
|
|
}
|
2019-03-09 00:43:43 +01:00
|
|
|
|
2020-09-11 11:35:53 +02:00
|
|
|
get isEncrypted() {
|
|
|
|
return this._room.isEncrypted;
|
|
|
|
}
|
|
|
|
|
2019-03-09 00:43:43 +01:00
|
|
|
get error() {
|
|
|
|
if (this._timelineError) {
|
|
|
|
return `Something went wrong loading the timeline: ${this._timelineError.message}`;
|
|
|
|
}
|
2020-03-30 21:33:04 +02:00
|
|
|
if (this._sendError) {
|
|
|
|
return `Something went wrong sending your message: ${this._sendError.message}`;
|
|
|
|
}
|
2019-06-16 15:21:20 +02:00
|
|
|
return "";
|
|
|
|
}
|
|
|
|
|
2020-08-20 17:33:08 +02:00
|
|
|
get avatarLetter() {
|
2020-08-21 18:14:32 +02:00
|
|
|
return avatarInitials(this.name);
|
2019-03-09 00:43:43 +01:00
|
|
|
}
|
2019-07-27 10:40:56 +02:00
|
|
|
|
2020-08-13 12:41:00 +02:00
|
|
|
get avatarColorNumber() {
|
|
|
|
return getIdentifierColorNumber(this._room.id)
|
|
|
|
}
|
2020-08-20 17:33:08 +02:00
|
|
|
|
|
|
|
get avatarUrl() {
|
|
|
|
if (this._room.avatarUrl) {
|
|
|
|
return this._room.mediaRepository.mxcUrlThumbnail(this._room.avatarUrl, 32, 32, "crop");
|
|
|
|
}
|
|
|
|
return null;
|
|
|
|
}
|
|
|
|
|
|
|
|
get avatarTitle() {
|
|
|
|
return this.name;
|
|
|
|
}
|
2020-05-04 22:23:43 +02:00
|
|
|
|
|
|
|
async _sendMessage(message) {
|
2019-07-29 19:54:21 +02:00
|
|
|
if (message) {
|
2019-09-15 12:23:26 +02:00
|
|
|
try {
|
2020-11-10 15:13:31 +01:00
|
|
|
let msgtype = "m.text";
|
|
|
|
if (message.startsWith("/me")) {
|
|
|
|
message = message.substr(3).trim();
|
|
|
|
msgtype = "m.emote";
|
|
|
|
}
|
|
|
|
await this._room.sendEvent("m.room.message", {msgtype, body: message});
|
2019-09-15 12:23:26 +02:00
|
|
|
} catch (err) {
|
|
|
|
console.error(`room.sendMessage(): ${err.message}:\n${err.stack}`);
|
2020-03-30 21:33:04 +02:00
|
|
|
this._sendError = err;
|
|
|
|
this._timelineError = null;
|
2020-05-04 19:23:11 +02:00
|
|
|
this.emitChange("error");
|
2019-09-15 12:23:26 +02:00
|
|
|
return false;
|
|
|
|
}
|
|
|
|
return true;
|
2019-07-29 19:54:21 +02:00
|
|
|
}
|
2019-09-15 12:23:26 +02:00
|
|
|
return false;
|
2019-07-27 10:40:56 +02:00
|
|
|
}
|
2020-05-04 22:23:43 +02:00
|
|
|
|
2020-11-10 22:36:26 +01:00
|
|
|
async _sendFile() {
|
2020-11-11 10:47:55 +01:00
|
|
|
let file;
|
|
|
|
try {
|
|
|
|
file = this.platform.openFile();
|
|
|
|
} catch (err) {
|
|
|
|
return;
|
2020-11-10 22:36:26 +01:00
|
|
|
}
|
2020-11-11 10:47:55 +01:00
|
|
|
const attachment = this._room.uploadAttachment(file.name, file.blob);
|
2020-11-10 22:36:26 +01:00
|
|
|
const content = {
|
|
|
|
body: file.name,
|
|
|
|
msgtype: "m.file",
|
|
|
|
};
|
2020-11-11 10:47:55 +01:00
|
|
|
await this._room.sendEvent("m.room.message", content, attachment);
|
2020-11-10 22:36:26 +01:00
|
|
|
}
|
|
|
|
|
2020-05-04 22:23:43 +02:00
|
|
|
get composerViewModel() {
|
|
|
|
return this._composerVM;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-08-13 18:00:19 +02:00
|
|
|
class ComposerViewModel extends ViewModel {
|
2020-05-04 22:23:43 +02:00
|
|
|
constructor(roomVM) {
|
2020-08-13 18:00:19 +02:00
|
|
|
super();
|
2020-05-04 22:23:43 +02:00
|
|
|
this._roomVM = roomVM;
|
2020-08-13 18:00:19 +02:00
|
|
|
this._isEmpty = true;
|
2020-05-04 22:23:43 +02:00
|
|
|
}
|
|
|
|
|
2020-09-11 11:35:53 +02:00
|
|
|
get isEncrypted() {
|
|
|
|
return this._roomVM.isEncrypted;
|
|
|
|
}
|
|
|
|
|
2020-05-04 22:23:43 +02:00
|
|
|
sendMessage(message) {
|
2020-08-13 18:00:19 +02:00
|
|
|
const success = this._roomVM._sendMessage(message);
|
|
|
|
if (success) {
|
|
|
|
this._isEmpty = true;
|
|
|
|
this.emitChange("canSend");
|
|
|
|
}
|
|
|
|
return success;
|
|
|
|
}
|
|
|
|
|
2020-11-11 11:47:05 +01:00
|
|
|
sendAttachment() {
|
|
|
|
this._roomVM._sendFile();
|
|
|
|
}
|
|
|
|
|
2020-08-13 18:00:19 +02:00
|
|
|
get canSend() {
|
|
|
|
return !this._isEmpty;
|
|
|
|
}
|
|
|
|
|
2020-11-06 23:43:02 +01:00
|
|
|
async setInput(text) {
|
|
|
|
const wasEmpty = this._isEmpty;
|
2020-08-13 18:00:19 +02:00
|
|
|
this._isEmpty = text.length === 0;
|
2020-11-10 14:02:07 +01:00
|
|
|
if (wasEmpty && !this._isEmpty) {
|
|
|
|
this._roomVM._room.ensureMessageKeyIsShared();
|
2020-11-06 23:43:02 +01:00
|
|
|
}
|
|
|
|
if (wasEmpty !== this._isEmpty) {
|
|
|
|
this.emitChange("canSend");
|
|
|
|
}
|
2020-05-04 22:23:43 +02:00
|
|
|
}
|
2019-02-27 22:50:08 +01:00
|
|
|
}
|