Merge pull request #6129 from tsiegleauq/firefox-stream-no-app-stable

Fix firefox endless spinner in stream
This commit is contained in:
Emanuel Schütze 2021-06-24 16:09:33 +02:00 committed by GitHub
commit c0582e4b1c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 12 additions and 2 deletions

View File

@ -1,3 +1,3 @@
<div [osResized]="resizeSubject" class="particle-wrapper">
<div [osResized]="resizeSubject" *ngIf="isStable" class="particle-wrapper">
<Particles id="particles" [options]="options" (particlesLoaded)="particlesLoaded($event)"> </Particles>
</div>

View File

@ -7,6 +7,7 @@ import { Subject } from 'rxjs';
import { auditTime } from 'rxjs/operators';
import { Container } from 'tsparticles';
import { OpenSlidesStatusService } from 'app/core/core-services/openslides-status.service';
import { ConfigService } from 'app/core/ui-services/config.service';
import { ElementSize } from 'app/shared/directives/resized.directive';
import { BaseViewComponentDirective } from 'app/site/base/base-view';
@ -20,6 +21,11 @@ import { particleConfig, particleOptions } from './particle-options';
encapsulation: ViewEncapsulation.None
})
export class ApplauseParticleDisplayComponent extends BaseViewComponentDirective {
/**
* Firefox has an issue with ngParticles and stable state
*/
public isStable = false;
public options = particleOptions;
public resizeSubject = new Subject<ElementSize>();
private resizeAuditTime = 200;
@ -38,6 +44,7 @@ export class ApplauseParticleDisplayComponent extends BaseViewComponentDirective
translate: TranslateService,
matSnackBar: MatSnackBar,
configService: ConfigService,
osStatus: OpenSlidesStatusService,
private applauseService: ApplauseService
) {
super(title, translate, matSnackBar);
@ -52,6 +59,10 @@ export class ApplauseParticleDisplayComponent extends BaseViewComponentDirective
this.particleImage = particleImage || undefined;
})
);
osStatus.stable.then(() => {
this.isStable = true;
});
}
private setParticleImage(particleImage: string): void {

View File

@ -44,7 +44,6 @@ $radius: 5px;
.video-player {
display: block;
width: 500px;
max-height: 280px;
}
.call-body {