ohzi-core 10.4.2 → 10.6.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ohzi-core",
-  "version": "10.4.2",
+  "version": "10.6.0",
   "description": "OHZI Core Library",
   "source": "src/index.js",
   "module": "build/index.module.js",

package/src/BaseApplication.js

@@ -12,6 +12,9 @@ class BaseApplication
   update()
   {}
 
+  fixed_update()
+  {}
+
   on_post_render()
   {}
 

package/src/Browser.js

@@ -6,6 +6,12 @@ class Browser
     this.browser_name = '';
     this.agent = window.navigator.userAgent.toLowerCase();
 
+    // vr specific
+    this.vrBrowserKeywords = ['OculusBrowser', 'oculus', 'vive', 'rift', 'windowsmr', 'cardboard', 'daydream'];
+    this.vrBrowser = this.vrBrowserKeywords.find(keyword => this.agent.includes(keyword));
+    // Check for WebXR support (indicating VR capabilities)
+    this.hasWebXRSupport = 'xr' in navigator;
+
     switch (true)
     {
     case this.agent.indexOf('edge') > -1:
@@ -29,6 +35,9 @@ class Browser
     case this.agent.indexOf('safari') > -1:
       this.browser_name = 'safari';
       break;
+    case this.vrBrowser && this.hasWebXRSupport:
+      this.browser_name = this.vrBrowser;
+      break;
     default:
       this.browser_name = 'other';
       break;
@@ -62,6 +71,11 @@ class Browser
     return this.browser_name === 'edge_chromium';
   }
 
+  get is_vr()
+  {
+    return  this.vrBrowserKeywords.includes(this.browser_name);
+  }
+
   get has_webm()
   {
     return !!(this.is_chrome || this.is_firefox || this.is_edge_chromium);

package/src/Debug.js

@@ -25,6 +25,7 @@ import { MeshBasicMaterial } from 'three';
 
 import basic_color_vert from './shaders/basic_color/basic_color.vert';
 import basic_color_frag from './shaders/basic_color/basic_color.frag';
+import { CameraManager } from './CameraManager';
 
 class Debug
 {
@@ -38,22 +39,22 @@ class Debug
 
     this.ctx = undefined;
     this.scene = new Scene();
-    this.camera = new PerspectiveCamera();
-    // this.camera.clear_alpha = 0;
+    this.camera = new PerspectiveCamera(60, OScreen.aspect_ratio, 0.1, 1000);
+    this.camera.clear_alpha = 0;
   }
 
   draw_arrow(origin, dir, color = 0xff0000)
   {
     const arrow = new Arrow(color, dir.length(), dir.clone().normalize());
     arrow.position.copy(origin);
-    SceneManager.current.add(arrow);
+    this.scene.add(arrow);
     return arrow;
   }
 
   draw_axis()
   {
     const axis = new AxisHelper();
-    SceneManager.current.add(axis);
+    this.scene.add(axis);
     return axis;
   }
 
@@ -99,7 +100,7 @@ class Debug
 
     const line = new Line(geometry, material);
     line.frustumCulled = false;
-    SceneManager.current.add(line);
+    this.scene.add(line);
     return line;
   }
 
@@ -111,7 +112,7 @@ class Debug
 
     const cube = new Cube(new Vector3(size, size, size), undefined, color);
     cube.position.copy(pos);
-    SceneManager.current.add(cube);
+    this.scene.add(cube);
     return cube;
   }
 
@@ -133,7 +134,7 @@ class Debug
     // cube.quaternion.setFromRotationMatrix(new Matrix4().makeBasis(right,up,forward));
     cube.quaternion.setFromUnitVectors(new Vector3(0, 0, -1), forward_dir);
 
-    SceneManager.current.add(cube);
+    this.scene.add(cube);
     return cube;
   }
 
@@ -152,7 +153,7 @@ class Debug
 
     const plane = new Mesh(geometry, material);
     plane.renderOrder = -10000;
-    SceneManager.current.add(plane);
+    this.scene.add(plane);
     return plane;
   }
 
@@ -175,7 +176,7 @@ class Debug
 
     const sphere = new Sphere(size, color);
     sphere.position.copy(pos);
-    SceneManager.current.add(sphere);
+    this.scene.add(sphere);
     return sphere;
   }
 
@@ -255,7 +256,7 @@ class Debug
     }
     if (this.scene.children.length > 0)
     {
-      graphics.render(this.scene, this.camera);
+      graphics.render(this.scene, CameraManager.current);
     }
   }
 }

package/src/RenderLoop.js

@@ -17,6 +17,8 @@ class RenderLoop
 
     this.is_running = false;
     this.frames_passed = 0;
+
+    this.time_accumulator = 0;
   }
 
   update()
@@ -35,7 +37,17 @@ class RenderLoop
 
     this.input.update();
 
+    this.time_accumulator += Time.delta_time;
+
+    while (this.time_accumulator > Time.fixed_delta_time)
+    {
+      this.target_application.fixed_update();
+      this.time_accumulator -= Time.fixed_delta_time;
+    }
+    Time.__set_frame_interpolation(this.time_accumulator / Time.fixed_delta_time);
+
     this.target_application.update();
+
     ViewManager.update();
     ViewComponentManager.update();
 

package/src/Time.js

@@ -5,17 +5,18 @@ class Time
 {
   constructor()
   {
-    this.delta_buffer = [0.016, 0.016, 0.016, 0.016, 0.016, 0.016, 0.016, 0.016, 0.016, 0.016];
+    this.__delta_buffer = [0.016, 0.016, 0.016, 0.016, 0.016, 0.016, 0.016, 0.016, 0.016, 0.016];
   }
 
   init()
   {
     this.___time = new Clock();
-    this.__raw_delta_time = 0;
+    this.__delta_time = 0;
+    this.__smooth_delta_time = 0;
     this.__elapsed_time = 0;
     this.__allocated_time = new Vector2(0, 0);
-
-    this.delta_time = 0.016;
+    this.__frame_interpolation_t = 0;
+    this.fixed_delta_time = 1 / 30;
   }
 
   get elapsed_time()
@@ -23,6 +24,16 @@ class Time
     return this.__elapsed_time;
   }
 
+  get delta_time()
+  {
+    return this.__delta_time;
+  }
+
+  get smooth_delta_time()
+  {
+    return this.__smooth_delta_time;
+  }
+
   get shader_time()
   {
     this.__allocated_time.x = this.delta_time;
@@ -30,27 +41,52 @@ class Time
     return  this.__allocated_time;
   }
 
+  get frame_interpolation()
+  {
+    return this.__frame_interpolation_t;
+  }
+
+  get fdt()
+  {
+    return this.fixed_delta_time;
+  }
+
+  get dt()
+  {
+    return this.delta_time;
+  }
+
+  get sdt()
+  {
+    return this.smooth_delta_time;
+  }
+
+  __set_frame_interpolation(value)
+  {
+    this.__frame_interpolation_t = value;
+  }
+
   __update()
   {
-    this.__raw_delta_time = this.___time.getDelta();
+    this.__delta_time = this.___time.getDelta();
     this.__elapsed_time = this.___time.getElapsedTime();
 
-    this.delta_buffer.shift();
-    this.delta_buffer.push(this.__raw_delta_time < 0.32 ? this.__raw_delta_time : 0.032);
+    this.__delta_buffer.shift();
+    this.__delta_buffer.push(this.delta_time < 0.32 ? this.delta_time : 0.032);
 
-    this.__calculate_delta_time();
+    this.__calculate_smooth_delta_time();
   }
 
-  __calculate_delta_time()
+  __calculate_smooth_delta_time()
   {
-    this.delta_time = 0;
+    this.__smooth_delta_time = 0;
 
-    for (let i = 0; i < this.delta_buffer.length; i++)
+    for (let i = 0; i < this.__delta_buffer.length; i++)
     {
-      this.delta_time += this.delta_buffer[i];
+      this.__smooth_delta_time += this.__delta_buffer[i];
     }
 
-    this.delta_time = this.delta_time / this.delta_buffer.length;
+    this.__smooth_delta_time = this.__smooth_delta_time / this.__delta_buffer.length;
   }
 }
 

package/src/action_sequencer/ActionSequencer.js

@@ -3,11 +3,12 @@ import { OMath } from '../utilities/OMath';
 
 class ActionSequencer
 {
-  constructor(context)
+  constructor(context = {})
   {
+    this.previous_elapsed_time = -0.00001;
     this.elapsed_time = -0.00001;
     this.playback_speed = this.__get_playback_speed();
-    this.playing = false;
+    this.playing = true;
 
     this.action_events = [];
     this.context = context;
@@ -53,19 +54,22 @@ class ActionSequencer
   {
     if (this.playing)
     {
-      this.__play_clips(this.elapsed_time, this.elapsed_time + delta_time * this.playback_speed);
-      this.elapsed_time = this.elapsed_time + delta_time * this.playback_speed;
+      this.previous_elapsed_time = this.elapsed_time;
+      this.elapsed_time += delta_time * this.playback_speed;
+      this.__play_clips(this.previous_elapsed_time, this.elapsed_time);
     }
   }
 
   set_progress(time)
   {
+    this.previous_elapsed_time = this.elapsed_time;
     this.elapsed_time = OMath.clamp(time, 0, this.duration);
     this.__play_clips(this.elapsed_time, this.elapsed_time);
   }
 
   set_normalized_progress(t)
   {
+    this.previous_elapsed_time = this.elapsed_time;
     this.elapsed_time = OMath.clamp(t, 0, 1) * this.duration;
     this.__play_clips(this.elapsed_time, this.elapsed_time);
   }
@@ -155,14 +159,9 @@ class ActionSequencer
 
   __play_clips(from, to)
   {
-    for (let i = 0; i < this.action_events.length; i++)
+    if (this.elapsed_time > this.previous_elapsed_time)
     {
-      if (this.action_events[i].trigger_time > from - Number.EPSILON &&
-          this.action_events[i].trigger_time < to   + Number.EPSILON)
-      {
-        // console.log("Play event: " + this.action_events[i].action.constructor.name + " at "+  this.action_events[i].trigger_time);
-        this.action_events[i].action.trigger();
-      }
+      this.__play_events(this.previous_elapsed_time, this.elapsed_time);
     }
     const channel_names = Object.keys(this.initial_context);
 
@@ -175,6 +174,19 @@ class ActionSequencer
     }
   }
 
+  __play_events(from, to)
+  {
+    for (let i = 0; i < this.action_events.length; i++)
+    {
+      const trigger_time = this.action_events[i].trigger_time;
+      if (OMath.between(trigger_time, from, to))
+      {
+        console.log('Play event: ' + this.action_events[i].action.constructor.name + ' at ' +  this.action_events[i].trigger_time);
+        this.action_events[i].action.trigger();
+      }
+    }
+  }
+
   evaluate_keyframe(keyframe, time)
   {
     this.tmp_t = this.__linear_map_01(time, keyframe.from, keyframe.to);