diff --git a/src/app/modules/project/overview/project-list/project/project.component.ts b/src/app/modules/project/overview/project-list/project/project.component.ts
index 9a350e6f..94aba8bb 100644
--- a/src/app/modules/project/overview/project-list/project/project.component.ts
+++ b/src/app/modules/project/overview/project-list/project/project.component.ts
@@ -42,8 +42,9 @@ export class ProjectComponent {
*/
public animationTriggered = false;
- // temporary string of tags
- public tags = ['UX', 'JavaScript', 'Angular', 'C#', 'HelloWorld', 'UX', 'JavaScript', 'Angular'];
+ /**
+ * Two arrays to keep track of tags to be displayed or not displayed:
+ */
public displayedTags = [];
public overflowTags = [];
@@ -60,12 +61,12 @@ export class ProjectComponent {
ngOnInit(): void {
this.resizeObservable$ = fromEvent(window, 'resize');
this.resizeSubscription$ = this.resizeObservable$.subscribe(evt => {
- this.displayMyTags(this.tags, document.getElementsByClassName('project-tag-group')[0].clientWidth);
+ this.displayMyTags(this.project.tags, document.getElementsByClassName('project-tag-group')[0].clientWidth);
});
}
ngAfterViewInit() {
- this.displayMyTags(this.tags, document.getElementsByClassName('project-tag-group')[0].clientWidth);
+ this.displayMyTags(this.project.tags, document.getElementsByClassName('project-tag-group')[0].clientWidth);
}
ngOnDestroy() {
@@ -118,13 +119,13 @@ export class ProjectComponent {
}
}
- public displayMyTags(tagList: string[], maxWidth: number) {
+ public displayMyTags(tagList, maxWidth: number) {
let totalLength = 0;
const displayedTags = [];
const overflowTags = [];
tagList.forEach(function (tag) {
- totalLength += (tag.length * 10 + 25);
+ totalLength += (tag.name.length * 10 + 25);
if (totalLength < maxWidth) {
displayedTags.push(tag);
} else {
@@ -132,8 +133,8 @@ export class ProjectComponent {
}
});
- if (overflowTags.length < (this.tags.length - displayedTags.length)) {
- overflowTags.push('+' + (this.tags.length - displayedTags.length - overflowTags.length) + ' more');
+ if (overflowTags.length < (tagList.length - displayedTags.length)) {
+ overflowTags.push('+' + (tagList.length - displayedTags.length - overflowTags.length) + ' more');
}
this.displayedTags = displayedTags;
From c65fa3dd56c28106ea492fca1036474abd45f712 Mon Sep 17 00:00:00 2001
From: Julia <71012148+juliaslaats@users.noreply.github.com>
Date: Thu, 16 Dec 2021 10:18:42 +0100
Subject: [PATCH 19/30] created tagservice
---
src/app/config/api-config.ts | 4 +++-
src/app/models/resources/project-tag-add.ts | 20 ++++++++++++++++++
.../models/resources/project-tag-update.ts | 21 +++++++++++++++++++
src/app/services/tag.service.ts | 17 +++++++++++++++
4 files changed, 61 insertions(+), 1 deletion(-)
create mode 100644 src/app/models/resources/project-tag-add.ts
create mode 100644 src/app/models/resources/project-tag-update.ts
create mode 100644 src/app/services/tag.service.ts
diff --git a/src/app/config/api-config.ts b/src/app/config/api-config.ts
index ccd036a8..816bd5f9 100644
--- a/src/app/config/api-config.ts
+++ b/src/app/config/api-config.ts
@@ -33,6 +33,7 @@ export interface ApiConfig {
uploadFileRoute: string;
projectLikes: string;
categoryRoute: string;
+ tagRoute: string;
}
export const API_CONFIG: ApiConfig = {
@@ -50,6 +51,7 @@ export const API_CONFIG: ApiConfig = {
wizardPageRoute: 'wizardpage',
uploadFileRoute: 'file',
projectLikes: 'project/like',
- categoryRoute: 'category'
+ categoryRoute: 'category',
+ tagRoute: 'tag'
};
diff --git a/src/app/models/resources/project-tag-add.ts b/src/app/models/resources/project-tag-add.ts
new file mode 100644
index 00000000..27509624
--- /dev/null
+++ b/src/app/models/resources/project-tag-add.ts
@@ -0,0 +1,20 @@
+/*
+ * Digital Excellence Copyright (C) 2020 Brend Smits
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Lesser General Public License as published
+ * by the Free Software Foundation version 3 of the License.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty
+ * of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+ * See the GNU Lesser General Public License for more details.
+ *
+ * You can find a copy of the GNU Lesser General Public License
+ * along with this program, in the LICENSE.md file in the root project directory.
+ * If not, see https://www.gnu.org/licenses/lgpl-3.0.txt
+ */
+
+export interface ProjectTagAdd {
+ name: string;
+}
diff --git a/src/app/models/resources/project-tag-update.ts b/src/app/models/resources/project-tag-update.ts
new file mode 100644
index 00000000..6001ef02
--- /dev/null
+++ b/src/app/models/resources/project-tag-update.ts
@@ -0,0 +1,21 @@
+/*
+ * Digital Excellence Copyright (C) 2020 Brend Smits
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Lesser General Public License as published
+ * by the Free Software Foundation version 3 of the License.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty
+ * of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+ * See the GNU Lesser General Public License for more details.
+ *
+ * You can find a copy of the GNU Lesser General Public License
+ * along with this program, in the LICENSE.md file in the root project directory.
+ * If not, see https://www.gnu.org/licenses/lgpl-3.0.txt
+ */
+
+export interface ProjectTagUpdate {
+ id: number;
+ name: string;
+}
diff --git a/src/app/services/tag.service.ts b/src/app/services/tag.service.ts
new file mode 100644
index 00000000..a9bc8a71
--- /dev/null
+++ b/src/app/services/tag.service.ts
@@ -0,0 +1,17 @@
+import { HttpBaseService } from './http-base.service';
+
+import { HttpClient } from '@angular/common/http';
+import { Injectable } from '@angular/core';
+import { API_CONFIG } from 'src/app/config/api-config';
+import { ProjectTag } from 'src/app/models/domain/projectTag';
+import { ProjectTagAdd } from 'src/app/models/resources/project-tag-add';
+import { ProjectTagUpdate } from 'src/app/models/resources/project-tag-update';
+
+@Injectable({
+ providedIn: 'root'
+})
+export class TagService extends HttpBaseService
{
+ constructor(http: HttpClient) {
+ super(http, API_CONFIG.url + API_CONFIG.tagRoute);
+ }
+}
From e04e7374af6857952e0a054610d76c2cf43648a7 Mon Sep 17 00:00:00 2001
From: Julia <71012148+juliaslaats@users.noreply.github.com>
Date: Thu, 16 Dec 2021 10:34:22 +0100
Subject: [PATCH 20/30] added tags to project-add and project-update
---
src/app/models/resources/project-add.ts | 2 ++
src/app/models/resources/project-update.ts | 2 ++
2 files changed, 4 insertions(+)
diff --git a/src/app/models/resources/project-add.ts b/src/app/models/resources/project-add.ts
index 447c9267..1e783c51 100644
--- a/src/app/models/resources/project-add.ts
+++ b/src/app/models/resources/project-add.ts
@@ -19,6 +19,7 @@ import { CollaboratorAdd } from './collaborator-add';
import { CallToAction } from 'src/app/models/domain/call-to-action';
import { ProjectCategory } from 'src/app/models/domain/projectCategory';
+import { ProjectTag } from 'src/app/models/domain/projectTag';
export interface ProjectAdd {
userId: number;
@@ -31,4 +32,5 @@ export interface ProjectAdd {
iconId?: number;
imageIds?: number[];
categories?: ProjectCategory[];
+ tags?: ProjectTag[];
}
diff --git a/src/app/models/resources/project-update.ts b/src/app/models/resources/project-update.ts
index 95beb796..00190c1c 100644
--- a/src/app/models/resources/project-update.ts
+++ b/src/app/models/resources/project-update.ts
@@ -19,6 +19,7 @@ import { CollaboratorUpdate } from './collaborator-update';
import { CallToAction } from 'src/app/models/domain/call-to-action';
import { ProjectCategory } from 'src/app/models/domain/projectCategory';
+import { ProjectTag } from 'src/app/models/domain/projectTag';
export interface ProjectUpdate {
id: number;
@@ -30,6 +31,7 @@ export interface ProjectUpdate {
url: string;
callToActions: CallToAction[];
categories: ProjectCategory[];
+ tags: ProjectTag[];
iconId?: number;
imageIds?: number[];
}
From 6e52d92f0669433b593bf13967794f8a0ca936c8 Mon Sep 17 00:00:00 2001
From: Julia <71012148+juliaslaats@users.noreply.github.com>
Date: Thu, 16 Dec 2021 11:57:40 +0100
Subject: [PATCH 21/30] added real tags to project add wizard
---
src/app/models/resources/project-add.ts | 4 ++--
.../project-tags/project-tags.component.html | 15 ++++++++-----
.../project-tags/project-tags.component.scss | 2 ++
.../project-tags/project-tags.component.ts | 22 ++++++++++++++-----
4 files changed, 31 insertions(+), 12 deletions(-)
diff --git a/src/app/models/resources/project-add.ts b/src/app/models/resources/project-add.ts
index 1e783c51..7c5bc7d5 100644
--- a/src/app/models/resources/project-add.ts
+++ b/src/app/models/resources/project-add.ts
@@ -19,7 +19,7 @@ import { CollaboratorAdd } from './collaborator-add';
import { CallToAction } from 'src/app/models/domain/call-to-action';
import { ProjectCategory } from 'src/app/models/domain/projectCategory';
-import { ProjectTag } from 'src/app/models/domain/projectTag';
+import { ProjectTagAdd } from 'src/app/models/resources/project-tag-add';
export interface ProjectAdd {
userId: number;
@@ -32,5 +32,5 @@ export interface ProjectAdd {
iconId?: number;
imageIds?: number[];
categories?: ProjectCategory[];
- tags?: ProjectTag[];
+ tags?: ProjectTagAdd[];
}
diff --git a/src/app/modules/project/add/main/wizard/wizardPages/default/project-tags/project-tags.component.html b/src/app/modules/project/add/main/wizard/wizardPages/default/project-tags/project-tags.component.html
index 2657149c..7cbe5b04 100644
--- a/src/app/modules/project/add/main/wizard/wizardPages/default/project-tags/project-tags.component.html
+++ b/src/app/modules/project/add/main/wizard/wizardPages/default/project-tags/project-tags.component.html
@@ -29,21 +29,26 @@
diff --git a/src/app/modules/project/details/summary/summary.component.ts b/src/app/modules/project/details/summary/summary.component.ts
index ec642be1..00a5e8da 100644
--- a/src/app/modules/project/details/summary/summary.component.ts
+++ b/src/app/modules/project/details/summary/summary.component.ts
@@ -11,6 +11,7 @@ import { AlertConfig } from 'src/app/models/internal/alert-config';
import { AlertType } from 'src/app/models/internal/alert-type';
import { AlertService } from 'src/app/services/alert.service';
import { LikeService } from 'src/app/services/like.service';
+import { ProjectTag } from 'src/app/models/domain/projectTag';
@Component({
selector: 'app-summary',
@@ -22,9 +23,6 @@ export class SummaryComponent {
@Input() onLike: Subject;
@Input() animationTriggered: boolean;
- // temporary string of tags
- public tags = ['UX', 'Angular', 'HelloWorld', 'Java', 'JavaScript', 'UI', 'My Tag', 'C#', 'Python', 'Fontys', 'UX', 'Angular'];
-
// strings to store the tags to handle displaying them
public displayedTags = [];
public overflowTags = [];
@@ -42,12 +40,12 @@ export class SummaryComponent {
ngOnInit(): void {
this.resizeObservable$ = fromEvent(window, 'resize');
this.resizeSubscription$ = this.resizeObservable$.subscribe(evt => {
- this.displayMyTags(this.tags, document.getElementsByClassName('detail-tag-group')[0].clientWidth * 2);
+ this.displayMyTags(this.project.tags, document.getElementsByClassName('detail-tag-group')[0].clientWidth * 2);
});
}
ngAfterViewInit() {
- this.displayMyTags(this.tags, document.getElementsByClassName('detail-tag-group')[0].clientWidth * 2);
+ this.displayMyTags(this.project.tags, document.getElementsByClassName('detail-tag-group')[0].clientWidth * 2);
}
ngOnDestroy() {
@@ -90,13 +88,13 @@ export class SummaryComponent {
* Method to split tags into what fits directly and what is
* in the collapsable part
*/
- public displayMyTags(tagList: string[], maxWidth: number) {
+ public displayMyTags(tagList: ProjectTag[], maxWidth: number) {
let totalLength = 0;
const displayedTags = [];
const overflowTags = [];
tagList.forEach(function (tag) {
- totalLength += (tag.length * 10 + 30);
+ totalLength += (tag.name.length * 10 + 30);
if (totalLength < maxWidth) {
displayedTags.push(tag);
} else {
diff --git a/src/app/services/wizard.service.ts b/src/app/services/wizard.service.ts
index 82631496..5c55f1a8 100644
--- a/src/app/services/wizard.service.ts
+++ b/src/app/services/wizard.service.ts
@@ -46,7 +46,8 @@ export class WizardService {
shortDescription: '',
uri: '',
userId: 0,
- categories: []
+ categories: [],
+ tags: []
};
/**
From 141f37db0c81930246f157266aff6c0187c7b2c5 Mon Sep 17 00:00:00 2001
From: Julia <71012148+juliaslaats@users.noreply.github.com>
Date: Thu, 16 Dec 2021 16:37:48 +0100
Subject: [PATCH 23/30] fixed remove in wizard, added check to projectcard
---
.../project-tags/project-tags.component.html | 69 +++++++++----------
.../project-tags/project-tags.component.ts | 28 +++++---
.../project-list/project/project.component.ts | 21 +++---
3 files changed, 64 insertions(+), 54 deletions(-)
diff --git a/src/app/modules/project/add/main/wizard/wizardPages/default/project-tags/project-tags.component.html b/src/app/modules/project/add/main/wizard/wizardPages/default/project-tags/project-tags.component.html
index 7cbe5b04..6e33a953 100644
--- a/src/app/modules/project/add/main/wizard/wizardPages/default/project-tags/project-tags.component.html
+++ b/src/app/modules/project/add/main/wizard/wizardPages/default/project-tags/project-tags.component.html
@@ -20,45 +20,44 @@
{{step.description}}
diff --git a/src/app/modules/project/details/edit/edit.component.ts b/src/app/modules/project/details/edit/edit.component.ts
index e8372745..281a2dff 100644
--- a/src/app/modules/project/details/edit/edit.component.ts
+++ b/src/app/modules/project/details/edit/edit.component.ts
@@ -16,17 +16,19 @@
*/
import { Component, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core';
-import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
import { SafeUrl } from '@angular/platform-browser';
import { ActivatedRoute, Router } from '@angular/router';
import { finalize } from 'rxjs/operators';
import { FileUploaderComponent } from 'src/app/components/file-uploader/file-uploader.component';
import { Project } from 'src/app/models/domain/project';
import { ProjectCategory } from 'src/app/models/domain/projectCategory';
+import { ProjectTag } from 'src/app/models/domain/projectTag';
import { UploadFile } from 'src/app/models/domain/uploadFile';
import { AlertConfig } from 'src/app/models/internal/alert-config';
import { AlertType } from 'src/app/models/internal/alert-type';
import { CollaboratorAdd } from 'src/app/models/resources/collaborator-add';
+import { ProjectTagAdd } from 'src/app/models/resources/project-tag-add';
import { ProjectUpdate } from 'src/app/models/resources/project-update';
import { CallToActionsEditComponent } from 'src/app/modules/project/call-to-actions-edit/call-to-actions-edit.component';
import { AlertService } from 'src/app/services/alert.service';
@@ -64,8 +66,11 @@ export class EditComponent implements OnInit {
public categories: ProjectCategory[];
/**
- * Projects selected call to action
+ * Variables to handle the tags
*/
+ public addedTags: ProjectTagAdd[] = [];
+ public recommendedTags = [];
+ public tagInput = new FormControl('');
/**
* Project's collaborators.
@@ -145,6 +150,7 @@ export class EditComponent implements OnInit {
);
});
}
+ this.displayProjectTags();
}
public onCategoryClick(category): void {
@@ -155,6 +161,26 @@ export class EditComponent implements OnInit {
));
}
+ public displayProjectTags(): void {
+ this.project.tags.forEach(tag => {
+ this.addedTags.push({name: tag.name});
+ });
+ }
+
+ public onAddTagClick() {
+ if (this.tagInput.value.length > 0) {
+ const newTag = { name: this.tagInput.value };
+ this.addedTags.push(newTag);
+ this.tagInput.setValue('');
+ }
+ console.log(this.addedTags);
+ }
+
+ public moveTag(start: any[], end: any[], myIndex: number): void {
+ end.push(start[myIndex]);
+ start.splice(myIndex, 1);
+ }
+
/**
* Method that triggers when the upload image button is clicked on mobile
*/
@@ -219,6 +245,8 @@ export class EditComponent implements OnInit {
const editedProject: ProjectUpdate = this.editProjectForm.value;
editedProject.collaborators = this.collaborators;
editedProject.categories = this.categories.filter(category => category.selected);
+ editedProject.tags = this.addedTags;
+ console.log(editedProject);
const selectedCallToActions = this.callToActions.callToActionOptions
.filter(option => this.callToActions.selectedCallToActionOptionIds
From 0d94d5ecdf3b0497925617b8f77dacbcc40c6e2e Mon Sep 17 00:00:00 2001
From: Julia <71012148+juliaslaats@users.noreply.github.com>
Date: Fri, 17 Dec 2021 12:22:45 +0100
Subject: [PATCH 26/30] styled edit-component add tags
---
.../project/details/edit/edit.component.html | 16 +++---
.../project/details/edit/edit.component.scss | 50 +++++++++++++++++--
.../project/details/edit/edit.component.ts | 2 -
3 files changed, 55 insertions(+), 13 deletions(-)
diff --git a/src/app/modules/project/details/edit/edit.component.html b/src/app/modules/project/details/edit/edit.component.html
index 03396ded..d5964bb7 100644
--- a/src/app/modules/project/details/edit/edit.component.html
+++ b/src/app/modules/project/details/edit/edit.component.html
@@ -51,14 +51,18 @@
Project Link
Tags
-
- {{tag.name}} ×
-
+
category.selected);
editedProject.tags = this.addedTags;
- console.log(editedProject);
const selectedCallToActions = this.callToActions.callToActionOptions
.filter(option => this.callToActions.selectedCallToActionOptionIds
From 1e5db5d89d4d31506e86431bae8d11fe1e5b7c48 Mon Sep 17 00:00:00 2001
From: Julia <71012148+juliaslaats@users.noreply.github.com>
Date: Fri, 17 Dec 2021 12:29:35 +0100
Subject: [PATCH 27/30] fixed linting issue
---
src/app/modules/project/details/summary/summary.component.ts | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/app/modules/project/details/summary/summary.component.ts b/src/app/modules/project/details/summary/summary.component.ts
index 00a5e8da..eba301ec 100644
--- a/src/app/modules/project/details/summary/summary.component.ts
+++ b/src/app/modules/project/details/summary/summary.component.ts
@@ -7,11 +7,11 @@ import { Component, Input } from '@angular/core';
import { SafeUrl } from '@angular/platform-browser';
import { fromEvent, Observable, Subject, Subscription } from 'rxjs';
import { Project } from 'src/app/models/domain/project';
+import { ProjectTag } from 'src/app/models/domain/projectTag';
import { AlertConfig } from 'src/app/models/internal/alert-config';
import { AlertType } from 'src/app/models/internal/alert-type';
import { AlertService } from 'src/app/services/alert.service';
import { LikeService } from 'src/app/services/like.service';
-import { ProjectTag } from 'src/app/models/domain/projectTag';
@Component({
selector: 'app-summary',
From afa5e1ef08153af37c41d723f98f834288851937 Mon Sep 17 00:00:00 2001
From: Julia <71012148+juliaslaats@users.noreply.github.com>
Date: Fri, 17 Dec 2021 12:48:44 +0100
Subject: [PATCH 28/30] removed tag-filter-component for now
---
.../modules/project/details/edit/edit.component.scss | 12 +++++++++---
.../overview/filter-menu/filter-menu.component.html | 2 +-
2 files changed, 10 insertions(+), 4 deletions(-)
diff --git a/src/app/modules/project/details/edit/edit.component.scss b/src/app/modules/project/details/edit/edit.component.scss
index 14d5c5f6..c0fc145f 100644
--- a/src/app/modules/project/details/edit/edit.component.scss
+++ b/src/app/modules/project/details/edit/edit.component.scss
@@ -146,9 +146,9 @@
display: flex;
flex-direction: column;
margin-bottom: 5vh;
- .inline-input{
+ .inline-input {
display: flex;
- width: 40%;
+ width: 50%;
input {
flex: 0 1 auto;
background-color: white;
@@ -163,7 +163,7 @@
color: white;
border: none;
border-radius: $border-radius;
- &:hover{
+ &:hover {
background-color: $accent-color-red-secondary;
}
}
@@ -177,6 +177,12 @@
border-top: 1px solid $light-mode-grey-secondary;
}
}
+ @media only screen and (max-width: 800px) {
+ .inline-input {
+ display: flex;
+ width: 100%;
+ }
+ }
}
}
diff --git a/src/app/modules/project/overview/filter-menu/filter-menu.component.html b/src/app/modules/project/overview/filter-menu/filter-menu.component.html
index 6da1ae93..95df1c00 100644
--- a/src/app/modules/project/overview/filter-menu/filter-menu.component.html
+++ b/src/app/modules/project/overview/filter-menu/filter-menu.component.html
@@ -26,7 +26,7 @@ Pagination
- 