Skip to content

Commit

Permalink
Merge pull request #294 from vplan-fr/main
Browse files Browse the repository at this point in the history 
Weekplan + Designs + fixes
  • Loading branch information
@OfficialFreak
OfficialFreak authored Mar 22, 2024
2 parents ec6be59 + 0d332de commit 4b3e2c7
Show file tree
Hide file tree
Showing 22 changed files with 1,650 additions and 336 deletions.
Binary file removed client/public/base_static/favicon.png
View file
Binary file not shown.
2 changes: 1 addition & 1 deletion client/public/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@

<title>Better VPlan</title>

<link rel='icon' type='image/png' href='/public/base_static/favicon.png'>
<link rel='icon' type='image/png' href='/public/base_static/images/better_vp.svg'>
<link rel='stylesheet' href='/public/base_static/global.css'>
<link rel='stylesheet' href='/public/build/bundle.css'>

Expand Down
49 changes: 19 additions & 30 deletions client/src/App.svelte
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<script>
import Plan from "./components/Plan.svelte";
import Weekplan from "./components/Weekplan.svelte";
import Plan from "./components/Plan/Plan.svelte";
import Weekplan from "./components/Weekplan/Weekplan.svelte";
import Authentication from "./components/Authentication.svelte";
import LandingPage from "./components/LandingPage.svelte";
import LandingPageNavbar from "./components/LandingPageNavbar.svelte";
Expand All @@ -13,7 +13,7 @@
import SveltyPicker from 'svelty-picker';
import {get_settings, group_rooms, update_colors, navigate_page, init_indexed_db, clear_plan_cache, get_favorites} from "./utils.js";
import {notifications} from './notifications.js';
import {logged_in, title, current_page, settings, active_modal, pwa_prompt, indexed_db, selected_favorite, favorites} from './stores.js'
import {logged_in, title, current_page, settings, active_modal, pwa_prompt, selected_favorite, favorites, api_base} from './stores.js'
import {getDateDisabled} from './plan.js';
import SchoolManager from "./components/SchoolManager.svelte";
import Changelog from "./components/Changelog.svelte";
Expand All @@ -29,6 +29,9 @@
import { fade } from "svelte/transition";
import FancyBackground from "./components/FancyBackground.svelte";
import NotFound from "./components/NotFound.svelte";
import {gen_revision_arr} from "./plan.js";
import LessonInspect from "./components/Weekplan/LessonInspect.svelte";
import DayInspect from "./components/Weekplan/DayInspect.svelte";
const pad = (n, s = 2) => (`${new Array(s).fill(0)}${n}`).slice(-s);
let school_num;
Expand All @@ -39,7 +42,6 @@
let teacher_dict;
let all_rooms;
let grouped_forms;
let api_base;
let selected_revision;
let meta;
let enabled_dates;
Expand Down Expand Up @@ -74,7 +76,7 @@
teacher_dict = {};
all_rooms = null;
grouped_forms = [];
api_base = null;
$api_base = null;
selected_revision = ".newest";
meta = {};
enabled_dates = [];
Expand Down Expand Up @@ -264,17 +266,6 @@
}
}
function gen_revision_arr(all_revisions) {
revision_arr = [];
for(const [index, revision] of Object.entries(all_revisions)) {
if (index == 1) {continue;}
revision_arr.push({
"id": revision,
"display_name": format_revision_date(revision, all_revisions[1])
});
}
}
function customGetDateDisabled(date) {
if(typeof date === "object") {
date = `${date.getFullYear()}-${pad(date.getMonth()+1)}-${pad(date.getDate())}`;
Expand Down Expand Up @@ -330,7 +321,7 @@
if(!load_favorite || !$settings.load_first_favorite) {
return;
}
navigate_page('plan');
navigate_page($settings.weekplan_default ? "weekplan" : "plan");
if($favorites.length === 0) {
return;
}
Expand Down Expand Up @@ -358,16 +349,16 @@
$: $logged_in && init_indexed_db();
$: !$logged_in && logout();
$: select_plan($favorites, $selected_favorite);
$: school_num && (api_base = `/api/v69.420/${school_num}`);
$: school_num && ($api_base = `/api/v69.420/${school_num}`);
$: school_num && get_meta(school_num);
$: all_revisions = [".newest"].concat((meta?.dates || {})[date] || []);
$: all_revisions = [".newest"].concat((meta?.dates || {})[date] || [])
// If no date selected, default to today
$: !date && (() => {
let tmp_date = new Date();
date = `${tmp_date.getFullYear()}-${pad(tmp_date.getMonth()+1)}-${pad(tmp_date.getDate())}`
})();
// If the selected date is disabled, and meta date is not disabled, set to meta date
$: date && customGetDateDisabled(date) && (date !== meta.date) && (() => {
$: date && !$current_page.startsWith("weekplan") && customGetDateDisabled(date) && (date !== meta.date) && (() => {
date = meta.date;
})();
//$: school_num && get_preferences();
Expand All @@ -383,7 +374,7 @@
$: date && gen_teacher_arr(teacher_dict);
$: selected_room && set_plan("rooms", selected_room);
$: gen_room_arr(grouped_rooms);
$: gen_revision_arr(all_revisions);
$: revision_arr = gen_revision_arr(all_revisions);
$: reset_selects(plan_type);
const resizeObserver = new ResizeObserver((entries) => {
Expand All @@ -404,7 +395,7 @@
return;
}
navigate_page(new_location);
if (new_location.startsWith("plan")) {
if (new_location.startsWith("plan") || new_location.startsWith("weekplan")) {
refresh_plan_vars();
}
});
Expand All @@ -413,7 +404,7 @@
if(!((new_location === "login" || new_location === "register") && $logged_in)) {
if(new_location === "favorite") {
load_favorite = true;
new_location = "plan";
new_location = $settings.weekplan_default ? "weekplan" : "plan";
}
navigate_page(new_location);
}
Expand All @@ -439,6 +430,8 @@
<Settings />
<Changelog />
<LessonInspect />
<DayInspect />
<div id="page-container">
<main>
Expand Down Expand Up @@ -472,7 +465,7 @@
inputClasses="datepicker-input"
bind:value={date}
/>
{#if available_plan_version}
{#if available_plan_version && $current_page.startsWith("plan")}
<div class="plan-status" transition:fade|local={{duration: 200}}>
{#if available_plan_version === "default_plan"}
<span class="material-symbols-outlined" style="color: #dbae00">warning</span>
Expand Down Expand Up @@ -507,13 +500,9 @@
</div>
</div>
{#if $current_page.substring(0, 4) === "plan"}
<Plan bind:api_base bind:school_num bind:date bind:plan_type bind:plan_value bind:all_rooms bind:meta bind:selected_revision bind:enabled_dates bind:free_days bind:available_plan_version external_times={$settings.external_times} />
<Plan bind:school_num bind:date bind:plan_type bind:plan_value bind:all_rooms bind:meta revision_arr={revision_arr} bind:enabled_dates bind:free_days bind:available_plan_version external_times={$settings.external_times} />
{:else}
<Weekplan bind:api_base bind:week_start={date} bind:plan_type bind:plan_value />
{/if}
<!-- Select Revision (Plan Version) -->
{#if $settings.show_revision_selector}
<Select data={revision_arr} bind:selected_id={selected_revision} data_name="Revisions">Zeitstempel des Planuploads auswählen</Select>
<Weekplan bind:school_num bind:date bind:plan_type bind:plan_value bind:all_rooms bind:meta bind:enabled_dates bind:free_days />
{/if}
{:else if $current_page === "school_manager"}
<SchoolManager bind:school_num bind:date bind:plan_type bind:plan_value />
Expand Down
120 changes: 61 additions & 59 deletions client/src/base_components/Modal.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,69 +46,71 @@
</dialog>

<style lang="scss">
dialog {
transition: all .3s ease;
display: flex;
flex-direction: column;
position: fixed;
top: 50%;
left: calc(50% + (100vw - 100%) / 2);
transform: translate(-50%, calc(-50% - 20px));
margin: 0;
opacity: 0;
visibility: hidden;
padding: 0;
pointer-events: none;
border: none;
border-radius: 5px;
background: var(--background);
color: var(--text-color);
overflow-y: hidden;
min-height: 50vh;
max-height: calc((100% - 6px) - 2em);
max-width: calc(100% - 6px - 2em);
width: clamp(700px, 60vw, 1400px);
z-index: 9999;
dialog {
transition: all .3s ease;
display: flex;
flex-direction: column;
position: fixed;
top: 50%;
left: calc(50% + (100vw - 100%) / 2);
transform: translate(-50%, calc(-50% - 20px));
margin: 0;
opacity: 0;
visibility: hidden;
padding: 0;
pointer-events: none;
border: none;
border-radius: 5px;
background: var(--background);
color: var(--text-color);
overflow-y: hidden;
min-height: 50vh;
max-height: calc((100% - 6px) - 2em);
max-width: calc(100% - 6px - 2em);
width: clamp(700px, 60vw, 1400px);
z-index: 9999;
&.full_height {
height: calc((100% - 6px) - 2em);
}
.content-scroll {
overflow-y: auto;
padding: 20px;
max-height: calc((100% - 46px) - 2em);
flex: 1;
}
&::before {
content: "";
position: absolute;
inset: 0;
background-color: rgba(255, 255, 255, 0.08);
z-index: -1;
pointer-events: none;
}
}
dialog[open] {
transform: translate(-50%, -50%);
opacity: 1;
visibility: visible;
pointer-events: all;
}
dialog::backdrop {
background-color: rgba(0, 0, 0, 0.5);
&.full_height {
height: calc((100% - 6px) - 2em);
}
.footer {
display: flex;
flex-direction: row;
justify-content: flex-end;
.content-scroll {
overflow-y: auto;
padding: 20px;
@media only screen and (max-width: 900px) {
padding: 10px;
background: rgba(255, 255, 255, 0.05);
border-top: 1px solid rgba(255, 255, 255, 0.2);
}
max-height: calc((100% - 46px) - 2em);
flex: 1;
}
&::before {
content: "";
position: absolute;
inset: 0;
background-color: rgba(255, 255, 255, 0.08);
z-index: -1;
pointer-events: none;
}
}
dialog[open] {
transform: translate(-50%, -50%);
opacity: 1;
visibility: visible;
pointer-events: all;
}
dialog::backdrop {
background-color: rgba(0, 0, 0, 0.5);
}
.footer {
display: flex;
flex-direction: row;
justify-content: flex-end;
padding: 10px;
background: rgba(255, 255, 255, 0.05);
border-top: 1px solid rgba(255, 255, 255, 0.2);
}
</style>
4 changes: 2 additions & 2 deletions client/src/components/Contact.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
import {notifications} from "../notifications.js";
import Select from "../base_components/Select.svelte";
import { onMount } from "svelte";
import { title } from "../stores.js";
import {settings, title} from "../stores.js";
import Button from "../base_components/Button.svelte";
let category = "bug";
Expand All @@ -23,7 +23,7 @@
})
.then(data => {
notifications.success("Nachricht übermittelt");
navigate_page("plan");
navigate_page($settings.weekplan_default ? "weekplan" : "plan");
})
.catch(error => {
notifications.danger(error.message);
Expand Down
21 changes: 17 additions & 4 deletions client/src/components/Navbar.svelte
View file
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
<script>
import {notifications} from '../notifications.js';
import {logged_in, active_modal, new_changelogs_available} from '../stores.js';
import {logged_in, active_modal, new_changelogs_available, current_page} from '../stores.js';
import Dropdown from '../base_components/Dropdown.svelte';
import { fly } from 'svelte/transition';
import {customFetch, navigate_page} from "../utils.js";
import {selected_favorite, favorites} from "../stores.js";
import {selected_favorite, favorites, settings} from "../stores.js";
function logout() {
customFetch('/auth/logout')
Expand All @@ -25,18 +25,31 @@
</script>

<nav transition:fly={{y:-64}}>
<button class="logo-button" on:click={() => {navigate_page("plan"); selected_favorite.set(-1)}}>
<button class="logo-button" on:click={() => {navigate_page($settings.weekplan_default ? "weekplan" : "plan"); selected_favorite.set(-1)}}>
<img class="logo" src="/public/base_static/images/better_vp_white.svg" alt="Better VPlan Logo">
</button>
<ul class="nav-element-wrapper">
<li><button on:click={() => {
navigate_page(
($current_page.startsWith("weekplan") || $current_page.startsWith("plan")) ?
($current_page.startsWith("weekplan") ? "plan" : "weekplan") :
($settings.weekplan_default ? "weekplan" : "plan"))}
} class="nav-button"><span class="material-symbols-outlined">{
($current_page.startsWith("weekplan") || $current_page.startsWith("plan")) ?
($current_page.startsWith("weekplan") ? "calendar_view_day" : "calendar_view_week") :
($settings.weekplan_default ? "calendar_view_week" : "calendar_view_day")
}</span></button></li>
<li><button on:click={() => {navigate_page("about_us")}} class="nav-button">Über uns</button></li>
<li>
<Dropdown>
<button slot="toggle_button" let:toggle on:click={toggle} class="nav-button">
<span class="material-symbols-outlined" class:favorite-selected={$selected_favorite !== -1}>star</span>
</button>
{#each $favorites as favorite, index}
<button class="nav-button" on:click={() => {selected_favorite.set(index); navigate_page("plan")}}>
<button class="nav-button" on:click={() => {
selected_favorite.set(index);
if(!$current_page.startsWith("weekplan")) navigate_page("plan");
}}>
<span class="material-symbols-outlined" class:favorite-selected={$selected_favorite === index}>{favorite_icon_map[favorite.plan_type]}</span>
{favorite.name}</button>
{/each}
Expand Down
8 changes: 4 additions & 4 deletions client/src/components/PWAInstallHelper.svelte
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<script>
import { onMount } from "svelte";
import { pwa_prompt, title } from "../stores";
import { pwa_prompt, title, settings } from "../stores";
import { notifications } from "../notifications";
import {navigate_page, update_hash} from "../utils";
import Button from "../base_components/Button.svelte";
Expand All @@ -11,7 +11,7 @@
$pwa_prompt = null;
if(outcome === "accepted") {
notifications.success("App erfolgreich installiert!");
navigate_page('plan');
navigate_page($settings.weekplan_default ? "weekplan" : "plan");
} else if (outcome === "dismissed") {
notifications.danger("App konnte nicht installiert werden.");
}
Expand All @@ -30,7 +30,7 @@
Um <b>online</b> und <b>offline</b> schnell an deinen Stundenplan zu kommen, lade die Website als <b>App</b> herunter:
</span>
<Button on:click={try_install} id="pwa-install-btn" background="var(--accent-color)">Installieren <span class="material-symbols-outlined">install_mobile</span></Button>
<button class="skip-btn" on:click={() => {navigate_page('plan')}}>Weiter</button>
<button class="skip-btn" on:click={() => {navigate_page($settings.weekplan_default ? "weekplan" : "plan")}}>Weiter</button>
{:else}
<span class="responsive-text">
Um <b>online</b> und <b>offline</b> schnell an deinen Stundenplan zu kommen, lade die Website als <b>App</b> herunter:<br><br>
Expand All @@ -49,7 +49,7 @@
<li>Klicke in der Suchleiste (rechts) auf <div class="custom-badge">Better VPlan installieren <span class="material-symbols-outlined">install_desktop</span></div></li>
</ul>
</span>
<Button on:click={() => {navigate_page('plan')}} background="var(--accent-color)" id="pwa-continue-btn">Weiter <span class="material-symbols-outlined">chevron_right</span></Button>
<Button on:click={() => {navigate_page($settings.weekplan_default ? "weekplan" : "plan")}} background="var(--accent-color)" id="pwa-continue-btn">Weiter <span class="material-symbols-outlined">chevron_right</span></Button>
{/if}
</main>

Expand Down
Loading

0 comments on commit 4b3e2c7

Please sign in to comment.