From e32aa85d6a32dcf0881abde2ee42b3ae4493ccb5 Mon Sep 17 00:00:00 2001
From: Ruben Bimberg <ruben.bimberg@mni.thm.de>
Date: Sat, 29 May 2021 13:14:47 +0200
Subject: [PATCH] Implement first steps towards popup
---
src/app/components/shared/shared.module.ts | 7 +++--
.../tag-cloud-pop-up.component.html | 24 +++++++++++++++++
.../tag-cloud-pop-up.component.scss | 14 ++++++++++
.../tag-cloud-pop-up.component.spec.ts | 25 +++++++++++++++++
.../tag-cloud-pop-up.component.ts | 27 +++++++++++++++++++
.../shared/tag-cloud/tag-cloud.component.html | 4 +++
.../shared/tag-cloud/tag-cloud.component.ts | 24 ++++++++++-------
.../tag-cloud/tag-cloud.data-manager.ts | 26 ++++++++++++++++--
8 files changed, 138 insertions(+), 13 deletions(-)
create mode 100644 src/app/components/shared/tag-cloud/tag-cloud-pop-up/tag-cloud-pop-up.component.html
create mode 100644 src/app/components/shared/tag-cloud/tag-cloud-pop-up/tag-cloud-pop-up.component.scss
create mode 100644 src/app/components/shared/tag-cloud/tag-cloud-pop-up/tag-cloud-pop-up.component.spec.ts
create mode 100644 src/app/components/shared/tag-cloud/tag-cloud-pop-up/tag-cloud-pop-up.component.ts
diff --git a/src/app/components/shared/shared.module.ts b/src/app/components/shared/shared.module.ts
index 0fe7715ac..9e1fa76e7 100644
--- a/src/app/components/shared/shared.module.ts
+++ b/src/app/components/shared/shared.module.ts
@@ -36,6 +36,7 @@ import { TopicCloudAdministrationComponent } from './_dialogs/topic-cloud-admini
import { TopicDialogCommentComponent } from './dialog/topic-dialog-comment/topic-dialog-comment.component';
import { TopicCloudFilterComponent } from './_dialogs/topic-cloud-filter/topic-cloud-filter.component';
import { SpacyDialogComponent } from './_dialogs/spacy-dialog/spacy-dialog.component';
+import { TagCloudPopUpComponent } from './tag-cloud/tag-cloud-pop-up/tag-cloud-pop-up.component';
@NgModule({
imports: [
@@ -77,7 +78,8 @@ import { SpacyDialogComponent } from './_dialogs/spacy-dialog/spacy-dialog.compo
TopicCloudAdministrationComponent,
TopicDialogCommentComponent,
TopicCloudFilterComponent,
- SpacyDialogComponent
+ SpacyDialogComponent,
+ TagCloudPopUpComponent
],
exports: [
RoomJoinComponent,
@@ -93,7 +95,8 @@ import { SpacyDialogComponent } from './_dialogs/spacy-dialog/spacy-dialog.compo
CommentComponent,
DialogActionButtonsComponent,
UserBonusTokenComponent,
- CloudConfigurationComponent
+ CloudConfigurationComponent,
+ TagCloudPopUpComponent
]
})
export class SharedModule {
diff --git a/src/app/components/shared/tag-cloud/tag-cloud-pop-up/tag-cloud-pop-up.component.html b/src/app/components/shared/tag-cloud/tag-cloud-pop-up/tag-cloud-pop-up.component.html
new file mode 100644
index 000000000..36196007f
--- /dev/null
+++ b/src/app/components/shared/tag-cloud/tag-cloud-pop-up/tag-cloud-pop-up.component.html
@@ -0,0 +1,24 @@
+<div>
+ <span>
+ <mat-icon>comment</mat-icon>
+ <p>
+ {{tagData && tagData.comments.length}} 1
+ </p>
+ <mat-icon>person</mat-icon>
+ <p>
+ {{tagData && tagData.distinctUsers.size}} 2
+ </p>
+ <mat-icon>thumb_up</mat-icon>
+ <p>
+ {{tagData && tagData.cachedVoteCount}} 3
+ </p>
+ <mat-icon>date_range</mat-icon>
+ <p>
+ {{tagData && tagData.cachedVoteCount}} 3 Wochen
+ </p>
+ </span>
+ <p>Kategorien:</p>
+ <ul *ngIf="categories">
+ <li *ngFor="let category of categories">{{category}}</li>
+ </ul>
+</div>
diff --git a/src/app/components/shared/tag-cloud/tag-cloud-pop-up/tag-cloud-pop-up.component.scss b/src/app/components/shared/tag-cloud/tag-cloud-pop-up/tag-cloud-pop-up.component.scss
new file mode 100644
index 000000000..74aa46d21
--- /dev/null
+++ b/src/app/components/shared/tag-cloud/tag-cloud-pop-up/tag-cloud-pop-up.component.scss
@@ -0,0 +1,14 @@
+div {
+ padding: 5px;
+}
+
+span > mat-icon {
+ margin: -1px 0px 0px 12px;
+ vertical-align: middle;
+}
+
+span > p {
+ display: inline;
+ font-weight: 600;
+ vertical-align: middle;
+}
diff --git a/src/app/components/shared/tag-cloud/tag-cloud-pop-up/tag-cloud-pop-up.component.spec.ts b/src/app/components/shared/tag-cloud/tag-cloud-pop-up/tag-cloud-pop-up.component.spec.ts
new file mode 100644
index 000000000..129b82c55
--- /dev/null
+++ b/src/app/components/shared/tag-cloud/tag-cloud-pop-up/tag-cloud-pop-up.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { TagCloudPopUpComponent } from './tag-cloud-pop-up.component';
+
+describe('TagCloudPopUpComponent', () => {
+ let component: TagCloudPopUpComponent;
+ let fixture: ComponentFixture<TagCloudPopUpComponent>;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ declarations: [ TagCloudPopUpComponent ]
+ })
+ .compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(TagCloudPopUpComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/components/shared/tag-cloud/tag-cloud-pop-up/tag-cloud-pop-up.component.ts b/src/app/components/shared/tag-cloud/tag-cloud-pop-up/tag-cloud-pop-up.component.ts
new file mode 100644
index 000000000..49f8bc599
--- /dev/null
+++ b/src/app/components/shared/tag-cloud/tag-cloud-pop-up/tag-cloud-pop-up.component.ts
@@ -0,0 +1,27 @@
+import { Component, OnInit } from '@angular/core';
+import { TagCloudDataTagEntry } from '../tag-cloud.data-manager';
+
+@Component({
+ selector: 'app-tag-cloud-pop-up',
+ templateUrl: './tag-cloud-pop-up.component.html',
+ styleUrls: ['./tag-cloud-pop-up.component.scss']
+})
+export class TagCloudPopUpComponent implements OnInit {
+
+ tag: string;
+ tagData: TagCloudDataTagEntry;
+ categories: string[];
+
+ constructor() {
+ }
+
+ ngOnInit(): void {
+ }
+
+ initPopUp(tag: string, tagData: TagCloudDataTagEntry) {
+ this.tag = tag;
+ this.tagData = tagData;
+ this.categories = Array.from(tagData.categories.keys());
+ }
+
+}
diff --git a/src/app/components/shared/tag-cloud/tag-cloud.component.html b/src/app/components/shared/tag-cloud/tag-cloud.component.html
index 509971aa8..ede5cd6bb 100644
--- a/src/app/components/shared/tag-cloud/tag-cloud.component.html
+++ b/src/app/components/shared/tag-cloud/tag-cloud.component.html
@@ -26,3 +26,7 @@
</mat-drawer-content>
</mat-drawer-container>
</ars-screen>
+
+<ars-screen style="">
+ <app-tag-cloud-pop-up></app-tag-cloud-pop-up>
+</ars-screen>
diff --git a/src/app/components/shared/tag-cloud/tag-cloud.component.ts b/src/app/components/shared/tag-cloud/tag-cloud.component.ts
index 44bd3899c..a4062678d 100644
--- a/src/app/components/shared/tag-cloud/tag-cloud.component.ts
+++ b/src/app/components/shared/tag-cloud/tag-cloud.component.ts
@@ -43,14 +43,16 @@ class CustomPosition implements Position {
}
class TagComment implements CloudData {
- constructor(public color: string,
- public external: boolean,
- public link: string,
- public position: Position,
+
+ constructor(public text: string,
public rotate: number,
- public text: string,
- public tooltip: string,
- public weight: number) {
+ public weight: number,
+ public index: number,
+ public color: string = null,
+ public external: boolean = false,
+ public link: string = null,
+ public position: Position = null,
+ public tooltip: string = null) {
}
}
@@ -324,7 +326,7 @@ export class TagCloudComponent implements OnInit, AfterViewInit, OnDestroy {
if (rotation === null || this._currentSettings.randomAngles) {
rotation = Math.floor(Math.random() * 30 - 15);
}
- newElements.push(new TagComment(null, true, null, null, rotation, tag, 'TODO', tagData.weight));
+ newElements.push(new TagComment(tag, rotation, tagData.weight, newElements.length));
}
}
}
@@ -372,6 +374,10 @@ export class TagCloudComponent implements OnInit, AfterViewInit, OnDestroy {
}
openTags(tag: CloudData): void {
+ const myTag = tag as TagComment;
+ console.log(this.dataManager.currentData.get(myTag.text));
+ console.log(this.child.cloudDataHtmlElements[myTag.index]);
+ /* TODO rollback to default!
if(this._subscriptionCommentlist !== null){
return;
}
@@ -380,7 +386,7 @@ export class TagCloudComponent implements OnInit, AfterViewInit, OnDestroy {
this.eventService.broadcast('setTagConfig', tag.text);
this._subscriptionCommentlist.unsubscribe();
});
- this.router.navigate(['../'], {relativeTo: this.route});
+ this.router.navigate(['../'], {relativeTo: this.route});*/
}
private redraw(): void {
diff --git a/src/app/components/shared/tag-cloud/tag-cloud.data-manager.ts b/src/app/components/shared/tag-cloud/tag-cloud.data-manager.ts
index 2c8707373..689929be1 100644
--- a/src/app/components/shared/tag-cloud/tag-cloud.data-manager.ts
+++ b/src/app/components/shared/tag-cloud/tag-cloud.data-manager.ts
@@ -9,6 +9,9 @@ export interface TagCloudDataTagEntry {
weight: number;
adjustedWeight: number;
cachedVoteCount: number;
+ distinctUsers: Set<number>;
+ firstTimeStamp: Date;
+ categories: Set<string>;
comments: Comment[];
}
@@ -117,7 +120,10 @@ export class TagCloudDataManager {
cachedVoteCount: 0,
comments: [],
weight: i,
- adjustedWeight: i - 1
+ adjustedWeight: i - 1,
+ categories: new Set<string>(),
+ distinctUsers: new Set<number>(),
+ firstTimeStamp: new Date()
});
}
});
@@ -266,10 +272,26 @@ export class TagCloudDataManager {
//TODO Check spelling & check profanity
let current = data.get(keyword);
if (current === undefined) {
- current = {cachedVoteCount: 0, comments: [], weight: 0, adjustedWeight: 0};
+ current = {
+ cachedVoteCount: 0,
+ comments: [],
+ weight: 0,
+ adjustedWeight: 0,
+ distinctUsers: new Set<number>(),
+ categories: new Set<string>(),
+ firstTimeStamp: comment.timestamp
+ };
data.set(keyword, current);
}
current.cachedVoteCount += comment.score;
+ current.distinctUsers.add(comment.userNumber);
+ if (comment.tag) {
+ current.categories.add(comment.tag);
+ }
+ // @ts-ignore
+ if (current.firstTimeStamp - comment.timestamp > 0){
+ current.firstTimeStamp = comment.timestamp;
+ }
current.comments.push(comment);
}
users.add(comment.userNumber);
--
GitLab