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

General: Allow to switch courses from the course icon #8669

Merged
merged 48 commits into from
Jun 8, 2024
Merged

General: Allow to switch courses from the course icon #8669

Show file tree
Hide file tree
Changes from 5 commits
Commits
Show all changes
48 commits
Select commit Hold shift + click to select a range
c9d817b
added first draft of course switching
az108 May 25, 2024
031ff3e
fixed navbar behaviour
az108 May 25, 2024
34b28df
added comments
az108 May 25, 2024
3d110e9
Merge branch 'develop' into feature/general/course-switching
az108 May 25, 2024
6463728
Update src/main/webapp/app/overview/course-overview.component.ts
az108 May 25, 2024
f818946
Update package.json
az108 May 25, 2024
a503e37
removed unused import
az108 May 25, 2024
bfe9e62
Merge remote-tracking branch 'origin/feature/general/course-switching…
az108 May 25, 2024
77ba79f
Update package.json
az108 May 25, 2024
605a09f
Delete package-lock.json
az108 May 25, 2024
7f43f27
Revert "Delete package-lock.json"
az108 May 25, 2024
4560632
renamed method and reverted commit
az108 May 25, 2024
23543d5
Update package-lock.json
az108 May 25, 2024
bad4f0b
renamed method and extended range of clickable button
az108 May 25, 2024
df64b62
made all allignments relative and updated html code
az108 May 26, 2024
b164172
made whole container clickable and removed click number attribute
az108 May 26, 2024
c053be0
implemented changes from reviews
az108 May 26, 2024
4cb6887
fixed small error
az108 May 26, 2024
bf7b048
fixed small error
az108 May 26, 2024
9736c61
alligned icon and text better
az108 May 26, 2024
90c07ca
implemented feedback from ramona
az108 May 27, 2024
56c40c3
fixed visual bug in dropdown
az108 May 27, 2024
f9bba22
fixed centering of course dropdown
az108 May 28, 2024
bd26689
fixed failing client tests due to adjustments
az108 May 28, 2024
600adaa
Merge branch 'develop' into feature/general/course-switching
MarkusPaulsen May 29, 2024
1e05a62
Implemented Markus feedback
az108 May 29, 2024
707efef
Magic Numbers
az108 May 29, 2024
42be49e
implemented feedback
az108 May 31, 2024
58b3679
implemented feedback
az108 Jun 3, 2024
78da14a
implemented feedback
az108 Jun 3, 2024
5d99192
updated html
az108 Jun 3, 2024
93cd35e
updated html
az108 Jun 3, 2024
2ee88bf
fix html
az108 Jun 3, 2024
5f6953e
fix amount of recently accessed courses
az108 Jun 3, 2024
2f2d34a
coderabbit suggestion implemented
az108 Jun 3, 2024
f0d1ade
feedback implemented
az108 Jun 4, 2024
a138611
unsubscribe fixed
az108 Jun 4, 2024
f9f6c10
removed unused variables and renamed variable
az108 Jun 4, 2024
700fe19
fixed comment
az108 Jun 4, 2024
287ff8b
fix client side test
az108 Jun 4, 2024
65ccde6
added test
az108 Jun 4, 2024
f5099dd
fixed client tests and added tests
az108 Jun 4, 2024
aa929d9
Merge branch 'develop' into feature/general/course-switching
az108 Jun 5, 2024
7163843
Merge remote-tracking branch 'refs/remotes/origin/develop' into featu…
az108 Jun 5, 2024
476dd53
Merge remote-tracking branch 'origin/feature/general/course-switching…
az108 Jun 5, 2024
7ed579b
fixed empty courses list bug
az108 Jun 5, 2024
ac41e34
fixed scenario where no icon could be shown
az108 Jun 5, 2024
7ad7e75
fixed scenario where no icon could be shown
az108 Jun 5, 2024
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
60 changes: 60 additions & 0 deletions package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

5 changes: 3 additions & 2 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,8 @@
"@angular/forms": "17.3.9",
"@angular/localize": "17.3.9",
"@angular/material": "17.3.9",
"@angular/platform-browser-dynamic": "17.3.9",
"@angular/platform-browser": "17.3.9",
"@angular/platform-browser-dynamic": "17.3.9",
az108 marked this conversation as resolved.
Show resolved Hide resolved
"@angular/router": "17.3.9",
"@angular/service-worker": "17.3.9",
"@ctrl/ngx-emoji-mart": "9.2.0",
Expand Down Expand Up @@ -50,9 +50,9 @@
"crypto-js": "4.2.0",
"dayjs": "1.11.11",
"diff-match-patch-typescript": "1.0.8",
"fast-json-patch": "3.1.1",
"dompurify": "3.1.3",
"export-to-csv": "1.3.0",
"fast-json-patch": "3.1.1",
az108 marked this conversation as resolved.
Show resolved Hide resolved
"franc-min": "6.2.0",
"interactjs": "1.10.27",
"ismobilejs-es5": "0.0.1",
Expand Down Expand Up @@ -118,6 +118,7 @@
"@angular/cli": "17.3.7",
"@angular/compiler-cli": "17.3.9",
"@angular/language-service": "17.3.9",
"@playwright/test": "^1.44.1",
julian-christl marked this conversation as resolved.
Show resolved Hide resolved
"@sentry/types": "7.114.0",
"@types/crypto-js": "4.2.2",
"@types/d3-shape": "3.1.6",
Expand Down
48 changes: 48 additions & 0 deletions src/main/webapp/app/overview/course-overview.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,54 @@
opened="true"
mode="side"
>
@if (!isNavbarCollapsed) {
<div id="container">
<div id="courseDropdownButton" (click)="dropdownCourses = true">
<fa-icon [icon]="faChevronDown" />
<div id="dropdownCourses" [ngClass]="{ active: dropdownCourses }">
<ul>
@for (course of courses; track course) {
<li>
<a (click)="switchCourse(course); dropdownCourses = false">
@if (course.courseIcon) {
<span>
<jhi-secured-image [src]="course.courseIcon" />
</span>
}
{{ course?.title }}</a
>
</li>
}
</ul>
</div>
</div>
</div>
} @else {
<div id="containerCollapsed">
<div id="courseDropdownButtonCollapsed" (click)="dropdownCourses = true">
<fa-icon [icon]="faChevronDown" />
<div id="dropdownCoursesCollapsed" [ngClass]="{ active: dropdownCourses }">
<ul>
@for (course of courses; track course) {
<li>
<a (click)="switchCourse(course); dropdownCourses = false">
@if (course.courseIcon) {
<span>
<jhi-secured-image [src]="course.courseIcon" />
</span>
} @else {
<div class="course-circle d-flex align-items-center justify-content-center" style="margin-left: -12px">
<span class="fs-4" style="margin-left: 1px">{{ course?.title | slice: 0 : 1 }}</span>
</div>
}
</a>
</li>
}
</ul>
</div>
</div>
</div>
}
<div class="sidebar-container d-flex h-100 justify-content-between flex-column" [ngClass]="{ collapsed: isNavbarCollapsed }">
<!-- NavItems -->
<div>
Expand Down
110 changes: 110 additions & 0 deletions src/main/webapp/app/overview/course-overview.component.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -253,3 +253,113 @@ jhi-secured-image {
max-height: 91px; // To avoid cut offs in the dropdown menu content
}
}

#container {
display: flex;
position: absolute;
#courseDropdownButton {
cursor: pointer;
position: relative;
padding-top: 30px;
padding-left: 20px;
padding-right: 30px;
top: 18px;
left: 6px;
#dropdownCourses {
display: none;
position: absolute;
width: 210px;
overflow: auto;
background-color: var(--dropdown-bg);
border-radius: 10px;
top: 100%;
left: 0;
border: 1px solid var(--border-color);
z-index: 9999;
ul {
list-style: none;
margin: 0px;
display: flex;
flex-direction: column;
padding: 0px;
}
li {
padding: 0;
border-bottom: 1px solid #ccc;
&:last-child {
border-bottom: none;
}
}
a {
text-decoration: none;
color: var(--bs-body-color);
padding: 15px 20px;
display: flex;
&:hover {
color: var(--link-item-color);
}
span {
margin-left: -12px; /* Add margin to the right of the icon */
}
}
}
#dropdownCourses.active {
display: block;
}
}
}

#containerCollapsed {
display: flex;
position: absolute;
#courseDropdownButtonCollapsed {
cursor: pointer;
position: relative;
padding-top: 30px;
padding-left: 20px;
padding-right: 5px;
top: 18px;
left: 6px;
#dropdownCoursesCollapsed {
display: none;
position: absolute;
width: 58px;
overflow: auto;
background-color: var(--dropdown-bg);
border-radius: 10px;
top: 100%;
left: 0;
border: 1px solid var(--border-color);
z-index: 9999;
ul {
list-style: none;
margin: 0px;
display: flex;
flex-direction: column;
padding: 0px;
}
li {
padding: 0;
border-bottom: 1px solid #ccc;
&:last-child {
border-bottom: none;
}
}
a {
text-decoration: none;
color: var(--bs-body-color);
padding: 15px 20px;
display: flex;
&:hover {
color: var(--link-item-color);
}
span {
margin-left: -12px; /* Add margin to the right of the icon */
}
}
}
#dropdownCoursesCollapsed.active {
display: block;
}
}
}
Loading
Loading