if "files" in dayLog.keys() and len(dayLog["files"]) > 0:
days_with_files.append(dayLog["day"])
- return {"days_with_logs": days_with_logs, "days_with_files": days_with_files}
\ No newline at end of file
+ return {"days_with_logs": days_with_logs, "days_with_files": days_with_files}
+
+
+@router.get("/loadMonthForReading")
+async def loadMonthForReading(month: int, year: int, cookie = Depends(users.isLoggedIn)):
+ content:dict = fileHandling.getDay(cookie["user_id"], year, month)
+ if "days" not in content.keys():
+ return []
+
+ days = []
+ enc_key = security.get_enc_key(cookie["user_id"], cookie["derived_key"])
+ for dayLog in content["days"]:
+ if "text" in dayLog.keys():
+ days.append({"day": dayLog["day"],
+ "text": security.decrypt_text(dayLog["text"], enc_key),
+ "date_written": security.decrypt_text(dayLog["date_written"], enc_key)})
+
+ days.sort(key=lambda x: x["day"])
+
+ return days
\ No newline at end of file
--- /dev/null
+import { dev } from '$app/environment';
+
+export let API_URL = dev
+ ? `${window.location.origin.replace(/:5173.*$/gm, '')}:8000`
+ : window.location.pathname.replace(/\/+$/, '');
\ No newline at end of file
import { fly } from 'svelte/transition';
let days = $state([]);
- let markedDays = {
- '2024-12-25': { type: 'background', color: '#28a745' }, // green instead of red
- '2024-12-31': { type: 'dot', color: '#28a745' } // green instead of blue
- };
let animationDirection = $state(1); // swipe the dates left or right
let lastYear = $cal.currentYear;
$effect(() => {
- if ($cal && ($cal.currentMonth !== lastMonth || $cal.currentYear !== lastYear)) {
+ if ($cal.currentMonth !== lastMonth || $cal.currentYear !== lastYear) {
// set animation direction
animationDirection = $cal.currentMonth > lastMonth ? 1 : -1;
if ($cal.currentYear > lastYear) {
}
days = updateCalendar();
+
lastMonth = $cal.currentMonth;
lastYear = $cal.currentYear;
}
const dayKey = `${year}-${(month + 1).toString().padStart(2, '0')}-${i
.toString()
.padStart(2, '0')}`;
- tempDays.push({ date: new Date(Date.UTC(year, month, i)), mark: markedDays[dayKey] });
+ tempDays.push(new Date(Date.UTC(year, month, i)));
}
return tempDays;
in:fly={{ y: 100, duration: 200 }}
out:fly={{ y: -100, duration: 200 }}
class="day
- {$cal.daysWithLogs.includes(day.date.getDate()) ? 'mark-background' : ''}
- {day.mark?.type === 'dot' ? 'mark-dot' : ''}
- {$selectedDate.toDateString() === day.date.toDateString() ? 'selected' : ''}"
- onclick={() => onDateClick(day.date)}
+ {$cal.daysWithLogs.includes(day.getDate()) ? 'mark-background' : ''}
+ {$cal.daysWithFiles.includes(day.getDate()) ? 'mark-dot' : ''}
+ {$selectedDate.toDateString() === day.toDateString() ? 'selected' : ''}"
+ onclick={() => onDateClick(day)}
>
- {day.date.getDate()}
+ {day.getDate()}
</div>
{:else}
<div class="day empty-slot"></div>
--- /dev/null
+<script>
+ import { API_URL } from '$lib/APIurl.js';
+ import { cal } from '$lib/calendarStore.js';
+ import axios from 'axios';
+
+ $effect(() => {
+ if ($cal.currentMonth || $cal.currentYear) {
+ loadMarkedDays();
+ }
+ });
+
+ let lastMonth = $cal.currentMonth - 1;
+ let lastYear = $cal.currentYear;
+ let isLoadingMarkedDays = false;
+ function loadMarkedDays() {
+ console.log('a');
+ if ($cal.currentMonth === lastMonth && $cal.currentYear === lastYear) {
+ return;
+ }
+
+ if (isLoadingMarkedDays) {
+ return;
+ }
+ console.log('b');
+ isLoadingMarkedDays = true;
+
+ axios
+ .get(API_URL + '/logs/getMarkedDays', {
+ params: {
+ month: $cal.currentMonth + 1,
+ year: $cal.currentYear
+ }
+ })
+ .then((response) => {
+ $cal.daysWithLogs = [...response.data.days_with_logs];
+ $cal.daysWithFiles = [...response.data.days_with_files];
+ })
+ .catch((error) => {
+ console.error(error);
+ })
+ .finally(() => {
+ lastMonth = $cal.currentMonth;
+ lastYear = $cal.currentYear;
+ isLoadingMarkedDays = false;
+ console.log('c');
+ });
+ }
+</script>
import {writable} from 'svelte/store';
-export const readingMode = writable(true);
\ No newline at end of file
+export const readingMode = writable(false);
\ No newline at end of file
<script>
import { fade, blur, slide } from 'svelte/transition';
import axios from 'axios';
- import { dev } from '$app/environment';
+ //import { dev } from '$app/environment';
import { goto } from '$app/navigation';
import { onMount } from 'svelte';
import '../scss/styles.scss';
import Fa from 'svelte-fa';
import { readingMode } from '$lib/settingsStore.js';
import { page } from '$app/state';
+ import { API_URL } from '$lib/APIurl.js';
import {
faRightFromBracket,
let inDuration = 150;
let outDuration = 150;
- let API_URL = dev
+ /*let API_URL = dev
? `${window.location.origin.replace(/:5173.*$/gm, '')}:8000`
- : window.location.pathname.replace(/\/+$/, '');
+ : window.location.pathname.replace(/\/+$/, '');*/
function logout() {
axios
<main class="d-flex flex-column">
<nav class="navbar navbar-expand-lg bg-body-tertiary">
<div class="row w-100">
- <div class="col-lg-4 col-sm-5 col d-flex flex-row justify-content-start">
+ <div class="col-lg-4 col-sm-5 col d-flex flex-row justify-content-start align-items-center">
<button
class="btn d-md-none"
type="button"
</div>
</div>
- <div class="col-lg-4 col-sm-2 col d-flex flex-row justify-content-center">Center-LOGO</div>
+ <div class="col-lg-4 col-sm-2 col d-flex flex-row justify-content-center align-items-center">
+ Center-LOGO
+ </div>
- <div class="col-lg-4 col-sm-5 col d-flex flex-row justify-content-end">
+ <div class="col-lg-4 col-sm-5 col pe-0 d-flex flex-row justify-content-end">
<button
- class="btn btn-outline-secondary"
+ class="btn btn-outline-secondary me-2"
data-bs-toggle="modal"
data-bs-target="#settingsModal"><Fa icon={faSliders} /></button
>
export const load = () => {
const user = JSON.parse(localStorage.getItem('user'));
if (user) {
- throw redirect(307, '/');
+ throw redirect(307, '/write');
}
}
\ No newline at end of file
import * as bootstrap from 'bootstrap';
import { onMount } from 'svelte';
import axios from 'axios';
- import { dev } from '$app/environment';
import { goto } from '$app/navigation';
- import { page } from '$app/stores';
+ import { API_URL } from '$lib/APIurl.js';
let show_login_failed = $state(false);
let show_login_warning_empty_fields = $state(false);
let registration_failed_message = $state('');
let is_registering = $state(false);
- let API_URL = dev
- ? `${window.location.origin.replace(/:5173.*$/gm, '')}:8000`
- : window.location.pathname.replace(/\/+$/, '');
-
onMount(() => {
// if params error=440 or error=401, show toast
if (window.location.search.includes('error=440')) {
.post(API_URL + '/users/login', { username, password })
.then((response) => {
localStorage.setItem('user', JSON.stringify(response.data.username));
- goto('/');
+ goto('/write');
})
.catch((error) => {
if (error.response.status === 404) {
<script>
- import '../scss/styles.scss';
+ import '../../scss/styles.scss';
import * as bootstrap from 'bootstrap';
- import Sidenav from './Sidenav.svelte';
+ import Sidenav from '$lib/Sidenav.svelte';
import { selectedDate, cal } from '$lib/calendarStore.js';
import axios from 'axios';
- import { dev } from '$app/environment';
+ //import { dev } from '$app/environment';
import { goto } from '$app/navigation';
import { onMount } from 'svelte';
import { searchString, searchResults } from '$lib/searchStore.js';
import * as TinyMDE from 'tiny-markdown-editor';
- import '../../node_modules/tiny-markdown-editor/dist/tiny-mde.css';
+ import '../../../node_modules/tiny-markdown-editor/dist/tiny-mde.css';
+ import { readingMode } from '$lib/settingsStore';
+ //import { read } from '$app/server';
+ import { API_URL } from '$lib/APIurl.js';
+ import DatepickerLogic from '$lib/datepickerLogic.svelte';
- let API_URL = dev
+ /*let API_URL = dev
? `${window.location.origin.replace(/:5173.*$/gm, '')}:8000`
- : window.location.pathname.replace(/\/+$/, '');
+ : window.location.pathname.replace(/\/+$/, '');*/
axios.interceptors.request.use((config) => {
config.withCredentials = true;
});
getLog();
- loadMarkedDays();
});
$effect(() => {
loading = false;
});
- $effect(() => {
- if ($cal.currentMonth || $cal.currentYear) {
- loadMarkedDays();
- }
- });
-
- let lastMonth = $cal.currentMonth - 1;
- let lastYear = $cal.currentYear;
- let isLoadingMarkedDays = false;
- function loadMarkedDays() {
- if ($cal.currentMonth === lastMonth && $cal.currentYear === lastYear) {
- return;
- }
-
- if (isLoadingMarkedDays) {
- return;
- }
- isLoadingMarkedDays = true;
-
- axios
- .get(API_URL + '/logs/getMarkedDays', {
- params: {
- month: $cal.currentMonth + 1,
- year: $cal.currentYear
- }
- })
- .then((response) => {
- $cal.daysWithLogs = [...response.data.days_with_logs];
- $cal.daysWithFiles = [...response.data.days_with_files];
- })
- .catch((error) => {
- console.error(error);
- })
- .finally(() => {
- lastMonth = $cal.currentMonth;
- lastYear = $cal.currentYear;
- isLoadingMarkedDays = false;
- });
- }
-
let altPressed = false;
function on_key_down(event) {
if (event.key === 'Alt') {
toast.show();
});
}
+
+ //#TODO Muss in die separate /read page (diese hier in /write umbenennen)
+ let isLoadingMonthForReading = false;
+ function loadMonthForReading() {
+ if (isLoadingMonthForReading) {
+ return;
+ }
+ isLoadingMonthForReading = true;
+
+ axios
+ .get(API_URL + '/logs/loadMonthForReading', {
+ params: {
+ month: $cal.currentMonth + 1,
+ year: $cal.currentYear
+ }
+ })
+ .then((response) => {
+ readingData = response.data;
+ })
+ .catch((error) => {
+ console.error(error);
+ })
+ .finally(() => {
+ isLoadingMonthForReading = false;
+ });
+ }
</script>
+<DatepickerLogic />
<svelte:window onkeydown={on_key_down} onkeyup={on_key_up} />
<!-- shown on small Screen, when triggered -->
<Sidenav {search} />
</div>
- <!-- Center -->
- <div class="d-flex flex-column mt-4 mx-4 flex-fill">
- <!-- Input-Area -->
- <div class="d-flex flex-column">
- <div class="d-flex flex-row textAreaHeader">
- <div class="flex-fill textAreaDate">
- {$selectedDate.toLocaleDateString('locale', { weekday: 'long' })}<br />
- {$selectedDate.toLocaleDateString('locale', {
- day: '2-digit',
- month: '2-digit',
- year: 'numeric'
- })}
+ {#if !$readingMode}
+ <!-- Center -->
+ <div class="d-flex flex-column mt-4 mx-4 flex-fill">
+ <!-- Input-Area -->
+ <div class="d-flex flex-column">
+ <div class="d-flex flex-row textAreaHeader">
+ <div class="flex-fill textAreaDate">
+ {$selectedDate.toLocaleDateString('locale', { weekday: 'long' })}<br />
+ {$selectedDate.toLocaleDateString('locale', {
+ day: '2-digit',
+ month: '2-digit',
+ year: 'numeric'
+ })}
+ </div>
+ <div class="flex-fill textAreaWrittenAt">
+ <div class={logDateWritten ? '' : 'opacity-50'}>Geschrieben am:</div>
+ {logDateWritten}
+ </div>
+ <div class="textAreaHistory">history</div>
+ <div class="textAreaDelete">delete</div>
</div>
- <div class="flex-fill textAreaWrittenAt">
- <div class={logDateWritten ? '' : 'opacity-50'}>Geschrieben am:</div>
- {logDateWritten}
- </div>
- <div class="textAreaHistory">history</div>
- <div class="textAreaDelete">delete</div>
- </div>
- <!-- <textarea
+ <!-- <textarea
bind:value={currentLog}
oninput={handleInput}
class="form-control {currentLog !== savedLog ? 'notSaved' : ''}"
rows="10"
></textarea> -->
- <div id="log" class="focus-ring">
- <div id="toolbar"></div>
- <div id="editor"></div>
+ <div id="log" class="focus-ring">
+ <div id="toolbar"></div>
+ <div id="editor"></div>
+ </div>
+ {$selectedDate}<br />
+ {lastSelectedDate}
</div>
- {$selectedDate}<br />
- {lastSelectedDate}
</div>
- </div>
- <div id="right">Right</div>
+ <div id="right">Right</div>
+ {:else}
+ <div class="w-100">
+ {#each readingData as log}
+ <div class="card">
+ <div class="card-header">{log.day} | {log.date_written}</div>
+ <div class="card-body">
+ {@html log.text}
+ </div>
+ </div>
+ {/each}
+ </div>
+ {/if}
<div class="toast-container position-fixed bottom-0 end-0 p-3">
<div