Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fix group order #1150

Merged
merged 2 commits into from
Sep 6, 2023
Merged

Fix group order #1150

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
3b2f0ed
Fix group order
MatthiasReumann Sep 5, 2023
4aeccd9
Refactor courses.ts
MatthiasReumann Sep 5, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions web/template/home.gohtml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -431,18 +431,18 @@
</header>
<section>
<template x-if="courseStreams.hasElements()">
<article class="flex flex-col" :class="{'flex-col-reverse' : !isOldestFirst() }">
<article class="grid">
<template
x-for="[m, streams] of Object.entries(courseStreams.get(sortFn(streamSortMode), filterPred(streamFilterMode)))">
x-for="group in courseStreams.get(sortFn(streamSortMode), filterPred(streamFilterMode))">
<article class="mb-8">
<header class="mb-2">
<h6 class="font-semibold" x-text="getMonthName(m)"></h6>
<h6 class="font-semibold" x-text="group[0].GetMonthName()"></h6>
</header>
<section class="grid gap-3 md:grid-cols-2 grid-cols-1"
:class="plannedStreams.hasElements()
? 'xl:grid-cols-4 lg:grid-cols-3'
: 'xl:grid-cols-5 lg:grid-cols-4'">
<template x-for="vod in streams" :key="vod.ID">
<template x-for="vod in group" :key="vod.ID">
<article
class="tum-live-stream group sm:col-span-1 col-span-full"
@click.outside="vod.Dropdown.toggle(false)">
Expand Down
33 changes: 25 additions & 8 deletions web/ts/api/courses.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,16 +42,16 @@ export class Stream implements Identifiable {
});
}

public MonthOfStart(): string {
return new Date(this.Start).toLocaleString("default", { month: "short" });
public StartDate(): Date {
return new Date(this.Start);
}

public NumericMonthOfStart(): number {
return new Date(this.Start).getMonth() + 1;
public MonthOfStart(): string {
return this.StartDate().toLocaleString("default", { month: "short" });
}

public DayOfStart(): number {
return new Date(this.Start).getDate();
return this.StartDate().getDate();
}

public TimeOfStart(): string {
Expand All @@ -63,11 +63,11 @@ export class Stream implements Identifiable {
}

public IsToday(): boolean {
return same_day(new Date(this.Start), new Date());
return same_day(this.StartDate(), new Date());
}

public MinutesLeftToStart(): number {
return Math.round((new Date(this.Start).valueOf() - new Date().valueOf()) / 60000);
return Math.round((this.StartDate().valueOf() - new Date().valueOf()) / 60000);
}

public DurationString() {
Expand All @@ -86,7 +86,7 @@ export class Stream implements Identifiable {
}

public CompareStart(other: Stream) {
const a = new Date(this.Start);
const a = this.StartDate();
const b = new Date(other.Start);
if (a < b) {
return 1;
Expand All @@ -101,6 +101,23 @@ export class Stream implements Identifiable {
this.Thumbnail.src = `/api/stream/${this.ID}/thumbs/vod`;
}

public GetMonthName(): string {
return [
"January",
"February",
"March",
"April",
"May",
"June",
"July",
"August",
"September",
"October",
"November",
"December",
][this.StartDate().getMonth()];
}

private static TimeOf(d: string): string {
return new Date(d).toLocaleTimeString("default", { hour: "2-digit", minute: "2-digit" });
}
Expand Down
21 changes: 2 additions & 19 deletions web/ts/components/course.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ export function courseContext(slug: string, year: number, term: string, userId:

course: new Course() as Course,

courseStreams: new GroupedSmartArray<Stream, number>([], (_) => 0),
courseStreams: new GroupedSmartArray<Stream, number>(),
plannedStreams: new Paginator<Stream>([], 3),
upcomingStreams: new Paginator<Stream>([], 3),

Expand Down Expand Up @@ -64,7 +64,7 @@ export function courseContext(slug: string, year: number, term: string, userId:
this.upcomingStreams.set(this.course.Upcoming).reset();
this.loadProgresses(this.course.Recordings.map((s: Stream) => s.ID)).then((progresses) => {
this.course.Recordings.forEach((s: Stream, i) => (s.Progress = progresses[i]));
this.courseStreams.set(this.course.Recordings, (s: Stream) => s.NumericMonthOfStart());
this.courseStreams.set(this.course.Recordings, (s: Stream) => s.StartDate().getMonth());
});
console.log("🌑 init course", this.course);
});
Expand Down Expand Up @@ -135,23 +135,6 @@ export function courseContext(slug: string, year: number, term: string, userId:
dropdown.toggle(false);
},

getMonthName(m: number): string {
return [
"January",
"February",
"March",
"April",
"May",
"June",
"July",
"August",
"September",
"October",
"November",
"December",
][m - 1];
},

async loadCourse() {
this.course = await CoursesAPI.get(this.slug, this.year, this.term, this.userId);
},
Expand Down
38 changes: 22 additions & 16 deletions web/ts/utilities/smartarray.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,19 +25,18 @@ export class SmartArray<T> {
}
}

export class GroupedSmartArray<T, K extends keyof never> {
export class GroupedSmartArray<T, K> {
private list: T[];
private key: (i: T) => K;

constructor(list: T[], key: (i: T) => K) {
this.list = list;
this.key = key;
constructor() {
this.list = [];
}

get(sortFn?: CompareFunction<T>, filterPred?: FilterPredicate<T>) {
const copy = filterPred ? [...this.list].filter(filterPred) : [...this.list];
const _list = sortFn ? copy.sort(sortFn) : copy;
return groupBy(_list, this.key);
return this.group(_list, this.key);
}

set(list: T[], key: (i: T) => K): GroupedSmartArray<T, K> {
Expand All @@ -49,18 +48,25 @@ export class GroupedSmartArray<T, K extends keyof never> {
hasElements() {
return this.list.length > 0;
}

private group(list: T[], key: (i: T) => K) {
const groups = [];

let lastKey = null;
let currentGroup = [];

list.forEach((l) => {
if (lastKey !== null && key(l) != lastKey) {
groups.push(currentGroup);
currentGroup = [];
}
currentGroup.push(l);
lastKey = key(l);
});
groups.push(currentGroup);
return groups;
}
}

export type CompareFunction<T> = (a: T, b: T) => number;
export type FilterPredicate<T> = (o: T) => boolean;

/* eslint-disable */
function groupBy<T, K extends keyof never>(list: T[], getKey: (item: T) => K) {
/* eslint-disable */
return list.reduce(function (previous, currentItem) {
const group = getKey(currentItem);
if (!previous[group]) previous[group] = [];
previous[group].push(currentItem);
return previous;
}, {} as Record<K, T[]>);
}
Loading