Frontend/src/app/components/change/change.component.html

@@ -1 +1 @@
-<p>Change details</p>
+<p>change works!</p>

Frontend/src/app/components/datepicker/datepicker.component.css

@@ -1,23 +1,3 @@
 .datepicker {
     text-align: center;
 }
-
-.switchWeekButton {
-    background-color: dimgrey; /* Green */
-    border: none;
-    color: #E0E5E9;
-    padding: .15em .5em;
-    text-align: center;
-    display: inline-block;
-    border-radius: .5em;
-    margin: .5em;
-}
-
-.datePickerDropdown {
-    background-color: dimgrey;
-    border: none;
-    color: #E0E5E9;
-    padding: .15em .5em;
-    border-radius: .5em;
-    margin: .1em;
-}

Frontend/src/app/components/datepicker/datepicker.component.html

@@ -1,21 +1,18 @@
 <div class="datepicker">
     <p *ngIf="itIsWednesday">It is Wednesday, my dudes!</p>
-    <button (click)="switchToPreviousWeek()" class="switchWeekButton">&lt;&lt; Previous week</button>
+    <select name="year" (change)="handleYearChange()" [(ngModel)]="selectedYear">
-    <select name="year" (change)="handleYearChange()" [(ngModel)]="selectedYear" class="datePickerDropdown">
         <option *ngFor="let year of years">
             {{year}}
         </option>
     </select>
-    <select name="month" (change)="handleMonthChange()" [(ngModel)]="selectedMonth" class="datePickerDropdown">
+    <select name="month" (change)="handleMonthChange()" [(ngModel)]="selectedMonth">
         <option *ngFor="let month of months">
             {{month}}
         </option>
     </select>
-    <select name="day" (change)="handleDayChange()" [(ngModel)]="selectedDay" class="datePickerDropdown">
+    <select name="day" (change)="handleDayChange()" [(ngModel)]="selectedDay">
         <option *ngFor="let day of days">
             {{day}}
         </option>
     </select>
-    <button (click)="switchToToday()" class="switchWeekButton">Today</button>
-    <button (click)="switchToNextWeek()" class="switchWeekButton">Next week &gt;&gt;</button>
 </div>

Frontend/src/app/components/datepicker/datepicker.component.ts

@@ -147,7 +147,7 @@ export class DatepickerComponent implements OnInit {
             mondayInWeekDate.setDate(selectedDate.getDate() - difference);
         }
 
-        let yearString = mondayInWeekDate.getFullYear().toString();
+        let yearString = mondayInWeekDate.getFullYear();
         let monthString = (mondayInWeekDate.getMonth() + 1).toString().padStart(2, '0');
         let dayString = mondayInWeekDate.getDate().toString().padStart(2, '0');
 
@@ -163,31 +163,4 @@ export class DatepickerComponent implements OnInit {
         return new Date(year, month, 0).getDate();
     }
 
-    switchToNextWeek() {
-        let currentDate = new Date(parseInt(this.selectedYear), parseInt(this.selectedMonth)-1, parseInt(this.selectedDay));
-        let newDate = currentDate;
-        newDate.setDate(currentDate.getDate() + 7);
-        this.selectedYear = newDate.getFullYear().toString();
-        this.selectedMonth = (newDate.getMonth()+1).toString().padStart(2, '0');
-        this.selectedDay = newDate.getDate().toString().padStart(2, '0');
-        this.handleDateChange();
-    }
-
-    switchToPreviousWeek() {
-        let currentDate = new Date(parseInt(this.selectedYear), parseInt(this.selectedMonth)-1, parseInt(this.selectedDay));
-        let newDate = currentDate;
-        newDate.setDate(currentDate.getDate() - 7);
-        this.selectedYear = newDate.getFullYear().toString();
-        this.selectedMonth = (newDate.getMonth()+1).toString().padStart(2, '0');
-        this.selectedDay = newDate.getDate().toString().padStart(2, '0');
-        this.handleDateChange();
-    }
-
-    switchToToday() {
-        let currentDate = new Date();
-        this.selectedYear = currentDate.getFullYear().toString();
-        this.selectedMonth = (currentDate.getMonth()+1).toString().padStart(2, '0');
-        this.selectedDay = currentDate.getDate().toString().padStart(2, '0');
-        this.handleDateChange();
-    }
 }

Frontend/src/app/components/day/day.component.html

@@ -1,4 +1,6 @@
-<h1>{{weekDayName}}</h1>
+<h1>Day</h1>
-<div *ngFor="let event of events">
+<p *ngFor="let event of events">
-    <app-event [event]="event"></app-event>
+    Titel: {{event.latest_event_summary}}
-</div>
+    Start: {{event.latest_start_date}}
+    Gelöscht: {{event.changes[event.changes.length-1].is_deleted}}
+</p>

Frontend/src/app/components/day/day.component.ts

@@ -7,16 +7,12 @@ import {Event} from '../../models/event';
     styleUrls: ['./day.component.css']
 })
 export class DayComponent implements OnInit {
-    @Input() events: Event[] = [];
+    @Input() events: Event[]= [];
-    @Input() dayOfWeek: number = 0;
-
-    weekDayName: string = '';
 
     constructor() {
     }
 
     ngOnInit(): void {
-        this.weekDayName = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'][this.dayOfWeek];
     }
 
 }

Frontend/src/app/components/event-detail/event-detail.component.html

@@ -1 +1 @@
-<p>Event details popover</p>
+<p>event-detail works!</p>

Frontend/src/app/components/event/event.component.css

@@ -1,17 +0,0 @@
-.event-card {
-    border-radius: .5em;
-    padding: .25em;
-    margin: .5em;
-}
-
-.event-card-lecture {
-    background-color: #0A62D0;
-}
-
-.event-card-exam {
-    background-color: orangered;
-}
-
-.event-card-blocker {
-    background-color: dimgrey;
-}

Frontend/src/app/components/event/event.component.html

@@ -1,5 +1 @@
-<div class="event-card {{eventTypeClass}}">
+<p>event works!</p>
-    Titel: {{event.latest_event_summary}}
-    Start: {{event.latest_start_date}}
-    Gelöscht: {{event.changes[event.changes.length-1].is_deleted}}
-</div>

Frontend/src/app/components/event/event.component.ts

@@ -1,5 +1,4 @@
-import {Component, Input, OnInit} from '@angular/core';
+import {Component, OnInit} from '@angular/core';
-import {Event} from '../../models/event';
 
 @Component({
     selector: 'app-event',
@@ -7,31 +6,11 @@ import {Event} from '../../models/event';
     styleUrls: ['./event.component.css']
 })
 export class EventComponent implements OnInit {
-    @Input() event: Event = {} as Event;
-    eventTypeClass: string = '';
 
     constructor() {
     }
 
     ngOnInit(): void {
-        let latestFullChange = this.event.changes[this.event.changes.length - 1];
-        if(latestFullChange.is_deleted) {
-            latestFullChange = this.event.changes[this.event.changes.length - 2];
-        }
-
-        switch(latestFullChange.new_categories) {
-            case 'Prüfung':
-                this.eventTypeClass = 'event-card-exam';
-                break;
-            case 'Lehrveranstaltung':
-                this.eventTypeClass = 'event-card-lecture';
-                break;
-            case 'Sonstige':
-                this.eventTypeClass = 'event-card-blocker';
-                break;
-            default:
-                this.eventTypeClass = 'event-card-blocker';
-        }
     }
 
 }

Frontend/src/app/components/week/week.component.html

@@ -1,5 +1,3 @@
-<div id="week" class="container-fluid">
+<div id="week">
-    <div class="row">
+    <app-day *ngFor="let day of eventsPerDay" [events]="day"></app-day>
-        <app-day *ngFor="let day of eventsPerDay" [events]="day" [dayOfWeek]="eventsPerDay.indexOf(day)" class="col"></app-day>
-    </div>
 </div>