whs
Version:
Super-fast 3D framework for Web Applications & Games. Based on Three.js
2,352 lines (719 loc) • 46.3 kB
HTML
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>OrthographicCamera - Documentation</title>
<script src="scripts/prettify/prettify.js"></script>
<script src="scripts/prettify/lang-css.js"></script>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link type="text/css" rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
<link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
<link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
</head>
<body>
<input type="checkbox" id="nav-trigger" class="nav-trigger" />
<label for="nav-trigger" class="navicon-button x">
<div class="navicon"></div>
</label>
<label for="nav-trigger" class="overlay"></label>
<nav>
<a class="no-u" href="index.html"><span class="logo">whs<span class="gl">.js</span> <span class="gline"></span></span></a>
<li>
<a href="https://github.com/WhitestormJS/whitestorm.js/releases"><img src="https://img.shields.io/github/release/WhitestormJS/whitestorm.js.svg?style=flat-square" alt="GitHub release"></a>
</li>
<li><a href="https://discord.gg/5yNCvC4">chat</a> <span style="color: #777; font-size: 12px; margin-left: 5px;">(discord)</span></li>
<li><a href="https://github.com/WhitestormJS/whitestorm.js">github</a> <span style="color: #777; font-size: 12px; margin-left: 5px;">(source code)</span></li>
<li><a href="https://whs-dev.surge.sh/examples/">examples</a></li>
<li><span> </span></li>
<li><a href="https://threejs.org/">three.js</a></li>
<li><a href="https://twitter.com/_alex_buzin">twitter</a> <span style="color: #777; font-size: 12px; margin-left: 5px;">(me)</span></li>
<li><span> </span></li>
<li class="nav-heading">Pages</li><li class="nav-link nav-Welcome-link"><a href="index.html">Welcome</a></li><li class="nav-link nav-Showcase-link"><a href="Showcase.html">Showcase</a></li><li class="nav-link nav-Hello World!-link"><a href="Hello World!.html">Hello World!</a></li><li class="nav-link nav-Loops & 3D Animation-link"><a href="Loops & 3D Animation.html">Loops & 3D Animation</a></li><li class="nav-link nav-Groups-link"><a href="Groups.html">Groups</a></li><li class="nav-link nav-3D Transforms-link"><a href="3D Transforms.html">3D Transforms</a></li><li class="nav-link nav-Usage with webpack-link"><a href="Usage with webpack.html">Usage with webpack</a></li><li class="nav-link nav-Modules-link"><a href="Modules.html">Modules</a></li><li class="nav-link nav-Animation Clips-link"><a href="Animation Clips.html">Animation Clips</a></li><li class="nav-heading margin">Classes</li><li class="nav-heading pad "><a href="module-core.html">core</a></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-core.App.html">App</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-core.CameraComponent.html">CameraComponent</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-core.Component.html">Component</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-core.LightComponent.html">LightComponent</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-core.Loop.html">Loop</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-core.MeshComponent.html">MeshComponent</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-core.ModuleManager.html">ModuleManager</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-core.ModuleSystem.html">ModuleSystem</a></span></li><li class="nav-heading pad "><a href="module-components_meshes.html">components/meshes</a></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Box.html">Box</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Circle.html">Circle</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Cone.html">Cone</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Cylinder.html">Cylinder</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Dodecahedron.html">Dodecahedron</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Extrude.html">Extrude</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Group.html">Group</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Icosahedron.html">Icosahedron</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Importer.html">Importer</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Lathe.html">Lathe</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Line.html">Line</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Octahedron.html">Octahedron</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Parametric.html">Parametric</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Plane.html">Plane</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Polyhedron.html">Polyhedron</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Ring.html">Ring</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Shape.html">Shape</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Sphere.html">Sphere</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Tetrahedron.html">Tetrahedron</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Text.html">Text</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Torus.html">Torus</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Torusknot.html">Torusknot</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_meshes.Tube.html">Tube</a></span></li><li class="nav-heading pad "><a href="module-components_lights.html">components/lights</a></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_lights.AmbientLight.html">AmbientLight</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_lights.DirectionalLight.html">DirectionalLight</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_lights.HemisphereLight.html">HemisphereLight</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_lights.PointLight.html">PointLight</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_lights.SpotLight.html">SpotLight</a></span></li><li class="nav-heading pad "><a href="module-components_cameras.html">components/cameras</a></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_cameras.CubeCamera.html">CubeCamera</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_cameras.OrthographicCamera.html">OrthographicCamera</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-components_cameras.PerspectiveCamera.html">PerspectiveCamera</a></span></li><li class="nav-heading pad "><a href="module-modules.html">modules</a></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-modules.DefineModule.html">DefineModule</a></span></li><li class="nav-heading pad "><a href="module-modules_app.html">modules/app</a></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-modules_app.ControlsModule.html">ControlsModule</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-modules_app.ElementModule.html">ElementModule</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-modules_app.FogModule.html">FogModule</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-modules_app.OrbitControlsModule.html">OrbitControlsModule</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-modules_app.PostProcessorModule.html">PostProcessorModule</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-modules_app.RenderingModule.html">RenderingModule</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-modules_app.ResizeModule.html">ResizeModule</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-modules_app.SceneModule.html">SceneModule</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-modules_app.StateModule.html">StateModule</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-modules_app.VirtualMouseModule.html">VirtualMouseModule</a></span></li><li class="nav-heading pad "><a href="module-modules_mesh.html">modules/mesh</a></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-modules_mesh.AnimationModule.html">AnimationModule</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-modules_mesh.DynamicGeometryModule.html">DynamicGeometryModule</a></span></li><li class="nav-heading "><span class="nav-item-type type-class">C</span><span class="nav-item-name"><a href="module-modules_mesh.TextureModule.html">TextureModule</a></span></li><li class="nav-heading margin">Namespaces</li><li class="nav-heading "><span class="nav-item-type type-namespace">N</span><span class="nav-item-name"><a href="WHS.html">WHS</a></span></li><li class="nav-heading "><a href="global.html">Globals</a></li><li class="nav-item"><span class="nav-item-type type-member">M</span><span class="nav-item-name"><a href="global.html#VREffect">VREffect</a></span></li><li class="nav-item"><span class="nav-item-type type-member">M</span><span class="nav-item-name"><a href="global.html#WEBVR">WEBVR</a></span></li>
<!-- <div class="nav-footer">
<a href="https://discord.gg/5yNCvC4" class="icon"><img src="./discord.png" width="32" /></a>
<a href="https://github.com/WhitestormJS/whitestorm.js" class="icon"><img src="./github.png" style="transform: scale(1.3);" width="32" /></a>
<a href="https://twitter.com/_alex_buzin" class="icon"><img src="./twitter.jpg" style="transform: scale(0.8);" width="32" /></a>
</div> -->
</nav>
<div id="main">
<h1 class="page-title"><span class="sub"></span>OrthographicCamera</h1>
<div class="sidebar">
<h5>Table of content</h5>
<ul>
<li><span class="folder ">— </span><a href="#tag-members">Members</a></li>
<ul class="sub ">
<li><a href="#_wait">._wait</a></li>
<li><a href="#children">.children</a></li>
<li><a href="#defaults">.defaults</a></li>
<li><a href="#instructions">.instructions</a></li>
<li><a href="#isDeffered">.isDeffered</a></li>
<li><a href="#manager">.manager</a></li>
<li><a href="#modules">.modules</a></li>
<li><a href="#native">.native</a></li>
</ul>
<li><span class="folder folded">+ </span><a href="#tag-methods">Methods</a></li>
<ul class="sub folded">
<li><a href="#add">.add()</a></li>
<li><a href="#addTo">.addTo()</a></li>
<li><a href="#build">.build()</a></li>
<li><a href="#clone">.clone()</a></li>
<li><a href="#copy">.copy()</a></li>
<li><a href="#defer">.defer()</a></li>
<li><a href="#remove">.remove()</a></li>
<li><a href="#updateParams">.updateParams()</a></li>
<li><a href="#wait">.wait()</a></li>
<li><a href="#wrap">.wrap()</a></li>
</ul>
</ul>
</div>
<section class="main-doc">
<header>
<h2>
<span class="ancestors"><a href="module-components_cameras.html">components/cameras</a>/</span>
OrthographicCamera
</h2>
</header>
<article>
<div class="container-overview">
<div class="section-method" id="OrthographicCamera">
<h4 class="name"><span class="type-signature"></span><span class="dot">.</span>new OrthographicCamera<span class="signature">(params<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h4>
<div class="description">
<p>Camera with orthographic projection.</p>
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/components/cameras/OrthographicCamera.js">components/cameras/OrthographicCamera.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/components/cameras/OrthographicCamera.js#L7">line 7</a>
</li></ul></dd>
</dl>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Attributes</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>params</code></td>
<td class="type">
<span class="param-type"><code>Object</code></span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">
<p>The parameters object.</p>
</td>
</tr>
</tbody>
</table>
<div class="section-examples">
<h5>Example</h5>
<p class="code-caption">Create an OrthographicCamera and set it as app's camera</p>
<pre class="prettyprint"><code>const camera = new OrthographicCamera({
camera: {
far: 10000
},
position: {
y: 50
}
});
app.camera = camera;</code></pre>
</div>
<h4 class="no-dec" style="padding-left: 20px;">Extends
<a href="module-core.CameraComponent.html">module:core.CameraComponent</a>
</h4>
</div>
</div>
<!-- <div class="subsection-left"> -->
<h3 class="subsection-title" id="tag-members">Members <span class="gline"></span></h3>
<div class="section-members" id="_wait">
<h4 class="name"><span class="type-signature">(private) </span><span class="dot">.</span>_wait<span class="type-signature"> :Array</span></h4>
<div class="description">
<p>Array of promises that should be resolved before Component is ready.</p>
</div>
<dl class="details">
<dt class="inherited-from">Inherited From:</dt>
<dd class="inherited-from"><ul class="dummy"><li>
<a href="module-core.Component.html#_wait">module:core.Component#_wait</a>
</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js">core/Component.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js#L74">line 74</a>
</li></ul></dd>
</dl>
<!--<h5>Type:
<span class="param-type"><code>Array</code></span>
</h5>-->
</div>
<div class="section-members" id="children">
<h4 class="name"><span class="type-signature"></span><span class="dot">.</span>children<span class="type-signature"> :Array</span></h4>
<div class="description">
<p>Collection of <code>child</code> Components.</p>
</div>
<dl class="details">
<dt class="inherited-from">Inherited From:</dt>
<dd class="inherited-from"><ul class="dummy"><li>
<a href="module-core.Component.html#children">module:core.Component#children</a>
</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js">core/Component.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js#L67">line 67</a>
</li></ul></dd>
</dl>
<!--<h5>Type:
<span class="param-type"><code>Array</code></span>
</h5>-->
</div>
<div class="section-members" id="defaults">
<h4 class="name"><span class="type-signature"></span><span class="dot">.</span>defaults<span class="type-signature"> :Object</span></h4>
<div class="description">
<p>Default values for parameters</p>
</div>
<dl class="details">
<dt class="tag-overrides">Overrides:</dt>
<dd class="tag-overrides"><ul class="dummy"><li>
<a href="module-core.CameraComponent.html#defaults">module:core.CameraComponent#defaults</a>
</li></ul></dd>
<dt class="tag-default">Default Value:</dt>
<dd class="tag-default" style="margin-left: 100px;"><ul class="dummy">
<pre style="line-height: 1.4; word-wrap: break-word; display: block;">
<code style="display: block;"><pre>
{
near: 1,
far: 1000,
left: system.window.innerWidth / -2,
right: system.window.innerWidth / 2,
top: system.window.innerHeight / 2,
bottom: system.window.innerHeight / -2
}</pre></code>
</pre>
</ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/components/cameras/OrthographicCamera.js">components/cameras/OrthographicCamera.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/components/cameras/OrthographicCamera.js#L35">line 35</a>
</li></ul></dd>
</dl>
<!--<h5>Type:
<span class="param-type"><code>Object</code></span>
</h5>-->
</div>
<div class="section-members" id="instructions">
<h4 class="name"><span class="type-signature"></span><span class="dot">.</span>instructions<span class="type-signature"> :Object</span></h4>
<div class="description">
<p>Static instructions</p>
</div>
<dl class="details">
<dt class="inherited-from">Inherited From:</dt>
<dd class="inherited-from"><ul class="dummy"><li>
<a href="module-core.CameraComponent.html#instructions">module:core.CameraComponent#instructions</a>
</li></ul></dd>
<dt class="tag-default">Default Value:</dt>
<dd class="tag-default" style="margin-left: 100px;"><ul class="dummy">
<pre style="line-height: 1.4; word-wrap: break-word; display: block;">
<code style="display: block;">{
position: ['x', 'y', 'z'],
rotation: ['x', 'y', 'z'],
scale: ['x', 'y', 'z']
}</code>
</pre>
</ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/CameraComponent.js">core/CameraComponent.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/CameraComponent.js#L69">line 69</a>
</li></ul></dd>
</dl>
<!--<h5>Type:
<span class="param-type"><code>Object</code></span>
</h5>-->
</div>
<div class="section-members" id="isDeffered">
<h4 class="name"><span class="type-signature"></span><span class="dot">.</span>isDeffered<span class="type-signature"> :Boolean</span></h4>
<div class="description">
<p>Returns whether the object is <code>async</code> (<code>wait</code> promises are more than <code>0</code>).</p>
</div>
<dl class="details">
<dt class="inherited-from">Inherited From:</dt>
<dd class="inherited-from"><ul class="dummy"><li>
<a href="module-core.Component.html#isDeffered">module:core.Component#isDeffered</a>
</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js">core/Component.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js#L238">line 238</a>
</li></ul></dd>
</dl>
<!--<h5>Type:
<span class="param-type"><code>Boolean</code></span>
</h5>-->
</div>
<div class="section-members" id="manager">
<h4 class="name"><span class="type-signature"></span><span class="dot">.</span>manager<span class="type-signature"> :ModuleManager</span></h4>
<div class="description">
<p>Returns the <code>ModuleManager</code> used for this component.</p>
</div>
<dl class="details">
<dt class="inherited-from">Inherited From:</dt>
<dd class="inherited-from"><ul class="dummy"><li>
<a href="module-core.Component.html#manager">module:core.Component#manager</a>
</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js">core/Component.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js#L249">line 249</a>
</li></ul></dd>
</dl>
<!--<h5>Type:
<span class="param-type"><code>ModuleManager</code></span>
</h5>-->
</div>
<div class="section-members" id="modules">
<h4 class="name"><span class="type-signature"></span><span class="dot">.</span>modules<span class="type-signature"> :Array</span></h4>
<div class="description">
<p>Collection of <code>modules</code>.</p>
</div>
<dl class="details">
<dt class="inherited-from">Inherited From:</dt>
<dd class="inherited-from"><ul class="dummy"><li>
<a href="module-core.Component.html#modules">module:core.Component#modules</a>
</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js">core/Component.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js#L23">line 23</a>
</li></ul></dd>
</dl>
<!--<h5>Type:
<span class="param-type"><code>Array</code></span>
</h5>-->
</div>
<div class="section-members" id="native">
<h4 class="name"><span class="type-signature"></span><span class="dot">.</span>native<span class="type-signature"> :Object</span></h4>
<div class="description">
<p>Returns the <code>native</code> object used for this component.</p>
</div>
<dl class="details">
<dt class="inherited-from">Inherited From:</dt>
<dd class="inherited-from"><ul class="dummy"><li>
<a href="module-core.Component.html#native">module:core.Component#native</a>
</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js">core/Component.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js#L266">line 266</a>
</li></ul></dd>
</dl>
<!--<h5>Type:
<span class="param-type"><code>Object</code></span>
</h5>-->
</div>
<!-- </div> -->
<!-- <div class="subsection-right"> -->
<h3 class="subsection-title" id="tag-methods">Methods <span class="gline"></span></h3>
<div class="section-method" id="add">
<h4 class="name"><span class="type-signature"></span><span class="dot">.</span>add<span class="signature">(object)</span><span class="type-signature"> → {Promise}</span></h4>
<div class="description">
<p>Add a child <code>Component</code>.</p>
</div>
<dl class="details">
<dt class="inherited-from">Inherited From:</dt>
<dd class="inherited-from"><ul class="dummy"><li>
<a href="module-core.Component.html#add">module:core.Component#add</a>
</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js">core/Component.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js#L173">line 173</a>
</li></ul></dd>
</dl>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>object</code></td>
<td class="type">
<span class="param-type"><code>Component</code></span>
</td>
<td class="description last">
<p>Component that should be added as a <code>child</code>.</p>
</td>
</tr>
</tbody>
</table>
<div class="section-returns">
<!--<h5>Returns:</h5>
<dl class="param-type">
<dt>
Type:
</dt>
<dd>
<span class="param-type"><code>Promise</code></span>
</dd>
</dl>
<div class="param-desc">
<p>Resolved when action is done.</p>
</div>
-->
</div>
</div>
<div class="section-method" id="addTo">
<h4 class="name"><span class="type-signature"></span><span class="dot">.</span>addTo<span class="signature">(object)</span><span class="type-signature"></span></h4>
<div class="description">
<p>Adds <code>this</code> Component to specified <code>App</code>/<code>Component</code>.</p>
</div>
<dl class="details">
<dt class="inherited-from">Inherited From:</dt>
<dd class="inherited-from"><ul class="dummy"><li>
<a href="module-core.Component.html#addTo">module:core.Component#addTo</a>
</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js">core/Component.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js#L224">line 224</a>
</li></ul></dd>
</dl>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>object</code></td>
<td class="type">
<span class="param-type"><code>Component</code></span>
</td>
<td class="description last">
<p>Component that will be a parent of <code>this</code>.</p>
</td>
</tr>
</tbody>
</table>
</div>
<div class="section-method" id="build">
<h4 class="name"><span class="type-signature"></span><span class="dot">.</span>build<span class="signature">()</span><span class="type-signature"></span></h4>
<div class="description">
<p>Build livecycle should return a native object.</p>
</div>
<dl class="details">
<dt class="inherited-from">Inherited From:</dt>
<dd class="inherited-from"><ul class="dummy"><li>
<a href="module-core.CameraComponent.html#build">module:core.CameraComponent#build</a>
</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/CameraComponent.js">core/CameraComponent.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/CameraComponent.js#L60">line 60</a>
</li></ul></dd>
</dl>
<div class="section-throws">
<h5>Throws:</h5>
<div class="param-desc">
<span class="param-type"><code>CompositionError</code></span>
</div>
</div>
</div>
<div class="section-method" id="clone">
<h4 class="name"><span class="type-signature"></span><span class="dot">.</span>clone<span class="signature">()</span><span class="type-signature"> → {CameraComponent}</span></h4>
<div class="description">
<p>Make a clone of this CameraComponent using <code>.copy()</code></p>
</div>
<dl class="details">
<dt class="inherited-from">Inherited From:</dt>
<dd class="inherited-from"><ul class="dummy"><li>
<a href="module-core.CameraComponent.html#clone">module:core.CameraComponent#clone</a>
</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/CameraComponent.js">core/CameraComponent.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/CameraComponent.js#L135">line 135</a>
</li></ul></dd>
</dl>
<div class="section-returns">
<!--<h5>Returns:</h5>
<dl class="param-type">
<dt>
Type:
</dt>
<dd>
<span class="param-type"><code>CameraComponent</code></span>
</dd>
</dl>
<div class="param-desc">
<p>clone of this object</p>
</div>
-->
</div>
</div>
<div class="section-method" id="copy">
<h4 class="name"><span class="type-signature"></span><span class="dot">.</span>copy<span class="signature">()</span><span class="type-signature"> → {this}</span></h4>
<div class="description">
<p>Copy source transforms & execute <code>Component.copy()</code></p>
</div>
<dl class="details">
<dt class="inherited-from">Inherited From:</dt>
<dd class="inherited-from"><ul class="dummy"><li>
<a href="module-core.CameraComponent.html#copy">module:core.CameraComponent#copy</a>
</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/CameraComponent.js">core/CameraComponent.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/CameraComponent.js#L113">line 113</a>
</li></ul></dd>
</dl>
<div class="section-returns">
<!--<h5>Returns:</h5>
<dl class="param-type">
<dt>
Type:
</dt>
<dd>
<span class="param-type"><code>this</code></span>
</dd>
</dl>
<div class="param-desc">
<p>CameraComponent</p>
</div>
-->
</div>
</div>
<div class="section-method" id="defer">
<h4 class="name"><span class="type-signature"></span><span class="dot">.</span>defer<span class="signature">(func)</span><span class="type-signature"></span></h4>
<div class="description">
<p>Execute <code>func</code> (Callback) when Component is ready.</p>
</div>
<dl class="details">
<dt class="inherited-from">Inherited From:</dt>
<dd class="inherited-from"><ul class="dummy"><li>
<a href="module-core.Component.html#defer">module:core.Component#defer</a>
</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js">core/Component.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js#L98">line 98</a>
</li></ul></dd>
</dl>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>func</code></td>
<td class="type">
<span class="param-type"><code>function</code></span>
</td>
<td class="description last">
<p>Callback.</p>
</td>
</tr>
</tbody>
</table>
</div>
<div class="section-method" id="remove">
<h4 class="name"><span class="type-signature"></span><span class="dot">.</span>remove<span class="signature">(object)</span><span class="type-signature"></span></h4>
<div class="description">
<p>Remove a child <code>Component</code>.</p>
</div>
<dl class="details">
<dt class="inherited-from">Inherited From:</dt>
<dd class="inherited-from"><ul class="dummy"><li>
<a href="module-core.Component.html#remove">module:core.Component#remove</a>
</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js">core/Component.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js#L209">line 209</a>
</li></ul></dd>
</dl>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>object</code></td>
<td class="type">
<span class="param-type"><code>Component</code></span>
</td>
<td class="description last">
<p>Component that should be a <strong>child</strong> of this Component.</p>
</td>
</tr>
</tbody>
</table>
</div>
<div class="section-method" id="updateParams">
<h4 class="name"><span class="type-signature"></span><span class="dot">.</span>updateParams<span class="signature">()</span><span class="type-signature"> → {Object}</span></h4>
<div class="description">
<p>Updates parameters of the Component.</p>
</div>
<dl class="details">
<dt class="inherited-from">Inherited From:</dt>
<dd class="inherited-from"><ul class="dummy"><li>
<a href="module-core.Component.html#updateParams">module:core.Component#updateParams</a>
</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js">core/Component.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js#L118">line 118</a>
</li></ul></dd>
</dl>
<div class="section-returns">
<!--<h5>Returns:</h5>
<dl class="param-type">
<dt>
Type:
</dt>
<dd>
<span class="param-type"><code>Object</code></span>
</dd>
</dl>
<div class="param-desc">
<p>Params of this Component</p>
</div>
-->
</div>
</div>
<div class="section-method" id="wait">
<h4 class="name"><span class="type-signature"></span><span class="dot">.</span>wait<span class="signature">(promise<span class="signature-attributes">opt</span>)</span><span class="type-signature"> → {Promise}</span></h4>
<div class="description">
<p>Wait for a promise.</p>
</div>
<dl class="details">
<dt class="inherited-from">Inherited From:</dt>
<dd class="inherited-from"><ul class="dummy"><li>
<a href="module-core.Component.html#wait">module:core.Component#wait</a>
</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js">core/Component.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/Component.js#L57">line 57</a>
</li></ul></dd>
</dl>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Attributes</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>promise</code></td>
<td class="type">
<span class="param-type"><code>Promise</code></span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">
<p>The promise that should be added to a queue.</p>
</td>
</tr>
</tbody>
</table>
<div class="section-returns">
<!--<h5>Returns:</h5>
<dl class="param-type">
<dt>
Type:
</dt>
<dd>
<span class="param-type"><code>Promise</code></span>
</dd>
</dl>
<div class="param-desc">
<p>Promise that is resolved when all promises completed.</p>
</div>
-->
</div>
</div>
<div class="section-method" id="wrap">
<h4 class="name"><span class="type-signature"></span><span class="dot">.</span>wrap<span class="signature">()</span><span class="type-signature"> → {Promise}</span></h4>
<div class="description">
<p>Wraps transforms (<code>position</code> & <code>rotation</code>)</p>
</div>
<dl class="details">
<dt class="inherited-from">Inherited From:</dt>
<dd class="inherited-from"><ul class="dummy"><li>
<a href="module-core.CameraComponent.html#wrap">module:core.CameraComponent#wrap</a>
</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/CameraComponent.js">core/CameraComponent.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/core/CameraComponent.js#L88">line 88</a>
</li></ul></dd>
</dl>
<div class="section-returns">
<!--<h5>Returns:</h5>
<dl class="param-type">
<dt>
Type:
</dt>
<dd>
<span class="param-type"><code>Promise</code></span>
</dd>
</dl>
<div class="param-desc">
<p>Resolved when action is completed</p>
</div>
-->
</div>
</div>
<!-- </div> -->
</article>
</section>
<script>
var folders = document.querySelectorAll('.folder');
console.log(folders);
[].slice.call(folders).forEach(function (folder) {
folder.addEventListener('click', function() {
folder.classList.toggle('folded');
folder.parentNode.nextElementSibling.classList.toggle('folded');
folder.innerText = folder.className.indexOf('folded') > -1 ? '+ ' : '— ';
});
})
</script>
</div>
<br class="clear">
<footer>
Generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.4.3</a><strong> on Tue Jul 18 2017 14:29:46 GMT+0300 (EEST)</strong>. Inspired by <a href="http://stack.gl/packages/">stack.gl</a>
<br /> <span style="color: #A9B0C2;"><b>MIT</b>, see <code>LICENSE.md</code> for details.</span>
</footer>
<script>prettyPrint();</script>
<script src="scripts/linenumber.js"></script>
<script src="scripts/scroll.js"></script>
<script>
const links = document.querySelectorAll('.sidebar a[href]');
[].slice.call(links).forEach(link => {
link.classList.add('scroll');
});
</script>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-83696871-1', 'auto');
ga('send', 'pageview');
</script>
</body>
</html>