commit 06cedbd790a48995b5889960f9e30b1e8e39c319
Author: schmieders <80328887+schmieders@users.noreply.github.com>
Date: Sat Dec 10 12:25:13 2022 +0100
first commit
diff --git a/assets/css/styles.css b/assets/css/styles.css
new file mode 100644
index 0000000..b533985
--- /dev/null
+++ b/assets/css/styles.css
@@ -0,0 +1,414 @@
+/***********/
+/* GENERAL */
+/***********/
+:root {
+ /* Override Bootstrap colors */
+ --bs-primary: #e2001a;
+ --bs-secondary: #5c6971;
+ /* Other colors */
+ --primary-hover: #fe1530;
+ --secondary-hover: #222;
+ --light-grey: #f1f3f3;
+ --darker-grey: #d4dada;
+}
+
+body {
+ background-color: #eee;
+}
+
+a {
+ color: var(--secondary-hover);
+ text-decoration-color: var(--bs-primary);
+}
+
+a:hover {
+ color: var(--primary-hover);
+}
+
+/*************/
+/* BOOTSTRAP */
+/*************/
+/* Colors*/
+.bg-primary {
+ background-color: var(--bs-primary) !important;
+}
+
+.bg-secondary {
+ background-color: var(--bs-secondary) !important;
+}
+
+/* Buttons */
+.btn-primary {
+ --bs-btn-color: #fff;
+ --bs-btn-bg: var(--bs-primary);
+ --bs-btn-border-color: var(--bs-primary);
+ --bs-btn-hover-color: #fff;
+ --bs-btn-hover-bg: var(--primary-hover);
+ --bs-btn-hover-border-color: var(--primary-hover);
+ --bs-btn-focus-shadow-rgb: 49, 132, 253;
+ --bs-btn-active-color: #fff;
+ --bs-btn-active-bg: var(--bs-primary);
+ --bs-btn-active-border-color: var(--bs-primary);
+ --bs-btn-active-shadow: inset 0 3px 5px #00000020;
+}
+
+.btn-secondary {
+ --bs-btn-color: #fff;
+ --bs-btn-bg: var(--bs-secondary);
+ --bs-btn-border-color: var(--bs-secondary);
+ --bs-btn-hover-color: #fff;
+ --bs-btn-hover-bg: var(--secondary-hover);
+ --bs-btn-hover-border-color: var(--secondary-hover);
+ --bs-btn-focus-shadow-rgb: 130, 138, 145;
+ --bs-btn-active-color: #fff;
+ --bs-btn-active-bg: var(--bs-secondary);
+ --bs-btn-active-border-color: var(--bs-secondary);
+ --bs-btn-active-shadow: inset 0 3px 5px #00000020;
+}
+
+.btn-primary:focus,
+.btn-secondary:focus {
+ box-shadow: 0 0 0 0.25rem #5c69714a;
+}
+
+.form-control:focus,
+.form-select:focus,
+.btn-close:focus {
+ color: #212529;
+ background-color: #fff;
+ border-color: #5c6971;
+ outline: 0;
+ box-shadow: 0 0 0 0.25rem #5c69714a;
+}
+
+/* Navbar */
+.navbar-dark {
+ --bs-navbar-color: #fffc;
+ --bs-navbar-hover-color: #fffe;
+ --bs-navbar-active-color: #fff;
+}
+
+.dropdown-item.active,
+.dropdown-item:active {
+ background-color: var(--bs-primary) !important;
+}
+
+/* Modals */
+.modal-body form {
+ padding: 10px 20px;
+}
+
+/**********/
+/* HEADER */
+/**********/
+header nav {
+ font-weight: 500;
+}
+
+.dash-item {
+ display: flex;
+ align-items: center;
+ vertical-align: middle;
+}
+
+/***********/
+/* CONTENT */
+/***********/
+h5 {
+ font-size: 18px;
+}
+
+/* Main Page */
+.section-title {
+ margin-bottom: 15px;
+}
+
+.content-section:first-of-type {
+ padding-top: 62px;
+}
+
+.content-section {
+ padding-top: 70px;
+}
+
+/* Management */
+main.content {
+ margin-top: 62px;
+ margin-bottom: 66px;
+ padding: 20px;
+ min-height: calc(100vh - 194px);
+}
+
+/* Tables */
+.table-heading {
+ margin: 20px 0;
+ display: flex;
+ align-items: center;
+}
+
+.content table tbody td,
+.content table tbody th {
+ vertical-align: middle;
+}
+
+.content table thead th.text-center {
+ width: 78px;
+}
+
+/* Custom Buttons */
+.add-button {
+ margin-left: auto;
+ background-color: var(--bs-secondary);
+ border-radius: 100%;
+ color: white;
+ height: 32px;
+ width: 32px;
+ display: flex;
+ align-items: center;
+ text-align: center;
+ justify-content: center;
+}
+
+.add-button:hover {
+ background-color: var(--secondary-hover);
+}
+
+.action-row {
+ justify-content: center;
+ display: flex;
+ gap: 10px;
+}
+
+.action-button {
+ border: none;
+ border-radius: 100%;
+ height: 34px;
+ width: 34px;
+ display: flex;
+ align-items: center;
+ text-align: center;
+ justify-content: center;
+}
+
+.action-button.edit {
+ color: white;
+ background-color: var(--bs-secondary);
+}
+
+.action-button.edit:not(.placeholder):hover {
+ background-color: var(--secondary-hover);
+}
+
+.action-button.delete {
+ color: white;
+ background-color: var(--bs-primary);
+}
+
+.action-button.delete:hover {
+ background-color: var(--bs-secondary);
+}
+
+/* Media Queries */
+@media (min-width: 992px) {
+
+ .container,
+ .content > section {
+ padding-left: 80px;
+ padding-right: 80px;
+ }
+}
+
+@media (max-width: 992px) {
+ aside {
+ display: none;
+ }
+}
+
+/* SIDEBAR */
+.sidebar {
+ -webkit-box-shadow: 5px 0 5px rgba(196, 194, 196, 0.72);
+ -moz-box-shadow: 5px 0 5px rgba(196, 194, 196, 0.72);
+ box-shadow: 5px 0 5px rgba(196, 194, 196, 0.72);
+ position: absolute;
+ top: 62px;
+ left: 0;
+ width: 80px;
+ background-color: white;
+ min-height: calc(100vh - 62px - 66px);
+}
+
+.sidebar li {
+ border-bottom: 1px solid #c5c5c5;
+}
+
+.sidebar li a {
+ display: block;
+ height: 65px;
+ width: 80px;
+ text-align: center;
+}
+
+.sidebar .nav-link {
+ color: var(--bs-secondary);
+}
+
+.sidebar .nav-link:not(.active):hover {
+ color: var(--secondary-hover);
+}
+
+.sidebar .nav-link.active {
+ color: var(--bs-primary);
+}
+
+.sidebar .nav-link svg {
+ vertical-align: -1.4em;
+}
+
+/* Carousel */
+.carousel-item {
+ height: calc(100vh - 62px);
+}
+
+.carousel-item > img {
+ position: absolute;
+ object-fit: cover;
+ top: 0;
+ left: 0;
+ min-width: 100%;
+ min-height: 100%;
+}
+
+.carousel-caption {
+ text-align: left;
+ max-width: 400px;
+ z-index: 10;
+ color: white;
+ background-color: #00000090;
+ padding: 20px;
+}
+
+/* Custom Cards */
+.name {
+ color: var(--bs-primary);
+}
+
+.work {
+ font-weight: bold;
+ font-size: 15px;
+}
+
+.work a {
+ text-decoration: none;
+}
+
+.about {
+ font-size: 13px;
+}
+
+.box {
+ -webkit-box-shadow: 13px 12px 5px -10px rgba(196, 194, 196, 0.72);
+ -moz-box-shadow: 13px 12px 5px -10px rgba(196, 194, 196, 0.72);
+ box-shadow: 13px 12px 5px -10px rgba(196, 194, 196, 0.72);
+ min-height: 300px;
+}
+
+/*************/
+/* DASHBOARD */
+/*************/
+.dash-select {
+ border: none;
+ background-color: transparent;
+ font-size: 24px;
+}
+
+.dashboard .row.full,
+.dashboard .section {
+ min-height: calc(100vh - 330px);
+}
+
+.dashboard .row.gap {
+ gap: 10px;
+ justify-content: center;
+}
+
+.dashboard .person {
+ vertical-align: middle;
+ margin: auto 0;
+}
+
+.dashboard .details svg {
+ color: var(--bs-primary)
+}
+
+#lecturerOther {
+ font-size: 16px;
+ text-overflow: ellipsis;
+ max-height: 580px;
+}
+
+.dashboard .details {
+ padding: 20px;
+ font-size: 18px;
+ vertical-align: middle;
+}
+
+.dashboard .row .card-cust {
+ height: 100%;
+ width: 100%;
+}
+
+/* Lecture List */
+.lectureList {
+ list-style-type: none;
+ padding-left: 0;
+ overflow-y: scroll;
+ max-height: 580px;
+}
+
+.lectureList li {
+ padding: 10px;
+}
+
+.lectureList li:not(:last-of-type) {
+ border-bottom: 0.5px solid var(--darker-grey);
+}
+
+.lectureList li:nth-child(even) {
+ background-color: var(--light-grey);
+}
+
+.lectureList li:hover {
+ background-color: var(--darker-grey);
+}
+
+.lectureList .lecture {
+ font-size: 16px;
+ vertical-align: middle;
+}
+
+/* Misc */
+.error {
+ display: none;
+ color: red;
+ padding: 0 20px;
+}
+
+.error.show {
+ display: block;
+}
+
+/**********/
+/* FOOTER */
+/**********/
+footer {
+ bottom: 0;
+ text-align: center;
+ font-weight: 600;
+ color: var(--light-grey);
+ background-color: var(--bs-secondary);
+ padding: 20px 0;
+ margin-top: 20px;
+ border-top: 2px solid var(--bs-primary);
+ z-index: 2;
+ width: 100%;
+}
\ No newline at end of file
diff --git a/assets/img/AliFistik.jpg b/assets/img/AliFistik.jpg
new file mode 100644
index 0000000..eefb7f4
Binary files /dev/null and b/assets/img/AliFistik.jpg differ
diff --git a/assets/img/JonasBraus.jpg b/assets/img/JonasBraus.jpg
new file mode 100644
index 0000000..c1ad0bc
Binary files /dev/null and b/assets/img/JonasBraus.jpg differ
diff --git a/assets/img/SimonSchmieder.jpg b/assets/img/SimonSchmieder.jpg
new file mode 100644
index 0000000..84522cb
Binary files /dev/null and b/assets/img/SimonSchmieder.jpg differ
diff --git a/assets/img/favicon.svg b/assets/img/favicon.svg
new file mode 100644
index 0000000..e164827
--- /dev/null
+++ b/assets/img/favicon.svg
@@ -0,0 +1,4 @@
+
+
+
\ No newline at end of file
diff --git a/assets/img/uniplanner.png b/assets/img/uniplanner.png
new file mode 100644
index 0000000..ca832cf
Binary files /dev/null and b/assets/img/uniplanner.png differ
diff --git a/assets/js/dashboard/dashboardLogicHandler.js b/assets/js/dashboard/dashboardLogicHandler.js
new file mode 100644
index 0000000..fdee579
--- /dev/null
+++ b/assets/js/dashboard/dashboardLogicHandler.js
@@ -0,0 +1,42 @@
+let logicHandler = new LogicHandler()
+
+window.addEventListener('load', function () {
+ let dropdown = this.document.getElementById("dropdown")
+ logicHandler.getItems("lecturers").forEach(lecturer => {
+ dropdown.innerHTML += `${lecturer.firstName} ${lecturer.lastName} ${lecturer.email} `
+ document.getElementById("lecturerProgram").innerText = logicHandler.getItem("studyPrograms", lecturer.studyProgram).name
+ document.getElementById("lecturerOther").innerText = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
+
+ let btn = document.getElementById("lecturerEditButton")
+ btn.classList.remove("disabled", "placeholder")
+ btn.innerHTML = `${lecture.lectureName} - ${logicHandler.getItem("studyClasses", lecture.studyClass).name} (${logicHandler.formatDateTime(date.startDate)} - ${logicHandler.formatDateTime(date.endDate)})
+ `
+ }
+ })
+
+ })
+ document.querySelector(".lectureList").innerHTML = html
+
+ document.getElementsByClassName("sidebar")[0].style.minHeight = `${document.body.offsetHeight - 66}px`
+}
\ No newline at end of file
diff --git a/assets/js/dummyDataHandler.js b/assets/js/dummyDataHandler.js
new file mode 100644
index 0000000..2cc7c46
--- /dev/null
+++ b/assets/js/dummyDataHandler.js
@@ -0,0 +1,149 @@
+function loadDummyData() {
+
+ window.localStorage.setItem("studyPrograms", JSON.stringify([
+ {
+ id: 0,
+ name: "Informatik",
+ short: "TIF"
+ },
+ {
+ id: 1,
+ name: "Wirtschaftsinformatik",
+ short: "WIF"
+ },
+ {
+ id: 2,
+ name: "Betriebswirtschaftslehre",
+ short: "BWL"
+ },
+ ]))
+
+ window.localStorage.setItem("lectureDates", JSON.stringify([
+ {
+ id: 0,
+ startDate: "2022-01-01T00:00",
+ endDate: "2022-01-01T23:59"
+ },
+ {
+ id: 1,
+ startDate: "2022-02-02T00:00",
+ endDate: "2022-02-02T23:59"
+ },
+ {
+ id: 2,
+ startDate: "2022-03-03T00:00",
+ endDate: "2022-03-03T23:59"
+ },
+ ]))
+
+
+ window.localStorage.setItem("semesters", JSON.stringify([
+ {
+ id: 0,
+ name: "1. Semester",
+ startDate: 0,
+ endDate: 2,
+ number: 1,
+ studyProgram: 1
+ }, {
+ id: 1,
+ name: "2. Semester",
+ startDate: 1,
+ endDate: 2,
+ number: 2,
+ studyProgram: 2
+ }, {
+ id: 2,
+ name: "3. Semester",
+ startDate: 0,
+ endDate: 1,
+ number: 3,
+ studyProgram: 0
+ },
+ ]))
+
+ window.localStorage.setItem("studyClasses", JSON.stringify([
+ {
+ id: 0,
+ name: "TIF22A",
+ startDate: 0,
+ endDate: 0,
+ semester: 0,
+ studyProgram: 0
+ }, {
+ id: 1,
+ name: "WIF21B",
+ startDate: 1,
+ endDate: 1,
+ semester: 1,
+ studyProgram: 1
+ }, {
+ id: 2,
+ name: "BWL20A",
+ startDate: 2,
+ endDate: 2,
+ semester: 2,
+ studyProgram: 2
+ },
+ ]))
+
+ window.localStorage.setItem("lecturers", JSON.stringify([
+ {
+ id: 0,
+ firstName: "Max",
+ lastName: "Mustermann",
+ email: "max.mustermann@uniplanner.de",
+ studyProgram: 0
+ }, {
+ id: 1,
+ firstName: "Erika",
+ lastName: "Musterfrau",
+ email: "erika.musterfrau@uniplanner.de",
+ studyProgram: 1
+ }, {
+ id: 2,
+ firstName: "Max",
+ lastName: "Musterfrau",
+ email: "max.musterfrau@uniplanner.de",
+ studyProgram: 2
+ },
+ ]))
+
+ window.localStorage.setItem("lectures", JSON.stringify([
+ {
+ id: 0,
+ lectureName: "Technische Informatik",
+ moduleName: "Digitaltechnik I",
+ duration: 48,
+ lectureDates: ["0", "2"],
+ lecturers: ["0"],
+ studyClass: 0
+ }, {
+ id: 1,
+ lectureName: "Mathematik I",
+ moduleName: "Analysis",
+ duration: 50,
+ lectureDates: ["1", "2"],
+ lecturers: ["1", "2"],
+ studyClass: 1
+ }, {
+ id: 2,
+ lectureName: "Betriebswirtschaftslehre",
+ moduleName: "Projektmanagement",
+ duration: 35,
+ lectureDates: ["0", "2"],
+ lecturers: ["0", "1", "2"],
+ studyClass: 2
+ },
+ ]))
+
+ window.localStorage.setItem("currentIds", JSON.stringify({
+ lectureDate: 3,
+ lecturer: 3,
+ lecture: 3,
+ semester: 3,
+ studyClass: 3,
+ studyProgram: 3
+ }))
+
+}
\ No newline at end of file
diff --git a/assets/js/lectureDates/lectureDateLogicHandler.js b/assets/js/lectureDates/lectureDateLogicHandler.js
new file mode 100644
index 0000000..8f0df76
--- /dev/null
+++ b/assets/js/lectureDates/lectureDateLogicHandler.js
@@ -0,0 +1,35 @@
+let logicHandler = new LogicHandler()
+let modalHandler = new LectureDateModalHandler()
+
+function renderLectureDateModal(id) {
+ id = typeof id == "undefined" ? "Create" : id
+
+ let lectureDate = id == "Create" ? getEmptyLectureDate() : logicHandler.getItem("lectureDates", id)
+
+ document.body.append(modalHandler.getLectureDateModal(lectureDate))
+ document.body.append(modalHandler.getLectureDateModalButton(id))
+ let htmlButton = document.getElementById("modalButton" + id)
+ htmlButton.click()
+ htmlButton.remove()
+}
+
+function cancelLectureDateModal(id) {
+ document.getElementById("lectureDateModal" + id).remove()
+}
+
+function saveLectureDate(id) {
+ logicHandler.saveItem("lectureDate", id)
+}
+
+function removeLectureDate(id) {
+ logicHandler.removeItem("lectureDates", id)
+ document.getElementById("row" + id).remove()
+}
+
+function getEmptyLectureDate() {
+ return {
+ id: "Create",
+ startDate: "",
+ endDate: ""
+ }
+}
\ No newline at end of file
diff --git a/assets/js/lectureDates/lectureDateModalHandler.js b/assets/js/lectureDates/lectureDateModalHandler.js
new file mode 100644
index 0000000..02f89bc
--- /dev/null
+++ b/assets/js/lectureDates/lectureDateModalHandler.js
@@ -0,0 +1,49 @@
+class LectureDateModalHandler {
+ getLectureDateModal(lectureDate) {
+ let heading = lectureDate.id == "Create" ? "Neuen Termin erstellen" : `Termin #${lectureDate.id} bearbeiten`
+
+ let modal = `
+
+ `
+
+ let htmlModal = document.createElement("div")
+ htmlModal.innerHTML = modal
+ return htmlModal
+ }
+
+ getLectureDateModalButton(id) {
+ let button = `
+ ${lectureDate.id}
+ ${logicHandler.formatDateTime(lectureDate.startDate)}
+ ${logicHandler.formatDateTime(lectureDate.endDate)}
+
+
+
+ `
+
+ let row = document.createElement("tr")
+ row.id = "row" + lectureDate.id
+ row.innerHTML = content
+ document.getElementById("lectureDateTable").appendChild(row)
+
+ document.getElementsByClassName("sidebar")[0].style.minHeight = `${document.body.offsetHeight - 66}px`
+ })
+ }
+})
\ No newline at end of file
diff --git a/assets/js/lecturers/lecturerLogicHandler.js b/assets/js/lecturers/lecturerLogicHandler.js
new file mode 100644
index 0000000..88fa466
--- /dev/null
+++ b/assets/js/lecturers/lecturerLogicHandler.js
@@ -0,0 +1,46 @@
+let logicHandler = new LogicHandler()
+let modalHandler = new LecturerModalHandler()
+
+window.addEventListener('load', function () {
+ if (this.window.location.search.includes("id=")) {
+ renderLecturerModal(window.location.search.replace("?id=", ""))
+ }
+})
+
+function renderLecturerModal(id) {
+ id = typeof id == "undefined" ? "Create" : id
+
+ let lecturer = id == "Create" ? getEmptyLecturer() : logicHandler.getItem("lecturers", id)
+
+ let studyProgramList = logicHandler.getAsDataList("studyPrograms", "name", [lecturer.studyProgram])
+
+ document.body.append(modalHandler.getLecturerModal(lecturer, studyProgramList))
+ document.body.append(modalHandler.getLecturerModalButton(id))
+ let htmlButton = document.getElementById("lecturerButton" + id)
+ htmlButton.click()
+ htmlButton.remove()
+}
+
+function cancelLecturerModal(id) {
+ document.getElementById("lecturerModal" + id).remove()
+ window.location.href = window.location.href.replace(window.location.search, "")
+}
+
+function saveLecturer(id) {
+ logicHandler.saveItem("lecturer", id)
+}
+
+function removeLecturer(id) {
+ logicHandler.removeItem("lecturers", id)
+ document.getElementById("row" + id).remove()
+}
+
+function getEmptyLecturer() {
+ return {
+ id: "Create",
+ firstName: "",
+ lastName: "",
+ email: "",
+ studyProgram: ""
+ }
+}
\ No newline at end of file
diff --git a/assets/js/lecturers/lecturerModalHandler.js b/assets/js/lecturers/lecturerModalHandler.js
new file mode 100644
index 0000000..c5be7db
--- /dev/null
+++ b/assets/js/lecturers/lecturerModalHandler.js
@@ -0,0 +1,60 @@
+class LecturerModalHandler {
+
+ getLecturerModal(lecturer, studyProgramList) {
+ let heading = lecturer.id == "Create" ? "Neuen Dozent erstellen" : `Dozent #${lecturer.id} bearbeiten`
+ let modal = `
+
+ `
+
+ let htmlModal = document.createElement("div")
+ htmlModal.innerHTML = modal
+ return htmlModal
+ }
+
+ getLecturerModalButton(id) {
+ let button = `
+ ${lecturer.id}
+ ${lecturer.firstName}
+ ${lecturer.lastName}
+ ${lecturer.email}
+ ${studyProgram}
+
+
+
+ `
+ let row = document.createElement("tr")
+ row.id = "row" + lecturer.id
+ row.innerHTML = content
+ document.getElementById("lecturersTable").appendChild(row)
+
+ document.getElementsByClassName("sidebar")[0].style.minHeight = `${document.body.offsetHeight - 66}px`
+ })
+ }
+})
\ No newline at end of file
diff --git a/assets/js/lectures/lectureLogicHandler.js b/assets/js/lectures/lectureLogicHandler.js
new file mode 100644
index 0000000..531c1d5
--- /dev/null
+++ b/assets/js/lectures/lectureLogicHandler.js
@@ -0,0 +1,43 @@
+let logicHandler = new LogicHandler()
+let modalHandler = new LectureModalHandler()
+
+function renderLectureModal(id) {
+ id = typeof id == "undefined" ? "Create" : id
+
+ let lecture = id == "Create" ? getEmptyLecture() : logicHandler.getItem("lectures", id)
+
+ let lectureDateList = logicHandler.getAsDataListWithRange("lectureDates", "startDate", "endDate", lecture.lectureDates)
+ let lecturerList = logicHandler.getAsDataList("lecturers", "lastName", lecture.lecturers)
+ let studyClassList = logicHandler.getAsDataList("studyClasses", "name", [lecture.studyClass])
+
+ document.body.append(modalHandler.getLectureModal(lecture, lectureDateList, lecturerList, studyClassList))
+ document.body.append(modalHandler.getLectureModalButton(id))
+ let htmlButton = document.getElementById("lectureButton" + id)
+ htmlButton.click()
+ htmlButton.remove()
+}
+
+function cancelLectureModal(id) {
+ document.getElementById("lectureModal" + id).remove()
+}
+
+function saveLecture(id) {
+ logicHandler.saveItem("lecture", id)
+}
+
+function removeLecture(id) {
+ logicHandler.removeItem("lectures", id)
+ document.getElementById("row" + id).remove()
+}
+
+function getEmptyLecture() {
+ return {
+ id: "Create",
+ lectureName: "",
+ moduleName: "",
+ duration: "",
+ lectureDates: [],
+ lecturers: [],
+ studyClass: ""
+ }
+}
\ No newline at end of file
diff --git a/assets/js/lectures/lectureModalHandler.js b/assets/js/lectures/lectureModalHandler.js
new file mode 100644
index 0000000..d0b9834
--- /dev/null
+++ b/assets/js/lectures/lectureModalHandler.js
@@ -0,0 +1,72 @@
+class LectureModalHandler {
+
+ getLectureModal(lecture, lectureDateList, lecturerList, studyClassList) {
+ let heading = lecture.id == "Create" ? "Neue Vorlesung erstellen" : `Vorlesung #${lecture.id} bearbeiten`
+ let modal = `
+
+ `
+
+ let htmlModal = document.createElement("div")
+ htmlModal.innerHTML = modal
+ return htmlModal
+ }
+
+ getLectureModalButton(id) {
+ let button = `
+ ${lecture.id}
+ ${lecture.lectureName}
+ ${lecture.moduleName}
+ ${lecture.duration}
+ ${lectureDates}
+ ${lecturers}
+ ${studyClass}
+
+
+
+ `
+ let row = document.createElement("tr")
+ row.id = "row" + lecture.id
+ row.innerHTML = content
+ document.getElementById("lecturesTable").appendChild(row)
+
+ document.getElementsByClassName("sidebar")[0].style.minHeight = `${document.body.offsetHeight - 66}px`
+ })
+ }
+})
\ No newline at end of file
diff --git a/assets/js/logicHandler.js b/assets/js/logicHandler.js
new file mode 100644
index 0000000..aabe445
--- /dev/null
+++ b/assets/js/logicHandler.js
@@ -0,0 +1,152 @@
+class LogicHandler {
+
+ getItems(type) {
+ let items = JSON.parse(window.localStorage.getItem(type))
+ return items == null ? [] : items
+ }
+
+ getItem(type, id) {
+ let item = JSON.parse(window.localStorage.getItem(type))
+ return item == null ? {} : item.filter(item => {
+ return item.id == id
+ })[0]
+ }
+
+ addItem(type, item) {
+ let items = this.getItems(type)
+ items[items.length] = item
+ window.localStorage.setItem(type, JSON.stringify(items))
+ }
+
+ updateItem(type, data) {
+ let items = this.getItems(type)
+ items.forEach((item, idx) => {
+ if (item.id == data.id)
+ items[idx] = data
+ })
+ window.localStorage.setItem(type, JSON.stringify(items))
+ }
+
+ removeItem(type, id) {
+ let items = this.getItems(type).filter(item => {
+ return item.id != id
+ })
+ window.localStorage.setItem(type, JSON.stringify(items))
+ }
+
+ saveItem(type, id, multiple = "s") {
+ let json = this.getFormData(type + "Form" + id)
+ if (!json) {
+ document.getElementById(type + "Modal" + id).querySelector("p.error").classList.add("show")
+ return
+ }
+
+ json.id = id == "Create" ? this.getId(type) : id
+
+ if (id == "Create")
+ this.addItem(type + multiple, json)
+ else
+ this.updateItem(type + multiple, json)
+
+ window.location.href = window.location.href.replace(window.location.search, "")
+ }
+
+ getId(type) {
+ var values = JSON.parse(window.localStorage.getItem("currentIds"))
+ if (values == null)
+ values = {}
+
+ if (values[type] == null)
+ values[type] = 0
+
+ let id = values[type]
+ values[type] = parseInt(values[type]) + 1
+ window.localStorage.setItem("currentIds", JSON.stringify(values))
+ return id
+ }
+
+ getAsDataList(type, field, selected) {
+ let datalist = ""
+ Array.from(this.getItems(type)).forEach(item => {
+ if (selected.length > 0 && selected.filter(select => { return parseInt(select) == item['id'] }).length > 0)
+ datalist += `${item[field]} `
+ else
+ datalist += `${item[field]} `
+ })
+ return datalist
+ }
+
+ getAsDataListWithRange(type, rangeStart, rangeEnd, selected) {
+ let datalist = ""
+ Array.from(this.getItems(type)).forEach(item => {
+ if (selected.length > 0 && selected.filter(select => { return parseInt(select) == item['id'] }).length > 0)
+ datalist += `${this.formatDateTime(item[rangeStart])} - ${this.formatDateTime(item[rangeEnd])} `
+ else
+ datalist += `${this.formatDateTime(item[rangeStart])} - ${this.formatDateTime(item[rangeEnd])} `
+ })
+ return datalist
+ }
+
+ getAsDateList(type, field, selected) {
+ let datalist = ""
+ Array.from(this.getItems(type)).forEach(item => {
+ if (selected.length > 0 && selected.filter(select => { return parseInt(select) == item['id'] }).length > 0)
+ datalist += `${this.formatDateTimeToDate(item[field])} `
+ else
+ datalist += `${this.formatDateTimeToDate(item[field])} `
+ })
+ return datalist
+ }
+
+ getFormData(form) {
+ let fields = Array.from(document.getElementById(form).querySelectorAll(".modalInput"))
+ let json = {}
+ let valid = true
+
+ fields.forEach(element => {
+ if (typeof element.options != "undefined") {
+ let values = []
+ Array.from(element.options).forEach(option => {
+ if (option.selected && !option.disabled)
+ values.push(option.value)
+ })
+ if (values.length == 0)
+ valid = false
+
+ json[element.name] = values
+ } else {
+ if (element.value.trim().length == 0)
+ valid = false
+
+ json[element.name] = element.value
+ }
+ })
+
+ if (!valid)
+ return false
+
+ return json
+ }
+
+ formatDateTime(dateTime) {
+ let split = dateTime.split("T")
+ let dateSplit = split[0].split("-")
+
+ return dateSplit[2] + "." + dateSplit[1] + "." + dateSplit[0] + " " + split[1]
+ }
+
+ formatDateTimeToDate(dateTime) {
+ let split = dateTime.split("T")
+ let dateSplit = split[0].split("-")
+
+ return dateSplit[2] + "." + dateSplit[1] + "." + dateSplit[0]
+ }
+}
+
+window.addEventListener('load', function () {
+ document.getElementsByClassName("sidebar")[0].style.minHeight = `${document.body.offsetHeight - 66}px`
+})
+
+window.addEventListener('resize', function () {
+ document.getElementsByClassName("sidebar")[0].style.minHeight = `${document.body.offsetHeight - 66}px`
+})
diff --git a/assets/js/semesters/semesterLogicHandler.js b/assets/js/semesters/semesterLogicHandler.js
new file mode 100644
index 0000000..8f30a1c
--- /dev/null
+++ b/assets/js/semesters/semesterLogicHandler.js
@@ -0,0 +1,43 @@
+let logicHandler = new LogicHandler()
+let modalHandler = new SemesterModalHandler()
+
+function renderSemesterModal(id) {
+ id = typeof id == "undefined" ? "Create" : id
+
+ let semester = id == "Create" ? getEmptySemester() : logicHandler.getItem("semesters", id)
+
+ let startDateList = logicHandler.getAsDateList("lectureDates", "startDate", [semester.startDate])
+ let endDateList = logicHandler.getAsDateList("lectureDates", "endDate", [semester.endDate])
+
+ let studyProgramList = logicHandler.getAsDataList("studyPrograms", "name", [semester.studyProgram])
+
+ document.body.append(modalHandler.getSemesterModal(semester, startDateList, endDateList, studyProgramList))
+ document.body.append(modalHandler.getSemesterModalButton(id))
+ let htmlButton = document.getElementById("modalButton" + id)
+ htmlButton.click()
+ htmlButton.remove()
+}
+
+function cancelSemesterModal(id) {
+ document.getElementById("semesterModal" + id).remove()
+}
+
+function saveSemester(id) {
+ logicHandler.saveItem("semester", id)
+}
+
+function removeSemester(id) {
+ logicHandler.removeItem("semesters", id)
+ document.getElementById("row" + id).remove()
+}
+
+function getEmptySemester() {
+ return {
+ id: "Create",
+ name: "",
+ startDate: "",
+ endDate: "",
+ number: "",
+ studyProgram: ""
+ }
+}
\ No newline at end of file
diff --git a/assets/js/semesters/semesterModalHandler.js b/assets/js/semesters/semesterModalHandler.js
new file mode 100644
index 0000000..c24d1d6
--- /dev/null
+++ b/assets/js/semesters/semesterModalHandler.js
@@ -0,0 +1,68 @@
+class SemesterModalHandler {
+ getSemesterModal(semester, startDateList, endDateList, studyProgramList) {
+ let heading = semester.id == "Create" ? "Neues Semester erstellen" : `Semester #${semester.id} bearbeiten`
+ let modal = `
+
+ `
+
+ let htmlModal = document.createElement("div")
+ htmlModal.innerHTML = modal
+ return htmlModal
+ }
+
+ getSemesterModalButton(id) {
+ let button = `
+ ${semester.id}
+ ${semester.name}
+ ${logicHandler.formatDateTimeToDate(logicHandler.getItem("lectureDates", semester.startDate).startDate)}
+ ${logicHandler.formatDateTimeToDate(logicHandler.getItem("lectureDates", semester.endDate).endDate)}
+ ${semester.number}
+ ${studyProgram}
+
+
+
+ `
+
+ let row = document.createElement("tr")
+ row.id = "row" + semester.id
+ row.innerHTML = content
+ document.getElementById("semestersTable").appendChild(row)
+
+ document.getElementsByClassName("sidebar")[0].style.minHeight = `${document.body.offsetHeight - 66}px`
+ })
+ }
+})
\ No newline at end of file
diff --git a/assets/js/studyClasses/studyClassLogicHandler.js b/assets/js/studyClasses/studyClassLogicHandler.js
new file mode 100644
index 0000000..a361e4d
--- /dev/null
+++ b/assets/js/studyClasses/studyClassLogicHandler.js
@@ -0,0 +1,43 @@
+let logicHandler = new LogicHandler()
+let modalHandler = new StudyClassModalHandler()
+
+function renderStudyClassModal(id) {
+ id = typeof id == "undefined" ? "Create" : id
+
+ let studyClass = id == "Create" ? getEmptyStudyClass() : logicHandler.getItem("studyClasses", id)
+
+ let startDateList = logicHandler.getAsDateList("lectureDates", "startDate", [studyClass.startDate])
+ let endDateList = logicHandler.getAsDateList("lectureDates", "endDate", [studyClass.endDate])
+ let semesterList = logicHandler.getAsDataList("semesters", "name", [studyClass.semester])
+ let studyProgramList = logicHandler.getAsDataList("studyPrograms", "name", [studyClass.studyProgram])
+
+ document.body.append(modalHandler.getStudyClassModal(studyClass, semesterList, startDateList, endDateList, studyProgramList))
+ document.body.append(modalHandler.getStudyClassModalButton(id))
+ let htmlButton = document.getElementById("studyClassButton" + id)
+ htmlButton.click()
+ htmlButton.remove()
+}
+
+function cancelStudyClassModal(id) {
+ document.getElementById("studyClassModal" + id).remove()
+}
+
+function saveStudyClass(id) {
+ logicHandler.saveItem("studyClass", id, "es")
+}
+
+function removeStudyClass(id) {
+ logicHandler.removeItem("studyClasses", id)
+ document.getElementById("row" + id).remove()
+}
+
+function getEmptyStudyClass() {
+ return {
+ id: "Create",
+ name: "",
+ startDate: "",
+ endDate: "",
+ semester: "",
+ studyProgram: ""
+ }
+}
\ No newline at end of file
diff --git a/assets/js/studyClasses/studyClassModalHandler.js b/assets/js/studyClasses/studyClassModalHandler.js
new file mode 100644
index 0000000..1a16fef
--- /dev/null
+++ b/assets/js/studyClasses/studyClassModalHandler.js
@@ -0,0 +1,73 @@
+class StudyClassModalHandler {
+
+ getStudyClassModal(studyClass, semesterList, startDateList, endDateList, studyProgramList) {
+ let heading = studyClass.id == "Create" ? "Neuen Jahrgang erstellen" : `Jahrgang #${studyClass.id} bearbeiten`
+ let modal = `
+
+ `
+
+ let htmlModal = document.createElement("div")
+ htmlModal.innerHTML = modal
+ return htmlModal
+ }
+
+ getStudyClassModalButton(id) {
+ let button = `
+ ${studyClass.id}
+ ${studyClass.name}
+ ${logicHandler.formatDateTimeToDate(logicHandler.getItem("lectureDates", studyClass.startDate).startDate)}
+ ${logicHandler.formatDateTimeToDate(logicHandler.getItem("lectureDates", studyClass.endDate).endDate)}
+ ${logicHandler.getItem("semesters", studyClass.semester).name}
+ ${studyProgram}
+
+
+
+ `
+ let row = document.createElement("tr")
+ row.id = "row" + studyClass.id
+ row.innerHTML = content
+ document.getElementById("studyClassTable").appendChild(row)
+
+ document.getElementsByClassName("sidebar")[0].style.minHeight = `${document.body.offsetHeight - 66}px`
+ })
+ }
+})
\ No newline at end of file
diff --git a/assets/js/studyProgram/studyProgramLogicHandler.js b/assets/js/studyProgram/studyProgramLogicHandler.js
new file mode 100644
index 0000000..6263192
--- /dev/null
+++ b/assets/js/studyProgram/studyProgramLogicHandler.js
@@ -0,0 +1,35 @@
+let logicHandler = new LogicHandler()
+let modalHandler = new StudyProgramModalHandler()
+
+function renderStudyProgramModal(id) {
+ id = typeof id == "undefined" ? "Create" : id
+
+ let studyProgram = id == "Create" ? getEmptyStudyProgram() : logicHandler.getItem("studyPrograms", id)
+
+ document.body.append(modalHandler.getStudyProgramModal(studyProgram))
+ document.body.append(modalHandler.getStudyProgramModalButton(id))
+ let htmlButton = document.getElementById("modalButton" + id)
+ htmlButton.click()
+ htmlButton.remove()
+}
+
+function cancelStudyProgramModal(id) {
+ document.getElementById("studyProgramModal" + id).remove()
+}
+
+function saveStudyProgram(id) {
+ logicHandler.saveItem("studyProgram", id)
+}
+
+function removeStudyProgram(id) {
+ logicHandler.removeItem("studyPrograms", id)
+ document.getElementById("row" + id).remove()
+}
+
+function getEmptyStudyProgram() {
+ return {
+ id: "Create",
+ name: "",
+ short: ""
+ }
+}
\ No newline at end of file
diff --git a/assets/js/studyProgram/studyProgramModalHandler.js b/assets/js/studyProgram/studyProgramModalHandler.js
new file mode 100644
index 0000000..587f602
--- /dev/null
+++ b/assets/js/studyProgram/studyProgramModalHandler.js
@@ -0,0 +1,49 @@
+class StudyProgramModalHandler {
+
+ getStudyProgramModal(studyProgram) {
+ let heading = studyProgram.id == "Create" ? "Neuen Studiengang erstellen" : `Studiengang #${studyProgram.id} bearbeiten`
+ let modal = `
+
+ `
+
+ let htmlModal = document.createElement("div")
+ htmlModal.innerHTML = modal
+ return htmlModal
+ }
+
+ getStudyProgramModalButton(id) {
+ let button = `
+ ${studyProgram.id}
+ ${studyProgram.name}
+ ${studyProgram.short}
+
+
+
+ `
+
+ let row = document.createElement("tr")
+ row.id = "row" + studyProgram.id
+ row.innerHTML = content
+ document.getElementById("studyProgramTable").appendChild(row)
+
+ document.getElementsByClassName("sidebar")[0].style.minHeight = `${document.body.offsetHeight - 66}px`
+ })
+ }
+})
\ No newline at end of file
diff --git a/dashboard/index.html b/dashboard/index.html
new file mode 100644
index 0000000..e7b3f8e
--- /dev/null
+++ b/dashboard/index.html
@@ -0,0 +1,279 @@
+
+
+
+
+ UniPlanner
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Dashboard
+
+
+ Dozent wählen
+
+
+
+
+
+
+
+
+
Vorlesungstermine
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Weiteres
+
+
+
+
+
+
+
+
+
+
+ Copyright © 2022 Ali Fistik, Jonas Braus, Simon Schmieder
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..af1424f
--- /dev/null
+++ b/index.html
@@ -0,0 +1,332 @@
+
+
+
+
+ UniPlanner
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Struktur
+
Als Student ist es wichtig den Überblick über seinen Alltag zu behalten.
+
+
+
+
+
+
Alles in einem Tool
+
Mit dem Uniplanner können Studenten nicht nur ihre Vorlesungen strukturieren.
+ Auch das verwalten von Kontaktdaten der Dozenten sowie eine Kursübergreifende
+ Terminplanung ist durch unsere Systeme einfacher denn je.
+
+
+
+
+
+
Digitalisierung
+
Der digitale Uniplanner bietet den Studenten neue Möglichkeiten für ihren Alltag.
+
+
+
+
+ Previous
+
+
+ Next
+
+
+
+
+
+
+
Über uns
+
+
+
+
+
+
+
+
+
+
Ali Fistik
+
Dualer Student
+
+
+
+
+
+
+
+
+
+
+
+ Persistence. Perfection. Prioritize your passion.
+
+
+
+
+
+
+
+
Jonas Braus
+
Dualer Student
+
+
+
+
+
+
+
+
+
+
+
+
+ Price is what you pay. Value is what you get.
+
+
+
+
+
+
+
+
Simon Schmieder
+
Dualer Student
+
+
+
+
+
+
+
+
+
+
+
+
+ Best way to predict your future is to create IT.
+
+
+
+
+
+
+
+
+
+
Funktionen
+
+
+
+ Herzlich Willkommen auf uniplanner.de DEIN Online-Tool für die Planung sämtlicher studienrelevanten
+ Themen!
+
+
+
Wie funktionierts?
+
+
+ Mit UniPlanner kannst du kostenlos Einträge für Vorlesungen, Semester, Dozenten und Weiteres
+ anlegen. Womit du am Besten anfängst
+ erfährst du in diesem kurzen Guide.
+
+
+
+ Über das Dropdownmenü "Verwaltung", gelangst du zu den jeweiligen Seiten für die
+ Datenerfassung
+
+
+ Zu Beginn kannst du einen
+ Studiengang , sowie einen oder mehrere Termine , bestehend aus einem
+ Start- und Enddatum, so wie der jeweiligen Uhrzeit, anlegen
+
+
+ Hast du das getan, ist es dir bereits möglich Semester und Dozenten mit allen erforderlichen
+ Daten einzutragen
+
+
+ Navigiere nun in den Bereich Jahrgänge und trage die jeweiligen Daten ein
+
+
+ Du hast nun alle nötigen Daten um Einträge zu Vorlesungen zu erstellen
+
+
+ Nachdem alle Daten ins System eingetragen wurden kannst du über das Dashboard einen Dozenten
+ auswählen, um dir seine Kontaktdaten, Vorlesungen und einige weiteren Daten anzusehen
+
+
+
+
+
+
+
+
+
+
Impressum
+
Angaben gemäß § 5 TMG
+
Simon Schmieder
+
Vertreten durch:
+
Kontakt: kontakt@uniplanner.de
+
Umsatzsteuer-ID: Wirtschafts-ID:
+
Aufsichtsbehörde:
+
+
+ Website Impressum erstellt durch impressum-generator.de von der Kanzlei Hasselbach
+
+
+
+
+
+
+
+ Copyright © 2022 Ali Fistik, Jonas Braus, Simon Schmieder
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/lectureDates/index.html b/lectureDates/index.html
new file mode 100644
index 0000000..6eab76d
--- /dev/null
+++ b/lectureDates/index.html
@@ -0,0 +1,195 @@
+
+
+
+
+ UniPlanner
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Vorlesungstermine
+
+
+
+
+
+
+
+
+
+ #
+ Startdatum
+ Enddatum
+
+
+
+
+
+
+
+
+
+
+
+
+ Copyright © 2022 Ali Fistik, Jonas Braus, Simon Schmieder
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/lecturers/index.html b/lecturers/index.html
new file mode 100644
index 0000000..5d84efa
--- /dev/null
+++ b/lecturers/index.html
@@ -0,0 +1,197 @@
+
+
+
+
+ UniPlanner
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Dozenten
+
+
+
+
+
+
+
+
+
+ #
+ Vorname
+ Nachname
+ Email
+ Studiengang
+
+
+
+
+
+
+
+ Copyright © 2022 Ali Fistik, Jonas Braus, Simon Schmieder
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/lectures/index.html b/lectures/index.html
new file mode 100644
index 0000000..0125e25
--- /dev/null
+++ b/lectures/index.html
@@ -0,0 +1,201 @@
+
+
+
+
+ UniPlanner
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Vorlesungen
+
+
+
+
+
+
+
+
+
+ #
+ Name
+ Modul
+ Dauer
+ Termine
+ Dozenten
+ Jahrgang
+
+
+
+
+
+
+
+ Copyright © 2022 Ali Fistik, Jonas Braus, Simon Schmieder
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/readme.md b/readme.md
new file mode 100644
index 0000000..45116e7
--- /dev/null
+++ b/readme.md
@@ -0,0 +1,94 @@
+# UniPlanner
+
+## Inhaltsverzeichnis
+1. Projektbeschreibung
+2. Projektarchitektur
+ 1. Technologien
+ 2. Anforderungen
+3. Farbschema
+4. Anleitung zum starten
+
+## Projektbeschreibung
+Der UniPlanner ist eine WebAnwendung, mit der
+ - Vorlesungen
+ - Semester
+ - Dozenten
+ - Termine
+ - Jahrgänge
+ - Studiengänge
+
+verwaltet werden können.
+
+Die Webseite ist dabei aufgeteilt in eine statische Hauptseite und einen Verwaltungsbereich mit Dashboard.
+
+Die Hauptseite mit Carousel enthält einige Informationen über uns und die Anwendung sowie ein Impressum.
+
+Im Verwaltungsbereich befinden sich Unterseiten, die per Dropdown oder per Sidebar erreicht werden können.
+Auf jeder dieser Unterseiten kann ein "Datentyp" verwaltet werden (Einsehen, Erstellen, Editieren und Löschen).
+Die einzelnen Datentypen verweisen dabei teilweise auf andere Datentypen, wodurch eine Reihenfolge der Eingaben vorgegeben ist.
+Um Elemente zu erstellen müssen stets alle Felder ausgefüllt werden.
+
+Über das Dashboard können mithilfe eines Dropdown-Menüs Dozenten einzeln gewählt und angezeigt werden. Hierbei werden Vorlesungen mit Jahrgang und dem ersten Vorlesungstermin angezeigt, außerdem sind einige Informationen über den Dozenten einsehbar.
+
+## Projektarchitektur
+Das Projekt ist in 2 Teile zu unterteilen.
+Im Hauptordner befinden sich die einzelnen HTML Dateien, die über eine Ordnerstruktur den Webseitenaufbau abbilden.
+Im Assets-Ordner befinden sich alle JavaScript und CSS Dateien, welche in den einzelnen HTML Dateien importiert werden.
+
+### Technologien
+
+#### HTML
+HTML ist eine Markdownsprache, mit der die Struktur von Webseiten beschrieben werden kann.
+Wir haben unsere Webseite mit HTML5 aufgebaut und in Bereiche wie header, main und footer aufgeteilt.
+
+#### CSS
+CSS ist eine Sprache, mit der HTML Elemente gestyled werden können.
+In der Datei assets/styles.css befinden sich alle unsere Styledefinitionen (Bootstrap ausgenommen).
+Wir haben CSS3 verwendet, um eigene Styles zu definieren und bestehende HTML sowie Bootstrap Styles zu überschreiben.
+
+#### JavaScript
+JavaScript (JS) ist eine Scriptsprache, mit der Webseiten interaktiv aufgebaut werden können.
+Wir haben auf unserer Webseite JavaScript verwendet, um Daten im Lokalen Speicher des Browsers abzulegen, HTML Code für Popups und Tabellen zu generieren und styles von HTML Elementen anzupassen (...).
+
+Unsere JS Dateien verweisen dabei nicht aufeinander, können jedoch Elemente aus anderen Dateien verwenden, da wir sie in einer speziellen Reihenfolge in den HTML Code importiert haben. Die Hauptkomponente stellt hierbei der LogicHandler (assets/logicHandler.js) dar, welcher sich mit der Speicher und Ladelogik sowie einigen weiteren oft verwendeten Operationen befasst.
+
+Für jeden Datentyp haben wir außerdem einen TableHandler und einen ModalHandler erstellt, welche sich um das generieren von Tabellen und Modals (Popups) mit den jeweiligen Werten kümmern. Diese beiden Handler haben wir dann über einen Datentyp spezifischen LogicHandler mit der Hauptlogik verknüpft.
+
+Das Dashboard hat ebenfalls einen gesonderten LogicHandler, welcher sich mit der Ladelogik der Dozenten in der Dashboard Ansicht befasst.
+
+### Anforderungen
+Für unser Projekt wird eine stabile Internetanbindung benötigt, da wir Bootstrap v5.2 per URL (CDN) importiert haben.
+
+Bootstrap ist eine Bibliothek, die Styles, Icons und JavaScript in eine Webseite einbinden kann, um das erstellen von vorgefertigten Komponenten zu ermöglichen.
+Im Rahmen unserer Projektarbeit haben wir manche der Standardwerte von Bootstrap überschrieben.
+
+## Farbschema
+Als Farben haben wir uns für ein kräftiges Rot in Kombination mit einem Grauton entschieden.
+
+In der Farbtheorie wird Rot oft mit Wut und Agressionen, jedoch auch mit Liebe und Harmonie verbunden. Da wir diese Kombination aus Gefühlen als eine recht passende Beschreibung eines Studiums angesehen haben, haben wir die Farbe #e2001a als Primärfarbe gewählt.
+
+Da die Kombination aus Rot und Grau aus unserer Sicht professionell wirkt und außerdem die Farbkombination der DHBW wiederspiegelt haben wir als Sekundäre Farbe #5c6971 gewählt.
+
+Als Hintergrundfarbe haben wir zudem nicht ein klares Weiß gewählt, sondern einen sehr hellen grauton.
+Durch diese Entscheidung konnten wir einzelne Komponenten der Webseite besser hervorheben und unsere Augen schonen.
+
+## Anleitung zum starten
+Um unsere Webseite zu testen kann die Datei index.html im Hauptverzeichnis im Browser geöffnert werden.
+
+Unsere Webseite ist alternativ auch über [uniplanner.de](https://uniplanner.de) erreichbar (Stand 12.12.2022)
+
+Auf der Webseite befindet sich im Bereich Funktionen folgende Kurzanleitung, die veranschaulicht, in welcher Reihenfolge das erstellen von Daten möglich ist.
+- Über das Dropdownmenü "Verwaltung", gelangen Sie zu den jeweiligen Seiten für die Datenerfassung
+- Zu Beginn können Sie einen Studiengang, sowie einen oder mehrere Termine, bestehend aus einem Start- und Enddatum, so wie der jeweiligen Uhrzeit, anlegen
+- Haben Sie das getan, ist es Ihnen bereits möglich Semester und Dozenten mit allen erforderlichen Daten einzutragen
+- Navigieren Sie nun in den Bereich Jahrgänge und tragen Sie die jeweiligen Daten ein
+- Nun haben Sie alle nötigen Daten um Einträge zu Vorlesungen zu erstellen
+- Nachdem Sie alle Daten ins System eingetragen haben, können Sie über das Dashboard einen Dozenten auswählen, um dessen Kontaktdaten, Vorlesungen und einige weiteren Daten anzusehen
+
+Knöpfe zum erstellen von Daten sind immer durch ein +-Symbol erkennbar
+
+Knöpfe zum editieren von Daten sind immer durch ein Stift-Symbol erkennbar
+
+Knöpfe zum löschen von Daten sind immer durch ein Mülleimer-Symbol erkennbar
+
+Um die manuelle Datenerstellung zu überspringen und die Webseite mit Testdaten zu füllen, kann jedoch auch in der Konsole der JS Befehl loadDummyData() ausgeführt werden.
diff --git a/semesters/index.html b/semesters/index.html
new file mode 100644
index 0000000..d9e298c
--- /dev/null
+++ b/semesters/index.html
@@ -0,0 +1,197 @@
+
+
+
+
+ UniPlanner
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Semester
+
+
+
+
+
+
+
+
+
+ #
+ Name
+ Start
+ Ende
+ Nummer
+ Studiengang
+
+
+
+
+
+
+
+ Copyright © 2022 Ali Fistik, Jonas Braus, Simon Schmieder
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/studyClasses/index.html b/studyClasses/index.html
new file mode 100644
index 0000000..44e8527
--- /dev/null
+++ b/studyClasses/index.html
@@ -0,0 +1,197 @@
+
+
+
+
+ UniPlanner
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Jahrgänge
+
+
+
+
+
+
+
+
+
+ #
+ Name
+ Start
+ Ende
+ Semester
+ Studiengang
+
+
+
+
+
+
+
+ Copyright © 2022 Ali Fistik, Jonas Braus, Simon Schmieder
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/studyProgram/index.html b/studyProgram/index.html
new file mode 100644
index 0000000..e357428
--- /dev/null
+++ b/studyProgram/index.html
@@ -0,0 +1,194 @@
+
+
+
+
+ UniPlanner
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Studiengang
+
+
+
+
+
+
+
+
+
+ #
+ Name
+ Kürzel
+
+
+
+
+
+
+
+ Copyright © 2022 Ali Fistik, Jonas Braus, Simon Schmieder
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
+ 
+ 
+ 
+
+ 
+
+ 
+
+