@egjs/view360
Version:
360 integrated viewing solution from inside-out view to outside-in view. It provides user-friendly service by rotating 360 degrees through various user interaction such as motion sensor and touch.
134 lines (133 loc) • 4.6 kB
TypeScript
import Component, { ComponentEvent } from "@egjs/component";
import { mat4 } from "gl-matrix";
import { PROJECTION_TYPE, STEREO_FORMAT } from "../PanoViewer/consts";
import { CubemapConfig, ImageCandidate, ValueOf, VideoCandidate } from "../types/internal";
import YawPitchControl from "../YawPitchControl/YawPitchControl";
import Renderer from "./renderer/Renderer";
declare const EVENTS: {
BIND_TEXTURE: "bindTexture";
IMAGE_LOADED: "imageLoaded";
ERROR: "error";
RENDERING_CONTEXT_LOST: "renderingContextLost";
RENDERING_CONTEXT_RESTORE: "renderingContextRestore";
};
declare class PanoImageRenderer extends Component<{
[EVENTS.ERROR]: {
type: number;
message: string;
};
[EVENTS.IMAGE_LOADED]: {
content: HTMLElement;
isVideo: boolean;
projectionType: ValueOf<typeof PROJECTION_TYPE>;
};
[EVENTS.BIND_TEXTURE]: ComponentEvent;
[EVENTS.RENDERING_CONTEXT_LOST]: ComponentEvent;
[EVENTS.RENDERING_CONTEXT_RESTORE]: ComponentEvent;
}> {
static EVENTS: {
BIND_TEXTURE: "bindTexture";
IMAGE_LOADED: "imageLoaded";
ERROR: "error";
RENDERING_CONTEXT_LOST: "renderingContextLost";
RENDERING_CONTEXT_RESTORE: "renderingContextRestore";
};
static ERROR_TYPE: {
INVALID_DEVICE: number;
NO_WEBGL: number;
FAIL_IMAGE_LOAD: number;
RENDERER_ERROR: number;
};
sphericalConfig: {
initialYaw: number;
initialPitch: number;
fieldOfView: number;
imageType: ValueOf<typeof PROJECTION_TYPE>;
stereoFormat: ValueOf<typeof STEREO_FORMAT>;
cubemapConfig: Partial<CubemapConfig>;
};
fieldOfView: number;
width: number;
height: number;
canvas: HTMLCanvasElement;
context: WebGLRenderingContext;
shaderProgram: WebGLProgram | null;
texture: WebGLTexture;
pMatrix: mat4;
mvMatrix: mat4;
textureCoordBuffer: WebGLBuffer | null;
vertexBuffer: WebGLBuffer | null;
indexBuffer: WebGLBuffer | null;
private _wrapper;
private _wrapperOrigStyle;
private _lastQuaternion;
private _lastYaw;
private _lastPitch;
private _lastFieldOfView;
private _renderingContextAttributes?;
private _renderer;
private _contentLoader;
private _image;
private _imageConfig;
private _imageType;
private _imageIsReady;
private _isVideo;
private _isCubeMap;
private _shouldForceDraw;
private _keepUpdate;
private _hasExternalCanvas;
private _yawPitchControl;
private _animator;
private _vr;
constructor(image: ImageCandidate | VideoCandidate, width: number, height: number, isVideo: boolean, container: HTMLElement, canvasClass: string, sphericalConfig: PanoImageRenderer["sphericalConfig"], renderingContextAttributes?: WebGLContextAttributes);
setYawPitchControl(yawPitchControl: YawPitchControl): void;
getContent(): HTMLImageElement | HTMLVideoElement | HTMLImageElement[];
setImage({ image, imageType, isVideo, cubemapConfig }: {
image: ImageCandidate | VideoCandidate;
imageType: PanoImageRenderer["_imageType"];
isVideo: boolean;
cubemapConfig: Partial<CubemapConfig>;
}): void;
isImageLoaded(): boolean;
bindTexture(): any;
attachTo(parentElement: any): void;
forceContextLoss(): void;
detach(): void;
destroy(): void;
hasRenderingContext(): boolean;
updateFieldOfView(fieldOfView: any): void;
updateViewportDimensions(width: any, height: any): void;
keepUpdate(doUpdate: any): void;
startRender(): void;
stopRender(): void;
renderWithQuaternion(quaternion: any, fieldOfView: any): void;
renderWithYawPitch(yaw: any, pitch: any, fieldOfView: any): void;
getProjectionRenderer(): Renderer;
enterVR(options: any): any;
exitVR: () => void;
private _setImageType;
private _initCanvas;
private _createCanvas;
private _setDefaultCanvasStyle;
private _onContentError;
private _triggerContentLoad;
private _onContentLoad;
private _initShaderProgram;
private _onWebglcontextlost;
private _onWebglcontextrestored;
private _updateViewport;
private _initWebGL;
private _initRenderingContext;
private _initBuffers;
private _bindTexture;
private _updateTexture;
private _render;
private _renderStereo;
private _bindBuffers;
private _draw;
private _requestPresent;
private _onFirstVRFrame;
private _setWrapperFullscreen;
private _restoreStyle;
}
export default PanoImageRenderer;