ohzi-core 10.6.7 → 11.0.1

package/src/materials/SSAOMaterial.js

@@ -3,11 +3,7 @@ import { BlitMaterial } from '../materials/BlitMaterial';
 import frag from '../shaders/ssao/ssao.frag';
 import vert from '../shaders/ssao/ssao.vert';
 
-import { Matrix4 } from 'three';
-import { Vector3 } from 'three';
-import { DataTexture } from 'three';
-import { RGBFormat } from 'three';
-import { RepeatWrapping } from 'three';
+import { DataTexture, Matrix4, RGBAFormat, RepeatWrapping, Vector3 } from 'three';
 
 import { OMath } from '../utilities/OMath';
 class SSAOMaterial extends BlitMaterial
@@ -57,7 +53,7 @@ class SSAOMaterial extends BlitMaterial
       rotation_kernel[i * 3 + 3] = 0;
     }
 
-    const rotation_texture = new DataTexture(rotation_kernel, 4, 4, RGBFormat);
+    const rotation_texture = new DataTexture(rotation_kernel, 4, 4, RGBAFormat);
     rotation_texture.wrapS = RepeatWrapping;
     rotation_texture.wrapT = RepeatWrapping;
 

package/src/primitives/Arrow.js

@@ -1,7 +1,4 @@
-import { CylinderBufferGeometry } from 'three';
-import { ConeBufferGeometry } from 'three';
-import { MeshBasicMaterial } from 'three';
-import { Vector3, Mesh } from 'three';
+import { ConeGeometry, CylinderGeometry, Mesh, MeshBasicMaterial, Vector3 } from 'three';
 
 import * as BufferGeometryUtils from 'three/examples/jsm/utils/BufferGeometryUtils.js';
 
@@ -14,10 +11,10 @@ class Arrow extends Mesh
 
     const cone_height = 0.4;
     const cylinder_height = length - cone_height;
-    const cylinder_geo = new CylinderBufferGeometry(0.01, 0.01, cylinder_height, 32);
+    const cylinder_geo = new CylinderGeometry(0.01, 0.01, cylinder_height, 32);
     cylinder_geo.translate(0, cylinder_height / 2, 0);
 
-    const cone_geometry = new ConeBufferGeometry(0.1, cone_height, 32);
+    const cone_geometry = new ConeGeometry(0.1, cone_height, 32);
     cone_geometry.translate(0, cylinder_height + cone_height / 2, 0);
 
     const buffer_geometry = BufferGeometryUtils.mergeBufferGeometries([cylinder_geo, cone_geometry]);

package/src/primitives/Sphere.js

@@ -1,6 +1,4 @@
-import { Mesh } from 'three';
-import { SphereBufferGeometry } from 'three';
-import { MeshBasicMaterial } from 'three';
+import { Mesh, MeshBasicMaterial, SphereGeometry } from 'three';
 
 class Sphere extends Mesh
 {
@@ -8,7 +6,7 @@ class Sphere extends Mesh
   {
     color = color || '#FF0000';
     radius = radius || 1;
-    const geometry = new SphereBufferGeometry(radius, 64, 64);
+    const geometry = new SphereGeometry(radius, 64, 64);
     const material = new MeshBasicMaterial({ color: color });
     super(geometry, material);
   }

package/src/render_mode/DeferredRender.js

@@ -1,16 +1,12 @@
 import { CameraManager } from '../CameraManager';
-import { SceneManager } from '../SceneManager';
+import { Graphics } from '../Graphics';
 import { OScreen } from '../OScreen';
-import { BaseRender } from '../render_mode/BaseRender';
+import { SceneManager } from '../SceneManager';
 import { DeferredRendererComposeMaterial } from '../materials/DeferredRendererComposeMaterial';
-import { Graphics } from '../Graphics';
 import { DeferredPointLightMaterial } from '../materials/deferred/DeferredPointLightMaterial';
+import { BaseRender } from '../render_mode/BaseRender';
 
-import { WebGLRenderTarget } from 'three';
-import { Scene } from 'three';
-import { Mesh } from 'three';
-import { SphereBufferGeometry } from 'three';
-import { Matrix4 } from 'three';
+import { Matrix4, Mesh, Scene, SphereGeometry, WebGLRenderTarget } from 'three';
 
 class DeferredRender extends BaseRender
 {
@@ -29,7 +25,7 @@ class DeferredRender extends BaseRender
     const light_intensity = 1;
     const light_brightest_component = 1;
     const radius_needed_for_intensity = Math.sqrt(4 * light_intensity * (light_brightest_component * (256.0 / 5.0))) / (2 * light_intensity);
-    const sphere = new Mesh(new SphereBufferGeometry(radius_needed_for_intensity), new DeferredPointLightMaterial(light_intensity));
+    const sphere = new Mesh(new SphereGeometry(radius_needed_for_intensity), new DeferredPointLightMaterial(light_intensity));
     // sphere.position.y = 2;
     // this.scene_lights.add(sphere);
 

package/src/render_mode/NormalAORender.js

@@ -1,19 +1,18 @@
 import { CameraManager } from '../CameraManager';
-import { SceneManager } from '../SceneManager';
+import { Graphics } from '../Graphics';
 import { OScreen } from '../OScreen';
-import { BaseRender } from '../render_mode/BaseRender';
-import { Configuration } from '../Configuration';
-import { SSAOMaterial } from '../materials/SSAOMaterial';
-import { SSAOComposeMaterial } from '../materials/SSAOComposeMaterial';
+import { SceneManager } from '../SceneManager';
 import { DisplayNormalTextureMaterial } from '../materials/DisplayNormalTextureMaterial';
+import { SSAOComposeMaterial } from '../materials/SSAOComposeMaterial';
+import { SSAOMaterial } from '../materials/SSAOMaterial';
+import { BaseRender } from '../render_mode/BaseRender';
 import { Blurrer } from '../render_utilities/Blurrer';
-import { Graphics } from '../Graphics';
 
 import { WebGLRenderTarget } from 'three';
 
 class NormalAORender extends BaseRender
 {
-  constructor()
+  constructor(use_ssaa = false)
   {
     super();
 
@@ -21,7 +20,7 @@ class NormalAORender extends BaseRender
     this.ssao_compose_mat = new SSAOComposeMaterial();
     this.debug_normals = new DisplayNormalTextureMaterial();
 
-    this.ssaa = Configuration.use_ssaa ? 2 : 1;
+    this.ssaa = use_ssaa ? 2 : 1;
 
     this.main_RT = new WebGLRenderTarget(OScreen.width * this.ssaa, OScreen.height * this.ssaa);
 

package/src/resource_loader/AsyncTextureLoader.js

@@ -9,6 +9,8 @@ class AsyncTextureLoader extends AbstractLoader
   {
     super(resource_id, url, size);
 
+    this.original_url = '';
+
     this.colorSpaceConversion = colorSpaceConversion;
     this.premultiplyAlpha = premultiplyAlpha;
     this.flipY = flipY;
@@ -51,7 +53,7 @@ class AsyncTextureLoader extends AbstractLoader
 
       image.onerror = () =>
       {
-        console.error('Error loading texture. Maybe the resource is not an image?', this.url, this.original_url);
+        console.error('The source image could not be decoded.', this.original_url);
       };
     }
     else
@@ -93,9 +95,9 @@ class AsyncTextureLoader extends AbstractLoader
 
         this.__update_downloaded_bytes(1, 1);
         this.__loading_ended();
-      }).catch(function(e)
+      }).catch((e) =>
       {
-        console.error(e);
+        console.error(e, this.original_url);
       });
     }
     else

package/src/resource_loader/BasisLoader.js

@@ -1,7 +1,5 @@
 import { AbstractLoader } from './AbstractLoader';
 
-// import { sRGBEncoding } from 'three';
-
 class BasisLoader extends AbstractLoader
 {
   constructor(resource_id, url, loader, size)
@@ -17,8 +15,6 @@ class BasisLoader extends AbstractLoader
     {
       this.loader.load(this.url, (basis) =>
       {
-      // basis.encoding = sRGBEncoding;
-
         resource_container.set_resource(this.resource_id, this.url, basis);
 
         this.__update_downloaded_bytes(1, 1);

package/src/static_batcher/GeometryBatch.js

@@ -1,10 +1,4 @@
-import { Vector2 } from 'three';
-import { ShaderMaterial } from 'three';
-import { Mesh } from 'three';
-import { DataTexture } from 'three';
-import { RGBAFormat } from 'three';
-import { RGBFormat } from 'three';
-import { FloatType } from 'three';
+import { DataTexture, FloatType, Mesh, RGBAFormat, ShaderMaterial, Vector2 } from 'three';
 
 class GeometryBatch
 {
@@ -242,7 +236,7 @@ class GeometryBatch
   __create_rgb_texture(width)
   {
     const data = new Uint8Array(3 * width * width);
-    return new DataTexture(data, width, width, RGBFormat);
+    return new DataTexture(data, width, width, RGBAFormat);
   }
 
   __create_rgba_texture(width)

package/src/view_components/ApplicationView.js

@@ -1,5 +1,3 @@
-import { ResourceContainer } from '../ResourceContainer';
-import { HTMLUtilities } from '../utilities/HTMLUtilities';
 import { ViewManager } from './ViewManager';
 import { ViewState } from './ViewState';
 
@@ -12,22 +10,7 @@ class ApplicationView extends ViewState
     this.container = container;
     this.url = url;
 
-    let transition_data = ResourceContainer.get(`${name}_data`);
-
-    transition_data = transition_data || {
-      animation_tracks: [],
-      triggers: []
-    };
-
-    const transitions = [
-      {
-        to: name,
-        data: transition_data
-      }
-    ];
-
     ViewManager.register_view(this);
-    ViewManager.add_transitions(transitions);
   }
 
   show()
@@ -58,19 +41,9 @@ class ApplicationView extends ViewState
     this.container.classList.remove('before_exit');
   }
 
-  load_html_images()
-  {
-    HTMLUtilities.load_images(this.container);
-  }
-
-  load_html_videos()
-  {
-    HTMLUtilities.load_videos(this.container);
-  }
-
-  set_opacity(current_state_data)
+  set_opacity(opacity)
   {
-    this.container.style.opacity = current_state_data[`${this.name}_opacity`];
+    this.container.style.opacity = opacity;
   }
 }
 

package/src/view_components/ApplicationViewController.js

@@ -0,0 +1,95 @@
+import { TransitionManager } from './TransitionManager';
+import { VCManager } from './VCManager';
+import { ViewState } from './ViewState';
+import { WorkerToMain } from './WorkerToMain';
+
+class ApplicationViewController extends ViewState
+{
+  constructor({ name, url, transition_data })
+  {
+    super(name);
+
+    this.url = url;
+
+    transition_data = transition_data || {
+      animation_tracks: [],
+      triggers: []
+    };
+
+    const transitions = [
+      {
+        to: name,
+        data: transition_data
+      }
+    ];
+
+    this.current_opacity = 0;
+
+    VCManager.register_view_controller(this);
+    TransitionManager.add_transitions(transitions);
+  }
+
+  show()
+  {
+    WorkerToMain.push(`${this.name}_view.show`);
+  }
+
+  before_enter()
+  {
+    WorkerToMain.push(`${this.name}_view.before_enter`);
+  }
+
+  on_enter()
+  {
+    WorkerToMain.push(`${this.name}_view.on_enter`);
+  }
+
+  before_exit()
+  {
+    WorkerToMain.push(`${this.name}_view.before_exit`);
+  }
+
+  on_exit()
+  {
+    WorkerToMain.push(`${this.name}_view.on_exit`);
+  }
+
+  hide()
+  {
+    WorkerToMain.push(`${this.name}_view.hide`);
+  }
+
+  update()
+  {
+    WorkerToMain.push(`${this.name}_view.update`);
+  }
+
+  fixed_update()
+  {
+    // TODO: Evaluate if a fixed update is necessary on the main thread
+  }
+
+  update_enter_transition(global_view_data, transition_progress, action_sequencer)
+  {
+    WorkerToMain.push(`${this.name}_view.update_enter_transition`, [global_view_data, transition_progress]);
+  }
+
+  update_exit_transition(global_view_data, transition_progress, action_sequencer)
+  {
+    WorkerToMain.push(`${this.name}_view.update_exit_transition`, [global_view_data, transition_progress]);
+  }
+
+  set_opacity(current_state_data)
+  {
+    const opacity = current_state_data[`${this.name}_opacity`];
+
+    if (this.current_opacity > opacity || this.current_opacity < opacity)
+    {
+      this.current_opacity = opacity;
+
+      WorkerToMain.push(`${this.name}_view.set_opacity`, [opacity]);
+    }
+  }
+}
+
+export { ApplicationViewController };

package/src/view_components/TransitionManager.js

@@ -0,0 +1,60 @@
+import { TransitionTable } from './transition/TransitionTable';
+import { ViewStateTransitionHandler } from './transition/ViewStateTransitionHandler';
+
+class TransitionManager
+{
+  constructor()
+  {
+    this.transition_table = new TransitionTable();
+    this.transition_handler = new ViewStateTransitionHandler(this.transition_table);
+  }
+
+  get action_sequencer()
+  {
+    return this.transition_handler.action_sequencer;
+  }
+
+  get current_state_data()
+  {
+    return this.transition_handler.current_state_data;
+  }
+
+  before_update()
+  {
+    this.transition_handler.before_update();
+  }
+
+  update()
+  {
+    this.transition_handler.update();
+  }
+
+  fixed_update()
+  {
+    this.transition_handler.fixed_update();
+  }
+
+  add_transitions(transitions)
+  {
+    this.transition_table.add_transitions(transitions);
+  }
+
+  set_transitions(transitions)
+  {
+    this.transition_table.set_transitions(transitions);
+  }
+
+  set_default_state_data(default_state_data)
+  {
+    this.transition_table.set_default_state_data(default_state_data);
+    this.transition_handler.set_default_state_data(default_state_data);
+  }
+
+  set_transitions_velocity(transitions_velocity)
+  {
+    this.transition_table.set_transitions_velocity(transitions_velocity);
+  }
+}
+
+const transition_manager = new TransitionManager();
+export { transition_manager as TransitionManager };

package/src/view_components/VCManager.js

@@ -0,0 +1,9 @@
+import { ViewControllerManager } from './ViewControllerManager';
+
+// Formerly ViewControllerManager
+class VCManager extends ViewControllerManager
+{
+}
+
+const v_c_manager = new VCManager();
+export { v_c_manager as VCManager };

package/src/view_components/ViewComponent.js

@@ -1,4 +1,3 @@
-import { HTMLUtilities } from '../utilities/HTMLUtilities';
 import { ViewComponentManager } from './ViewComponentManager';
 
 class ViewComponent
@@ -7,7 +6,8 @@ class ViewComponent
   {
     this.name = name;
     this.container = container;
-    this.hidden = true;
+
+    // this.hidden = true;
 
     ViewComponentManager.register_component(this);
   }
@@ -19,9 +19,10 @@ class ViewComponent
   on_enter()
   {
     this.container.classList.remove('hidden');
-    ViewComponentManager.enable_component(this);
 
-    this.hidden = false;
+    // this.hidden = false;
+
+    ViewComponentManager.enable_component(this);
   }
 
   update()
@@ -31,43 +32,15 @@ class ViewComponent
   on_exit()
   {
     this.container.classList.add('hidden');
-    ViewComponentManager.disable_component(this);
-
-    this.hidden = true;
-  }
 
-  set_opacity(current_state_data)
-  {
-    this.container.style.opacity = current_state_data[`${this.name}_opacity`];
-    this.toggle_hidden();
-  }
+    // this.hidden = true;
 
-  toggle_hidden()
-  {
-    if (this.container.style.opacity > 0.001)
-    {
-      if (this.hidden)
-      {
-        this.on_enter();
-      }
-    }
-    else
-    {
-      if (!this.hidden)
-      {
-        this.on_exit();
-      }
-    }
-  }
-
-  load_html_images()
-  {
-    HTMLUtilities.load_images(this.container);
+    ViewComponentManager.disable_component(this);
   }
 
-  load_html_videos()
+  set_opacity(opacity)
   {
-    HTMLUtilities.load_videos(this.container);
+    this.container.style.opacity = opacity;
   }
 }
 

package/src/view_components/ViewComponentController.js

@@ -0,0 +1,73 @@
+import { ViewComponentControllerManager } from './ViewComponentControllerManager';
+import { WorkerToMain } from './WorkerToMain';
+
+class ViewComponentController
+{
+  constructor({ name })
+  {
+    this.name = name;
+
+    this.current_opacity = 0;
+    this.hidden = true;
+
+    ViewComponentControllerManager.register_component_controller(this);
+  }
+
+  start()
+  {
+  }
+
+  on_enter()
+  {
+    ViewComponentControllerManager.enable_component_controller(this);
+    WorkerToMain.push(`${this.name}_component.on_enter`);
+
+    this.hidden = false;
+  }
+
+  update()
+  {
+    WorkerToMain.push(`${this.name}_component.update`);
+  }
+
+  on_exit()
+  {
+    ViewComponentControllerManager.disable_component_controller(this);
+    WorkerToMain.push(`${this.name}_component.on_exit`);
+
+    this.hidden = true;
+  }
+
+  set_opacity(current_state_data)
+  {
+    const opacity = current_state_data[`${this.name}_opacity`];
+
+    if (this.current_opacity > opacity || this.current_opacity < opacity)
+    {
+      this.current_opacity = opacity;
+
+      WorkerToMain.push(`${this.name}_component.set_opacity`, [opacity]);
+      this.toggle_hidden();
+    }
+  }
+
+  toggle_hidden()
+  {
+    if (this.current_opacity > 0.0001)
+    {
+      if (this.hidden)
+      {
+        this.on_enter();
+      }
+    }
+    else
+    {
+      if (!this.hidden)
+      {
+        this.on_exit();
+      }
+    }
+  }
+}
+
+export { ViewComponentController };

package/src/view_components/ViewComponentControllerManager.js

@@ -0,0 +1,59 @@
+import { TransitionManager } from './TransitionManager';
+
+class ViewComponentControllerManager
+{
+  constructor()
+  {
+    this.component_controllers = [];
+    this.enabled_component_controllers = new Set();
+  }
+
+  update()
+  {
+    this.__set_component_controllers_opacities();
+
+    for (const component_controller of this.enabled_component_controllers)
+    {
+      component_controller.update(TransitionManager.current_state_data);
+    }
+  }
+
+  register_component_controller(component_controller)
+  {
+    this.component_controllers.push(component_controller);
+  }
+
+  enable_component_controller(component_controller)
+  {
+    this.enabled_component_controllers.add(component_controller);
+  }
+
+  disable_component_controller(component_controller)
+  {
+    this.enabled_component_controllers.delete(component_controller);
+  }
+
+  get(component_name)
+  {
+    for (let i = 0; i < this.component_controllers.length; i++)
+    {
+      if (this.component_controllers[i].name === component_name)
+      {
+        return this.component_controllers[i];
+      }
+    }
+    console.error('[ViewComponentControllerManager.get] no component_controller found for: ', component_name);
+    return undefined;
+  }
+
+  __set_component_controllers_opacities()
+  {
+    for (let i = 0; i < this.component_controllers.length; i++)
+    {
+      this.component_controllers[i].set_opacity(TransitionManager.current_state_data);
+    }
+  }
+}
+
+const view_component_contorller_manager = new ViewComponentControllerManager();
+export { view_component_contorller_manager as ViewComponentControllerManager };

package/src/view_components/ViewComponentManager.js

@@ -1,4 +1,4 @@
-import { ViewManager } from './ViewManager';
+import { TransitionManager } from './TransitionManager';
 
 class ViewComponentManager
 {
@@ -14,7 +14,7 @@ class ViewComponentManager
 
     for (const component of this.enabled_components)
     {
-      component.update(ViewManager.transition_handler.current_state_data);
+      component.update(TransitionManager.current_state_data);
     }
   }
 
@@ -25,24 +25,14 @@ class ViewComponentManager
 
   enable_component(component)
   {
-    // const component_to_enable = this.get_component_by_name(component_name);
-
     this.enabled_components.add(component);
   }
 
   disable_component(component)
   {
-    // const component_to_disable = this.get_component_by_name(component_name);
-
     this.enabled_components.delete(component);
   }
 
-  get_component_by_name(component_name)
-  {
-    console.warn('DEPRECATED. Use ViewComponentManager.get instead');
-    this.get(component_name);
-  }
-
   get(component_name)
   {
     for (let i = 0; i < this.components.length; i++)
@@ -60,7 +50,7 @@ class ViewComponentManager
   {
     for (let i = 0; i < this.components.length; i++)
     {
-      this.components[i].set_opacity(ViewManager.transition_handler.current_state_data);
+      this.components[i].set_opacity(TransitionManager.current_state_data);
     }
   }
 }