2020-08-05 18:38:55 +02:00
|
|
|
/*
|
|
|
|
Copyright 2020 Bruno Windels <bruno@windels.cloud>
|
|
|
|
|
|
|
|
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.
|
|
|
|
*/
|
|
|
|
|
2019-09-08 10:19:16 +02:00
|
|
|
import {SortedArray} from "../observable/index.js";
|
2020-04-29 10:10:20 +02:00
|
|
|
import {SessionLoadViewModel} from "./SessionLoadViewModel.js";
|
2020-05-04 19:23:11 +02:00
|
|
|
import {ViewModel} from "./ViewModel.js";
|
2019-10-12 21:16:48 +02:00
|
|
|
|
2020-05-04 19:23:11 +02:00
|
|
|
class SessionItemViewModel extends ViewModel {
|
2019-10-12 21:16:48 +02:00
|
|
|
constructor(sessionInfo, pickerVM) {
|
2020-05-05 23:14:58 +02:00
|
|
|
super({});
|
2019-10-12 21:16:48 +02:00
|
|
|
this._pickerVM = pickerVM;
|
|
|
|
this._sessionInfo = sessionInfo;
|
|
|
|
this._isDeleting = false;
|
2019-10-13 07:48:49 +02:00
|
|
|
this._isClearing = false;
|
2019-10-12 21:16:48 +02:00
|
|
|
this._error = null;
|
2019-12-14 18:29:35 +01:00
|
|
|
this._exportDataUrl = null;
|
2019-10-12 21:16:48 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
get error() {
|
|
|
|
return this._error && this._error.message;
|
|
|
|
}
|
|
|
|
|
|
|
|
async delete() {
|
|
|
|
this._isDeleting = true;
|
2020-05-04 19:23:11 +02:00
|
|
|
this.emitChange("isDeleting");
|
2019-10-12 21:16:48 +02:00
|
|
|
try {
|
|
|
|
await this._pickerVM.delete(this.id);
|
|
|
|
} catch(err) {
|
|
|
|
this._error = err;
|
|
|
|
console.error(err);
|
2020-05-04 19:23:11 +02:00
|
|
|
this.emitChange("error");
|
2019-10-12 21:16:48 +02:00
|
|
|
} finally {
|
|
|
|
this._isDeleting = false;
|
2020-05-04 19:23:11 +02:00
|
|
|
this.emitChange("isDeleting");
|
2019-10-12 21:16:48 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2019-10-13 07:48:49 +02:00
|
|
|
async clear() {
|
|
|
|
this._isClearing = true;
|
2020-05-04 19:23:11 +02:00
|
|
|
this.emitChange();
|
2019-10-13 07:48:49 +02:00
|
|
|
try {
|
|
|
|
await this._pickerVM.clear(this.id);
|
|
|
|
} catch(err) {
|
|
|
|
this._error = err;
|
|
|
|
console.error(err);
|
2020-05-04 19:23:11 +02:00
|
|
|
this.emitChange("error");
|
2019-10-13 07:48:49 +02:00
|
|
|
} finally {
|
|
|
|
this._isClearing = false;
|
2020-05-04 19:23:11 +02:00
|
|
|
this.emitChange("isClearing");
|
2019-10-13 07:48:49 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2019-10-12 21:16:48 +02:00
|
|
|
get isDeleting() {
|
|
|
|
return this._isDeleting;
|
|
|
|
}
|
|
|
|
|
2019-10-13 07:48:49 +02:00
|
|
|
get isClearing() {
|
|
|
|
return this._isClearing;
|
|
|
|
}
|
|
|
|
|
2019-10-12 21:16:48 +02:00
|
|
|
get id() {
|
|
|
|
return this._sessionInfo.id;
|
|
|
|
}
|
|
|
|
|
2019-12-14 18:29:35 +01:00
|
|
|
get label() {
|
|
|
|
const {userId, comment} = this._sessionInfo;
|
|
|
|
if (comment) {
|
|
|
|
return `${userId} (${comment})`;
|
|
|
|
} else {
|
|
|
|
return userId;
|
|
|
|
}
|
2019-10-12 21:16:48 +02:00
|
|
|
}
|
2019-10-12 22:18:08 +02:00
|
|
|
|
|
|
|
get sessionInfo() {
|
|
|
|
return this._sessionInfo;
|
2019-10-12 21:16:48 +02:00
|
|
|
}
|
2019-10-13 08:29:23 +02:00
|
|
|
|
2019-12-14 18:29:35 +01:00
|
|
|
get exportDataUrl() {
|
|
|
|
return this._exportDataUrl;
|
|
|
|
}
|
|
|
|
|
|
|
|
async export() {
|
|
|
|
try {
|
|
|
|
const data = await this._pickerVM._exportData(this._sessionInfo.id);
|
|
|
|
const json = JSON.stringify(data, undefined, 2);
|
|
|
|
const blob = new Blob([json], {type: "application/json"});
|
|
|
|
this._exportDataUrl = URL.createObjectURL(blob);
|
2020-05-04 19:23:11 +02:00
|
|
|
this.emitChange("exportDataUrl");
|
2019-12-14 18:29:35 +01:00
|
|
|
} catch (err) {
|
|
|
|
alert(err.message);
|
|
|
|
console.error(err);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
clearExport() {
|
|
|
|
if (this._exportDataUrl) {
|
|
|
|
URL.revokeObjectURL(this._exportDataUrl);
|
|
|
|
this._exportDataUrl = null;
|
2020-05-04 19:23:11 +02:00
|
|
|
this.emitChange("exportDataUrl");
|
2019-10-13 08:29:23 +02:00
|
|
|
}
|
|
|
|
}
|
2019-10-12 21:16:48 +02:00
|
|
|
}
|
2019-07-29 22:39:56 +02:00
|
|
|
|
2020-04-22 21:53:55 +02:00
|
|
|
|
2020-05-04 19:23:11 +02:00
|
|
|
export class SessionPickerViewModel extends ViewModel {
|
2020-05-05 23:14:58 +02:00
|
|
|
constructor(options) {
|
|
|
|
super(options);
|
|
|
|
const {storageFactory, sessionInfoStorage, sessionCallback, createSessionContainer} = options;
|
2019-10-12 21:16:48 +02:00
|
|
|
this._storageFactory = storageFactory;
|
2020-04-19 19:13:38 +02:00
|
|
|
this._sessionInfoStorage = sessionInfoStorage;
|
2019-07-29 22:39:56 +02:00
|
|
|
this._sessionCallback = sessionCallback;
|
2020-04-20 22:49:14 +02:00
|
|
|
this._createSessionContainer = createSessionContainer;
|
2019-10-13 08:16:08 +02:00
|
|
|
this._sessions = new SortedArray((s1, s2) => s1.id.localeCompare(s2.id));
|
2020-04-22 21:53:55 +02:00
|
|
|
this._loadViewModel = null;
|
|
|
|
this._error = null;
|
2019-07-29 22:39:56 +02:00
|
|
|
}
|
|
|
|
|
2020-04-20 22:49:14 +02:00
|
|
|
// this loads all the sessions
|
2019-07-29 22:39:56 +02:00
|
|
|
async load() {
|
2020-04-19 19:13:38 +02:00
|
|
|
const sessions = await this._sessionInfoStorage.getAll();
|
2019-10-12 21:16:48 +02:00
|
|
|
this._sessions.setManyUnsorted(sessions.map(s => new SessionItemViewModel(s, this)));
|
2019-07-29 22:39:56 +02:00
|
|
|
}
|
|
|
|
|
2020-04-22 21:53:55 +02:00
|
|
|
// for the loading of 1 picked session
|
|
|
|
get loadViewModel() {
|
|
|
|
return this._loadViewModel;
|
2020-04-20 22:49:14 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
async pick(id) {
|
2020-04-22 21:53:55 +02:00
|
|
|
if (this._loadViewModel) {
|
|
|
|
return;
|
|
|
|
}
|
2019-10-12 22:18:08 +02:00
|
|
|
const sessionVM = this._sessions.array.find(s => s.id === id);
|
|
|
|
if (sessionVM) {
|
2020-04-29 10:10:20 +02:00
|
|
|
this._loadViewModel = new SessionLoadViewModel({
|
2020-04-23 09:06:04 +02:00
|
|
|
createAndStartSessionContainer: () => {
|
|
|
|
const sessionContainer = this._createSessionContainer();
|
|
|
|
sessionContainer.startWithExistingSession(sessionVM.id);
|
|
|
|
return sessionContainer;
|
|
|
|
},
|
2020-04-22 21:53:55 +02:00
|
|
|
sessionCallback: sessionContainer => {
|
|
|
|
if (sessionContainer) {
|
|
|
|
// make parent view model move away
|
|
|
|
this._sessionCallback(sessionContainer);
|
|
|
|
} else {
|
|
|
|
// show list of session again
|
|
|
|
this._loadViewModel = null;
|
2020-05-04 19:23:11 +02:00
|
|
|
this.emitChange("loadViewModel");
|
2020-04-22 21:53:55 +02:00
|
|
|
}
|
2020-04-23 09:06:04 +02:00
|
|
|
}
|
2020-04-20 22:49:14 +02:00
|
|
|
});
|
2020-04-22 21:53:55 +02:00
|
|
|
this._loadViewModel.start();
|
2020-05-04 19:23:11 +02:00
|
|
|
this.emitChange("loadViewModel");
|
2019-07-29 22:39:56 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2019-12-14 18:29:35 +01:00
|
|
|
async _exportData(id) {
|
2020-04-19 19:13:38 +02:00
|
|
|
const sessionInfo = await this._sessionInfoStorage.get(id);
|
2019-12-14 18:29:35 +01:00
|
|
|
const stores = await this._storageFactory.export(id);
|
|
|
|
const data = {sessionInfo, stores};
|
|
|
|
return data;
|
|
|
|
}
|
|
|
|
|
2019-10-13 08:16:08 +02:00
|
|
|
async import(json) {
|
2019-12-14 18:29:35 +01:00
|
|
|
const data = JSON.parse(json);
|
|
|
|
const {sessionInfo} = data;
|
|
|
|
sessionInfo.comment = `Imported on ${new Date().toLocaleString()} from id ${sessionInfo.id}.`;
|
2020-04-20 22:49:14 +02:00
|
|
|
sessionInfo.id = this._createSessionContainer().createNewSessionId();
|
2019-12-14 18:29:35 +01:00
|
|
|
await this._storageFactory.import(sessionInfo.id, data.stores);
|
2020-04-19 19:13:38 +02:00
|
|
|
await this._sessionInfoStorage.add(sessionInfo);
|
2019-10-13 08:16:08 +02:00
|
|
|
this._sessions.set(new SessionItemViewModel(sessionInfo, this));
|
|
|
|
}
|
|
|
|
|
2019-10-12 21:16:48 +02:00
|
|
|
async delete(id) {
|
|
|
|
const idx = this._sessions.array.findIndex(s => s.id === id);
|
2020-04-19 19:13:38 +02:00
|
|
|
await this._sessionInfoStorage.delete(id);
|
2019-10-12 21:16:48 +02:00
|
|
|
await this._storageFactory.delete(id);
|
|
|
|
this._sessions.remove(idx);
|
|
|
|
}
|
|
|
|
|
2019-10-13 07:48:49 +02:00
|
|
|
async clear(id) {
|
|
|
|
await this._storageFactory.delete(id);
|
|
|
|
}
|
|
|
|
|
2019-07-29 22:39:56 +02:00
|
|
|
get sessions() {
|
|
|
|
return this._sessions;
|
|
|
|
}
|
|
|
|
|
|
|
|
cancel() {
|
2020-04-29 10:10:20 +02:00
|
|
|
if (!this._loadViewModel) {
|
|
|
|
this._sessionCallback();
|
|
|
|
}
|
2019-07-29 22:39:56 +02:00
|
|
|
}
|
|
|
|
}
|