whs

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>StateModule - Documentation</title> <script src="scripts/prettify/prettify.js"></script> <script src="scripts/prettify/lang-css.js"></script>  <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>  </nav> <div id="main"> <h1 class="page-title"><span class="sub"></span>StateModule</h1> <div class="sidebar"> <h5>Table of content</h5> <ul> <li><span class="folder ">— </span><a href="#tag-methods">Methods</a></li> <ul class="sub "> <li><a href="#.config">.config()</a></li> <li><a href="#.current">.current()</a></li> <li><a href="#.default">.default()</a></li> <li><a href="#.get">.get()</a></li> <li><a href="#.prev">.prev()</a></li> <li><a href="#.set">.set()</a></li> <li><a href="#.setEqualCheck">.setEqualCheck()</a></li> <li><a href="#.to">.to()</a></li> <li><a href="#.update">.update()</a></li> </ul> </ul> </div> <section class="main-doc"> <header> <h2> <span class="ancestors"><a href="module-modules_app.html">modules/app</a>/</span> StateModule </h2> </header> <article> <div class="container-overview"> <div class="section-method" id="StateModule"> <h4 class="name"><span class="type-signature"></span><span class="dot">.</span>new StateModule<span class="signature">(params<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h4> <div class="description"> <p><code>StateModule</code> is useful for apps, where you need state manipulation. This can be: <em>transitions between screens, games, development moments</em>. You can check <a href="https://whs-dev.surge.sh/examples/?basic/state">basic/state</a> example.</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/modules/app/StateModule.js">modules/app/StateModule.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/modules/app/StateModule.js#L9">line 9</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"> </td> </tr> </tbody> </table> <div class="section-examples"> <h5>Example</h5> <p class="code-caption"> Creating a state module</p> <pre class="prettyprint"><code>new App([ // ... new StateModule().default({ sphereColor: 0xff0000 }) ]);</code></pre> </div> </div> </div>  <h3 class="subsection-title" id="tag-methods">Methods <span class="gline"></span></h3> <div class="section-method" id=".config"> <h4 class="name"><span class="type-signature">(static) </span><span class="dot">.</span>config<span class="signature">(configs)</span><span class="type-signature"></span></h4> <div class="description"> <p>Load configurations from object.</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/modules/app/StateModule.js">modules/app/StateModule.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/modules/app/StateModule.js#L95">line 95</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>configs</code></td> <td class="type"> <span class="param-type"><code>Object</code></span> </td> <td class="description last"> <p>Configuration data</p> </td> </tr> </tbody> </table> <div class="section-examples"> <h5>Example</h5> <p class="code-caption"> Adding `green` configuration</p> <pre class="prettyprint"><code>state.config({ green: { sphereColor: 0x00ff00, planeColor: 0x00ff00 } });</code></pre> </div> </div> <div class="section-method" id=".current"> <h4 class="name"><span class="type-signature">(static) </span><span class="dot">.</span>current<span class="signature">(config, trueVal, falseVal)</span><span class="type-signature"></span></h4> <div class="description"> <p>Return <code>trueVal</code> if <code>config</code> match current configuration, in other case - return <code>falseVal</code>.</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/modules/app/StateModule.js">modules/app/StateModule.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/modules/app/StateModule.js#L218">line 218</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>config</code></td> <td class="type"> <span class="param-type"><code>String</code></span> </td> <td class="description last"> <p>Configuration name.</p> </td> </tr> <tr> <td class="name"><code>trueVal</code></td> <td class="type"> <span class="param-type"><code>Any</code></span> </td> <td class="description last"> <p>Value returned if condition is truthy.</p> </td> </tr> <tr> <td class="name"><code>falseVal</code></td> <td class="type"> <span class="param-type"><code>Any</code></span> </td> <td class="description last"> <p>Value returned if condition is falsy.</p> </td> </tr> </tbody> </table> </div> <div class="section-method" id=".default"> <h4 class="name"><span class="type-signature">(static) </span><span class="dot">.</span>default<span class="signature">(data)</span><span class="type-signature"></span></h4> <div class="description"> <p>Add default configuration.</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/modules/app/StateModule.js">modules/app/StateModule.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/modules/app/StateModule.js#L57">line 57</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>data</code></td> <td class="type"> <span class="param-type"><code>Object</code></span> </td> <td class="description last"> <p>Configuration setup</p> </td> </tr> </tbody> </table> <div class="section-examples"> <h5>Example</h5> <pre class="prettyprint"><code>new WHS.StateModule().default({ sphereColor: UTILS.$colors.mesh, planeColor: 0x447F8B })</code></pre> </div> </div> <div class="section-method" id=".get"> <h4 class="name"><span class="type-signature">(static) </span><span class="dot">.</span>get<span class="signature">(key)</span><span class="type-signature"></span></h4> <div class="description"> <p>Return data of parameter.</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/modules/app/StateModule.js">modules/app/StateModule.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/modules/app/StateModule.js#L188">line 188</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>key</code></td> <td class="type"> <span class="param-type"><code>String</code></span> </td> <td class="description last"> <p>Parameter name.</p> </td> </tr> </tbody> </table> <div class="section-examples"> <h5>Example</h5> <pre class="prettyprint"><code>state.get('sphereColor'); // 0x00ff00</code></pre> </div> </div> <div class="section-method" id=".prev"> <h4 class="name"><span class="type-signature">(static) </span><span class="dot">.</span>prev<span class="signature">(config, trueVal, falseVal)</span><span class="type-signature"></span></h4> <div class="description"> <p>Return <code>trueVal</code> if <code>config</code> match previous configuration, in other case - return <code>falseVal</code>.</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/modules/app/StateModule.js">modules/app/StateModule.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/modules/app/StateModule.js#L203">line 203</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>config</code></td> <td class="type"> <span class="param-type"><code>String</code></span> </td> <td class="description last"> <p>Configuration name.</p> </td> </tr> <tr> <td class="name"><code>trueVal</code></td> <td class="type"> <span class="param-type"><code>Any</code></span> </td> <td class="description last"> <p>Value returned if condition is truthy.</p> </td> </tr> <tr> <td class="name"><code>falseVal</code></td> <td class="type"> <span class="param-type"><code>Any</code></span> </td> <td class="description last"> <p>Value returned if condition is falsy.</p> </td> </tr> </tbody> </table> </div> <div class="section-method" id=".set"> <h4 class="name"><span class="type-signature">(static) </span><span class="dot">.</span>set<span class="signature">(data)</span><span class="type-signature"></span></h4> <div class="description"> <p>Set current parameters.</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/modules/app/StateModule.js">modules/app/StateModule.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/modules/app/StateModule.js#L169">line 169</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>data</code></td> <td class="type"> <span class="param-type"><code>Object</code></span> </td> <td class="description last"> <p>Configuration parameters.</p> </td> </tr> </tbody> </table> <div class="section-examples"> <h5>Example</h5> <pre class="prettyprint"><code>state.set({ sphereColor: 0x00ff00 });</code></pre> </div> </div> <div class="section-method" id=".setEqualCheck"> <h4 class="name"><span class="type-signature">(static) </span><span class="dot">.</span>setEqualCheck<span class="signature">(func)</span><span class="type-signature"></span></h4> <div class="description"> <p>Sets an equalCheck function</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/modules/app/StateModule.js">modules/app/StateModule.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/modules/app/StateModule.js#L77">line 77</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>function to generate equal check</p> </td> </tr> </tbody> </table> </div> <div class="section-method" id=".to"> <h4 class="name"><span class="type-signature">(static) </span><span class="dot">.</span>to<span class="signature">(configName)</span><span class="type-signature"></span></h4> <div class="description"> <p>Switch to configuration.</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/modules/app/StateModule.js">modules/app/StateModule.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/modules/app/StateModule.js#L149">line 149</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>configName</code></td> <td class="type"> <span class="param-type"><code>String</code></span> </td> <td class="description last"> <p>Configuration name.</p> </td> </tr> </tbody> </table> <div class="section-examples"> <h5>Example</h5> <p class="code-caption"> Changes configuration to `green`</p> <pre class="prettyprint"><code>state.to('green');</code></pre> </div> </div> <div class="section-method" id=".update"> <h4 class="name"><span class="type-signature">(static) </span><span class="dot">.</span>update<span class="signature">(updates)</span><span class="type-signature"></span></h4> <div class="description"> <p>Load updates from object.</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/modules/app/StateModule.js">modules/app/StateModule.js</a>, <a href="https://github.com/WhitestormJS/whitestorm.js/blob/dev/src/modules/app/StateModule.js#L119">line 119</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>updates</code></td> <td class="type"> <span class="param-type"><code>Object</code></span> </td> <td class="description last"> <p>Updates data</p> </td> </tr> </tbody> </table> <div class="section-examples"> <h5>Example</h5> <p class="code-caption"> Update callback for `sphereColor`</p> <pre class="prettyprint"><code>state.update({ sphereColor: color => sphere.material.color.setHex(color) });</code></pre> </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:47 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>