@woosh/meep-engine 2.75.3 → 2.75.5

package/src/engine/graphics/sh3/path_tracer/prototypePathTracer.js

@@ -1,6 +1,4 @@
-import EmptyView from "../../../../view/elements/EmptyView.js";
-import { CanvasView } from "../../../../view/elements/CanvasView.js";
-import { PathTracer } from "./PathTracer.js";
+import { mat4, vec3 } from "gl-matrix";
 import {
     Box3,
     MeshStandardMaterial,
@@ -9,35 +7,37 @@ import {
     PlaneBufferGeometry,
     Sphere
 } from "three";
-import { Sampler2D } from "../../texture/sampler/Sampler2D.js";
-import sampler2D2Canvas from "../../texture/sampler/Sampler2D2Canvas.js";
-import { ray3_array_compose } from "../../../../core/geom/3d/ray/ray3_array_compose.js";
-import { Transform } from "../../../ecs/transform/Transform.js";
-import { float2uint8 } from "../../../../core/binary/float2uint8.js";
 import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader.js";
-import { Camera } from "../../ecs/camera/Camera.js";
+import { PLYLoader } from "three/examples/jsm/loaders/PLYLoader.js";
+
+import '../../../../../../../../css/game.scss';
+import { float2uint8 } from "../../../../core/binary/float2uint8.js";
+import { Color } from "../../../../core/color/Color.js";
+import { kelvin_to_rgb } from "../../../../core/color/kelvin/kelvin_to_rgb.js";
+import { noop } from "../../../../core/function/Functions.js";
+import { ray3_array_compose } from "../../../../core/geom/3d/ray/ray3_array_compose.js";
+import Quaternion from "../../../../core/geom/Quaternion.js";
+import { v3_distance } from "../../../../core/geom/vec3/v3_distance.js";
 import Vector3 from "../../../../core/geom/Vector3.js";
-import { sampler2d_scale } from "../../texture/sampler/resize/sampler2d_scale.js";
+import { Localization } from "../../../../core/localization/Localization.js";
+import { min2 } from "../../../../core/math/min2.js";
 import { seededRandom } from "../../../../core/math/random/seededRandom.js";
-import { mat4, vec3 } from "gl-matrix";
-import { v3_distance } from "../../../../core/geom/vec3/v3_distance.js";
+import { number_pretty_print } from "../../../../core/primitives/numbers/number_pretty_print.js";
 import ConcurrentExecutor from "../../../../core/process/executor/ConcurrentExecutor.js";
 import Task from "../../../../core/process/task/Task.js";
 import { TaskSignal } from "../../../../core/process/task/TaskSignal.js";
-import Quaternion from "../../../../core/geom/Quaternion.js";
-import TaskProgressView from "../../../../view/task/TaskProgressView.js";
-import { Localization } from "../../../../core/localization/Localization.js";
-
-import '../../../../../../../../css/game.scss';
+import { CanvasView } from "../../../../view/elements/CanvasView.js";
+import EmptyView from "../../../../view/elements/EmptyView.js";
+import { Transform } from "../../../ecs/transform/Transform.js";
 import { MouseEvents } from "../../../input/devices/events/MouseEvents.js";
-import { PLYLoader } from "three/examples/jsm/loaders/PLYLoader.js";
-import { noop } from "../../../../core/function/Functions.js";
-import { Color } from "../../../../core/color/Color.js";
-import { min2 } from "../../../../core/math/min2.js";
+import { makeSimpleTaskProgressView } from "../../../makeSimpleTaskProgressView.js";
+import { Camera } from "../../ecs/camera/Camera.js";
 import { makeGeometryIndexed } from "../../geometry/buffered/makeGeometryIndexed.js";
 import { DirectionalLight } from "../../render/forward_plus/model/DirectionalLight.js";
-import { kelvin_to_rgb } from "../../../../core/color/kelvin/kelvin_to_rgb.js";
-import { number_pretty_print } from "../../../../core/primitives/numbers/number_pretty_print.js";
+import { sampler2d_scale } from "../../texture/sampler/resize/sampler2d_scale.js";
+import { Sampler2D } from "../../texture/sampler/Sampler2D.js";
+import sampler2D2Canvas from "../../texture/sampler/Sampler2D2Canvas.js";
+import { PathTracer } from "./PathTracer.js";
 
 document.body.style.margin = 0;
 document.body.style.overflow = "hidden";
@@ -569,20 +569,11 @@ async function start_renderer(camera) {
         const t = make_render_task();
 
 
-        const vProgress = new TaskProgressView({
+        const vProgress =makeSimpleTaskProgressView({
             task: t,
+            size:vContainer.size,
             localization: loc
-        });
-
-        vProgress.size.set(vContainer.size.x, vContainer.size.y);
-        vProgress.css({
-            position: 'absolute',
-            top: 0,
-            left: 0,
-            pointerEvents: "none"
-        });
-        vProgress.el.querySelector('.fill').style.background = 'rgb(255,220,94)';
-        vProgress.el.querySelector('.progress-bar').style.height = '8px';
+        })
 
         vContainer.addChild(vProgress);
 

package/src/engine/graphics/sh3/prototypeSH3Probe.js

@@ -1,10 +1,3 @@
-import { EngineHarness } from "../../EngineHarness.js";
-import { seededRandom } from "../../../core/math/random/seededRandom.js";
-import { ShadedGeometrySystem } from "../ecs/mesh-v2/ShadedGeometrySystem.js";
-import { GizmoRenderingPlugin } from "../render/gizmo/GizmoRenderingPlugin.js";
-import { LightProbeVolume } from "./LightProbeVolume.js";
-import Entity from "../../ecs/Entity.js";
-import { ShadedGeometry } from "../ecs/mesh-v2/ShadedGeometry.js";
 import {
     ClampToEdgeWrapping,
     DataTexture,
@@ -15,23 +8,38 @@ import {
     RGBAFormat,
     UnsignedByteType
 } from "three";
-import { Transform } from "../../ecs/transform/Transform.js";
-import Vector3 from "../../../core/geom/Vector3.js";
+import '../../../../../../../css/game.scss';
 import { BinaryBuffer } from "../../../core/binary/BinaryBuffer.js";
-import { is_typed_array_equals } from "../../../core/collection/array/typed/is_typed_array_equals.js";
 import { array_copy } from "../../../core/collection/array/array_copy.js";
+import { is_typed_array_equals } from "../../../core/collection/array/typed/is_typed_array_equals.js";
+import { AABB3 } from "../../../core/geom/3d/aabb/AABB3.js";
+import { make_justified_point_grid } from "../../../core/geom/3d/util/make_justified_point_grid.js";
+import Vector2 from "../../../core/geom/Vector2.js";
+import Vector3 from "../../../core/geom/Vector3.js";
 import { randomFloatBetween } from "../../../core/math/random/randomFloatBetween.js";
+import { seededRandom } from "../../../core/math/random/seededRandom.js";
+import { delay } from "../../../core/process/delay.js";
 import { GLTFAssetLoader } from "../../asset/loaders/GLTFAssetLoader.js";
-import { three_object_to_entity_composition } from "../ecs/mesh-v2/three_object_to_entity_composition.js";
+import Entity from "../../ecs/Entity.js";
+import GUIElement from "../../ecs/gui/GUIElement.js";
+import GUIElementSystem from "../../ecs/gui/GUIElementSystem.js";
+import ViewportPosition from "../../ecs/gui/position/ViewportPosition.js";
+import ViewportPositionSystem from "../../ecs/gui/position/ViewportPositionSystem.js";
 import { TransformAttachmentSystem } from "../../ecs/transform-attachment/TransformAttachmentSystem.js";
-import { ShadedGeometryFlags } from "../ecs/mesh-v2/ShadedGeometryFlags.js";
-import { AABB3 } from "../../../core/geom/3d/aabb/AABB3.js";
-import { delay } from "../../../core/process/delay.js";
-import { make_justified_point_grid } from "../../../core/geom/3d/util/make_justified_point_grid.js";
-import LightSystem from "../ecs/light/LightSystem.js";
+import { Transform } from "../../ecs/transform/Transform.js";
+import { EngineHarness } from "../../EngineHarness.js";
+import { makeSimpleTaskProgressView } from "../../makeSimpleTaskProgressView.js";
 import { Light } from "../ecs/light/Light.js";
+import LightSystem from "../ecs/light/LightSystem.js";
 import { LightType } from "../ecs/light/LightType.js";
-import { load_and_set_cubemap_v0 } from "../load_and_set_cubemap_v0.js";
+import { SGMesh } from "../ecs/mesh-v2/aggregate/SGMesh.js";
+import { SGMeshSystem } from "../ecs/mesh-v2/aggregate/SGMeshSystem.js";
+import { ShadedGeometry } from "../ecs/mesh-v2/ShadedGeometry.js";
+import { ShadedGeometryFlags } from "../ecs/mesh-v2/ShadedGeometryFlags.js";
+import { ShadedGeometrySystem } from "../ecs/mesh-v2/ShadedGeometrySystem.js";
+import { three_object_to_entity_composition } from "../ecs/mesh-v2/three_object_to_entity_composition.js";
+import { GizmoRenderingPlugin } from "../render/gizmo/GizmoRenderingPlugin.js";
+import { LightProbeVolume } from "./LightProbeVolume.js";
 
 /**
  *
@@ -174,6 +182,118 @@ function make_test_texture(t = 1) {
     return tex;
 }
 
+/**
+ *
+ * @param {Engine} engine
+ * @param {EntityComponentDataset} ecd
+ * @param {AABB3} bounds
+ */
+async function build_probes(engine, ecd, bounds) {
+
+    const lpv = new LightProbeVolume();
+
+    // lpv.add_point(10, 5, 10);
+
+    const desired_density = 10;
+
+
+    // const light_volume_bounds = new AABB3(-10, 0.5, -10, 10, 11, 10);
+    const probe_grid_spacing_dense = Math.min(bounds.getExtentsX(), bounds.getExtentsY(), bounds.getExtentsZ()) / desired_density;
+    const probe_grid_spacing_sparse = Math.max(bounds.getExtentsX(), bounds.getExtentsY(), bounds.getExtentsZ()) / desired_density;
+
+    const probe_grid_spacing = (probe_grid_spacing_sparse / probe_grid_spacing_dense) < 2 ? probe_grid_spacing_dense : probe_grid_spacing_sparse * 0.5;
+    //
+    // const probe_grid_spacing =desired_density/ (mesh_asset.boundingBox.getExtentsX()* mesh_asset.boundingBox.getExtentsY()* mesh_asset.boundingBox.getExtentsZ());
+
+    const model_bounds = new AABB3(-10, 0.5, -10, 10, 11, 10);
+    model_bounds.copy(bounds);
+    // model_bounds._translate(composition.transform.position.x, composition.transform.position.y, composition.transform.position.z);
+    model_bounds.grow(probe_grid_spacing * 1.1);
+
+
+    // sg_hierarchy_compute_bounding_box_via_parent_entity(light_volume_bounds, composition.entity.entity, ecd);
+
+    // for (let i = 0; i < 100; i++) {
+    //     lpv.add_point(
+    //         randomFloatBetween(random, light_volume_bounds.x0, light_volume_bounds.x1),
+    //         randomFloatBetween(random,  light_volume_bounds.y0, light_volume_bounds.y1),
+    //         randomFloatBetween(random,  light_volume_bounds.z0, light_volume_bounds.z1),
+    //     );
+    // }
+
+    make_justified_point_grid(model_bounds, probe_grid_spacing, (x, y, z) => {
+        lpv.add_point(x, y, z);
+    });
+
+    // lpv.add_point(10, 1, -10);
+
+    await delay(2000);
+
+    //
+    // console.profile('lpv build');
+    //
+    const task = lpv.build(engine);
+    // console.profileEnd('lpv build');
+
+    const progress = makeSimpleTaskProgressView({
+        task,
+        localization: engine.localization,
+        size: new Vector2(512, 64)
+    });
+
+    const progress_entity = new Entity();
+    progress_entity
+        .add(GUIElement.fromView(progress))
+        .add(ViewportPosition.fromJSON({
+            position: new Vector2(0, 1),
+            anchor: new Vector2(0, 1),
+            offset: new Vector2(16, -16)
+        }))
+        .build(ecd);
+
+    task.promise().finally(() => progress_entity.destroy())
+
+    engine.executor.runGroup(task);
+
+    // fill probes with random data
+    // for (let i = 0; i < lpv.__length * 27; i++) {
+    //     lpv.__probe_data[i] = random();
+    // }
+
+    // for (let i = 0; i < lpv.__length; i++) {
+    //
+    //     for (let j = 0; j < 9; j++) {
+    //         lpv.__probe_data[(i * 9 + j) * 3] = max2(0, (lpv.__positions[i * 3] + 10) / 20);
+    //         lpv.__probe_data[(i * 9 + j) * 3 + 1] = max2(0, (lpv.__positions[i * 3 + 1] - 0.5) / 10.5);
+    //         lpv.__probe_data[(i * 9 + j) * 3 + 2] = max2(0, (lpv.__positions[i * 3 + 2] + 10) / 20);
+    //     }
+    // }
+
+    // lpv.white_probe(0, [
+    //     0.7953949, 0.4405923, 0.5459412,
+    //     0.3981450, 0.3526911, 0.6097158,
+    //     -0.3424573, -0.1838151, -0.2715583,
+    //
+    //     -0.2944621, -0.0560606, 0.0095193,
+    //     -0.1123051, -0.0513088, -0.1232869,
+    //     -0.2645007, -0.2257996, -0.4785847,
+    //
+    //     -0.1569444, -0.0954703, -0.1485053,
+    //     0.5646247, 0.2161586, 0.1402643,
+    //     0.2137442, -0.0547578, -0.3061700], 0);
+
+
+    // lpv.visualize_mesh({ ecd: ecd });
+
+    task.promise().then(() => {
+
+        lpv.visualize_probes({ ecd: ecd, size: probe_grid_spacing * 0.08 });
+
+    })
+
+    console.log(lpv);
+}
+
 /**
  *
  * @param {Engine} engine
@@ -184,30 +304,41 @@ async function main(engine) {
         engine,
         enableWater: false,
         enableTerrain: false,
-        enableLights: false,
-        // enableLights: true,
+        // enableLights: false,
+        enableLights: true,
         cameraFarDistance: 200,
         focus: { x: 0, y: 0, z: 0 },
         pitch: 1,
         yaw: -1.54,
         distance: 54,
-        shadowmapResolution: 4096
+        // shadowmapResolution: 4096
     });
-    load_and_set_cubemap_v0(engine.graphics, 'data/textures/cubemaps/hip_miramar/32/', '.png');
+
+    engine.graphics.getRenderer().setClearColor('#1e3441', 1);
+
+    // load_and_set_cubemap_v0(engine.graphics, 'data/textures/cubemaps/hip_miramar/32/', '.png');
 
     const ecd = engine.entityManager.dataset;
 
 
     // const path = 'data/models/LowPolyTownshipSet/Small_house/Small_house.gltf';
-    const path = 'data/models/sibenik/model.gltf';
+    // const path = 'data/models/sibenik/2/model.gltf';
+    const path = 'data/models/vokselia_spawn/model.gltf';
     // const path = 'data/models/sponza-pbr/gltf/sponza.glb';
     // const path = 'data/models/LowPolyTownshipSet/Town_Hall/model.gltf';
     // const path = 'data/models/Slaughter Mech/Slaugter Mech.gltf';
 
-    const mesh_asset = await engine.assetManager.promise(path, 'gltf');
+    const mesh_asset = await engine.assetManager.promise(path, 'model/gltf+json');
     const gltf = mesh_asset.gltf;
 
 
+    const mesh_entity = new Entity();
+    mesh_entity
+        .add(new Transform())
+        .add(SGMesh.fromURL(path))
+    ;
+
+
     const composition = three_object_to_entity_composition(gltf.scene);
 
     composition.traverse(n => {
@@ -241,7 +372,7 @@ async function main(engine) {
     // })
 
     composition.transform.scale.setScalar(1);
-    composition.transform.position.set(0, -mesh_asset.boundingBox.y0, 0);
+    // composition.transform.position.set(0, -mesh_asset.boundingBox.y0, 0);
 
     composition.build(ecd);
 
@@ -318,7 +449,7 @@ async function main(engine) {
 
     const random = seededRandom();
 
-    for (let i = 0; i < 16; i++) {
+    for (let i = 0; i < 0; i++) {
 
         new Entity()
             .add(Transform.fromJSON({
@@ -337,84 +468,16 @@ async function main(engine) {
             .build(ecd);
     }
 
+    function build() {
 
-    const lpv = new LightProbeVolume();
-
-    // lpv.add_point(10, 5, 10);
-
-    const desired_density = 10;
-
-
-    // const light_volume_bounds = new AABB3(-10, 0.5, -10, 10, 11, 10);
-    const probe_grid_spacing_dense = Math.min(mesh_asset.boundingBox.getExtentsX(), mesh_asset.boundingBox.getExtentsY(), mesh_asset.boundingBox.getExtentsZ()) / desired_density;
-    const probe_grid_spacing_sparse = Math.max(mesh_asset.boundingBox.getExtentsX(), mesh_asset.boundingBox.getExtentsY(), mesh_asset.boundingBox.getExtentsZ()) / desired_density;
-
-    const probe_grid_spacing = (probe_grid_spacing_sparse / probe_grid_spacing_dense) < 2 ? probe_grid_spacing_dense : probe_grid_spacing_sparse * 0.5;
-    //
-    // const probe_grid_spacing =desired_density/ (mesh_asset.boundingBox.getExtentsX()* mesh_asset.boundingBox.getExtentsY()* mesh_asset.boundingBox.getExtentsZ());
-
-    const model_bounds = new AABB3(-10, 0.5, -10, 10, 11, 10);
-    model_bounds.copy(mesh_asset.boundingBox);
-    model_bounds.grow(probe_grid_spacing * 1.1);
-
-
-    // sg_hierarchy_compute_bounding_box_via_parent_entity(light_volume_bounds, composition.entity.entity, ecd);
-
-    // for (let i = 0; i < 100; i++) {
-    //     lpv.add_point(
-    //         randomFloatBetween(random, light_volume_bounds.x0, light_volume_bounds.x1),
-    //         randomFloatBetween(random,  light_volume_bounds.y0, light_volume_bounds.y1),
-    //         randomFloatBetween(random,  light_volume_bounds.z0, light_volume_bounds.z1),
-    //     );
-    // }
-
-    make_justified_point_grid(model_bounds, probe_grid_spacing, (x, y, z) => {
-        lpv.add_point(x, y, z);
-    });
-
-    // lpv.add_point(10, 1, -10);
-
-    await delay(2000);
-
-    //
-    // console.profile('lpv build');
-    //
-    lpv.build(engine);
-    // console.profileEnd('lpv build');
-
-    // fill probes with random data
-    // for (let i = 0; i < lpv.__length * 27; i++) {
-    //     lpv.__probe_data[i] = random();
-    // }
+        build_probes(engine, ecd, mesh_asset.boundingBox);
+    }
 
-    // for (let i = 0; i < lpv.__length; i++) {
-    //
-    //     for (let j = 0; j < 9; j++) {
-    //         lpv.__probe_data[(i * 9 + j) * 3] = max2(0, (lpv.__positions[i * 3] + 10) / 20);
-    //         lpv.__probe_data[(i * 9 + j) * 3 + 1] = max2(0, (lpv.__positions[i * 3 + 1] - 0.5) / 10.5);
-    //         lpv.__probe_data[(i * 9 + j) * 3 + 2] = max2(0, (lpv.__positions[i * 3 + 2] + 10) / 20);
-    //     }
-    // }
+    build();
 
-    // lpv.white_probe(0, [
-    //     0.7953949, 0.4405923, 0.5459412,
-    //     0.3981450, 0.3526911, 0.6097158,
-    //     -0.3424573, -0.1838151, -0.2715583,
-    //
-    //     -0.2944621, -0.0560606, 0.0095193,
-    //     -0.1123051, -0.0513088, -0.1232869,
-    //     -0.2645007, -0.2257996, -0.4785847,
+    // mesh_entity.addEventListener(SGMeshEvents.AssetLoaded, build);
     //
-    //     -0.1569444, -0.0954703, -0.1485053,
-    //     0.5646247, 0.2161586, 0.1402643,
-    //     0.2137442, -0.0547578, -0.3061700], 0);
-
-
-    // lpv.visualize_mesh({ ecd: ecd });
-    lpv.visualize_probes({ ecd: ecd, size: probe_grid_spacing * 0.08 });
-
-
-    console.log(lpv);
+    // mesh_entity.build(ecd);
 }
 
 new EngineHarness().initialize({
@@ -424,8 +487,11 @@ new EngineHarness().initialize({
         config.addSystem(new LightSystem(engine, {
             shadowResolution: 2048
         }));
+        config.addSystem(new SGMeshSystem(engine));
+        config.addSystem(new GUIElementSystem(engine.gui.view, engine));
+        config.addSystem(new ViewportPositionSystem(engine.gui.view.size));
 
-        config.addLoader('gltf', new GLTFAssetLoader());
+        config.addLoader('model/gltf+json', new GLTFAssetLoader());
 
         config.addPlugin(GizmoRenderingPlugin);
     }

package/src/engine/graphics/texture/makeOnePixelTexture.js

@@ -0,0 +1,19 @@
+import { DataTexture, UnsignedByteType } from "three";
+
+/**
+ *
+ * @param {ArrayLike<number>|Uint8Array} contents
+ * @param {Signal} cleanup_signal can be called to dispose of the texture
+ * @returns {DataTexture}
+ */
+export function makeOnePixelTexture(contents, cleanup_signal) {
+    const t = new DataTexture(new Uint8Array(contents), 1, 1);
+
+    t.generateMipmaps = false;
+    t.needsUpdate = true;
+    t.type = UnsignedByteType;
+
+    cleanup_signal.addOne(t.dispose, t);
+
+    return t;
+}

package/src/engine/graphics/texture/sprite/prototypeSpriteCutoutGeometry.js

@@ -11,14 +11,12 @@ import GUIElementSystem from "../../../ecs/gui/GUIElementSystem.js";
 import ViewportPosition from "../../../ecs/gui/position/ViewportPosition.js";
 import ViewportPositionSystem from "../../../ecs/gui/position/ViewportPositionSystem.js";
 import { EngineHarness } from "../../../EngineHarness.js";
+import { canvas2d_draw_path } from "../../canvas/canvas2d_draw_path.js";
 import { Sampler2D } from "../sampler/Sampler2D.js";
 import sampler2D2Canvas from "../sampler/Sampler2D2Canvas.js";
 import { make_edge_condition_channel_threshold } from "../sampler/search/make_edge_condition_channel_threshold.js";
 import { sampler2d_find_pixels } from "../sampler/search/sampler2d_find_pixels.js";
 
-const edge_condition_alpha0 = make_edge_condition_channel_threshold(3, 0);
-
-
 function sampler_as_view(sampler) {
 
     const vSpriteSource = new CanvasView();
@@ -33,67 +31,6 @@ function sampler_as_view(sampler) {
     return vSpriteSource;
 }
 
-/**
- *
- * @param {number[]} vertices
- * @param {CanvasRenderingContext2D} ctx
- * @param [fillColor]
- * @param [strokeColor]
- * @param [highlight_vertices]
- * @param [vertex_draw_size]
- * @param {number} [offset] in pixels
- */
-function drawPath({
-                      vertices,
-                      ctx,
-                      fillColor = 'transparent',
-                      strokeColor = 'red',
-                      highlight_vertices = true,
-                      vertex_draw_size = 8,
-                      offset = [0, 0]
-                  }) {
-
-    function draw_point(x, y) {
-        ctx.fillStyle = 'rgba(255,255,255,0.8)';
-        ctx.strokeStyle = 'black';
-        ctx.lineWidth = "1px";
-
-        const x1 = x - vertex_draw_size / 2 + offset[0];
-        const y1 = y - vertex_draw_size / 2 + offset[1];
-
-        ctx.fillRect(x1, y1, vertex_draw_size, vertex_draw_size);
-
-        ctx.strokeRect(x1, y1, vertex_draw_size, vertex_draw_size);
-    }
-
-    if (highlight_vertices) {
-        for (let i = 0; i < vertices.length / 2; i++) {
-            draw_point(vertices[i * 2], vertices[i * 2 + 1]);
-        }
-    }
-
-    ctx.fillStyle = fillColor;
-    ctx.strokeStyle = strokeColor;
-    ctx.lineWidth = "1px";
-
-    ctx.beginPath();
-
-    ctx.moveTo(vertices[0] + offset[0], vertices[1] + offset[1]);
-    // drawPoint(jarvis_vertices[0].x, jarvis_vertices[0].y, jarvis_vertices[0].z, 'red');
-
-    for (let i = 1; i < vertices.length / 2; i++) {
-
-        ctx.lineTo(vertices[i * 2] + offset[0], vertices[i * 2 + 1] + offset[1]);
-
-        // drawPoint(last.x, last.y, last.z, 'red');
-    }
-
-    ctx.closePath();
-    ctx.stroke();
-    ctx.fill();
-
-}
-
 /**
  *
  * @param {Engine} engine
@@ -104,10 +41,10 @@ async function main(engine) {
     // const path = "data/textures/particle/UETools/Bones_01.png";
     // const path = "data/textures/particle/UETools/x64/Bones_01.png";
     // const path = "data/textures/particle/KriptoFX/x256/SmokeTile2.png";
-    const path = "data/textures/particle/KriptoFX/CloudMask.png";
+    // const path = "data/textures/particle/KriptoFX/CloudMask.png";
     // const path = "data/textures/particle/travnik/arrow_2_64.png";
     // const path = "data/textures/particle/travnik/leaf_01.png";
-    // const path = "data/textures/particle/travnik/portal_2_blue_64.png";
+    const path = "data/textures/particle/travnik/portal_2_blue_64.png";
     // const path = "data/textures/particle/travnik/flake.png";
 
     const asset = await engine.assetManager.promise(path, 'image')
@@ -147,7 +84,7 @@ async function main(engine) {
     // we make it a bit larger to fit markers drawn at the edges of the image
     vHull.size.set(sampler.width + 32, sampler.height + 32);
 
-    drawPath({
+    canvas2d_draw_path({
         vertices: convex_hull_vertices,
         ctx: vHull.context2d,
         offset: [16, 16]
@@ -184,7 +121,7 @@ async function main(engine) {
 
     vOptimalPoly.size.set(sampler.width + 100, sampler.height + 100);
 
-    drawPath({
+    canvas2d_draw_path({
         vertices: optimal_poly,
         ctx: vOptimalPoly.context2d,
         strokeColor: '#30c0ff',

package/src/engine/graphics/texture/virtual/v2/VirtualTexturePage.js

@@ -159,7 +159,7 @@ export class VirtualTexturePage {
         texture.minFilter = NearestFilter;
         texture.magFilter = LinearFilter;
         // texture.magFilter = NearestFilter;
-        texture.anisotropy = this.#tile_margin;
+        texture.anisotropy = this.#tile_margin*2;
 
         this.#tile_copy_texture.wrapT = ClampToEdgeWrapping;
         this.#tile_copy_texture.wrapS = ClampToEdgeWrapping;

package/src/engine/input/devices/PointerDevice.js

@@ -1,13 +1,13 @@
 /**
  * Created by Alex on 29/01/2015.
  */
-import Vector2 from "../../../core/geom/Vector2.js";
+import { assert } from "../../../core/assert.js";
 import Signal from "../../../core/events/signal/Signal.js";
+import Vector2 from "../../../core/geom/Vector2.js";
 import Vector3 from "../../../core/geom/Vector3.js";
-import { assert } from "../../../core/assert.js";
+import { sign } from "../../../core/math/sign.js";
 import { MouseEvents } from "./events/MouseEvents.js";
 import { TouchEvents } from "./events/TouchEvents.js";
-import { sign } from "../../../core/math/sign.js";
 import { InputDeviceSwitch } from "./InputDeviceSwitch.js";
 
 /**
@@ -353,6 +353,9 @@ export class PointerDevice {
         down: new Signal(),
         up: new Signal(),
         move: new Signal(),
+        /**
+         * @type {Signal<Vector2, (MouseEvent|TouchEvent)>}
+         */
         tap: new Signal(),
         drag: new Signal(),
         dragStart: new Signal(),

package/src/engine/makeSimpleTaskProgressView.js

@@ -0,0 +1,33 @@
+import Vector2 from "../core/geom/Vector2.js";
+import TaskProgressView from "../view/task/TaskProgressView.js";
+
+/**
+ *
+ * @param {Task|TaskGroup} task
+ * @param {Localization} localization
+ * @param {Vector2} [size]
+ * @returns {TaskProgressView}
+ */
+export function makeSimpleTaskProgressView({
+                                               task,
+                                               localization,
+                                               size = new Vector2(256, 32)
+                                           }) {
+
+    const vProgress = new TaskProgressView({
+        task,
+        localization
+    });
+
+    vProgress.size.copy(size);
+    vProgress.css({
+        position: 'absolute',
+        top: 0,
+        left: 0,
+        pointerEvents: "none"
+    });
+    vProgress.el.querySelector('.fill').style.background = 'rgb(255,220,94)';
+    vProgress.el.querySelector('.progress-bar').style.height = '8px';
+
+    return vProgress;
+}