ohzi-core 11.2.4 → 12.0.0

package/src/loaders/assets_loader/AbstractLoader.js

@@ -0,0 +1,129 @@
+
+class AbstractLoader
+{
+  constructor(resource_id, url, size = 1)
+  {
+    this.resource_id = resource_id;
+    this.url = url;
+    this.loaded_bytes = 0;
+    this.total_bytes = size;
+
+    this.has_finished = false;
+    this.has_error = false;
+    this.error_message = 'none';
+  }
+
+  is_int(n)
+  {
+    return Number(n) === n && n % 1 === 0;
+  }
+
+  is_float(n)
+  {
+    return Number(n) === n && n % 1 !== 0;
+  }
+
+  is_number(n)
+  {
+    return this.is_int(n) || this.is_float(n);
+  }
+
+  __update_downloaded_bytes(loaded, total)
+  {
+    loaded = this.is_number(loaded) ? loaded : 1;
+    total  = this.is_number(total)  ? total  : 1;
+
+    this.loaded_bytes = loaded;
+
+    if (total > 0)
+    {
+      this.total_bytes = total;
+    }
+
+    if (this.loaded_bytes > this.total_bytes)
+    {
+      console.warn('Total bytes is smaller than loaded ones. Please set total bytes by hand to:', this.url);
+    }
+  }
+
+  __loading_ended()
+  {
+    this.has_finished = true;
+  }
+
+  __set_error(message)
+  {
+    this.has_error = true;
+    this.error_message = message;
+  }
+
+  print_error()
+  {
+    console.error('Error while loading ' + this.resource_id + '\n\t path: ' + this.url + '\n\t\t' + this.error_message);
+  }
+
+  load(resource_container)
+  {
+    if (resource_container.resources_by_url[this.url] === undefined)
+    {
+      const cache = 'no-cache';
+
+      fetch(this.url, {
+        method: 'GET', // *GET, POST, PUT, DELETE, etc.
+        mode: 'cors', // no-cors, *cors, same-origin
+        cache: cache, // *default, no-cache, reload, force-cache, only-if-cached
+        credentials: 'same-origin', // include, *same-origin, omit
+        redirect: 'follow' // manual, *follow, error
+      })
+        .then(this.on_progress.bind(this, resource_container))
+        .catch(this.__on_error.bind(this));
+    }
+    else
+    {
+      resource_container.set_resource(this.resource_id, this.url, resource_container.resources_by_url[this.url]);
+
+      this.__update_downloaded_bytes(1, 1);
+      this.__loading_ended();
+    }
+  }
+
+  async on_progress(resource_container, response)
+  {
+    const response_clone = response.clone();
+    const reader = response.body.getReader();
+
+    // Step 2: get total length
+    const contentLength = +response.headers.get('Content-Length');
+
+    // Step 3: read the data
+    let receivedLength = 0; // received that many bytes at the moment
+
+    while (true)
+    {
+      const { done, value } = await reader.read();
+
+      if (done)
+      {
+        break;
+      }
+
+      receivedLength += value.length;
+
+      this.__update_downloaded_bytes(receivedLength, contentLength);
+      // console.log(`Received ${receivedLength} of ${contentLength}`);
+    }
+
+    this.on_preloaded_finished(resource_container, response_clone);
+  }
+
+  on_preloaded_finished(resource_container, response)
+  {
+  }
+
+  __on_error(data)
+  {
+    console.error(data);
+  }
+}
+
+export { AbstractLoader };

package/src/loaders/assets_loader/AssetLoader.js

@@ -0,0 +1,24 @@
+import { AbstractLoader } from './AbstractLoader';
+
+class AssetLoader extends AbstractLoader
+{
+  constructor(resource_id, url, size)
+  {
+    super(resource_id, url, size);
+  }
+
+  on_preloaded_finished(resource_container, response)
+  {
+    response.blob().then((blob) =>
+    {
+      const url = URL.createObjectURL(blob);
+
+      resource_container.set_resource(this.resource_id, this.url, url);
+
+      this.__update_downloaded_bytes(1, 1);
+      this.__loading_ended();
+    });
+  }
+}
+
+export { AssetLoader };

package/src/loaders/assets_loader/AsyncAssetsLoaderWorker.js

@@ -0,0 +1,69 @@
+// We use custom ResourceBatch, ResourceContainer and AbstractLoader to reduce build size
+import { ResourceBatch } from './ResourceBatch';
+import { ResourceContainer } from './ResourceContainer';
+import { AssetLoader } from './AssetLoader';
+import { ResourceLoaderChecker } from './ResourceLoaderChecker';
+
+class AsyncAssetsLoaderWorker
+{
+  run()
+  {
+    this.assets = {};
+    this.resource_batches = {};
+    this.resource_container = new ResourceContainer('worker');
+    this.resource_loader_checkers = {};
+
+    this.__bind_messages();
+  }
+
+  __bind_messages()
+  {
+    self.addEventListener('message', (e) =>
+    {
+      const message = e.data;
+
+      switch (message.type)
+      {
+      case 'assets':
+        this.assets[message.loader_name] = this.assets[message.loader_name] ? this.assets[message.loader_name] : [];
+        this.assets[message.loader_name] = this.assets[message.loader_name].concat(message.data);
+
+        break;
+      case 'load':
+        this.__setup_batch(message.loader_name);
+
+        this.resource_batches[message.loader_name].load();
+        this.resource_loader_checkers[message.loader_name].setup(this.on_assets_ready.bind(this, message.loader_name), 10);
+        this.resource_loader_checkers[message.loader_name].check();
+
+        break;
+      case 'reset':
+        // TODO: maybe not necessary anymore
+        this.assets[message.loader_name] = [];
+
+        break;
+      }
+    });
+  }
+
+  on_assets_ready(loader_name)
+  {
+    postMessage({ type: `asset_loaded_${loader_name}`, data: this.resource_container.resources });
+  }
+
+  __setup_batch(loader_name)
+  {
+    // this.resource_containers[loader_name] = new ResourceContainer(loader_name);
+    this.resource_batches[loader_name] = new ResourceBatch(loader_name, this.resource_container);
+    this.resource_loader_checkers[loader_name] = new ResourceLoaderChecker(this.resource_batches[loader_name]);
+
+    for (let i = 0; i < this.assets[loader_name].length; i++)
+    {
+      const asset = this.assets[loader_name][i];
+
+      this.resource_batches[loader_name].add_loader(new AssetLoader(asset.name, asset.url, asset.size));
+    }
+  }
+}
+
+new AsyncAssetsLoaderWorker().run();

package/src/loaders/assets_loader/ResourceBatch.js

@@ -0,0 +1,86 @@
+
+class ResourceBatch
+{
+  constructor(batch_name, resource_container)
+  {
+    this.resource_loaders = [];
+    this.batch_name = batch_name || 'unnamed batch';
+    this.resource_container = resource_container;
+  }
+
+  add_loader(loader)
+  {
+    this.resource_loaders.push(loader);
+  }
+
+  load()
+  {
+    for (let i = 0; i < this.resource_loaders.length; i++)
+    {
+      this.resource_loaders[i].load(this.resource_container);
+    }
+  }
+
+  get loading_finished()
+  {
+    let finished = true;
+    for (let i = 0; i < this.resource_loaders.length; i++)
+    {
+      finished = finished && this.resource_loaders[i].has_finished;
+    }
+    return finished;
+  }
+
+  get has_errors()
+  {
+    let has_error = false;
+    for (let i = 0; i < this.resource_loaders.length; i++)
+    {
+      has_error = has_error || this.resource_loaders[i].has_error;
+    }
+    return has_error;
+  }
+
+  print_errors()
+  {
+    console.error('Batch <' + this.batch_name + '> could not load successfully');
+    for (let i = 0; i < this.resource_loaders.length; i++)
+    {
+      if (this.resource_loaders[i].has_error)
+      {
+        this.resource_loaders[i].print_error();
+      }
+    }
+  }
+
+  get_progress()
+  {
+    return this.get_loaded_bytes() / this.get_total_bytes();
+  }
+
+  get_loaded_bytes()
+  {
+    let loaded_bytes = 1;
+
+    for (let i = 0; i < this.resource_loaders.length; i++)
+    {
+      loaded_bytes += this.resource_loaders[i].loaded_bytes;
+    }
+
+    return loaded_bytes;
+  }
+
+  get_total_bytes()
+  {
+    let total_bytes = 1;
+
+    for (let i = 0; i < this.resource_loaders.length; i++)
+    {
+      total_bytes += this.resource_loaders[i].total_bytes;
+    }
+
+    return total_bytes;
+  }
+}
+
+export { ResourceBatch };

package/src/loaders/assets_loader/ResourceContainer.js

@@ -0,0 +1,37 @@
+
+class ResourceContainer
+{
+  constructor(name)
+  {
+    this.name = name;
+    this.resources = {};
+    this.resources_by_url = {};
+  }
+
+  set_resource(name, url, resource)
+  {
+    const urls = Object.keys(this.resources_by_url);
+
+    if (urls.includes(url))
+    {
+      this.resources[name] = this.resources_by_url[url];
+    }
+    else
+    {
+      this.resources[name] = resource;
+      this.resources_by_url[url] = resource;
+    }
+  }
+
+  get_resource(name)
+  {
+    return this.resources[name];
+  }
+
+  get(name)
+  {
+    return this.resources[name];
+  }
+}
+
+export { ResourceContainer };

package/src/loaders/assets_loader/ResourceLoaderChecker.js

@@ -0,0 +1,39 @@
+class ResourceLoaderChecker
+{
+  constructor(batch)
+  {
+    this.batch = batch;
+    this.on_resources_loaded = undefined;
+    this.timeout = 10;
+  }
+
+  setup(on_resources_loaded, timeout = 10)
+  {
+    this.on_resources_loaded = on_resources_loaded;
+    this.timeout = timeout;
+  }
+
+  check()
+  {
+    if (this.batch.loading_finished)
+    {
+      if (this.batch.has_errors)
+      {
+        this.batch.print_errors();
+      }
+      else
+      {
+        this.on_resources_loaded();
+      }
+    }
+    else
+    {
+      setTimeout(function()
+      {
+        this.check(this.batch, this.on_resources_loaded);
+      }.bind(this), this.timeout);
+    }
+  }
+}
+
+export { ResourceLoaderChecker };

package/src/render_mode/NormalAORender.js

@@ -1,12 +1,12 @@
 import { CameraManager } from '../CameraManager';
 import { Graphics } from '../Graphics';
-import { OScreen } from '../OScreen';
-import { SceneManager } from '../SceneManager';
 import { DisplayNormalTextureMaterial } from '../materials/DisplayNormalTextureMaterial';
 import { SSAOComposeMaterial } from '../materials/SSAOComposeMaterial';
 import { SSAOMaterial } from '../materials/SSAOMaterial';
+import { OScreen } from '../OScreen';
 import { BaseRender } from '../render_mode/BaseRender';
 import { Blurrer } from '../render_utilities/Blurrer';
+import { SceneManager } from '../SceneManager';
 
 import { WebGLRenderTarget } from 'three';
 

package/src/resource_loader/AsyncTextureLoader.js

@@ -3,7 +3,7 @@ import { AbstractLoader } from './AbstractLoader';
 
 import { NoColorSpace, SRGBColorSpace, Texture } from 'three';
 
-class AsyncTextureLoader extends AbstractLoader
+export class AsyncTextureLoader extends AbstractLoader
 {
   constructor(resource_id, url, size, flipY = true, premultiplyAlpha = false, colorSpaceConversion = true)
   {
@@ -109,5 +109,3 @@ class AsyncTextureLoader extends AbstractLoader
     }
   }
 }
-
-export { AsyncTextureLoader };

package/src/resource_loader/BasisLoader.js

@@ -1,5 +1,7 @@
 import { AbstractLoader } from './AbstractLoader';
 
+// import { sRGBEncoding } from 'three';
+
 class BasisLoader extends AbstractLoader
 {
   constructor(resource_id, url, loader, size)
@@ -15,6 +17,8 @@ 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/scenes/AbstractScene.js

@@ -0,0 +1,166 @@
+import { Scene } from 'three';
+// import { AvatarSystem } from '../../components/avatar/AvatarSystem';
+
+import { HighQualityLoadingState } from './loading_states/HighQualityLoadingState';
+import { LoadingState } from './loading_states/LoadingState';
+import { RegularLoadingState } from './loading_states/RegularLoadingState';
+
+class AbstractScene extends Scene
+{
+  constructor({ name, compilators })
+  {
+    super();
+
+    this.name = name;
+
+    this.is_loaded = false;
+    this.is_high_loaded = false;
+
+    this.loading_states = {
+      regular: new RegularLoadingState(this, compilators),
+      high: new HighQualityLoadingState(this, compilators)
+    };
+
+    this.current_loading_state = new LoadingState(this, compilators);
+    // this.set_loading_state(this.loading_states.regular);
+  }
+
+  get loading_progress()
+  {
+    return this.current_loading_state.loading_progress;
+  }
+
+  init()
+  {
+  }
+
+  load()
+  {
+    this.init();
+
+    this.set_loading_state(this.loading_states.regular);
+    this.current_loading_state.load();
+  }
+
+  get_objects()
+  {
+    const objects = [];
+
+    this.traverse(child =>
+    {
+      if (child.geometry)
+      {
+        objects.push(child);
+
+        // if (child.name === 'pitch_floor')
+        // {
+        //   objects.push(child);
+        // }
+        // else
+        // {
+        //   child.visible = false;
+        // }
+      }
+    });
+
+    return objects;
+  }
+
+  dispose_cpu()
+  {
+    this.traverse(child =>
+    {
+      if (child.geometry)
+      {
+        child.geometry.attributes.position.array = new Float32Array(3);
+        if (child.geometry.attributes.normal)
+        {
+          child.geometry.attributes.normal.array = new Float32Array(3);
+        }
+        if (child.geometry.attributes.uv)
+        {
+          child.geometry.attributes.uv.array = new Float32Array(2);
+        }
+        if (child.material.map)
+        {
+          for (let i = 0; i < child.material.map.mipmaps.length; i++)
+          {
+            child.material.map.mipmaps[i] = new Uint8Array(4);
+          }
+        }
+      }
+    });
+
+    // AvatarSystem.component_container.component_instancer.data_texture.data = new Float32Array(4);
+  }
+
+  dispose()
+  {
+    this.traverse(child =>
+    {
+      if (child.material)
+      {
+        if (child.material.map)
+        {
+          child.material.map.dispose();
+        }
+
+        child.material.dispose();
+        child.geometry.dispose();
+      }
+    });
+    // AvatarSystem.component_container.component_instancer.data_texture.data = new Float32Array(4);
+  }
+
+  set_assets(scene_objects, scene_textures, scene_sounds)
+  {
+    this.loading_states.regular.set_assets(scene_objects, scene_textures, scene_sounds);
+  }
+
+  set_high_assets(scene_objects, scene_textures, scene_sounds)
+  {
+    this.loading_states.high.set_assets(scene_objects, scene_textures, scene_sounds);
+  }
+
+  set_loading_state(state)
+  {
+    this.current_loading_state.on_exit();
+    this.current_loading_state = state;
+    this.current_loading_state.on_enter();
+  }
+
+  // Called from transition
+  update_loading_state()
+  {
+    if (!this.is_high_loaded)
+    {
+      this.current_loading_state.update();
+    }
+  }
+
+  update()
+  {
+    this.update_loading_state();
+  }
+
+  on_assets_ready()
+  {
+
+  }
+
+  on_assets_compiled()
+  {
+    this.is_loaded = true;
+
+    // Load high quality assets
+    this.set_loading_state(this.loading_states.high);
+    this.current_loading_state.load();
+  }
+
+  on_high_quality_assets_ready()
+  {
+    this.is_high_loaded = true;
+  }
+}
+
+export { AbstractScene };

package/src/scenes/loading_states/CompilatorManager.js

@@ -0,0 +1,41 @@
+class CompilatorManager
+{
+  constructor(compilators)
+  {
+    this.compilators = compilators;
+    this.first_update = true;
+
+    this.index = 0;
+  }
+
+  update()
+  {
+    if (!this.is_finished())
+    {
+      if (this.compilators[this.index].finished)
+      {
+        this.index++;
+        this.first_update = true;
+      }
+      else
+      {
+        if (this.first_update)
+        {
+          this.compilators[this.index].start();
+          this.first_update = false;
+        }
+        else
+        {
+          this.compilators[this.index].update();
+        }
+      }
+    }
+  }
+
+  is_finished()
+  {
+    return this.index === this.compilators.length;
+  }
+}
+
+export { CompilatorManager };

package/src/scenes/loading_states/HighQualityLoadingState.js

@@ -0,0 +1,28 @@
+import { LoadingState } from './LoadingState';
+
+export class HighQualityLoadingState extends LoadingState
+{
+  on_enter()
+  {
+    super.on_enter();
+    // this.setup_loader();
+  }
+
+  on_exit()
+  {
+    super.on_exit();
+  }
+
+  update()
+  {
+    super.update();
+
+    if (this.is_loaded())
+    {
+      // if (this.is_compiled())
+      // {
+      this.scene.on_high_quality_assets_ready();
+      // }
+    }
+  }
+}