66 lines
2 KiB
JavaScript
66 lines
2 KiB
JavaScript
import ListView from "../general/ListView.js";
|
|
import TemplateView from "../general/TemplateView.js";
|
|
|
|
class SessionPickerItem extends TemplateView {
|
|
constructor(vm) {
|
|
super(vm, true);
|
|
this._onDeleteClick = this._onDeleteClick.bind(this);
|
|
this._onClearClick = this._onClearClick.bind(this);
|
|
}
|
|
|
|
_onDeleteClick(event) {
|
|
event.stopPropagation();
|
|
event.preventDefault();
|
|
if (confirm("Are you sure?")) {
|
|
this.viewModel.delete();
|
|
}
|
|
}
|
|
|
|
_onClearClick(event) {
|
|
event.stopPropagation();
|
|
event.preventDefault();
|
|
this.viewModel.clear();
|
|
}
|
|
|
|
render(t) {
|
|
const deleteButton = t.button({
|
|
disabled: vm => vm.isDeleting,
|
|
onClick: this._onDeleteClick,
|
|
}, "Delete");
|
|
const clearButton = t.button({
|
|
disabled: vm => vm.isClearing,
|
|
onClick: this._onClearClick,
|
|
}, "Clear");
|
|
const userName = t.span({className: "userId"}, vm => vm.userId);
|
|
const errorMessage = t.if(vm => vm.error, t => t.span({className: "error"}, vm => vm.error));
|
|
return t.li([userName, errorMessage, clearButton, deleteButton]);
|
|
}
|
|
}
|
|
|
|
export default class SessionPickerView extends TemplateView {
|
|
mount() {
|
|
this._sessionList = new ListView({
|
|
list: this.viewModel.sessions,
|
|
onItemClick: (item) => {
|
|
this.viewModel.pick(item.viewModel.id);
|
|
},
|
|
}, sessionInfo => {
|
|
return new SessionPickerItem(sessionInfo);
|
|
});
|
|
return super.mount();
|
|
}
|
|
|
|
render(t) {
|
|
return t.div({className: "SessionPickerView"}, [
|
|
t.h1(["Pick a session"]),
|
|
this._sessionList.mount(),
|
|
t.p(t.button({onClick: () => this.viewModel.cancel()}, ["Log in to a new session instead"])),
|
|
t.p(t.button({onClick: () => this.viewModel.import(prompt("JSON"))}, ["Import Session JSON"]))
|
|
]);
|
|
}
|
|
|
|
unmount() {
|
|
super.unmount();
|
|
this._sessionList.unmount();
|
|
}
|
|
}
|