From 230957b1bf4f5024b6773a89ca7ff32e489d159d Mon Sep 17 00:00:00 2001 From: Matei Adriel Date: Mon, 3 Jun 2019 08:03:35 +0000 Subject: [PATCH] =?UTF-8?q?=20=F0=9F=8C=8B=20=20fixed=20saving=20and=20loa?= =?UTF-8?q?ding=20saves=20from=20the=20ui,=20fixed=20the=20scale=20bug=20a?= =?UTF-8?q?nd=20the=20switchTo=20not=20beeing=20triggered=20=F0=9F=9A=88?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/index.html | 2 +- src/scss/base.scss | 8 ++--- .../componentManager/componentManager.ts | 35 +++++++++++++------ src/ts/common/store/persistent.ts | 21 +++++++++++ src/ts/main.ts | 28 +++++++-------- 5 files changed, 62 insertions(+), 32 deletions(-) create mode 100644 src/ts/common/store/persistent.ts diff --git a/src/index.html b/src/index.html index d91ad1f..3dd054e 100644 --- a/src/index.html +++ b/src/index.html @@ -8,7 +8,7 @@ - + hello world diff --git a/src/scss/base.scss b/src/scss/base.scss index 235e6e9..07789d8 100644 --- a/src/scss/base.scss +++ b/src/scss/base.scss @@ -1,7 +1,7 @@ @import "./toastr.scss"; @import "./modal.scss"; -$mdc-theme-primary: black; +$mdc-theme-primary: orange / 2; $mdc-theme-secondary: #feeae6; $mdc-theme-on-primary: white; $mdc-theme-surface: black; @@ -29,9 +29,9 @@ svg { display: block; } -.modal__btn-primary{ - background: orange !important; -} +// .modal__btn-primary{ + // background: orange !important; +// } .createBar { z-index:10; diff --git a/src/ts/common/componentManager/componentManager.ts b/src/ts/common/componentManager/componentManager.ts index cdbd552..deb13fe 100644 --- a/src/ts/common/componentManager/componentManager.ts +++ b/src/ts/common/componentManager/componentManager.ts @@ -16,6 +16,7 @@ import { Settings } from "../store/settings"; import { download } from "./download"; import { modal } from "../modals"; import { map } from "rxjs/operators"; +import { persistent } from "../store/persistent"; @Singleton @@ -48,7 +49,8 @@ export class ComponentManager { private upEvent = new KeyboardInput("up") private downEvent = new KeyboardInput("down") - public name = "current" + @persistent("current", "main'") + public name: string public alertOptions = alertOptions private commandHistory: string[] = [] @@ -140,9 +142,7 @@ export class ComponentManager { else { if (this.ctrlEvent.value) { if (this.createEvent.value) { - this.preInput() - this.inputMode = "create" - this.placeholder.next("Create simulation") + this.prepareNewSimulation() } else if (this.shiftEvent.value && this.palleteEvent.value) { this.preInput() @@ -164,10 +164,16 @@ export class ComponentManager { this.wireManager.update.subscribe(val => this.update()) this.saves.next(this.store.ls()) - //if (this.saves.value.length === 0) - // this.save() + if (this.saves.value.length === 0) + this.save() + } + public prepareNewSimulation() { + this.preInput() + this.inputMode = "create" + this.placeholder.next("Create simulation") + } preInput() { const elem = document.getElementById("nameInput") elem.value = "" @@ -199,6 +205,7 @@ All you work will be lost!` } public createEmptySimulation(name: string) { + console.log(name) const create = () => { this.store.set(name, { wires: [], @@ -209,6 +216,7 @@ All you work will be lost!` if (name !== this.name) this.save() + this.name = name this.refresh() } @@ -222,12 +230,14 @@ All you work will be lost!` } public switchTo(name: string) { + console.log(`switching to ${name}`) + const data = this.store.get(name) if (!data) - error(`An error occured when trying to load ${name}`,"",this.alertOptions) + error(`An error occured when trying to load ${name}`, "", this.alertOptions) - else - this.loadState(data) + this.name = name + this.refresh() } eval(command: string) { @@ -259,6 +269,8 @@ All you work will be lost!` } refresh() { + console.log(this.name) + if (this.store.get(this.name)) { this.loadState(this.store.get(this.name)) } @@ -401,6 +413,7 @@ All you work will be lost!` this.screen.scale = state.scale this.screen.position = state.position + this.screen.update() this.update() } @@ -410,8 +423,8 @@ All you work will be lost!` const element = this.commandHistory[i]; this.commandHistoryStore.set(i.toString(), element) } - this.store.set(name || this.name, this.state) + this.store.set(this.name, this.state) this.saves.next(this.store.ls()) - success("Saved the simulation succesfully!", "", this.alertOptions) + success(`Saved the simulation ${this.name} succesfully!`, "", this.alertOptions) } } \ No newline at end of file diff --git a/src/ts/common/store/persistent.ts b/src/ts/common/store/persistent.ts new file mode 100644 index 0000000..6615b3e --- /dev/null +++ b/src/ts/common/store/persistent.ts @@ -0,0 +1,21 @@ +import { Store } from "./store"; + +export const persistent = (_default:K,storeKey = "main") => (target:T, key: keyof T & string) => { + let secret: K + const store = new Store(key) + if (store.get(storeKey)) + secret = store.get(storeKey) + else + secret = _default + + Object.defineProperty(target,key,{ + get() { + return secret + }, + set(value:K) { + secret = value + store.set(storeKey, secret) + }, + enumerable: true + }) +} \ No newline at end of file diff --git a/src/ts/main.ts b/src/ts/main.ts index 94618a9..5832672 100644 --- a/src/ts/main.ts +++ b/src/ts/main.ts @@ -10,10 +10,11 @@ import { MDCMenu } from '@material/menu'; const screen = new Screen() const manager = new ComponentManager() -manager.components.push(new Component("and", [200, 100], [100, 100])) -manager.components.push(new Component("not", [200, 500], [100, 100])) -manager.components.push(new Component("true", [200, 500], [100, 100])) -manager.components.push(new Component("false", [200, 500], [100, 100])) +// manager.components.push(new Component("and", [200, 100], [100, 100])) +// manager.components.push(new Component("not", [200, 500], [100, 100])) +// manager.components.push(new Component("true", [200, 500], [100, 100])) +// manager.components.push(new Component("false", [200, 500], [100, 100])) +manager.save() manager.update() const handleEvent = (e: T, func: (e: T) => any) => { @@ -62,32 +63,27 @@ render(html`
`, document.body)