Skip to content

Commit

Permalink
estable
Browse files Browse the repository at this point in the history
  • Loading branch information
thejavierCO committed Aug 10, 2024
1 parent ab9a948 commit 355b0cd
Show file tree
Hide file tree
Showing 12 changed files with 229 additions and 298 deletions.
6 changes: 3 additions & 3 deletions src/App.svelte
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
<script>
import { blur } from "svelte/transition";
import Background from "./Components/background.svelte";
import Background from "./Components/Style Components/background.svelte";
import Store from "./Components/Db Components/store.svelte";
import Counter from "./Components/Timer Components/timer.svelte";
// import { catImage } from "./js/store";
// export let config;
import { catImage } from "./js/catApi.js";
export let config;
let objectAdd = async () => ({
status: "Stop",
seconds: 86400,
Expand Down
73 changes: 73 additions & 0 deletions src/Components/Db Components/localStorage.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,73 @@
export class localStorageDbItem {
constructor(localStorageParent, key) {
this.parent = localStorageParent;
this.key = key;
}
get data() {
return localStorage.getItem(this.key)
}
set data(data) {
if (typeof data != "string") throw "require type string for save"
localStorage.setItem(this.key, data);
this.parent.emit("changeItem", this);
}
defaultData(defaultData) {
if (defaultData && this.data == null) this.data = defaultData;
this.parent.emit("initItem", this);
return this;
}
Destroy() {
this.parent.keys = this.parent.keys.filter(e => e.key != this.key).map(e => e.getBase())
}
getBase() {
return { key: this.key }
}
toJSON(data) {
return JSON.parse(data ? data : this.data);
}
toString(data) {
return data ? JSON.stringify(data) : this.data;
}
onChange(fns) {
return this.parent.on("ChangeItem", ({ detail: { key, newValue, oldValue } }) => {
if (key == this.key) fns({ newValue, oldValue });
})
}
}

export class localStorageDb extends EventTarget {
constructor() {
super();
this._keys = [];
window.addEventListener("storage", ({ key, newValue, oldValue }) => {
if (key !== null) this.emit("ChangeItem", { key, newValue, oldValue });
else this.emit("ClearStorage");
})
}
get keys() {
return this._keys.map(({ key }) => new localStorageDbItem(this, key))
}
set keys(data) {
this._keys = data;
}
get(key) {
const Item = this.keys.find((e) => e.key == key);
if (!Item) throw "not exist element"
return Item
}
add(key) {
if (typeof key !== "string") throw "require key type string";
const Item = new localStorageDbItem(this, key);
this._keys = [...this._keys, Item.getBase()];
this.emit("addItem", Item)
return Item;
}
emit(name, data) {
if (data) return this.dispatchEvent(new CustomEvent(name, { detail: data, cancelable: true }))
else return this.dispatchEvent(new Event(name, { cancelable: true }))
}
on(name, callback) {
this.addEventListener(name, callback);
return this;
}
}
97 changes: 97 additions & 0 deletions src/Components/Db Components/store.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,97 @@
import { writable, get as getStoreData } from "svelte/store";
import { localStorageDb } from "./localStorage";
import { v4 as uuidv4 } from "uuid";

class StoreItem {
constructor(Store, data) {
this.parent = Store;
this._data = data;
}
get id() {
return this._data.id;
}
get data() {
return this._data;
}
set data(data) {
this._data = data;
}
edit(data) {
Object.keys(data).forEach((k) => (this.data[k] != data[k]) ? this.data[k] = data[k] : "");
this.parent.update(e => e.map(e => e.id == this.id ? this.data : e))
this.parent.emit("edit", this);
}
Destroy() {
this.parent.update(e => e.filter(e => e.id != this.id))
this.parent.emit("del", this);
}
}

export class Store extends EventTarget {
Destroy() {
throw new Error("Method not implemented.");
}
constructor(fnsDefaultStore) {
super();
this.store = writable([], fnsDefaultStore);
}
get subscribe() {
return this.store.subscribe;
}
get update() {
return this.store.update;
}
get data() {
return getStoreData(this.store).map((data) => new StoreItem(this, data));
}
set data(data) {
this.store.set(data);
}
add(data) {
if (!data.id) data.id = uuidv4();
this.update((e) => [...e, data])
this.emit("add");
return this;
}
get(id) {
const Item = this.data.find((e) => e.id == id);
if (!Item) throw "not exist element"
return Item;
}
clear() {
this.data = [];
this.emit("clear");
}
import(data) {
this.data = data;
this.emit("import");
}
emit(name, data) {
if (data) return this.dispatchEvent(new CustomEvent(name, { detail: data, cancelable: true }))
else return this.dispatchEvent(new Event(name, { cancelable: true }))
}
on(name, callback) {
this.addEventListener(name, callback);
return this;
}
}

export class StoreUseLocalStorage extends Store {
constructor(fnsUnsuscribe) {
super((setInternalStore) => {
console.log("start")
this.Keys = new localStorageDb();
const store = this.Keys.add("store").defaultData("[]")
setInternalStore(store.toJSON());
store.onChange(({ newValue: data }) => {
if (!document.hasFocus()) setInternalStore(store.toJSON(data))
})
this.Keys.on("ClearStorage", (_) => setInternalStore([]))
return fnsUnsuscribe;
});
this.Destroy = this.subscribe((data) => {
const store = this.Keys.get("store");
store.data = store.toString(data);
})
}
}
28 changes: 13 additions & 15 deletions src/Components/Db Components/store.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -2,42 +2,40 @@
import { createEventDispatcher, onDestroy, onMount } from "svelte";
import { get } from "svelte/store";
import LayoutGrid, { Cell } from "@smui/layout-grid";
import { dbStore, dbStoreUseLocalStorage } from "../../js/store";
import { Store, StoreUseLocalStorage } from "./store";
export let useLocalStorage = false;
const emit = createEventDispatcher();
let db = new (useLocalStorage ? dbStoreUseLocalStorage : dbStore)();
let store = new (useLocalStorage ? StoreUseLocalStorage : Store)();
const store = db.store;
db.on("del", (_) =>
store.on("del", (_) =>
emit("delete", {
add: (data) => db.add(data),
del: (id) => db.del(id),
edit: (id, data) => db.edit(id, data),
add: (data) => store.add(data),
del: (id) => store.get(id).Destroy(),
edit: (id, data) => store.get(id).edit(data),
store: () => get(store),
})
);
onDestroy(() => {
if (useLocalStorage) db.Destroy();
if (useLocalStorage) store.Destroy();
});
onMount(() =>
emit("mount", {
add: (data) => db.add(data),
del: (id) => db.del(id),
edit: (id, data) => db.edit(id, data),
add: (data) => store.add(data),
del: (id) => store.get(id).Destroy(),
edit: (id, data) => store.get(id).edit(data),
store: () => get(store),
})
);
</script>

<slot
add={(data) => db.add(data)}
del={(id) => db.del(id)}
edit={(id, data) => db.edit(id, data)}
add={(data) => store.add(data)}
del={(id) => store.get(id).Destroy()}
edit={(id, data) => store.get(id).edit(data)}
store={$store}
/>

Expand Down
File renamed without changes.
File renamed without changes.
File renamed without changes.
5 changes: 3 additions & 2 deletions src/Components/Timer Components/timer.svelte
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<script>
import { createEventDispatcher, onMount, onDestroy } from "svelte";
import { Temporizador } from "../../js/data";
import { Temporizador } from "./data";
let emit = createEventDispatcher();
export let time = { start: 0, pause: 0, end: 0 };
Expand All @@ -18,8 +18,9 @@
if (detail.status == "Play") emit("isPlay");
if (detail.status == "Pause") emit("isPause");
status = detail.status;
time = detail.time;
}
if (status == "Play") posicion = Counter.formatTime;
posicion = Counter.formatTime;
});
onMount(() => {
Expand Down
31 changes: 0 additions & 31 deletions src/js/_app.js

This file was deleted.

62 changes: 0 additions & 62 deletions src/js/_catapi.js

This file was deleted.

Loading

0 comments on commit 355b0cd

Please sign in to comment.