mirror of
https://github.com/vector-im/hydrogen-web.git
synced 2024-12-23 03:25:12 +01:00
use error view model from call tile
This commit is contained in:
parent
f15e849f54
commit
42ee2d294b
@ -16,7 +16,7 @@ limitations under the License.
|
|||||||
|
|
||||||
import {SimpleTile} from "./SimpleTile.js";
|
import {SimpleTile} from "./SimpleTile.js";
|
||||||
import {LocalMedia} from "../../../../../matrix/calls/LocalMedia";
|
import {LocalMedia} from "../../../../../matrix/calls/LocalMedia";
|
||||||
|
import {ErrorViewModel} from "../../../../ErrorViewModel"
|
||||||
// TODO: timeline entries for state events with the same state key and type
|
// TODO: timeline entries for state events with the same state key and type
|
||||||
// should also update previous entries in the timeline, so we can update the name of the call, whether it is terminated, etc ...
|
// should also update previous entries in the timeline, so we can update the name of the call, whether it is terminated, etc ...
|
||||||
|
|
||||||
@ -28,6 +28,7 @@ export class CallTile extends SimpleTile {
|
|||||||
const calls = this.getOption("session").callHandler.calls;
|
const calls = this.getOption("session").callHandler.calls;
|
||||||
this._call = calls.get(this._entry.stateKey);
|
this._call = calls.get(this._entry.stateKey);
|
||||||
this._callSubscription = undefined;
|
this._callSubscription = undefined;
|
||||||
|
this._errorViewModel = undefined;
|
||||||
if (this._call) {
|
if (this._call) {
|
||||||
this._callSubscription = this._call.disposableOn("change", () => {
|
this._callSubscription = this._call.disposableOn("change", () => {
|
||||||
// unsubscribe when terminated
|
// unsubscribe when terminated
|
||||||
@ -60,6 +61,10 @@ export class CallTile extends SimpleTile {
|
|||||||
return this._call && this._call.hasJoined;
|
return this._call && this._call.hasJoined;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
get errorViewModel() {
|
||||||
|
return this._errorViewModel;
|
||||||
|
}
|
||||||
|
|
||||||
get label() {
|
get label() {
|
||||||
if (this._call) {
|
if (this._call) {
|
||||||
if (this._call.hasJoined) {
|
if (this._call.hasJoined) {
|
||||||
@ -78,16 +83,19 @@ export class CallTile extends SimpleTile {
|
|||||||
const stream = await this.platform.mediaDevices.getMediaTracks(false, true);
|
const stream = await this.platform.mediaDevices.getMediaTracks(false, true);
|
||||||
const localMedia = new LocalMedia().withUserMedia(stream);
|
const localMedia = new LocalMedia().withUserMedia(stream);
|
||||||
await this._call.join(localMedia);
|
await this._call.join(localMedia);
|
||||||
} catch (err) {
|
} catch (error) {
|
||||||
this._error = err;
|
this._reportError(error);
|
||||||
this.emitChange("error");
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async leave() {
|
async leave() {
|
||||||
if (this.canLeave) {
|
if (this.canLeave) {
|
||||||
this._call.leave();
|
try {
|
||||||
|
this._call.leave();
|
||||||
|
} catch (err) {
|
||||||
|
this._reportError(err);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -96,4 +104,12 @@ export class CallTile extends SimpleTile {
|
|||||||
this._callSubscription = this._callSubscription();
|
this._callSubscription = this._callSubscription();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
_reportError(error) {
|
||||||
|
this._errorViewModel = new ErrorViewModel(this.childOptions({error, onClose: () => {
|
||||||
|
this._errorViewModel = undefined;
|
||||||
|
this.emitChange("errorViewModel");
|
||||||
|
}}));
|
||||||
|
this.emitChange("errorViewModel");
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
@ -14,17 +14,24 @@ See the License for the specific language governing permissions and
|
|||||||
limitations under the License.
|
limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import {TemplateView} from "../../../general/TemplateView";
|
import {Builder, TemplateView} from "../../../general/TemplateView";
|
||||||
import type {CallTile} from "../../../../../../domain/session/room/timeline/tiles/CallTile";
|
import type {CallTile} from "../../../../../../domain/session/room/timeline/tiles/CallTile";
|
||||||
|
import {ErrorView} from "../../../general/ErrorView";
|
||||||
|
|
||||||
export class CallTileView extends TemplateView<CallTile> {
|
export class CallTileView extends TemplateView<CallTile> {
|
||||||
render(t, vm) {
|
render(t: Builder<CallTile>, vm: CallTile) {
|
||||||
return t.li(
|
return t.li(
|
||||||
{className: "AnnouncementView"},
|
{className: "CallTileView AnnouncementView"},
|
||||||
t.div([
|
t.div(
|
||||||
vm => vm.label,
|
[
|
||||||
t.button({className: "CallTileView_join", hidden: vm => !vm.canJoin}, "Join"),
|
t.if(vm => vm.errorViewModel, t => {
|
||||||
t.button({className: "CallTileView_leave", hidden: vm => !vm.canLeave}, "Leave")
|
return t.div({className: "CallTileView_error"}, t.view(new ErrorView(vm.errorViewModel, {inline: true})));
|
||||||
|
}),
|
||||||
|
t.div([
|
||||||
|
vm => vm.label,
|
||||||
|
t.button({className: "CallTileView_join", hidden: vm => !vm.canJoin}, "Join"),
|
||||||
|
t.button({className: "CallTileView_leave", hidden: vm => !vm.canLeave}, "Leave")
|
||||||
|
])
|
||||||
])
|
])
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user