oxygen-core
Version:
Oxygen game engine (Xenon Core for browsers)
894 lines (787 loc) • 38.7 kB
HTML
<html>
<head>
<meta charset="utf-8">
<base data-ice="baseUrl" href="../../../">
<title data-ice="title">src/components/Camera.js | oxygen-core</title>
<link type="text/css" rel="stylesheet" href="css/style.css">
<link type="text/css" rel="stylesheet" href="css/prettify-tomorrow.css">
<script src="script/prettify/prettify.js"></script>
<script src="script/manual.js"></script>
<meta name="description" content="Oxygen game engine (Xenon Core for browsers)"><meta property="twitter:card" content="summary"><meta property="twitter:title" content="oxygen-core"><meta property="twitter:description" content="Oxygen game engine (Xenon Core for browsers)"></head>
<body class="layout-container" data-ice="rootContainer">
<header>
<a href="./">Home</a>
<a href="identifiers.html">Reference</a>
<a href="source.html">Source</a>
<div class="search-box">
<span>
<img src="./image/search.png">
<span class="search-input-edge"></span><input class="search-input"><span class="search-input-edge"></span>
</span>
<ul class="search-result"></ul>
</div>
<a style="position:relative; top:3px;" href="https://github.com/PsichiX/Oxygen"><img width="20px" src="./image/github.png"></a></header>
<nav class="navigation" data-ice="nav"><div>
<ul>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/index.js~EventsController.html">EventsController</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-lazyInitialization">lazyInitialization</a></span></span></li>
<li data-ice="doc"><a data-ice="dirPath" class="nav-dir-path" href="identifiers.html#asset-loaders">asset-loaders</a><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/asset-loaders/AssemblyAsset.js~AssemblyAsset.html">AssemblyAsset</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/asset-loaders/AtlasAsset.js~AtlasAsset.html">AtlasAsset</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/asset-loaders/BinaryAsset.js~BinaryAsset.html">BinaryAsset</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/asset-loaders/FontAsset.js~FontAsset.html">FontAsset</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/asset-loaders/ImageAsset.js~ImageAsset.html">ImageAsset</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/asset-loaders/JSONAsset.js~JSONAsset.html">JSONAsset</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/asset-loaders/MusicAsset.js~MusicAsset.html">MusicAsset</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/asset-loaders/PackAsset.js~PackAsset.html">PackAsset</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/asset-loaders/ParticleSystemAsset.js~ParticleSystemAsset.html">ParticleSystemAsset</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/asset-loaders/PostprocessRackEffectAsset.js~PostprocessRackEffectAsset.html">PostprocessRackEffectAsset</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/asset-loaders/SVGAsset.js~SVGAsset.html">SVGAsset</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/asset-loaders/SceneAsset.js~SceneAsset.html">SceneAsset</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/asset-loaders/SetAsset.js~SetAsset.html">SetAsset</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/asset-loaders/ShaderAsset.js~ShaderAsset.html">ShaderAsset</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/asset-loaders/SkeletonAsset.js~SkeletonAsset.html">SkeletonAsset</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/asset-loaders/SoundAsset.js~SoundAsset.html">SoundAsset</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/asset-loaders/TextAsset.js~TextAsset.html">TextAsset</a></span></span></li>
<li data-ice="doc"><a data-ice="dirPath" class="nav-dir-path" href="identifiers.html#components">components</a><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/AtlasSprite.js~AtlasSprite.html">AtlasSprite</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/Camera.js~Camera.html">Camera</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/Camera.js~PostprocessPass.html">PostprocessPass</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/Camera2D.js~Camera2D.html">Camera2D</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/CameraDirector2D.js~CameraDirector2D.html">CameraDirector2D</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/CircleShape.js~CircleShape.html">CircleShape</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/Container.js~Container.html">Container</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/DeferredRenderer.js~DeferredPipeline.html">DeferredPipeline</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/DeferredRenderer.js~DeferredRenderer.html">DeferredRenderer</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/GestureListener.js~GestureListener.html">GestureListener</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/InputHandler.js~InputHandler.html">InputHandler</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/MultipassRenderer.js~MultipassPipeline.html">MultipassPipeline</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/MultipassRenderer.js~MultipassRenderer.html">MultipassRenderer</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/Particles.js~Particles.html">Particles</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/PhysicsBody.js~PhysicsBody.html">PhysicsBody</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/PhysicsWorld.js~PhysicsWorld.html">PhysicsWorld</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/PolygonShape.js~PolygonShape.html">PolygonShape</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/PostprocessRack.js~PostprocessRack.html">PostprocessRack</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/PostprocessRack.js~PostprocessRackPass.html">PostprocessRackPass</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/PostprocessRack.js~PostprocessRackRawEffectPass.html">PostprocessRackRawEffectPass</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/PrefabInstance.js~PrefabInstance.html">PrefabInstance</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/RectangleRenderer.js~RectangleRenderer.html">RectangleRenderer</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/RectangleShape.js~RectangleShape.html">RectangleShape</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/Script.js~Script.html">Script</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/Shape.js~Shape.html">Shape</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/Skeleton.js~Skeleton.html">Skeleton</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/SortedActions.js~SortedActions.html">SortedActions</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/Sprite.js~Sprite.html">Sprite</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/TextRenderer.js~TextRenderer.html">TextRenderer</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/UiLayout.js~UiLayout.html">UiLayout</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/UiSprite.js~UiSprite.html">UiSprite</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/components/VerticesRenderer.js~VerticesRenderer.html">VerticesRenderer</a></span></span></li>
<li data-ice="doc"><a data-ice="dirPath" class="nav-dir-path" href="identifiers.html#systems">systems</a><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/systems/AssemblySystem.js~AssemblySystem.html">AssemblySystem</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/systems/AudioSystem.js~AudioSystem.html">AudioSystem</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/systems/InputSystem.js~InputSystem.html">InputSystem</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/systems/RenderSystem.js~Command.html">Command</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/systems/RenderSystem.js~Pipeline.html">Pipeline</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/systems/RenderSystem.js~RenderFullscreenCommand.html">RenderFullscreenCommand</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/systems/RenderSystem.js~RenderSystem.html">RenderSystem</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/systems/RenderSystem.js~RenderTargetWrapper.html">RenderTargetWrapper</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/systems/StorageSystem.js~StorageSystem.html">StorageSystem</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/systems/System.js~System.html">System</a></span></span></li>
<li data-ice="doc"><a data-ice="dirPath" class="nav-dir-path" href="identifiers.html#systems-assetsystem">systems/AssetSystem</a><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/systems/AssetSystem/Asset.js~Asset.html">Asset</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/systems/AssetSystem/index.js~AssetSystem.html">AssetSystem</a></span></span></li>
<li data-ice="doc"><a data-ice="dirPath" class="nav-dir-path" href="identifiers.html#systems-entitysystem">systems/EntitySystem</a><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/systems/EntitySystem/Component.js~Component.html">Component</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/systems/EntitySystem/Entity.js~Entity.html">Entity</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/systems/EntitySystem/index.js~EntitySystem.html">EntitySystem</a></span></span></li>
<li data-ice="doc"><a data-ice="dirPath" class="nav-dir-path" href="identifiers.html#utils">utils</a><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/utils/Events.js~Events.html">Events</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-angleDifference">angleDifference</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-bezierCubic">bezierCubic</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-convertGlobalPointToLocalPoint">convertGlobalPointToLocalPoint</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-convertLocalPointToGlobalPoint">convertLocalPointToGlobalPoint</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-findMapKeyOfValue">findMapKeyOfValue</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-getMipmapScale">getMipmapScale</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-getPOT">getPOT</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-isGlobalPointInGlobalBoundingBox">isGlobalPointInGlobalBoundingBox</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-isLocalPointInLocalBoundingBox">isLocalPointInLocalBoundingBox</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-isPOT">isPOT</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-propsEnumStringify">propsEnumStringify</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-stringToRGBA">stringToRGBA</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-waitForSeconds">waitForSeconds</a></span></span></li>
<li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-Box2D">Box2D</a></span></span></li>
</ul>
</div>
</nav>
<div class="content" data-ice="content"><h1 data-ice="title">src/components/Camera.js</h1>
<pre class="source-code line-number raw-source-code"><code class="prettyprint linenums" data-ice="content">import Component from '../systems/EntitySystem/Component';
import RenderSystem, { Command, RenderFullscreenCommand } from '../systems/RenderSystem';
import System from '../systems/System';
import { mat4, vec2 } from '../utils/gl-matrix';
import { getPOT, getMipmapScale } from '../utils';
const cachedTempMat4 = mat4.create();
const cachedZeroMat4 = mat4.fromValues(
0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0
);
let rttUidGenerator = 0;
export class PostprocessPass {
constructor() {
this._command = new RenderFullscreenCommand();
this._targets = new Map();
this._renderer = null;
}
dispose() {
this._command.dispose();
this.destroyAllTargets();
this._command = null;
this._targets = null;
this._renderer = null;
}
apply(
gl,
renderer,
textureSource,
renderTarget,
shader,
overrideUniforms = null,
overrideSamplers = null
) {
const { _command } = this;
_command.shader = shader;
_command.overrideUniforms.clear();
_command.overrideSamplers.clear();
_command.overrideSamplers.set('sBackBuffer', { texture: textureSource });
if (!!overrideUniforms) {
for (const key in overrideUniforms) {
_command.overrideUniforms.set(key, overrideUniforms[key]);
}
}
if (!!overrideSamplers) {
for (const key in overrideSamplers) {
_command.overrideSamplers.set(key, overrideSamplers[key]);
}
}
if (!renderTarget) {
renderer.disableRenderTarget();
} else {
renderer.enableRenderTarget(renderTarget);
}
_command.onRender(gl, renderer, 0, null);
}
createTarget(id, level = 0, floatPointData = false, potMode = null) {
if (typeof id !== 'string') {
throw new Error('`id` is not type of String!');
}
if (typeof level !== 'number') {
throw new Error('`level` is not type of Number!');
}
if (typeof floatPointData !== 'boolean') {
throw new Error('`floatPointData` is not type of Boolean!');
}
if (!!potMode && typeof potMode !== 'string') {
throw new Error('`potMode` is not type of String!');
}
level = level | 0;
const { _targets } = this;
if (_targets.has(id)) {
const target = _targets.get(id);
target.level = level;
target.floatPointData = floatPointData;
target.potMode = potMode;
target.dirty = true;
return target.target;
} else {
const target = `#Camera-PostprocessPass-${++rttUidGenerator}`;
_targets.set(id, {
target,
level,
floatPointData,
potMode,
dirty: true
});
return target;
}
}
destroyTarget(id) {
if (typeof id !== 'string') {
throw new Error('`id` is not type of String!');
}
const { _targets, _renderer } = this;
if (_targets.has(id)) {
const target = _targets.get(id);
if (!!_renderer) {
_renderer.unregisterRenderTarget(target.target);
}
_targets.delete(id);
}
}
destroyAllTargets() {
const { _targets, _renderer } = this;
if (!!_renderer) {
for (const target of _targets.values()) {
_renderer.unregisterRenderTarget(target.target);
}
}
_targets.clear();
}
getTargetId(id) {
if (typeof id !== 'string') {
throw new Error('`id` is not type of String!');
}
return this._targets.get(id).target || null;
}
onApply(gl, renderer, textureSource, renderTarget) {
this._renderer = renderer;
const { _targets } = this;
for (const target of _targets.values()) {
if (!!target.dirty) {
target.dirty = false;
const { width, height } = renderer.canvas;
const w = !target.potMode
? width
: getPOT(width, target.potMode === 'upper');
const h = !target.potMode
? height
: getPOT(height, target.potMode === 'upper');
const s = getMipmapScale(target.level);
renderer.registerRenderTarget(
target.target,
w * s,
h * s,
target.floatPointData
);
}
}
}
onResize(width, height) {
const { _targets } = this;
for (const target of _targets.values()) {
target.dirty = true;
}
}
}
/**
* Camera base class component.
*/
export default class Camera extends Component {
/** @type {*} */
static get propsTypes() {
return {
ignoreChildrenViews: 'boolean',
captureEntity: 'string_null',
renderTargetId: 'string_null',
renderTargetWidth: 'integer',
renderTargetHeight: 'integer',
renderTargetScale: 'number',
renderTargetFloat: 'boolean',
renderTargetMulti: 'array(any)',
layer: 'string_null'
};
}
/**
* Component factory.
*
* @return {Camera} Component instance.
*/
static factory() {
return new Camera();
}
/** @type {boolean} */
get ignoreChildrenViews() {
return this._ignoreChildrenViews;
}
/** @type {boolean} */
set ignoreChildrenViews(value) {
if (typeof value !== 'boolean') {
throw new Error('`value` is not type of Boolean!');
}
this._ignoreChildrenViews = value;
}
/** @type {string|null} */
get captureEntity() {
return this._captureEntity;
}
/** @type {string|null} */
set captureEntity(value) {
if (typeof value !== 'string') {
throw new Error('`value` is not type of String');
}
this._captureEntity = value;
}
/** @type {string|null} */
get renderTargetId() {
return this._renderTargetId;
}
/** @type {string|null} */
set renderTargetId(value) {
if (!!value && typeof value !== 'string') {
throw new Error('`value` is not type of String');
}
this._renderTargetId = value;
this._renderTargetDirty = true;
this._dirty = true;
}
/** @type {number} */
get renderTargetWidth() {
return this._renderTargetWidth;
}
/** @type {number} */
set renderTargetWidth(value) {
if (typeof value !== 'number') {
throw new Error('`value` is not type of Number');
}
this._renderTargetWidth = value | 0;
this._renderTargetDirty = true;
this._dirty = true;
}
/** @type {number} */
get renderTargetHeight() {
return this._renderTargetHeight;
}
/** @type {number} */
set renderTargetHeight(value) {
if (typeof value !== 'number') {
throw new Error('`value` is not type of Number');
}
this._renderTargetHeight = value | 0;
this._renderTargetDirty = true;
this._dirty = true;
}
/** @type {number} */
get renderTargetScale() {
return this._renderTargetScale;
}
/** @type {number} */
set renderTargetScale(value) {
if (typeof value !== 'number') {
throw new Error('`value` is not type of Number');
}
this._renderTargetScale = value;
this._renderTargetDirty = true;
this._dirty = true;
}
/** @type {boolean} */
get renderTargetFloat() {
return this._renderTargetFloat;
}
/** @type {boolean} */
set renderTargetFloat(value) {
if (typeof value !== 'boolean') {
throw new Error('`value` is not type of Boolean');
}
this._renderTargetFloat = value;
this._renderTargetDirty = true;
this._dirty = true;
}
/** @type {*[]} */
get renderTargetMulti() {
return this._renderTargetMulti;
}
/** @type {*[]} */
set renderTargetMulti(value) {
this._renderTargetMulti = value;
this._renderTargetDirty = true;
this._dirty = true;
}
/** @type {string|null} */
get layer() {
return this._layer;
}
/** @type {string|null} */
set layer(value) {
if (!!value && typeof value !== 'string') {
throw new Error('`value` is not type of String!');
}
this._layer = value;
}
/** @type {mat4} */
get projectionMatrix() {
return this._projectionMatrix;
}
/** @type {mat4} */
get inverseProjectionMatrix() {
return this._inverseProjectionMatrix;
}
/** @type {mat4} */
get viewMatrix() {
return this.entity.transform;
}
/** @type {mat4} */
get inverseViewMatrix() {
return this.entity.inverseTransform;
}
/** @type {mat4} */
get viewProjectionMatrix() {
return this.entity.transform;
}
/** @type {mat4} */
get inverseViewProjectionMatrix() {
return this.entity.inverseTransform;
}
/** @type {Command|null} */
get command() {
return this._command;
}
/** @type {Command|null} */
set command(value) {
if (!value) {
this._command = null;
return;
}
if (!(value instanceof Command)) {
throw new Error('`value` is not type of Command!');
}
this._command = value;
}
/**
* Constructor.
*/
constructor() {
super();
this._ignoreChildrenViews = false;
this._captureEntity = null;
this._projectionMatrix = mat4.create();
this._inverseProjectionMatrix = mat4.create();
this._viewProjectionMatrix = mat4.create();
this._inverseViewProjectionMatrix = mat4.create();
mat4.copy(this._projectionMatrix, cachedZeroMat4);
mat4.copy(this._inverseProjectionMatrix, cachedZeroMat4);
mat4.copy(this._viewProjectionMatrix, cachedZeroMat4);
mat4.copy(this._inverseViewProjectionMatrix, cachedZeroMat4);
this._context = null;
this._renderTargetId = null;
this._renderTargetIdUsed = null;
this._renderTargetWidth = 0;
this._renderTargetHeight = 0;
this._renderTargetScale = 1;
this._renderTargetFloat = false;
this._renderTargetMulti = null;
this._renderTargetDirty = false;
this._layer = null;
this._postprocess = null;
this._postprocessRtt = null;
this._postprocessCachedWidth = 0;
this._postprocessCachedHeight = 0;
this._command = null;
this._dirty = true;
this._onResize = this.onResize.bind(this);
}
/**
* @override
*/
dispose() {
super.dispose();
const {
_context,
_renderTargetIdUsed,
_postprocessRtt,
_command
} = this;
if (!!_context) {
if (!!_renderTargetIdUsed) {
_context.unregisterRenderTarget(_renderTargetIdUsed);
}
if (!!_postprocessRtt) {
_context.unregisterRenderTarget(_postprocessRtt);
}
this._context = null;
}
if (!!_command) {
_command.dispose();
}
this._captureEntity = null;
this._projectionMatrix = null;
this._inverseProjectionMatrix = null;
this._viewProjectionMatrix = null;
this._inverseViewProjectionMatrix = null;
this._postprocess = null;
this._renderTargetId = null;
this._renderTargetIdUsed = null;
this._renderTargetMulti = null;
this._postprocessRtt = null;
this._layer = null;
this._postprocess = null;
this._postprocessRtt = null;
this._command = null;
this._onResize = null;
}
/**
* Building camera matrix.
*
* @abstract
* @param {mat4} target - Result mat4 object.
* @param {number} width - Width.
* @param {number} height - Height.
*/
buildCameraMatrix(target, width, height) {
throw new Error('Not implemented!');
}
/**
* Register postprocess.
*
* @param {PostprocessPass} postprocess - Postprocess pass.
* @param {boolean} floatPointData - Tells if stores floating point texture data.
*/
registerPostprocess(postprocess, floatPointData = false) {
if (!(postprocess instanceof PostprocessPass)) {
throw new Error('`postprocess` is not type of PostprocessPass!');
}
const { _postprocess } = this;
if (!_postprocess) {
this._postprocessCachedWidth = 0;
this._postprocessCachedHeight = 0;
}
this._postprocess = {
postprocess,
floatPointData
};
}
/**
* Unregister postprocess.
*/
unregisterPostprocess() {
const { _postprocess } = this;
if (!_postprocess) {
return;
}
this._postprocess = null;
this._postprocessCachedWidth = 0;
this._postprocessCachedHeight = 0;
}
/**
* Convert screen space unit ([-1; 1]) vec2 point to global vec2 point.
*
* @param {vec2} target - Result vec2 point.
* @param {vec2} unitVec - Input screen space unit vec2 point.
*/
convertUnitPointToGlobalPoint(target, unitVec) {
vec2.transformMat4(
target,
unitVec,
this._inverseViewProjectionMatrix
);
}
/**
* @override
*/
onAttach() {
const { RenderSystem } = System.systems;
if (!RenderSystem) {
throw new Error('There is no registered RenderSystem!');
}
RenderSystem.events.on('resize', this._onResize);
}
/**
* @override
*/
onDetach() {
const { RenderSystem } = System.systems;
if (!RenderSystem) {
throw new Error('There is no registered RenderSystem!');
}
RenderSystem.events.off('resize', this._onResize);
}
/**
* @override
*/
onAction(name, ...args) {
if (name === 'view') {
return this.onView(...args);
}
}
/**
* Called when camera need to view rendered scene.
*
* @param {WebGLRenderingContext} gl - WebGL context.
* @param {RenderSystem} renderer - Calling renderer instance.
* @param {number} deltaTime - Delta time.
*
* @return {boolean} True if ignore viewing entity children, false otherwise.
*/
onView(gl, renderer, deltaTime) {
const { entity, _ignoreChildrenViews } = this;
if (!entity) {
return _ignoreChildrenViews;
}
let { width, height } = renderer.canvas;
const {
_captureEntity,
_projectionMatrix,
_inverseProjectionMatrix,
_viewProjectionMatrix,
_inverseViewProjectionMatrix,
_renderTargetWidth,
_renderTargetHeight,
_renderTargetScale,
_postprocess
} = this;
if (_renderTargetWidth > 0) {
width = _renderTargetWidth;
}
if (_renderTargetHeight > 0) {
height = _renderTargetHeight;
}
const target = !!_captureEntity
? entity.findEntity(_captureEntity)
: entity;
if ((width | 0) === 0 || (height | 0) === 0) {
mat4.copy(_projectionMatrix, cachedZeroMat4);
mat4.copy(_inverseProjectionMatrix, cachedZeroMat4);
mat4.copy(renderer.projectionMatrix, cachedZeroMat4);
mat4.copy(renderer.viewMatrix, cachedZeroMat4);
mat4.copy(_viewProjectionMatrix, cachedZeroMat4);
mat4.copy(_inverseViewProjectionMatrix, cachedZeroMat4);
if (this._dirty) {
this._dirty = false;
target.performAction('camera-changed', this);
}
return _ignoreChildrenViews;
}
this._context = renderer;
if (this._renderTargetDirty) {
if (!!this._renderTargetId) {
if (!!this._renderTargetIdUsed) {
renderer.unregisterRenderTarget(this._renderTargetIdUsed);
}
this._renderTargetIdUsed = this._renderTargetId;
if (!!this._renderTargetMulti) {
renderer.registerRenderTargetMulti(
this._renderTargetIdUsed,
width * _renderTargetScale,
height * _renderTargetScale,
this._renderTargetMulti
);
} else {
renderer.registerRenderTarget(
this._renderTargetIdUsed,
width * _renderTargetScale,
height * _renderTargetScale,
this._renderTargetFloat
);
}
} else {
renderer.unregisterRenderTarget(this._renderTargetIdUsed);
this._renderTargetIdUsed = null;
}
this._renderTargetDirty = false;
}
this.buildCameraMatrix(_projectionMatrix, width, height);
mat4.invert(_inverseProjectionMatrix, _projectionMatrix);
mat4.copy(renderer.projectionMatrix, _projectionMatrix);
mat4.copy(renderer.viewMatrix, entity.inverseTransform);
mat4.multiply(
_viewProjectionMatrix,
_projectionMatrix,
entity.inverseTransform
);
mat4.invert(_inverseViewProjectionMatrix, _viewProjectionMatrix);
if (this._postprocessCachedWidth !== width ||
this._postprocessCachedHeight !== height
) {
this._postprocessCachedWidth = width;
this._postprocessCachedHeight = height;
if (!!this._postprocessRtt) {
renderer.unregisterRenderTarget(this._postprocessRtt);
this._postprocessRtt = null;
}
if (!!_postprocess) {
const rtt = `#Camera-PostprocessPass-${++rttUidGenerator}`;
renderer.registerRenderTarget(
rtt,
width,
height,
_postprocess.floatPointData
);
this._postprocessRtt = rtt;
}
}
if (!_postprocess) {
if (!!this._renderTargetIdUsed) {
renderer.enableRenderTarget(this._renderTargetIdUsed);
}
if (!!this._command) {
renderer.executeCommand(this._command, deltaTime, this._layer);
} else {
if (!!this._layer) {
target.performAction(
'render-layer',
gl,
renderer,
deltaTime,
this._layer
);
} else {
target.performAction('render', gl, renderer, deltaTime, null);
}
}
if (!!this._renderTargetIdUsed) {
renderer.disableRenderTarget();
}
} else {
const { _postprocessRtt } = this;
renderer.enableRenderTarget(_postprocessRtt);
if (!!this._command) {
renderer.executeCommand(this._command, deltaTime, this._layer);
} else {
if (!!this._layer) {
target.performAction(
'render-layer',
gl,
renderer,
deltaTime,
this._layer
);
} else {
target.performAction('render', gl, renderer, deltaTime, null);
}
}
_postprocess.postprocess.onApply(
gl,
renderer,
_postprocessRtt,
this._renderTargetIdUsed || null
);
renderer.disableRenderTarget();
}
if (this._dirty) {
this._dirty = false;
target.performAction('camera-changed', this);
}
return _ignoreChildrenViews;
}
/**
* Called on view resize.
*
* @param {number} width - Width.
* @param {number} height - Height.
*/
onResize(width, height) {
const {
_renderTargetWidth,
_renderTargetHeight,
_command,
_postprocess
} = this;
if (_renderTargetWidth <= 0 || _renderTargetHeight <= 0) {
this._renderTargetDirty = true;
this._postprocessCachedWidth = 0;
this._postprocessCachedHeight = 0;
this._dirty = true;
}
if (!!_command) {
_command.onResize(width, height);
}
if (!!_postprocess) {
_postprocess.postprocess.onResize(width, height);
}
}
}
</code></pre>
</div>
<footer class="footer">
Generated by <a href="https://esdoc.org">ESDoc<span data-ice="esdocVersion">(1.1.0)</span><img src="./image/esdoc-logo-mini-black.png"></a>
</footer>
<script src="script/search_index.js"></script>
<script src="script/search.js"></script>
<script src="script/pretty-print.js"></script>
<script src="script/inherited-summary.js"></script>
<script src="script/test-summary.js"></script>
<script src="script/inner-link.js"></script>
<script src="script/patch-for-local.js"></script>
</body>
</html>