This commit is contained in:
relaxed 2024-08-25 12:07:03 +05:00
commit b8e463b000
31 changed files with 2230 additions and 0 deletions

557
src/App.svelte Normal file
View file

@ -0,0 +1,557 @@
<script>
import ThemeSwitch from "./lib/ThemeSwitch.svelte";
import Dialog from "./lib/Dialog.svelte";
import Pair from "./lib/Pair.svelte";
import Spinner from "./lib/Spinner.svelte";
import Cache from "./lib/Cache.svelte";
import Checked from "./lib/Checked.svelte";
import X from "./lib/X.svelte";
import { onMount } from "svelte";
const host = "https://rasp.ogkod.ru";
let start_date = new Date();
const day = start_date.getDay();
const diff = (day === 0 ? -6 : 1) - day;
start_date.setDate(start_date.getDate() + diff);
start_date.setHours(0, 0, 0, 0);
start_date = start_date;
let end_date = new Date();
end_date.setDate(start_date.getDate() + 6);
end_date.setHours(23, 59, 59, 999);
/** @typedef GroupInfo
* @property {string} name
* @property {'group' | 'teacher' | 'aud'} type
*/
/**
* @property {number} selected
* @property {Object} saved
*/
let data = {
/** @type {number} */
selected: 0,
/** @type {Array<GroupInfo>} */
saved: [],
};
function save_to_ls() {
data = data;
localStorage.setItem("data", JSON.stringify(data));
get_rasp();
}
function empty_rasp() {
const empty_rasp = [];
for (let i = 0; i < 7; i++) {
empty_rasp.push({
date: "dd.mm.yyyy",
weekDay: "dayofweek",
isCurrentDate: 1,
pairs: [
{
N: 0,
time: "infinity",
isCurrentPair: 0,
schedulePairs: [],
},
],
});
}
return empty_rasp;
}
function scroll_to_today() {
if (rasp_data.some((day) => day.isCurrentDate === 1)) {
setTimeout(() => {
const today = new Date();
const today_index = `${(today.getDay() + 6) % 7}`;
document.getElementById(today_index).scrollIntoView();
}, 0);
}
}
function get_rasp() {
const startDate = `${start_date.getDate()}.${start_date.getMonth() + 1}.${start_date.getFullYear()}`;
end_date = new Date(start_date);
end_date.setDate(start_date.getDate() + 6);
end_date.setHours(23, 59, 59, 999);
const endDate = `${end_date.getDate()}.${end_date.getMonth() + 1}.${end_date.getFullYear()}`;
const date_full = `${startDate}-${endDate}`;
is_rasp_data_loading = true;
is_rasp_cache_loaded = false;
is_rasp_data_loaded = false;
console.log(
"some",
!is_rasp_data_loading &&
!is_rasp_cache_loaded &&
!is_rasp_data_loaded,
);
let cache_data = {};
if (data.saved.length > 0) {
if (
localStorage.getItem(`${data.saved[data.selected].name}`) !==
null
) {
cache_data = JSON.parse(
localStorage.getItem(`${data.saved[data.selected].name}`),
);
if (date_full in cache_data) {
rasp_data = cache_data[date_full];
is_rasp_cache_loaded = true;
}
}
}
if (data.saved.length !== 0) {
fetch(
`${host}/schedule/?t=0.2&action=show&startDate=${startDate}&endDate=${endDate}&${data.saved[data.selected].type}=${data.saved[data.selected].name}`,
)
.then((response) => response.json())
.then((json) => {
if (json.length !== 0) {
cache_data[date_full] = json;
localStorage.setItem(
`${data.saved[data.selected].name}`,
JSON.stringify(cache_data),
);
rasp_data = json;
is_rasp_data_loaded = true;
is_rasp_cache_loaded = false;
} else {
is_rasp_data_loaded = false;
if (!is_rasp_cache_loaded) {
rasp_data = empty_rasp();
}
}
scroll_to_today();
is_rasp_data_loading = false;
})
.catch(() => {
is_rasp_data_loaded = false;
if (!is_rasp_cache_loaded) {
rasp_data = empty_rasp();
}
scroll_to_today();
is_rasp_data_loading = false;
});
// setTimeout(() => {
// is_rasp_data_loaded = true;
// is_rasp_data_loading = false;
// rasp_data = example;
// scroll_to_today();
// }, 1000);
}
}
let is_rasp_data_loading = false;
let is_rasp_data_loaded = false;
let is_rasp_cache_loaded = false;
let is_settings_open = false;
/** @type {"group-list" | "teacher-list" | "aud-list"} */
let search_type = "group-list";
let search_value = "";
let rasp_data = [];
let search_data = [];
function search_group() {
if (search_value != "") {
fetch(
`${host}/schedule/?action=${search_type}&term=${search_value}`,
)
.then((response) => response.json())
.then((json) => {
search_data = json;
})
.catch(() => {
search_data = ["not found"];
});
}
}
$: input_date = `${start_date.getDate()}.${start_date.getMonth() + 1}.${start_date.getFullYear()} - ${end_date.getDate()}.${end_date.getMonth() + 1}.${end_date.getFullYear()}`;
onMount(() => {
if (localStorage.getItem("data") === null) {
} else {
data = JSON.parse(localStorage.getItem("data"));
}
get_rasp();
});
let is_confirm_open = false;
let confirm_question = "__default__";
let on_confirm = () => {};
</script>
<Dialog name={"Rasp"} bind:is_open={is_settings_open}>
<h1 class="mx-2">Сохраненные</h1>
<div
class="min-h-[270px] m-2
overflow-y-auto
border-[1px] border-[var(--w-border)] dark:border-[var(--b-border)]"
>
{#each data.saved as info, i}
<div
class="p-2
flex justify-between items-center
{i === data.saved.length - 1 ? '' : 'border-b-2'}
border-[var(--w-border)] dark:border-[var(--b-border)]"
>
<p>{info.name}</p>
<button
on:click={() => {
data.saved.splice(i, 1);
data.selected = 0;
save_to_ls();
}}
>
<img
src="/x.svg"
class="min-w-[40px] min-h-[40px] size-[40px] transition-all
border-2 border-[var(--w-red)] dark:border-[var(--b-red)]"
alt="data not loaded"
/>
</button>
</div>
{/each}
</div>
<h1 class="mx-2 mt-10">Добавить</h1>
<select
class="min-h-[60px] p-2 m-2 w-atuo
bg-[var(--w-bg)] dark:bg-[var(--b-bg)]
border-[1px] border-[var(--w-border)] dark:border-[var(--b-border)]"
on:change={(event) => {
search_type = event.target.value;
search_value = "";
search_data = [];
}}
>
<option selected value="group-list">Группа</option>
<option value="teacher-list">Преподаватель</option>
<option value="aud-list">Аудитория</option>
</select>
<input
type="text"
placeholder="{{
'group-list': 'Группа',
'teacher-list': 'Преподователь',
'aud-list': 'Аудитория',
}[search_type]} "
class="p-2 m-2
bg-[var(--w-bg)] dark:bg-[var(--b-bg)]
border-[1px] border-[var(--w-border)] dark:border-[var(--b-border)]"
bind:value={search_value}
on:input={() => {
const saved = search_value;
setTimeout(() => {
if (saved === search_value) {
search_group();
}
}, 1000);
}}
/>
<div
class="min-h-[270px] m-2
overflow-y-auto
border-[1px] border-[var(--w-border)] dark:border-[var(--b-border)]"
>
{#each search_data as item, i}
<div
class="p-2
flex justify-between items-center
{i === search_data.length - 1 ? '' : 'border-b-2'}
border-[var(--w-border)] dark:border-[var(--b-border)]"
>
{#if search_type === "teacher-list"}
<p>{item.label}</p>
{:else}
<p>{item}</p>
{/if}
<button
class="min-w-[40px] min-h-[40px]
text-3xl text-[--w-green] dark:text-[var(--b-green)]
border-[1px] border-[var(--w-green)] dark:border-[var(--b-green)]"
on:click={() => {
if (item === "not found") {
return;
}
data.saved.push({
type: {
"group-list": "group",
"teacher-list": "teacher",
"aud-list": "aud",
}[search_type],
name:
search_type === "teacher-list"
? item.label
: item,
});
search_value = "";
search_data = [];
data.selected = data.saved.length - 1;
save_to_ls();
get_rasp();
is_settings_open = false;
}}
>
+
</button>
</div>
{/each}
</div>
<button
class="w-auto p-2 m-2
bg-[var(--w-red)] dark:bg-[var(--b-red)]
border-[1px] border-[var(--w-border)] dark:border-[var(--b-border)]"
on:click={() => {
localStorage.clear();
save_to_ls();
is_settings_open = false;
get_rasp();
}}
>
Очистить Кэш
</button>
<button
class="w-auto p-2 m-2
bg-[var(--w-red)] dark:bg-[var(--b-red)]
border-[1px] border-[var(--w-border)] dark:border-[var(--b-border)]"
on:click={() => {
is_confirm_open = true;
confirm_question = "Действительно удалить сохраненные расписания?";
on_confirm = () => {
localStorage.clear();
is_settings_open = false;
is_confirm_open = false;
window.location.reload();
};
}}
>
Удалить все данные
</button>
<div class="">
<pre
class="w-min m-2 break-words flex justify-center items-center"><Spinner
></Spinner> - Загрузка</pre>
<div
class="w-auto m-2 space-x-2 break-words flex justify-start items-center"
>
<Cache></Cache>
<p>- Показывает последние сохраненные данные</p>
</div>
<div
class="w-auto m-2 space-x-2 break-words flex justify-start items-center"
>
<X></X>
<p>- Данные не загрузились</p>
</div>
<div
class="w-auto m-2 space-x-2 break-words flex justify-start items-center"
>
<Checked></Checked>
<p>- Покавзывает актуальные данные</p>
</div>
</div>
<div
class="min-h-[100px] m-2 w-auto bg-gray-700 flex justify-center items-center"
>
<a href="https://ogkod.ru" class="underline text-white">
Made by OGkod
</a>
</div>
</Dialog>
<div class="w-full flex justify-center items-center">
<div
class="w-[2120px] h-svh
text-[var(--w-text)] dark:text-[var(--b-text)] transition-all
flex relative"
>
<div
class="top-0 left-0 w-full h-full p-2
flex flex-col absolute"
>
<div class="flex justify-between items-center">
<button
class="text-3xl w-min m-2"
on:click={() => {
is_settings_open = true;
}}>Настройки</button
>
<div class="flex justify-center items-center space-x-4">
{#if is_rasp_data_loading}
<Spinner></Spinner>
{/if}
{#if is_rasp_cache_loaded}
<Cache></Cache>
{/if}
{#if is_rasp_data_loaded}
<Checked></Checked>
{/if}
{#if !is_rasp_data_loaded && !is_rasp_cache_loaded && !is_rasp_data_loading}
<X></X>
{/if}
<ThemeSwitch></ThemeSwitch>
</div>
</div>
<div class="relative flex justify-start items-center">
<input
type="date"
name="date_input"
id="date_input"
class="bg-black text-white absolute top-0 invisible"
on:change={(event) => {
start_date = new Date(event.target.value);
get_rasp();
}}
/>
<button
class="m-2 p-2 w-auto h-[40px] flex-initial
bg-[var(--w-bbg)] dark:bg-[var(--w-bbg)]
border-[1px] border-[var(--w-border)] dark:border-[var(--b-border)]"
on:click={() => {
document.getElementById("date_input").showPicker();
}}
>
<pre>{input_date}</pre>
</button>
<select
class="h-[40px] p-2 m-2 flex-auto w-full max-w-[280px]
bg-[var(--w-bg)] dark:bg-[var(--b-bg)]
border-[1px] border-[var(--w-border)] dark:border-[var(--b-border)]"
on:change={(event) => {
data.selected = Number(event.target.value);
save_to_ls();
get_rasp();
}}
>
{#each data.saved as group, i}
{#if data.selected === i}
<option selected value={i}>
{group.name}
</option>
{:else}
<option value={i}>{group.name}</option>
{/if}
{/each}
</select>
</div>
<div class="flex overflow-x-auto overflow-y-hidden text-[16px]">
{#if rasp_data.length === 0 && data.saved.length === 0}
<p
class="break-words h-auto
text-2xl text-[var(--w-text)] dark:text-[var(--b-text)]"
>
У вас нету сохраненных расписаний, добавтье их в <button
class="underline"
on:click={() => {
is_settings_open = true;
}}>настройках</button
>
</p>
{:else}
{#each rasp_data as day, i}
<div id={`${i}`} class="p-2 min-w-[300px]">
<div
class="flex p-2 mb-2
border-[1px] border-[var(--w-border)] dark:border-[var(--b-border)]
text-[var(--w-text)] dark:text-[var(--b-text)]
{day.isCurrentDate === 1 ? 'bg-[var(--w-red)] dark:bg-[var(--b-red)]' : ''}"
>
<h1>
<pre>{day.date} - {day.weekDay}</pre>
</h1>
</div>
<div class="relative z-0 h-[calc(100svh-192px)]">
<div
class="h-full w-full z-0 absolute overflow-y-auto overflow-x-hidden
flex flex-col justify-start items-center
"
>
{#if day.pairs.every((p) => p.schedulePairs.length === 0)}
<div
class="w-full p-2
border-[1px] rounded-[8px] border-[var(--w-border)] dark:border-[var(--b-border)]
"
>
{#if !is_rasp_data_loading && !is_rasp_cache_loaded && !is_rasp_data_loaded}
Ошибка получения данных
попробуйте позже
{:else if is_rasp_data_loading}
Загрузка ....
{:else if is_rasp_data_loaded || is_rasp_cache_loaded}
have a good day
{/if}
</div>
{:else}
{#each day.pairs as pairs}
<Pair {pairs}></Pair>
{/each}
{/if}
</div>
</div>
</div>
{/each}
{/if}
</div>
</div>
</div>
</div>
<Dialog
name={confirm_question}
bind:is_open={is_confirm_open}
class_name="h-[220px]"
>
<button
on:click={on_confirm}
class="w-auto py-1 m-2
flex justify-center items-center
text-[var(--w-text)] dark:text-[var(--b-text)]
transition-all duration-300
bg-[var(--w-red)] dark:bg-[var(--b-red)]
border-2 border-[var(--border)] rounded-xl"
>
Да
</button>
<button
on:click={on_confirm}
class="w-auto py-1 m-2
flex justify-center items-center
text-[var(--w-text)] dark:text-[var(--b-text)]
transition-all duration-300
bg-[var(--w-green)] dark:bg-green-700
border-2 border-[var(--border)] rounded-xl"
>
Нет
</button>
</Dialog>

1080
src/example.json Normal file

File diff suppressed because it is too large Load diff

52
src/global.css Normal file
View file

@ -0,0 +1,52 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
@font-face {
font-family: JetBrainsMono;
src: url(/jbmv.ttf);
}
* {
-webkit-tap-highlight-color: transparent;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
outline: none !important;
font-family: JetBrainsMono;
/* white theme */
--w-bg: #ddd;
--w-text: #000;
--w-border: #000;
--w-red: #fcc;
--w-green: #0f0;
--w-blue: #ccf;
--w-orange: #f80;
/* dark theme */
--b-bg: black;
--b-text: white;
--b-border: white;
--b-red: #800;
--b-green: #080;
--b-blue: #000066;
--b-orange: #f80;
}
*::-webkit-scrollbar,
*::-webkit-scrollbar-thumb {
width: 0px;
border-radius: 0px;
background-clip: padding-box;
border: 0px solid transparent;
position: absolute;
}

9
src/lib/Cache.svelte Normal file
View file

@ -0,0 +1,9 @@
<div
class="size-[40px] min-w-[40px]
border-2 border-[var(--w-orange)] dark:border-[var(--b-orange)]
bg-gray-800
flex justify-center items-center
text-4xl text-[var(--w-orange)] dark:text-[var(--b-orange)]"
>
C
</div>

7
src/lib/Checked.svelte Normal file
View file

@ -0,0 +1,7 @@
<div class="w-[40px] bg-gray-800">
<img
src="/check.svg"
class="size-[40px] min-w-[40px] border-2 border-[var(--w-green)] dark:border-[var(--b-green)]"
alt="data loaded"
/>
</div>

50
src/lib/Dialog.svelte Normal file
View file

@ -0,0 +1,50 @@
<script>
export let is_open = false;
export let name_editable = false;
export let name = "";
export let class_name = "";
export let on_close = () => {};
</script>
<div
class="absolute top-0 w-full h-screen z-10
max-w-full max-h-full
flex justify-center items-center
backdrop-blur-sm
bg-[#00000022]
{is_open ? 'opacity-100 visible' : 'invisible opacity-0'}
transition-all duration-300"
>
<div
class="size-[700px] mx-4 flex flex-col
border-[var(--w-border)] dark:border-[var(--b-border)] border-2 rounded-xl
bg-[var(--w-bg)] dark:bg-[var(--b-bg)]
text-[var(--w-text)] dark:text-[var(--b-text)] text-2xl
overflow-y-auto
{class_name}"
>
<div
class="ml-2 relative flex flex-initial justify-between items-center"
>
{#if name_editable}
<input
type="text"
bind:value={name}
class="bg-[var(--bg)] w-full focus-visible:outline-none"
/>
{:else}
<p class="bg-[var(--bg)] w-full focus-visible:outline-none">
{name}
</p>
{/if}
<button
on:click={() => {
is_open = false;
on_close();
}}
class="size-[60px] m-2 text-[40px] pb-3">x</button
>
</div>
<slot></slot>
</div>
</div>

76
src/lib/Pair.svelte Normal file
View file

@ -0,0 +1,76 @@
<script>
export let pairs;
</script>
{#if pairs.schedulePairs.length === 1}
<div
class="w-auto m-2
border-[1px] rounded-xl border-[var(--w-border)] dark:border-[var(--b-border)]
{pairs.isCurrentPair ? 'bg-[var(--w-blue)] dark:bg-[var(--b-blue)]' : ''}
"
>
<div
class="border-b-[1px] border-[var(--w-border)] dark:border-[var(--b-border)]"
>
<h1 class="m-2 mb-1">
{pairs.N}) {pairs.time.replace("-", " - ")}
</h1>
</div>
<div class="p-2">
<h1>
{pairs.schedulePairs[0].subject}
</h1>
<h1>
aud: {pairs.schedulePairs[0].aud}
</h1>
<a
target="_blank"
href="https://www.usue.ru/raspisanie/getteams/?prepod={pairs
.schedulePairs[0].teacher}"
class="underline"
>
{pairs.schedulePairs[0].teacher}
</a>
<h1>
{pairs.schedulePairs[0].group}
</h1>
</div>
</div>
{:else if pairs.schedulePairs.length > 1}
{@const end_index = pairs.schedulePairs.length - 1}
<div
class="w-full m-2
border-[1px] rounded-xl border-[var(--w-border)] dark:border-[var(--b-border)]
{pairs.isCurrentPair ? 'bg-[var(--w-blue)] dark:bg-[var(--b-blue)]' : ''}
"
>
<div class="border-b-2 border-[var(--border)]">
<h1 class="m-2 mb-1">
{pairs.N}) {pairs.time.replace("-", " - ")}
</h1>
</div>
{#each pairs.schedulePairs as pair, i}
<div
class="p-2
{i === end_index ? '' : 'border-b-[1px] border-[var(--border)]'}"
>
<h1>
{pair.subject}
</h1>
<h1>
aud: {pair.aud}
</h1>
<a
target="_blank"
href="https://www.usue.ru/raspisanie/getteams/?prepod={pair.teacher}"
class="underline"
>
{pair.teacher}
</a>
<h1>
{pair.group}
</h1>
</div>
{/each}
</div>
{/if}

6
src/lib/Spinner.svelte Normal file
View file

@ -0,0 +1,6 @@
<span
class="size-[40px] min-w-[40px]
border-[5px] border-[var(--w-border)] dark:border-[var(--b-border)] rounded-[50%]
inline-block box-border animate-spin"
style="border-bottom-color: transparent;"
></span>

58
src/lib/ThemeSwitch.svelte Executable file
View file

@ -0,0 +1,58 @@
<script>
import { onMount } from "svelte";
let is_resize = false;
let is_transparent = false;
let is_dark = true;
function handleSwitchDarkMode() {
setTimeout(() => {
is_transparent = true;
is_dark = !is_dark;
setTimeout(() => {
is_resize = false;
is_transparent = false;
}, 250);
}, 500);
is_resize = true;
const isDark = window.document.documentElement.classList.toggle("dark");
if (isDark) {
localStorage.setItem("color-theme", "dark");
} else {
localStorage.setItem("color-theme", "light");
}
}
onMount(() => {
if (localStorage.getItem("color-theme") === "light") {
is_dark = false;
}
});
</script>
<div class=" min-w-[40px] min-h-[40px] flex justify-center items-center">
<!-- svelte-ignore a11y-click-events-have-key-events -->
<!-- svelte-ignore a11y-no-static-element-interactions -->
<div
class="group h-[50px] w-[50px] rounded-full flex justify-center items-center
{is_dark ? 'bg-[var(--w-bg)]' : 'bg-[var(--b-bg)]'}
"
on:click={handleSwitchDarkMode}
>
<div
class=" rounded-full
{!is_transparent
? is_dark
? 'group-hover:bg-[var(--b-bg)] dark:group-hover:bg-[var(--b-bg)]'
: 'group-hover:bg-[var(--w-bg)] dark:group-hover:bg-[var(--w-bg)]'
: ''}
{!is_transparent
? is_resize
? 'h-[50px] w-[50px]'
: 'h-[25px] w-[25px]'
: 'h-[25px] w-[25px]'}
transition-all duration-500 ease-in-out"
></div>
</div>
</div>

7
src/lib/X.svelte Normal file
View file

@ -0,0 +1,7 @@
<div class="w-[40px] bg-gray-800">
<img
src="/x.svg"
class="size-[40px] min-w-[40px] border-2 border-[var(--b-red)]"
alt="data not loaded"
/>
</div>

8
src/main.js Normal file
View file

@ -0,0 +1,8 @@
import './global.css'
import App from './App.svelte'
const app = new App({
target: document.getElementById('app'),
})
export default app

2
src/vite-env.d.ts vendored Normal file
View file

@ -0,0 +1,2 @@
/// <reference types="svelte" />
/// <reference types="vite/client" />