sprechtl/PomeloNote
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

stores.ts added, StrapiNoteRepository using it, updated editor

Browse source
This commit is contained in:
j-weissen 2022-10-16 23:22:19 +02:00
parent 22396d1a00
commit 154d496208
3 changed files with 67 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

16
frontend/svelte/src/models/StrapiNoteRepository.ts
View file

@ -1,6 +1,8 @@
import type {Note} from "./types";
import {parseCookies} from "nookies";
import type {NoteRepository} from "./NoteRepository";
import {currentNoteId} from "../stores";
type HttpMethod = 'GET' | 'POST' | 'PUT' | 'DELETE'
@ -13,13 +15,19 @@ export class StrapiNoteRepository implements NoteRepository {
return this.instance;
}
private constructor() {}
private constructor() {
currentNoteId.subscribe((value) => (this._currentNoteId = value));
}
private _currentNoteId: number | undefined;
private _currentNoteId: unknown;
private static apiNoteEndpoint: string = "http://localhost:1337/api/notes"
public set currentNoteId(value: number | undefined) {
this._currentNoteId = value;
currentNoteId.set(value || -1);
}
public get currentNoteId(): number {
return <number>this._currentNoteId;
}
public async getNotes(): Promise<Note[]>{
@ -36,7 +44,7 @@ export class StrapiNoteRepository implements NoteRepository {
if (this._currentNoteId === null || this._currentNoteId === undefined) {
return;
}
return await this.getNote(this._currentNoteId);
return await this.getNote(this.currentNoteId);
}
public async updateNote(id: number, note: Partial<Note>): Promise<Note> {

55
frontend/svelte/src/routes/editor/+page.svelte
View file

@ -1,24 +1,65 @@
<script lang="ts">
import type {Note} from "../../models/types";
import {StrapiNoteRepository} from "../../models/StrapiNoteRepository";
import {onMount} from "svelte";
import {currentNoteId} from "../../stores";
let notes: Note[] = JSON.parse(window.localStorage.getItem("notes"));
const clickedNoteId = window.localStorage.getItem("clickedNoteId");
let noteRepo: StrapiNoteRepository;
let currentNote: Note;
let id;
onMount(async () => {
currentNoteId.subscribe(v => id = v);
noteRepo = StrapiNoteRepository.getInstance();
currentNote = await noteRepo.getNote(noteRepo.currentNoteId);
title = (<Note>currentNote).title;
content = (<Note>currentNote).content;
console.log(noteRepo.currentNoteId)
})
export let title: string, content: string;
function save() {
noteRepo.updateNote(currentNote.id, {
"title": currentNote.title,
"content": currentNote.content
})
}
function cancel() {
window.location = "/";
}
const currNote = notes.find((note)=>{
return note.id === parseInt(clickedNoteId);
});
</script>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{"Pomelonote | Edit " + currNote.title}</title>
<title>Editor</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
<link href="" rel="stylesheet">
</head>
<html lang="en">
<div class="offset-3 col-6">
{currNote.content}
<input bind:value={title} class="input"> <br />
<textarea bind:value={content} class="input"></textarea>
<button on:click={() => save()} class="btn btn-primary save">Save</button>
<button on:click={() => cancel()} class="btn btn-outline-danger cancel">Cancel</button>
</div>
</html>
<style>
.input {
margin-top: 30px;
width: 100%;
}
.save {
justify-content: right;
}
.cancel {
justify-content: right;
}
</style>

7
frontend/svelte/src/stores.ts Normal file
View file

@ -0,0 +1,7 @@
import {writable} from "svelte/store";
import {browser} from "$app/environment"
export const currentNoteId = writable<number>();
if (browser) {
currentNoteId.set(Number(localStorage.getItem("currentNoteId") || ""))
currentNoteId.subscribe(val => localStorage.setItem("currentNoteId", String(val)));
}