UNPKG

ngx-acuw

Version:

Angular components using WEBGL (threejs)

113 lines (112 loc) 4.32 kB
import { AfterViewInit, ElementRef, EventEmitter, NgZone, OnDestroy } from '@angular/core'; import { Observable } from 'rxjs'; import { PerformanceMonitorComponent } from '../performance-monitor/performance-monitor.component'; import * as i0 from "@angular/core"; export declare class ImageTransitionComponent implements AfterViewInit, OnDestroy { private ngZone; imageUrls: string[]; get displacementImageUrl(): string; set displacementImageUrl(displacementImageUrl: string); get imageSize(): string; set imageSize(imageSize: string); get autoPlay(): boolean; set autoPlay(autoplay: boolean); get autoPlayInterval(): number; set autoPlayInterval(autoPlayInterval: number); transitionDuration: number; get transitionType(): string; set transitionType(transitionType: string); get sizeX(): number; set sizeX(sizeX: number); get sizeY(): number; set sizeY(sizeY: number); get width(): number; set width(width: number); get intensity(): number; set intensity(intensity: number); animationEnabled: boolean; startIndex: number; showPerformanceMonitor: boolean; imageIndexChange: EventEmitter<number>; private pAutoPlay; private pAutoPlayInterval; private pImageSize; private pTransitionType; private pIntensity; private pScaleX; private pScaleY; private pWidth; private pDistortionImageUrl; private animationFrameId; private renderer; private scene; private camera; private mesh; private material; private textures; private displacementTexture?; private nextImageIndex; private tranistionOngoing; private shaders; private autoPlay$; private autoPlaySubscription; private readonly subscriptions; private readonly basicAssetsLoaded$$; private readonly forwardTextureLoaded$$; private readonly backwardTextureLoaded$$; private readonly showLoadingSpinner$$; private readonly transitToForwardTexture$$; private readonly transitToBackwardTexture$$; showLoadingSpinner$: Observable<boolean>; threejsContainer: ElementRef; performanceMonitor: PerformanceMonitorComponent; constructor(ngZone: NgZone); ngAfterViewInit(): void; ngOnDestroy(): void; private subscribeToInitScene; private subscribeTransistionToForwardTexture; private subscribeTransistionToBackwardTexture; private loadBasicAssets; private loadTexture; private initBasiscScene; /** * Sets the autoPlay interval */ private setAutoPlayInterval; /** * Resets the autoPlay interval */ private resetAutoPlayInterval; /** * Stops the autoPlay interval */ private stopAutoPlayInterval; /** * Sets the shader properties depending on the transition type */ private setShaderProperties; /** * Animation */ private animate; /** * Resizes the canvas and updates the texture resulution information of the images */ private resize; /** * Updates the resulution of the texture for the shader depending on the image size type * @param textureNumber Number of the texture */ private updateTextureResolution; /** * Starts the transition effect to the next image * @param posDirection indicator, if the next or previous image should be loaded */ private transitionToNextTexture; private prepAndLoadNextImg; private nextImage; next(): void; prev(): void; static ɵfac: i0.ɵɵFactoryDeclaration<ImageTransitionComponent, never>; static ɵcmp: i0.ɵɵComponentDeclaration<ImageTransitionComponent, "lib-image-transition", never, { "imageUrls": "imageUrls"; "displacementImageUrl": "displacementImageUrl"; "imageSize": "imageSize"; "autoPlay": "autoPlay"; "autoPlayInterval": "autoPlayInterval"; "transitionDuration": "transitionDuration"; "transitionType": "transitionType"; "sizeX": "sizeX"; "sizeY": "sizeY"; "width": "width"; "intensity": "intensity"; "animationEnabled": "animationEnabled"; "startIndex": "startIndex"; "showPerformanceMonitor": "showPerformanceMonitor"; }, { "imageIndexChange": "imageIndexChange"; }, never, never>; }