From 0f606b5a7eb83cdb64037d925ba1a0a588e20112 Mon Sep 17 00:00:00 2001 From: Sean Engelhardt Date: Thu, 22 Aug 2019 14:01:17 +0200 Subject: [PATCH] Add change signals for the listview The projector-button now emits a signal if changed List-of-speaker-button is now able to detect it's own updates --- .../list-view-table.component.html | 2 +- .../list-view-table.component.ts | 7 ++++ .../projector-button.component.html | 29 +++++++++---- .../projector-button.component.ts | 42 ++++++++++++++++--- .../speaker-button.component.ts | 38 ++++++++++++++--- 5 files changed, 100 insertions(+), 18 deletions(-) diff --git a/client/src/app/shared/components/list-view-table/list-view-table.component.html b/client/src/app/shared/components/list-view-table/list-view-table.component.html index 5a5c67893..c1030a9e6 100644 --- a/client/src/app/shared/components/list-view-table/list-view-table.component.html +++ b/client/src/app/shared/components/list-view-table/list-view-table.component.html @@ -33,7 +33,7 @@
- +
diff --git a/client/src/app/shared/components/list-view-table/list-view-table.component.ts b/client/src/app/shared/components/list-view-table/list-view-table.component.ts index 8b0107ab1..430305fc8 100644 --- a/client/src/app/shared/components/list-view-table/list-view-table.component.ts +++ b/client/src/app/shared/components/list-view-table/list-view-table.component.ts @@ -394,6 +394,13 @@ export class ListViewTableComponent - - - diff --git a/client/src/app/shared/components/projector-button/projector-button.component.ts b/client/src/app/shared/components/projector-button/projector-button.component.ts index 7291d8162..4a81beb25 100644 --- a/client/src/app/shared/components/projector-button/projector-button.component.ts +++ b/client/src/app/shared/components/projector-button/projector-button.component.ts @@ -1,6 +1,10 @@ -import { Component, Input, OnInit } from '@angular/core'; +import { Component, EventEmitter, Input, OnDestroy, OnInit, Output } from '@angular/core'; + +import { Subscription } from 'rxjs'; +import { distinctUntilChanged } from 'rxjs/operators'; import { ProjectorService } from 'app/core/core-services/projector.service'; +import { ProjectorRepositoryService } from 'app/core/repositories/projector/projector-repository.service'; import { ProjectionDialogService } from 'app/core/ui-services/projection-dialog.service'; import { Projector } from 'app/shared/models/core/projector'; import { @@ -23,7 +27,7 @@ import { templateUrl: './projector-button.component.html', styleUrls: ['./projector-button.component.scss'] }) -export class ProjectorButtonComponent implements OnInit { +export class ProjectorButtonComponent implements OnInit, OnDestroy { /** * The object to project. */ @@ -33,6 +37,8 @@ export class ProjectorButtonComponent implements OnInit { return this._object; } + public isProjected = false; + @Input() public set object(obj: Projectable | ProjectorElementBuildDeskriptor) { if (isProjectable(obj) || isProjectorElementBuildDeskriptor(obj)) { @@ -48,16 +54,22 @@ export class ProjectorButtonComponent implements OnInit { @Input() public menuItem = false; + @Output() + public changeEvent: EventEmitter = new EventEmitter(); + /** * Pre-define projection target */ @Input() public projector: Projector | null; + private projectorRepoSub: Subscription; + /** * The constructor */ public constructor( + private projectorRepo: ProjectorRepositoryService, private projectionDialogService: ProjectionDialogService, private projectorService: ProjectorService ) {} @@ -65,7 +77,27 @@ export class ProjectorButtonComponent implements OnInit { /** * Initialization function */ - public ngOnInit(): void {} + public ngOnInit(): void { + this.isProjected = this.checkIsProjected(); + + this.projectorRepoSub = this.projectorRepo + .getGeneralViewModelObservable() + .pipe(distinctUntilChanged()) + .subscribe(() => { + const isProjected = this.checkIsProjected(); + if (this.isProjected !== isProjected) { + this.isProjected = isProjected; + this.changeEvent.next(); + } + }); + } + + public ngOnDestroy(): void { + if (this.projectorRepoSub) { + this.projectorRepoSub.unsubscribe(); + this.projectorRepoSub = null; + } + } /** * Click on the projector button @@ -79,7 +111,7 @@ export class ProjectorButtonComponent implements OnInit { if (this.object) { if (this.projector) { // if the projection target was defines before - if (this.isProjected()) { + if (this.checkIsProjected()) { // remove the projected object this.projectorService.removeFrom(this.projector, this.object); } else { @@ -98,7 +130,7 @@ export class ProjectorButtonComponent implements OnInit { * * @returns true, if the object is projected on one projector. */ - public isProjected(): boolean { + public checkIsProjected(): boolean { if (!this.object) { return false; } diff --git a/client/src/app/shared/components/speaker-button/speaker-button.component.ts b/client/src/app/shared/components/speaker-button/speaker-button.component.ts index 46bc6599b..f1d2c922c 100644 --- a/client/src/app/shared/components/speaker-button/speaker-button.component.ts +++ b/client/src/app/shared/components/speaker-button/speaker-button.component.ts @@ -1,4 +1,7 @@ -import { Component, Input } from '@angular/core'; +import { Component, Input, OnDestroy } from '@angular/core'; + +import { Subscription } from 'rxjs'; +import { distinctUntilChanged } from 'rxjs/operators'; import { ListOfSpeakersRepositoryService } from 'app/core/repositories/agenda/list-of-speakers-repository.service'; import { ContentObject, isContentObject } from 'app/shared/models/base/content-object'; @@ -18,15 +21,27 @@ import { selector: 'os-speaker-button', templateUrl: './speaker-button.component.html' }) -export class SpeakerButtonComponent { +export class SpeakerButtonComponent implements OnDestroy { @Input() public set object(obj: BaseViewModelWithListOfSpeakers | ContentObject | null) { + let listOfSpeakers: ViewListOfSpeakers; if (isBaseViewModelWithListOfSpeakers(obj)) { - this.listOfSpeakers = obj.listOfSpeakers; + listOfSpeakers = obj.listOfSpeakers; } else if (isContentObject(obj)) { - this.listOfSpeakers = this.listOfSpeakersRepo.findByContentObject(obj); + listOfSpeakers = this.listOfSpeakersRepo.findByContentObject(obj); } else { - this.listOfSpeakers = null; + listOfSpeakers = null; + } + + this.cleanLosSub(); + + if (!!listOfSpeakers) { + this.losSub = this.listOfSpeakersRepo + .getViewModelObservable(listOfSpeakers.id) + .pipe(distinctUntilChanged()) + .subscribe(speakerObj => { + this.listOfSpeakers = speakerObj; + }); } } @@ -52,8 +67,21 @@ export class SpeakerButtonComponent { return this.listOfSpeakers.closed ? 'The list of speakers is closed.' : 'List of speakers'; } + private losSub: Subscription; + /** * The constructor */ public constructor(private listOfSpeakersRepo: ListOfSpeakersRepositoryService) {} + + public ngOnDestroy(): void { + this.cleanLosSub(); + } + + private cleanLosSub(): void { + if (this.losSub) { + this.losSub.unsubscribe(); + this.losSub = null; + } + } }