Skip to content

S
student-helper
Commit e108b1df authored by Pavel Moiseenko's avatar Pavel Moiseenko
Browse files
Options

Upload files

parents
Hide whitespace changes
Inline Side-by-side
Showing with 1180 additions and 0 deletions
.gitignore 0 → 100644
View file @ e108b1df
.DS_Store
LICENSE 0 → 100644
View file @ e108b1df
MIT License
Copyright (c) 2022 Pavel Moiseenko
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
README.md 0 → 100644
View file @ e108b1df
# student-helper
Schedule, assignments, grades, etc. for a student of HSPU
css/style.css 0 → 100644
View file @ e108b1df
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500&display=swap");
body {
margin: 0;
width: 100%;
font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.btn {
all: unset;
cursor: pointer;
background-color: rgb(240, 240, 240);
text-align: center;
border-radius: 13px;
user-select: none;
transition: background-color 0.4s;
}
.btn:focus {
outline: rgb(200, 200, 200) 5px auto;
}
.btn:hover {
background-color: rgb(200, 200, 200);
}
.app {
display: flex;
height: 100vh;
}
.start-page {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 100%;
}
.start-page-title {
padding: 50px;
text-align: center;
font-size: 50px;
font-weight: bold;
}
.start-page-group {
padding: 25px;
}
#group-selector {
font-size: 17px;
}
.start-page-full-name {
padding: 35px;
}
#full_name_input {
width: 310px;
font-size: 17px;
text-transform: capitalize;
}
.start-page-ready-button {
padding: 20px 0;
margin: 25px 0;
width: 200px;
}
.tabs {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 30vw;
min-width: 150px;
}
.tabs * {
padding: 20px 0;
margin: 15px 0;
width: 70%;
}
.tabs > .active {
background-color: rgb(200, 200, 200);
}
.tabs *:hover {
background-color: rgb(200, 200, 200);
}
.content {
display: flex;
width: 100%;
}
.timetable {
display: flex;
align-items: center;
height: 100%;
width: 100%;
}
.calendar {
padding: 5%;
}
.calendar > .form-control {
width: 98%;
}
.shortcut-buttons-flatpickr-wrapper {
display: flex;
justify-content: center;
}
.lessons-list {
justify-content: center;
}
.lessons-list * {
height: 100%;
display: flex;
align-items: center;
width: max-content;
padding: 5px 0;
}
.time {
display: flex;
flex-direction: column;
padding: 15px 50px;
}
.start-time,
.time-divider,
.end-time {
padding: 1px 0;
text-align: center;
}
.about-subject {
display: flex;
padding: 10px;
width: max-content;
flex-direction: column;
}
.about-subject * {
padding: 8px;
}
.subject-name {
flex-basis: min-content;
font-weight: bold;
align-self: start;
}
.subject-type-and-teacher {
display: flex;
padding: 0;
align-self: start;
width: 100%;
font-size: 14px;
}
.subject-type {
min-width: 120px;
}
.address-or-distance {
align-self: start;
font-size: 14px;
}
.grade {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
width: 100%;
}
.semester-list-wrapper {
padding: 5% 0 5% 5%;
}
.semester-list {
font-size: 17px;
}
.grade-list {
padding: 5%;
width: 100%;
}
.grade-card {
display: flex;
padding: 15px 10px;
align-items: center;
justify-content: space-between;
}
.grade-subject-title {
font-weight: bold;
padding: 10px 30px;
}
.grade-date {
font-size: 14px;
padding: 10px 30px;
margin-left: auto;
}
.grade-mark {
padding: 10px 30px;
max-width: 80px;
min-width: 80px;
}
.grade-mark.five-or-credited {
color: rgb(94, 156, 32);
}
.grade-mark.four {
color: rgb(230, 194, 18);
}
.grade-mark.three {
color: rgb(238, 137, 37);
}
.grade-mark.two-or-uncredited {
color: rgb(238, 34, 3);
}
.settings {
display: flex;
align-items: center;
height: 100%;
padding-left: 10%;
}
.reset-button {
padding: 20px 0;
margin: 15px 0;
width: 90%;
}
/* mobile */
@media (max-width: 480px) {
.tabs {
position: fixed;
bottom: 0;
width: 100%;
height: 60px;
flex-direction: row;
}
.tabs * {
min-width: initial;
border-radius: 0;
width: 100%;
margin: 0;
}
.content {
width: 100%;
justify-content: center;
}
.timetable {
flex-direction: column;
}
.lessons-list {
width: 80%;
}
.lessons-list > div {
height: unset;
width: 100%;
margin: 2px 5px;
}
.time {
padding: 10px 2px;
}
.about-subject {
height: unset;
align-items: stretch;
flex-direction: column;
width: 100%;
}
.about-subject * {
padding: 6px 8px;
}
.subject-name {
max-width: 70%;
}
.grade {
flex-direction: column;
justify-content: unset;
}
.semester-list-wrapper {
margin-top: 10%;
}
.settings {
padding-left: 0;
}
.settings-list {
display: flex;
justify-content: center;
}
}
data/timetable.json 0 → 100644
View file @ e108b1df
{
"2022-06-07": [
{
"startTime": "9:40",
"endTime": "11:10",
"subjectName": "Информационные технологии и системы бизнес-аналитики",
"type": "Лабораторная",
"teacher": "Атаян Ануш Михайловна",
"distanceLearning": true,
"address": "Мойка 48, корп. 1, ауд. 308"
},
{
"startTime": "13:30",
"endTime": "15:00",
"subjectName": "Физическая культура и спорт (элективная дисциплина)",
"type": "Зачёт",
"teacher": "Головко Андрей Александрович",
"distanceLearning": true,
"address": "Мойка 48, корп. 4, ауд. 1"
},
{
"startTime": "15:10",
"endTime": "16:40",
"subjectName": "Визуализация данных и инфографика",
"type": "Лабораторная",
"teacher": "Иванова Екатерина Алексеевна",
"distanceLearning": true,
"address": "Мойка 48, корп. 1, ауд. 309"
}
],
"2022-06-08": [
{
"startTime": "9:40",
"endTime": "11:10",
"subjectName": "Информационные технологии и системы бизнес-аналитики",
"type": "Лабораторная",
"teacher": "Атаян Ануш Михайловна",
"distanceLearning": true,
"address": "Мойка 48, корп. 1, ауд. 308"
},
{
"startTime": "13:30",
"endTime": "15:00",
"subjectName": "Физическая культура и спорт (элективная дисциплина)",
"type": "Зачёт",
"teacher": "Головко Андрей Александрович",
"distanceLearning": true,
"address": "Мойка 48, корп. 4, ауд. 1"
},
{
"startTime": "15:10",
"endTime": "16:40",
"subjectName": "Визуализация данных и инфографика",
"type": "Лабораторная",
"teacher": "Иванова Екатерина Алексеевна",
"distanceLearning": true,
"address": "Мойка 48, корп. 1, ауд. 309"
}
]
}
index.html 0 → 100644
View file @ e108b1df
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Помощник студента</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/shortcut-buttons-flatpickr@0.1.0/dist/themes/light.min.css">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div class="app">
<div class="start-page">
<div class="start-page-title">
Выберите группу и введите ваше ФИО
</div>
<div class="start-page-group">
<select id="group-selector" name="start-page-group-selector">
<option value="ob_ivt18">Очный, бакалавриат, ИВТ, 2018 г. п.</option>
<option value="zb_ivt19">Заочный, бакалавриат, ИВТ, 2019 г. п.</option>
<option value="ob_icst20">Очный, бакалавриат, ИСиТ, 2020 г. п.</option>
</select>
</div>
<div class="start-page-full-name">
<input required type="text" id="full_name_input" name="full_name_input" placeholder="Фамилия Имя Отчество">
</div>
<button class="start-page-ready-button btn">
Готово
</button>
</div>
<div class="tabs">
<button class="timetable-tab btn">
Расписание
</button>
<button class="grade-tab btn">
Оценки
</button>
<button class="settings-tab btn">
Настройки
</button>
</div>
<div class="content">
<div class="timetable">
<div class="calendar">
<input id="calendar-picker" placeholder="Выберите дату" type="date">
</div>
<div class="lessons-list">
</div>
</div>
<div class="grade">
<div class="semester-list-wrapper">
<select id="semester-picker" class="semester-list" name="semester-list">
<option value="first-semester">1 семестр</option>
<option value="second-semester">2 семестр</option>
<option value="third-semester" selected="selected">3 семестр</option>
</select>
</div>
<div class="grade-list">
</div>
</div>
<div class="settings">
<div class="settings-list">
<button class="reset-button btn">
Сбросить группу и ФИО ученика
</button>
</div>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
<script src="https://npmcdn.com/flatpickr/dist/l10n/ru.js"></script>
<script src="https://cdn.jsdelivr.net/npm/shortcut-buttons-flatpickr@0.1.0/dist/shortcut-buttons-flatpickr.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>
js/script.js 0 → 100644
View file @ e108b1df
// flatpickr dependency
flatpickr("#calendar-picker", {
"locale": "ru",
inline: true,
altInput: true,
altFormat: "j F Y",
dateFormat: "Y-m-d",
plugins: [
ShortcutButtonsPlugin({
button: [
{
label: "Сегодня"
}
],
onClick: (index, fp) => {
let date = new Date();
fp.setDate(date);
}
})
]
});
// CSS
document.querySelector(".tabs").style.display = "none";
document.querySelector(".content").style.display = "none";
document.querySelector(".start-page-ready-button").onclick = function timetable_screen() {
document.querySelector(".timetable-tab").classList.add("active");
document.querySelector(".grade-tab").classList.remove("active");
document.querySelector(".settings-tab").classList.remove("active");
document.querySelector(".start-page").style.display = "none";
document.querySelector(".tabs").style.display = "flex";
document.querySelector(".content").style.display = "flex";
document.querySelector(".timetable").style.display = "flex";
document.querySelector(".grade").style.display = "none";
document.querySelector(".settings").style.display = "none";
}
document.querySelector(".timetable-tab").onclick = function active_timetable() {
document.querySelector(".timetable-tab").classList.add("active");
document.querySelector(".grade-tab").classList.remove("active");
document.querySelector(".settings-tab").classList.remove("active");
document.querySelector(".timetable").style.display = "flex";
document.querySelector(".grade").style.display = "none";
document.querySelector(".settings").style.display = "none";
}
document.querySelector(".grade-tab").onclick = function active_grade() {
document.querySelector(".grade-tab").classList.add("active");
document.querySelector(".timetable-tab").classList.remove("active");
document.querySelector(".settings-tab").classList.remove("active");
document.querySelector(".grade").style.display = "flex";
document.querySelector(".timetable").style.display = "none";
document.querySelector(".settings").style.display = "none";
}
document.querySelector(".settings-tab").onclick = function active_settings() {
document.querySelector(".settings-tab").classList.add("active");
document.querySelector(".timetable-tab").classList.remove("active");
document.querySelector(".grade-tab").classList.remove("active");
document.querySelector(".settings").style.display = "flex";
document.querySelector(".timetable").style.display = "none";
document.querySelector(".grade").style.display = "none";
}
document.querySelector(".reset-button").onclick = function reset_settings() {
document.querySelector(".tabs").style.display = "none";
document.querySelector(".content").style.display = "none";
document.querySelector(".start-page").style.display = "";
}
document.querySelector(".btn").setAttribute("role", "button");
document.querySelector(".btn").setAttribute("aria-pressed", "false");
document.querySelector(".btn").setAttribute("tabindex", "0");
// create lesson cards
// window.addEventListener("DOMContentLoaded", () => {
// function req() {
// fetch("http://127.0.0.1:5500/data/timetable.json")
// .then(data => data.json())
// .then(data => console.log(data))
// .then(data => createLessons(data))
// .catch(err => console.error(err));
// }
// function createLessons(response) {
// response.forEach(item => {
// let lesson-card = document.createElement("lesson-card");
// lesson-card.classList.add("lesson-card");
// card.innerHTML += `
// <div class="start-time">${item.startTime}</div>
// `;
// document.querySelector(".lessons-list").appendChild(lesson-card);
// });
// }
// req();
// });
// add test timetable data
function createTimetableFirst() {
let firstLesson = document.createElement("div");
firstLesson.classList.add("first-lesson");
firstLesson.innerHTML = `
<div class="time">
<div class="start-time">
9:40
</div>
<div class="time-divider">
—
</div>
<div class="end-time">
11:10
</div>
</div>
<div class="about-subject">
<div class="subject-name">
Информационные технологии и системы бизнес-аналитики
</div>
<div class="subject-type-and-teacher">
<div class="subject-type">
Лабораторная
</div>
<div class="subject-teacher">
Атаян Ануш Михайловна
</div>
</div>
<div class="address-or-distance">
Дистанционное обучение
</div>
</div>
`;
document.querySelector(".lessons-list").appendChild(firstLesson);
let secondLesson = document.createElement("div");
secondLesson.classList.add("second-lesson");
secondLesson.innerHTML = `
<div class="time">
<div class="start-time">
13:30
</div>
<div class="time-divider">
—
</div>
<div class="end-time">
15:00
</div>
</div>
<div class="about-subject">
<div class="subject-name">
Физическая культура и спорт (элективная дисциплина)
</div>
<div class="subject-type-and-teacher">
<div class="subject-type">
Практическая
</div>
<div class="subject-teacher">
Головко Андрей Александрович
</div>
</div>
<div class="address-or-distance">
Мойка 48, корп. 4, ауд. 1
</div>
</div>
`;
document.querySelector(".lessons-list").appendChild(secondLesson);
}
function createTimetableSecond() {
let firstLesson = document.createElement("div");
firstLesson.classList.add("first-lesson");
firstLesson.innerHTML = `
<div class="time">
<div class="start-time">
11:20
</div>
<div class="time-divider">
—
</div>
<div class="end-time">
12:50
</div>
</div>
<div class="about-subject">
<div class="subject-name">
Программирование
</div>
<div class="subject-type-and-teacher">
<div class="subject-type">
Лекция
</div>
<div class="subject-teacher">
Жуков Николай Николаевич
</div>
</div>
<div class="address-or-distance">
Дистанционное обучение
</div>
</div>
`;
document.querySelector(".lessons-list").appendChild(firstLesson);
let secondLesson = document.createElement("div");
secondLesson.classList.add("second-lesson");
secondLesson.innerHTML = `
<div class="time">
<div class="start-time">
13:30
</div>
<div class="time-divider">
—
</div>
<div class="end-time">
15:00
</div>
</div>
<div class="about-subject">
<div class="subject-name">
Основы корпоративного электронного обучения
</div>
<div class="subject-type-and-teacher">
<div class="subject-type">
Практическая
</div>
<div class="subject-teacher">
Власова Елена Зотиковна
</div>
</div>
<div class="address-or-distance">
Мойка 48, корп. 1, ауд. 335
</div>
</div>
`;
document.querySelector(".lessons-list").appendChild(secondLesson);
let thirdLesson = document.createElement("div");
thirdLesson.classList.add("third-lesson");
thirdLesson.innerHTML = `
<div class="time">
<div class="start-time">
15:10
</div>
<div class="time-divider">
—
</div>
<div class="end-time">
16:40
</div>
</div>
<div class="about-subject">
<div class="subject-name">
Электроника
</div>
<div class="subject-type-and-teacher">
<div class="subject-type">
Лекция
</div>
<div class="subject-teacher">
Жаркой Александр Борисович
</div>
</div>
<div class="address-or-distance">
Мойка 48, корп. 1, ауд. 237
</div>
</div>
`;
document.querySelector(".lessons-list").appendChild(thirdLesson);
}
function createTimetableThird() {
let firstLesson = document.createElement("div");
firstLesson.classList.add("first-lesson");
firstLesson.innerHTML = `
<div class="time">
<div class="start-time">
16:50
</div>
<div class="time-divider">
—
</div>
<div class="end-time">
18:20
</div>
</div>
<div class="about-subject">
<div class="subject-name">
Основы электронного управления
</div>
<div class="subject-type-and-teacher">
<div class="subject-type">
Лабораторная
</div>
<div class="subject-teacher">
Иванова Екатерина Алексеевна
</div>
</div>
<div class="address-or-distance">
Дистанционное обучение
</div>
</div>
`;
document.querySelector(".lessons-list").appendChild(firstLesson);
}
function clearTimetable() {
document.querySelectorAll(".first-lesson").forEach(e => e.remove());
document.querySelectorAll(".second-lesson").forEach(e => e.remove());
document.querySelectorAll(".third-lesson").forEach(e => e.remove());
}
firstDataArray = ["2022-06-02", "2022-06-06", "2022-06-09", "2022-06-13", "2022-06-16", "2022-06-20", "2022-06-23", "2022-06-27", "2022-06-30"]
secondDataArray = ["2022-06-03", "2022-06-07", "2022-06-10", "2022-06-14", "2022-06-17", "2022-06-21", "2022-06-24", "2022-06-28"]
thirdDataArray = ["2022-06-01", "2022-06-04", "2022-06-08", "2022-06-11", "2022-06-15", "2022-06-18", "2022-06-22", "2022-06-25", "2022-06-29"]
weekendDataArray = ["2022-06-05", "2022-06-12", "2022-06-18", "2022-06-19", "2022-06-26"]
let pickedDate = document.querySelector("#calendar-picker");
let todayDate = new Date().toISOString().slice(0,10);
pickedDate.value = todayDate;
document.querySelector(".form-control").value = todayDate;
if (firstDataArray.includes(pickedDate.value)) {
clearTimetable();
createTimetableFirst();
}
else if (secondDataArray.includes(pickedDate.value)) {
clearTimetable();
createTimetableSecond();
}
else if (thirdDataArray.includes(pickedDate.value)) {
clearTimetable();
createTimetableThird();
}
else if (weekendDataArray.includes(pickedDate.value)) {
clearTimetable();
createTimetableWeekend();
}
pickedDate.addEventListener("change", (e) => {
if (firstDataArray.includes(e.target.value)) {
clearTimetable();
createTimetableFirst();
}
else if (secondDataArray.includes(e.target.value)) {
clearTimetable();
createTimetableSecond();
}
else if (thirdDataArray.includes(e.target.value)) {
clearTimetable();
createTimetableThird();
}
else if (weekendDataArray.includes(e.target.value)) {
clearTimetable();
createTimetableWeekend();
}
});
// fix today button
document.querySelector(".shortcut-buttons-flatpickr-button").addEventListener("click", (e) => {
if (firstDataArray.includes(todayDate)) {
clearTimetable();
createTimetableFirst();
}
else if (secondDataArray.includes(todayDate)) {
clearTimetable();
createTimetableSecond();
}
else if (thirdDataArray.includes(todayDate)) {
clearTimetable();
createTimetableThird();
}
else if (weekendDataArray.includes(todayDate)) {
clearTimetable();
createTimetableWeekend();
}
});
// add test grade data
function createGradeFirst() {
let firstGrade = document.createElement("div");
firstGrade.classList.add("grade-card");
firstGrade.innerHTML = `
<div class="grade-subject-title">
Модуль "Естественно-математический". Математика
</div>
<div class="grade-date">
08.12.2020
</div>
<div class="grade-mark five-or-credited">
Зачтено (Отлично)
</div>
`;
document.querySelector(".grade-list").appendChild(firstGrade);
let secondGrade = document.createElement("div");
secondGrade.classList.add("grade-card");
secondGrade.innerHTML = `
<div class="grade-subject-title">
Модуль "Системное и прикладное программное обеспечение". Программирование
</div>
<div class="grade-date">
17.12.2020
</div>
<div class="grade-mark five-or-credited">
Отлично
</div>
`;
document.querySelector(".grade-list").appendChild(secondGrade);
let thirdGrade = document.createElement("div");
thirdGrade.classList.add("grade-card");
thirdGrade.innerHTML = `
<div class="grade-subject-title">
Модуль "Информационные технологии в математике и физике". Информационные технологии
</div>
<div class="grade-date">
22.12.2020
</div>
<div class="grade-mark four">
Хорошо
</div>
`;
document.querySelector(".grade-list").appendChild(thirdGrade);
}
function createGradeSecond() {
let firstGrade = document.createElement("div");
firstGrade.classList.add("grade-card");
firstGrade.innerHTML = `
<div class="grade-subject-title">
Модуль "Организация ЭВМ". ЭВМ и периферийные устройства
</div>
<div class="grade-date">
19.06.2021
</div>
<div class="grade-mark three">
Зачтено (Удовлетв.)
</div>
`;
document.querySelector(".grade-list").appendChild(firstGrade);
let secondGrade = document.createElement("div");
secondGrade.classList.add("grade-card");
secondGrade.innerHTML = `
<div class="grade-subject-title">
Модуль "Экономикo-правовой". Правоведение
</div>
<div class="grade-date">
18.06.2021
</div>
<div class="grade-mark four">
Зачтено (Хорошо)
</div>
`;
document.querySelector(".grade-list").appendChild(secondGrade);
let thirdGrade = document.createElement("div");
thirdGrade.classList.add("grade-card");
thirdGrade.innerHTML = `
<div class="grade-subject-title">
Модуль "Информационные технологии в управлении в IT-компании". IT-менеджмент
</div>
<div class="grade-date">
01.07.2021
</div>
<div class="grade-mark three">
Удовлетв.
</div>
`;
document.querySelector(".grade-list").appendChild(thirdGrade);
let fourthGrade = document.createElement("div");
fourthGrade.classList.add("grade-card");
fourthGrade.innerHTML = `
<div class="grade-subject-title">
Модуль "Системное и прикладное программное обеспечение". Базы данных
</div>
<div class="grade-date">
25.06.2021
</div>
<div class="grade-mark five-or-credited">
Отлично
</div>
`;
document.querySelector(".grade-list").appendChild(fourthGrade);
let fifthGrade = document.createElement("div");
fifthGrade.classList.add("grade-card");
fifthGrade.innerHTML = `
<div class="grade-subject-title">
Модуль "Информационные технологии в управлении в IT-компании". IT-менеджмент
</div>
<div class="grade-date">
01.07.2021
</div>
<div class="grade-mark three">
Удовлетв.
</div>
`;
document.querySelector(".grade-list").appendChild(fifthGrade);
}
function createGradeThird() {
let firstGrade = document.createElement("div");
firstGrade.classList.add("grade-card");
firstGrade.innerHTML = `
<div class="grade-subject-title">
Модуль "Экономикo-правовой". Правоведение
</div>
<div class="grade-date">
08.12.2021
</div>
<div class="grade-mark five-or-credited">
Зачтено
</div>
`;
document.querySelector(".grade-list").appendChild(firstGrade);
let secondGrade = document.createElement("div");
secondGrade.classList.add("grade-card");
secondGrade.innerHTML = `
<div class="grade-subject-title">
Модуль "Информационные ресурсы и средства профессиональной деятельности инженера". Практикум по программированию
</div>
<div class="grade-date">
17.12.2021
</div>
<div class="grade-mark">
</div>
`;
document.querySelector(".grade-list").appendChild(secondGrade);
let thirdGrade = document.createElement("div");
thirdGrade.classList.add("grade-card");
thirdGrade.innerHTML = `
<div class="grade-subject-title">
Модуль "Информационные технологии в управлении в IT-компании". IT-рекрутмент
</div>
<div class="grade-date">
19.12.2021
</div>
<div class="grade-mark three">
Удовлетв.
</div>
`;
document.querySelector(".grade-list").appendChild(thirdGrade);
let fourthGrade = document.createElement("div");
fourthGrade.classList.add("grade-card");
fourthGrade.innerHTML = `
<div class="grade-subject-title">
Модуль "Организация ЭВМ". Физические основы микроэлектроники
</div>
<div class="grade-date">
14.12.2021
</div>
<div class="grade-mark two-or-uncredited">
Незачтено
</div>
`;
document.querySelector(".grade-list").appendChild(fourthGrade);
}
function clearGrade() {
document.querySelectorAll(".grade-card").forEach(e => e.remove());
}
let pickedSemester = document.querySelector("#semester-picker");
if (pickedSemester.value == "third-semester") {
createGradeThird();
}
pickedSemester.addEventListener("change", (e) => {
console.log(e.target.value);
if (e.target.value == "first-semester") {
clearGrade();
createGradeFirst();
}
else if (e.target.value == "second-semester") {
clearGrade();
createGradeSecond();
}
else if (e.target.value == "third-semester") {
clearGrade();
createGradeThird();
}
});
const mediaQuery = window.matchMedia("(max-width: 480px)");
if (mediaQuery.matches) {
let deleted_node = document.querySelectorAll("div.subject-type-and-teacher");
let deleted_node_array = [...deleted_node];
deleted_node_array.forEach(div => div.replaceWith(...div.childNodes));
let div_list = document.querySelectorAll("div.grade-date");
let div_array = [...div_list];
div_array.forEach(div => {
div.innerHTML = ``;
div.replaceWith(...div.childNodes);
});
pickedDate.addEventListener("change", (e) => {
let div_list = document.querySelectorAll("div.subject-type-and-teacher");
let div_array = [...div_list];
div_array.forEach(div => div.replaceWith(...div.childNodes))
});
document.querySelector(".shortcut-buttons-flatpickr-button").addEventListener("click", (e) => {
let div_list = document.querySelectorAll("div.subject-type-and-teacher");
let div_array = [...div_list];
div_array.forEach(div => div.replaceWith(...div.childNodes))
});
pickedSemester.addEventListener("change", (e) => {
let div_list = document.querySelectorAll("div.grade-date");
let div_array = [...div_list];
div_array.forEach(div => {
div.innerHTML = ``;
div.replaceWith(...div.childNodes);
});
});
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment