import { Directive, Input, ElementRef, TemplateRef, ViewContainerRef, OnInit } from '@angular/core'; import { OperatorService } from 'app/core/services/operator.service'; import { OpenSlidesComponent } from 'app/openslides.component'; import { Group } from 'app/shared/models/users/group'; /** * Directive to check if the {@link OperatorService} has the correct permissions to access certain functions * * Successor of os-perms in OpenSlides 2.2 * @example
... < /div> */ @Directive({ selector: '[appOsPerms]' }) export class OsPermsDirective extends OpenSlidesComponent { /** * Holds the {@link OperatorService} permissions */ private userPermissions: string[]; /** * Holds the required permissions the access a feature */ private permissions; /** * Constructs the direcctive once. Observes the operator for it's groups so the directvice can perform changes * dynamically * * @param template inner part of the HTML container * @param viewContainer outer part of the HTML container (for example a `
`) * @param operator OperatorService */ constructor( private template: TemplateRef, private viewContainer: ViewContainerRef, private operator: OperatorService ) { super(); this.userPermissions = []; // observe groups of operator, so the directive can actively react to changes this.operator.getObservable().subscribe(content => { console.log('os-perms did monitor changes in observer: ', content); if (content instanceof Group && this.permissions !== '') { console.log('content was a Group'); this.userPermissions = [...this.userPermissions, ...content.permissions]; this.updateView(); } }); } /** * Comes directly from the view. * The value defines the requires permissions. */ @Input() set appOsPerms(value) { this.permissions = value; this.readUserPermissions(); this.updateView(); } /** * Updates the local `userPermissions[]` by the permissions found in the operators groups * Will just set, but not remove them. */ private readUserPermissions(): void { const opGroups = this.operator.getGroups(); console.log('operator Groups: ', opGroups); opGroups.forEach(group => { this.userPermissions = [...this.userPermissions, ...group.permissions]; }); } /** * Shows or hides certain content in the view. */ private updateView(): void { if (this.checkPermissions()) { // will just render the page normally this.viewContainer.createEmbeddedView(this.template); } else { // will remove the content of the container this.viewContainer.clear(); } } /** * Compare the required permissions with the users permissions. * Returns true if the users permissions fit. */ private checkPermissions(): boolean { let isPermitted = false; if (this.userPermissions && this.permissions) { this.permissions.forEach(perm => { isPermitted = this.userPermissions.find(userPerm => userPerm === perm) ? true : false; }); } return isPermitted; } }