kireji 0.13.0 → 0.15.0

package/package.json

@@ -1,6 +1,6 @@
 {
  "name": "kireji",
- "version": "0.13.0",
+ "version": "0.15.0",
  "description": "A web framework for stateful, entropy-perfect, multi-origin web applications. Currently in alpha. Expect breaking changes for version 0. Use with caution!",
  "files": [
   "src/",

package/src/app/kireji/issue-tracker/sections/issues/1776205973/affects_.js

@@ -1,3 +1,3 @@
 return [
- _.parts.abstract.mesh
+ _.parts.abstract.walkable
 ]

package/src/app/kireji/issue-tracker/sections/issues/1776205973/description

@@ -1,6 +1,6 @@
-There are four potential improvements that can be used to refine mesh raycasting to improve edge sliding and potentially performance (if necessary).
+There are four potential improvements that can be used to refine walkable raycasting to improve edge sliding and potentially performance (if necessary).
 
-1. When the angle of the line through the opposing neighbors appears exactly straight, consider searching in a wider radius for asymmetry in the mesh boundary. This can help prevent dead stops when the force vector is exactly perpendicular to a straight portion of a very gently angled edge.
-2. Consider memoizing triangle neighbors and offering a NEIGHBORS_ONLY argument into the function that determines which triangle a given point falls on. This might improve raytracing performance but it might also introduce edge cases (for example, for meshes with tris that are very thin slivers).
+1. When the angle of the line through the opposing neighbors appears exactly straight, consider searching in a wider radius for asymmetry in the walkable boundary. This can help prevent dead stops when the force vector is exactly perpendicular to a straight portion of a very gently angled edge.
+2. Consider memoizing triangle neighbors and offering a NEIGHBORS_ONLY argument into the function that determines which triangle a given point falls on. This might improve raytracing performance but it might also introduce edge cases (for example, for walkable with tris that are very thin slivers).
 3. For accurate "friction", we should reduce the speed of the vector-to-nearest-boundary-neighbor proportionally to how far that vector deviates from true force vector.
 4. When the ray casting time limit does not provide enough time to make a full diagonal move, consider moving to one of the two 4-point neighbors that sits between the current ray position and the target diagonal neighbor.

package/src/app/kireji/issue-tracker/sections/issues/1776205973/title

@@ -1 +1 @@
-Refine Mesh Ray Casting
+Refine Walkable Ray Casting

package/src/app/kireji/issue-tracker/sections/issues/1776206413/affects_.js

@@ -1,3 +1,3 @@
 return [
- _.parts.abstract.mesh
+ _.parts.abstract.walkable
 ]

package/src/build.js

@@ -82,6 +82,12 @@ function ƒ(_, compressedSubjectOrigins) {
 
  // Math Utilities
  class Vector {
+  static 2(x = 0, y = 0) {
+   return { x, y }
+  }
+  static 3(x = 0, y = 0, z = 0) {
+   return { x, y, z }
+  }
   static magnitude(vector) {
    return Math.hypot(...Object.values(vector))
   }
@@ -757,6 +763,8 @@ function ƒ(_, compressedSubjectOrigins) {
           const constant = this
           constant.path = SOURCE_PATH
           constant.line = SOURCE_LINE
+          if (!constant.line.endsWith(";"))
+           constant.line += ";"
           constant.lineNumber = SOURCE_LINE_NUMBER
           constant.source = sourceFile.addSource(SOURCE_PATH, SOURCE_LINE)
           constant.equalsIndex = SOURCE_LINE.indexOf("=")

package/src/parts/abstract/part/attr-click.js

@@ -0,0 +1 @@
+return `data-onclick="${sanitizeAttr(JSON.stringify([part.host, METHOD_NAME, ...ARGS]))}"`

package/src/parts/abstract/part/model-reset.js

@@ -0,0 +1,12 @@
+let landingModel = _.landingModel
+
+for (const domain of [...part.domains].reverse()) {
+ if (domain in landingModel)
+  landingModel = landingModel[domain]
+ else {
+  part.setRouteID(0n)
+  return
+ }
+}
+
+part.setModel(landingModel)

package/src/parts/abstract/part/model-set.js

@@ -1 +1,4 @@
-part.setRouteID(part.modelToRouteID(MODEL))
+const newRouteID = part.modelToRouteID(MODEL)
+
+if (part.routeID !== newRouteID)
+ part.setRouteID(newRouteID)

package/src/parts/abstract/part/part.json

@@ -13,6 +13,7 @@
    "MODEL",
    "SKIP_RUNTIME_STATE_DISTRIBUTION = false"
   ],
+  "model-reset": [],
   "routeID-collect": [
    "SUBPARTS",
    "DEPTH"
@@ -73,6 +74,10 @@
    "METHOD_NAME = 'point'",
    "...ARGS"
   ],
+  "attr-click": [
+   "METHOD_NAME = 'onclick'",
+   "...ARGS"
+  ],
   "manifest-resolve-owner-of": [
    "PROPERTY_KEY"
   ],

package/src/parts/abstract/part/type.d.ts

@@ -33,8 +33,10 @@ declare interface IPart<TOwner, TSubpart>
  readonly "runtimeReference": string
  /** An optional display name for the part. */
  readonly "title"?: string
- /** Generates the attribute string that sets up an onpointerdown listener that calls `part[METHOD_NAME](event,this,...ARGS)`. */
+ /** Generates the attribute string that sets up an onpointerdown listener that calls `part[METHOD_NAME](event,this,...ARGS)`. Typically, use `pointer.handle({ ... })` within that method to react to manage complex events drag-and-drop, clicks, double clicks, etc. @remarks This approach will always use the pointer events (not click, touch or mouse events). Use `clickAttr` instead of `pointAttr` to create a traditional click event handler. */
  readonly pointAttr(METHOD_NAME: string = "point", ...ARGS: any[])
+ /** Generates the attribute string that sets up an onclick listener that calls `part[METHOD_NAME](event,this,...ARGS)`. Using `pointAttr` with `pointer.handle({ ... })` is the preferred method of reacting to clicks but this event can be used for special cases like requesting a pointerlock, where the browser requires a proper click event. */
+ readonly clickAttr(METHOD_NAME: string = "onclick", ...ARGS: any[])
  /** Registers a listener that calls RECEIVER[CALLBACK_NAME](this) after the event of the given type occurs. */
  readonly attach(EVENT_TYPE: string, RECEIVER: IPartAny, CALLBACK_NAME: string): void
  /** Unregisters the listener that calls RECEIVER[CALLBACK_NAME](this) after the event of the given type occurs. */
@@ -66,6 +68,8 @@ declare interface IPart<TOwner, TSubpart>
  readonly startBuild(): void
  /** Performs `part.modelToRouteID()` on MODEL and then performs `part.setRouteID()` on the resulting route ID. */
  readonly setModel(MODEL: any, SKIP_RUNTIME_STATE_DISTRIBUTION: boolean = false)
+ /** Sets the route ID on the part to match the landing model (or route ID 0n, if the part is not mentioned in the landing model). */
+ readonly resetModel(MODEL: any, SKIP_RUNTIME_STATE_DISTRIBUTION: boolean = false)
  /** Sets the part's routeID, propagating it leafward and rootward and updating all views.
   * 
   * If DELTA is true, ROUTE_ID is added to the part's current route ID.

package/src/parts/abstract/scroller/onresize.js

@@ -2,7 +2,7 @@ scroller.onscroll()
 const ratio = scroller.container.scrollHeight / scroller.container.clientHeight
 const precisionFactor = 100_000
 
-scroller.scrollBar.style.setProperty("--ratio", ratio)
+scroller.scrollBar.style.setProperty("--scroll-thumb-ratio", ratio)
 
 if (Math.round(ratio * precisionFactor) === precisionFactor)
  scroller.scrollBar.setAttribute("disabled", "")

package/src/parts/abstract/scroller/wrap.js

@@ -1 +1 @@
-return `<scroller-><scroll-content>${INNER_HTML}</scroll-content></scroller-><scroll-bar ${scroller.pointAttr("buttonPoint")} style="--fraction:${scroller.fraction};--ratio:1" disabled><button ${scroller.pointAttr("buttonPoint")} class=scroll-up></button><thumb- ${scroller.pointAttr("thumbPoint")}></thumb-><button ${scroller.pointAttr("buttonPoint")} class=scroll-down></button></scroll-bar>`
+return `<scroller-><scroll-content>${INNER_HTML}</scroll-content></scroller-><scroll-bar ${scroller.pointAttr("buttonPoint")} style="--fraction:${scroller.fraction};--scroll-thumb-ratio:1" disabled><button ${scroller.pointAttr("buttonPoint")} class=scroll-up></button><thumb- ${scroller.pointAttr("thumbPoint")}></thumb-><button ${scroller.pointAttr("buttonPoint")} class=scroll-down></button></scroll-bar>`

package/src/parts/abstract/type.d.ts

@@ -11,7 +11,7 @@ declare interface IAbstract
  readonly facet: IFacet<IAbstract, null>
  readonly issue: ITrackedIssue<IAbstract>
  readonly match: IMatch<IAbstract, null>
- readonly mesh: IMesh<IAbstract>
+ readonly walkable: IWalkable<IAbstract>
  readonly mix: IMix<IAbstract, null>
  readonly part: IPart<IAbstract, null>
  readonly partMask: IPartMask<IAbstract, null>

package/src/parts/abstract/{mesh → walkable}/build.js

@@ -1,18 +1,18 @@
-mesh.define({
+walkable.define({
  triTable: { value: [] },
  triIndex: { value: -1, writable: true },
- position: { value: { x: null, y: null, z: null } },
+ position: { value: Vector[3]() },
  data: {
   resolve() {
-   return mesh.getData()
+   return walkable.getData()
   }
  },
  cardinality: {
   resolve() {
-   let meshCardinality = 0n
+   let walkableCardinality = 0n
 
-   // Obtain the raw data for this collision mesh.
-   const [pointList, tris] = this.data.collision
+   // Obtain the raw data for this walkable.
+   const [pointList, tris] = this.data.walkable
 
    // Iterate over each tri (array of three point indices) in the data.
    for (const tri of tris) {
@@ -59,7 +59,7 @@ mesh.define({
       // This row doesn't have a full pixel. Adjust the z-range.
       if (z <= zRange.min + 1) zRange.min = z + 1
       else if (z >= zRange.max - 1) zRange.max = z - 1
-      else throw new Error("Unexpected tri geometry found in mesh.")
+      else throw new Error("Unexpected tri geometry found in walkable.")
       continue
      }
 
@@ -70,7 +70,7 @@ mesh.define({
      min.x = Math.ceil(min.x)
      max.x = Math.ceil(max.x) - 1
 
-     /** @type {IMeshTriDataRow} */
+     /** @type {IWalkableTriDataRow} */
      const row = {
       z,
       xyRange: { min, max },
@@ -82,18 +82,18 @@ mesh.define({
     }
 
     // Store the tri.
-    mesh.triTable.push({
+    walkable.triTable.push({
      points,
      zRange,
      rows,
-     offset: meshCardinality,
+     offset: walkableCardinality,
      cardinality: triCardinality
     })
 
-    meshCardinality += triCardinality
+    walkableCardinality += triCardinality
    }
 
-   return meshCardinality
+   return walkableCardinality
   }
  }
 })

package/src/parts/abstract/walkable/constants.js

@@ -0,0 +1 @@
+const walkable = this

package/src/parts/abstract/walkable/data-get.js

@@ -0,0 +1,11 @@
+const { points, tris } = walkable.manifest
+
+const data = { walkable: [[], []] }
+
+for (let index = 0; index < points.length; index += 2)
+ data.walkable[0].push([Math.round(points[index]), 0, Math.round(points[index + 1])])
+
+for (let index = 0; index < tris.length; index += 3)
+ data.walkable[1].push([tris[index], tris[index + 1], tris[index + 2]])
+
+return data

package/src/parts/abstract/walkable/description-abstract

@@ -0,0 +1 @@
+This part represents a state space that is formed by quantizing the { x, z } positions of a 3D trianglated mesh. It is equipped with a per-frame ray-tracing method that uses a movement vector to handle the trade-off from triangle to triangle and converts route IDs to { x, y, z } coordinates. This is useful for for 2D and 3D games because it creates a state space that includes all of the positions a character is allowed to walk on and does not include any points that lie outside the mesh boundaries.

package/src/parts/abstract/{mesh → walkable}/mathML-subpart.js

@@ -1,10 +1,10 @@
 if (DEPTH <= 0)
  return [
-  `<munder><mo>∑</mo><mrow><mi>t</mi><mo>∈</mo><mi>tris</mi><mo>(</mo><msub><mi>𝑝</mi><mi>${mesh.key}</mi></msub><mo>)</mo></mrow></munder>`,
+  `<munder><mo>∑</mo><mrow><mi>t</mi><mo>∈</mo><mi>tris</mi><mo>(</mo><msub><mi>𝑝</mi><mi>${walkable.key}</mi></msub><mo>)</mo></mrow></munder>`,
   `<munder><mo>∑</mo><mrow><mi>r</mi><mo>∈</mo><mi>rows</mi><mo>(</mo><mi>t</mi><mo>)</mo></mrow></munder>`,
   `<msub><mi>𝑘</mi><mi>r</mi></msub>`
  ]
 
-return /*mesh.triTable.length > 20 ? base(DEPTH) :*/ mesh.triTable.flatMap(triData => {
+return /*walkable.triTable.length > 20 ? base(DEPTH) :*/ walkable.triTable.flatMap(triData => {
  return [`<mn>${triData.cardinality}</mn>`, "<mo>+</mo>"]
 }).slice(0, -1)

package/src/parts/abstract/walkable/model_.js

@@ -0,0 +1 @@
+return { ...walkable.position }

package/src/parts/abstract/{mesh → walkable}/point-tri-contains.js

@@ -1,5 +1,5 @@
 const flooredZ = Math.floor(POINT.z)
-const triData = mesh.triTable[TRI_INDEX]
+const triData = walkable.triTable[TRI_INDEX]
 
 if (flooredZ < triData.zRange.min || flooredZ > triData.zRange.max)
  return false

package/src/parts/abstract/walkable/point-tri-that-contains.js

@@ -0,0 +1,10 @@
+// Check current tri first.
+if (walkable.triIndex !== -1 && walkable.triContainsPoint(walkable.triIndex, POINT))
+ return walkable.triIndex
+
+// Check all tris. 
+for (let triIndex = 0; triIndex < walkable.triTable.length; triIndex++)
+ if (triIndex !== walkable.triIndex && walkable.triContainsPoint(triIndex, POINT))
+  return triIndex
+
+return -1

package/src/parts/abstract/{mesh → walkable}/ray-cast.js

@@ -1,13 +1,13 @@
 // Define a safe result: the current position before casting.
-/** @type {IMeshRayCastResult} */
+/** @type {IWalkableRayCastResult} */
 const safeIterationResult = {
  hit: false,
- triIndex: mesh.triIndex,
- point: {
-  x: mesh.position.x,
-  y: 0, // Exclude y from ray cast calculations for now.
-  z: mesh.position.z
- },
+ triIndex: walkable.triIndex,
+ point: Vector[3](
+  walkable.position.x,
+  0, // Exclude y coordinate from the ray casting algorithm for now.
+  walkable.position.z
+ ),
  forceVector: FORCE_VECTOR
 }
 
@@ -18,7 +18,7 @@ const speed = Vector.magnitude(FORCE_VECTOR)
 if (speed !== 0) {
 
  // Initialize timing data as though the vector doesn't intersect any grid lines.
- const timeOfNextIntersection = { x: Infinity, z: Infinity }
+ const timeOfNextIntersection = Vector[3](Infinity, Infinity, Infinity)
  const timeBetweenIntersections = { ...timeOfNextIntersection }
 
  // Set the clock to zero.
@@ -62,7 +62,7 @@ if (speed !== 0) {
 
   // Emergency exit the loop.
   if (_.now - start >= 2000) {
-   warn("Mesh ray cast calculation exceeded the maximum allowable processing time of 2 seconds.", { processingTime: _.now - start, iteration, DELTA_TIME, FORCE_VECTOR, speed, safeIterationResult, timeOfNextIntersection, timeBetweenIntersections })
+   warn("Walkable ray cast calculation exceeded the maximum allowable processing time of 2 seconds.", { processingTime: _.now - start, iteration, DELTA_TIME, FORCE_VECTOR, speed, safeIterationResult, timeOfNextIntersection, timeBetweenIntersections })
    break castRay
   }
 
@@ -94,8 +94,8 @@ if (speed !== 0) {
   // Construct the next point along the ray, given the elapsed time.
   const point = Vector.add(safeIterationResult.point, Vector.multiply(FORCE_VECTOR, timeElapsedDuringThisIteration))
 
-  // Check if the point is outside the mesh boundary.
-  const triIndex = mesh.triThatContainsPoint(point)
+  // Check if the point is outside the walkable boundary.
+  const triIndex = walkable.triThatContainsPoint(point)
 
   // If it is...
   if (triIndex === -1) {
@@ -113,10 +113,7 @@ if (speed !== 0) {
      dot: -Infinity,
      point: null,
      triIndex: null,
-     direction: {
-      x: null,
-      z: null
-     }
+     direction: Vector[3](null, null, null)
     }
 
     let boundaryAppearsFlat = false
@@ -139,9 +136,9 @@ if (speed !== 0) {
 
      // Get the position of the center of the neighbor.
      const point = Vector.add(Vector.floor(Vector.add(safeIterationResult.point, direction)), 0.5)
-     const triIndex = mesh.triThatContainsPoint(point)
+     const triIndex = walkable.triThatContainsPoint(point)
 
-     // If it isn't part of the mesh, exclude it from consideration.
+     // If it isn't part of the walkable, exclude it from consideration.
      if (triIndex === -1)
       continue
 
@@ -199,7 +196,7 @@ if (speed !== 0) {
 
      // Construct the point along the way to the neighbor.
      const point = Vector.add(safeIterationResult.point, Vector.multiply(forceVectorToNeighbor, timeElapsedDuringThisIteration))
-     const triIndex = mesh.triThatContainsPoint(point)
+     const triIndex = walkable.triThatContainsPoint(point)
      safeIterationResult.forceVector = forceVectorToNeighbor
 
      if (triIndex === -1) {
@@ -265,8 +262,8 @@ if (speed !== 0) {
  }
 }
 
-// Interpolate the y position of the collision mesh at the given { x, y } coordinates.
-const triData = mesh.triTable[safeIterationResult.triIndex]
+// Interpolate the y position of the walkable at the given { x, y } coordinates.
+const triData = walkable.triTable[safeIterationResult.triIndex]
 const flooredZ = Math.floor(safeIterationResult.point.z)
 const row = triData.rows[flooredZ - triData.zRange.min]
 const t = (safeIterationResult.point.x - row.xyRange.min.x) / Number(row.cardinality)

package/src/parts/abstract/{mesh → walkable}/routeID-distribute.js

@@ -1,19 +1,19 @@
-mesh.updateRouteID(ROUTE_ID)
+walkable.updateRouteID(ROUTE_ID)
 
 if (SKIP_RUNTIME_STATE_DISTRIBUTION)
  return
 
 // Binary search better than embedded match.
-mesh.triIndex = (() => {
+walkable.triIndex = (() => {
 
  let low = 0
- let high = mesh.triTable.length - 1
+ let high = walkable.triTable.length - 1
 
  while (low <= high) {
 
   const mid = (low + high) >>> 1
-  const triData = mesh.triTable[mid]
-  const nextTriData = mesh.triTable[mid + 1]
+  const triData = walkable.triTable[mid]
+  const nextTriData = walkable.triTable[mid + 1]
 
   if (ROUTE_ID < triData.offset)
    high = mid - 1
@@ -27,10 +27,10 @@ mesh.triIndex = (() => {
  return 0
 })()
 
-ROUTE_ID -= mesh.triTable[mesh.triIndex].offset
+ROUTE_ID -= walkable.triTable[walkable.triIndex].offset
 
 // Embedded match can become binary search later.
-for (const row of mesh.triTable[mesh.triIndex].rows) {
+for (const row of walkable.triTable[walkable.triIndex].rows) {
 
  if (!row)
   continue
@@ -38,8 +38,8 @@ for (const row of mesh.triTable[mesh.triIndex].rows) {
  const rowWidth = BigInt(row.xyRange.max.x - row.xyRange.min.x + 1)
 
  if (ROUTE_ID < row.offset + rowWidth) {
-  mesh.position.x = row.xyRange.min.x + Number(ROUTE_ID - row.offset)
-  mesh.position.z = row.z
+  walkable.position.x = row.xyRange.min.x + Number(ROUTE_ID - row.offset)
+  walkable.position.z = row.z
   break
  }
 }

package/src/parts/abstract/{mesh → walkable}/routeID-model-to.js

@@ -1,4 +1,4 @@
-const triIndex = mesh.triThatContainsPoint(MODEL)
-const triData = mesh.triTable[triIndex]
+const triIndex = walkable.triThatContainsPoint(MODEL)
+const triData = walkable.triTable[triIndex]
 const row = triData.rows[Math.floor(MODEL.z) - triData.zRange.min]
 return triData.offset + row.offset + BigInt(Math.floor(MODEL.x) - row.xyRange.min.x)

package/src/parts/abstract/walkable/type.d.ts

@@ -0,0 +1,109 @@
+declare interface IWalkable<TOwner>
+ extends IPart<TOwner, null> {
+
+ // Serialized Properties.
+ readonly getData(): IWalkableData
+ /** Casts a ray from the current walkable position along the force vector direction for the given delta time and returns a summary of the results. @param FORCE_VECTOR the force vector represent the position the uninterrupted ray will arrive at in one second. @param DELTA_TIME the duration of the time cast in seconds. @param ENABLE_SLIDING whether or not to enable the ray to "wrap" along the walkable boundary instead of stopping cold. */
+ readonly castRay(FORCE_VECTOR: IVector3, DELTA_TIME: number, ENABLE_SLIDING: boolean): IWalkableRayCastResult
+ /** Checks if a point (x, y, z) rounds to a valid pixel within the specified tri's memoized row data. */
+ readonly triContainsPoint(TRI_INDEX: IWalkableTriIndex, POINT: IVector3): boolean
+ /** Returns whether or not the given point is in a tri. @returns the index of the tri that contains the point. -1 otherwise. */
+ readonly triThatContainsPoint(POINT: IVector3): IWalkableTriIndex
+
+ // Runtime Properties.
+ /** The memoization data of every tri in the walkable, stored by tri index at build-time. */
+ readonly triTable: IWalkableTriData[]
+ /** The index of the current tri in the walkable. */
+ readonly triIndex?: IWalkableTriIndex
+ /** The current position of the state in the walkable. */
+ readonly position: IVector3
+ readonly manifest: IWalkableManifest
+ /** A cache of the pre-processed geometry data obtained by running the getData method. */
+ readonly data: IWalkableData
+}
+
+declare interface IWalkableRayCastResult {
+ /** Whether or not the ray hit the walkable boundary. */
+ readonly hit: boolean
+ /** The tri the ray most recently occupied when it hit the boundary or the index of the boundary where the ray stopped if there is no hit. */
+ readonly triIndex: IWalkableTriIndex
+ /** The rounded cell position where the cast ray landed. */
+ readonly point: IVector3
+ /** The force vector used to cast the ray, which might be different from the input if sliding is enabled as it may point along the direction of the most recent sliding iteration. */
+ readonly forceVector: IVector3
+}
+
+declare interface IWalkableTriData {
+ /** The original point array of the tri as taken from `walkable.getData()`. */
+ readonly points: IWalkableTriPoints
+ /** The z-axis range of the tri. */
+ readonly zRange: {
+  /** The z position of the top-most row of the tri. */
+  readonly min: number
+  /** The z position of the bottom-most row of the tri. */
+  readonly max: number
+ }
+ /** The rows of pixels in the tri. */
+ readonly rows: IWalkableTriDataRow[]
+ /** The offset of the tri in the overall walkable. */
+ readonly offset: bigint
+ /** The total number of pixels in the tri. */
+ readonly cardinality: bigint
+}
+
+declare interface IWalkableTriDataRow {
+ /** The z position of this row of the tri's space. */
+ readonly z: number
+ /** The x-axis range of the row stored with the corresponding y-axis coordinate at those two points. */
+ readonly xyRange: {
+  /** The smallest x position that is within the tri row. */
+  readonly min: {
+   readonly x: number,
+   readonly y: number
+  }
+  /** The largest x position that is within the tri row. */
+  readonly max: {
+   readonly x: number,
+   readonly y: number
+  }
+ }
+ /** The bigint offset of this row in the overall tri. */
+ readonly offset: bigint
+ /** The number of points in the given row. */
+ readonly cardinality: bigint
+}
+
+
+declare interface IWalkableManifest
+ extends IPartManifest {
+ /** The available walkable vertices as a flat array of 2D coordinates. Used for defining the world's walkable tris. */
+ readonly points: number[],
+ /** The list of walkable triangles, as a flat array of point triples. Used to define the walkable area of the world. */
+ readonly tris: number[]
+}
+
+declare type IWalkableData = {
+ readonly walkable: [IWalkablePoint[], IWalkableTri[]]
+}
+
+declare type IWalkableTri =
+ [IWalkablePointIndex, IWalkablePointIndex, IWalkablePointIndex]
+
+declare type IWalkablePointIndex =
+ number
+
+declare type IWalkableTriPoints =
+ [IWalkablePoint, IWalkablePoint, IWalkablePoint]
+
+declare type IWalkablePoint =
+ [x: number, y: number, z: number]
+
+declare type IWalkableTriIndex =
+ number
+
+declare type IWalkableAny =
+ IWalkable<IPartAny>
+
+declare const walkable: IWalkableAny
+
+declare const TRI: IWalkableTriData

package/src/parts/core/address-bar/{sync-install.js → async-install.js}

@@ -1,3 +1,5 @@
+await agent.promise
+
 addressBar.define({
  throttleDuration: { value: agent.isSafari ? 350 : 75 },
  throttleStartTime: { value: _.now, writable: true }

package/src/parts/core/client/async-install.js

@@ -61,10 +61,7 @@ logScope(0, "Finalizing Hydration", log => {
  })
 
  // Prevent normal click events to ensure the pointerdown event always takes precedence.
- document.addEventListener("click", pointerEvent => {
-  pointerEvent.preventDefault()
-  pointerEvent.stopPropagation()
- }, { capture: true })
+ document.addEventListener("click", client.blockClicks, { capture: true })
 
  log("Setting Initial State")
  // Propagate the initial state (matched to the snapshot exactly).

package/src/parts/core/client/clicks-block.js

@@ -0,0 +1,17 @@
+const clickHandler = POINTER_EVENT.target.getAttribute("data-onclick")
+
+if (clickHandler) {
+
+ const [partHost, methodName, ...args] = JSON.parse(clickHandler)
+ const part = partsByHost[partHost]
+
+ if (part[methodName] && typeof part[methodName] === "function")
+  part[methodName](...args)
+ else
+  throw new ReferenceError(`ClickAttr Error: could not find a method called "${methodName}" on part ${partHost}.`)
+
+ return
+}
+
+POINTER_EVENT.preventDefault()
+POINTER_EVENT.stopPropagation()

package/src/parts/core/client/part.json

@@ -3,6 +3,9 @@
  "methods": {
   "loop-request": [
    "REQUEST_TIME"
+  ],
+  "clicks-block": [
+   "POINTER_EVENT"
   ]
  }
 }

package/src/parts/core/client/type.d.ts

@@ -4,6 +4,8 @@ declare interface IClient
  // Serialized Properties.
  /** Requests an animation frame that distributes the loop function throughout the ecosystem and calls itself again. @remarks Can only be run on the client. */
  readonly requestLoop(REQUEST_TIME: DOMHighResTimeStamp): void
+ /** The click event handler that is used globally on the client to prevent the click event from taking precedence over pointer events. */
+ readonly blockClicks(POINTER_EVENT: PointerEvent): void
 
  // Runtime Properties.
  /** Whether or not the server-rendered page has been fully "taken over" by the client-side framework. @remarks Can only become true in the client environment. */

package/src/parts/core/pointer/handle.js

@@ -94,9 +94,11 @@ const
 document.addEventListener("pointermove", drag, { capture: true, signal: controller.signal })
 document.addEventListener("pointerup", drop, { capture: true, signal: controller.signal })
 document.addEventListener("pointercancel", reset, { capture: true, signal: controller.signal })
+pointer.id = POINTER_CONFIG.POINTER_EVENT.pointerId
 
 // Don't allow anything else to start picking up events.
-POINTER_CONFIG.TARGET_ELEMENT.setPointerCapture(pointer.id = POINTER_CONFIG.POINTER_EVENT.pointerId)
+if (!document.pointerLockElement)
+ POINTER_CONFIG.TARGET_ELEMENT.setPointerCapture(pointer.id)
 
 // Allow CSS styles to target the element while its down.
 POINTER_CONFIG.TARGET_ELEMENT.classList.add("down")

package/src/parts/core/server/sync-install.js

@@ -62,7 +62,7 @@ const
 
     // color.device.light = !prefersDarkMode
     _.setRoute(`https://${host}${pathname}`)
-    status = +(host in _.menuApplications ? 200 : _.applications[host].status ?? 503)
+    status = +(host in _.menuApplications ? 200 : _.applications[host].status ?? 200)
     const customHeaders = _.applications[host].customHeaders ?? {}
     head = { ...indexHeader, ...customHeaders }
     body = _['part.html']

package/src/parts/desktop/era/vintage/static.css

@@ -6,6 +6,40 @@ html {
   linear-gradient(45deg, var(--bg) 25%, transparent 25%, transparent 75%, var(--bg) 75%, var(--bg)) 1px 1px / 2px 2px;
 }
 
+wallpaper->* {
+ --deep-inset-dpx:
+  inset var(--d-1px) var(--d-1px) var(--bg-light-est),
+  inset var(--d1px) var(--d1px) var(--bg-dark),
+  inset var(--d-2px) var(--d-2px) var(--bg-light-er),
+  inset var(--d2px) var(--d2px) black;
+ --deep-outset-dpx:
+  inset var(--d-1px) var(--d-1px) black,
+  inset var(--d1px) var(--d1px) var(--bg-light-er),
+  inset var(--d-2px) var(--d-2px) var(--bg-dark),
+  inset var(--d2px) var(--d2px) var(--bg-light-est);
+ --bg-checker-dpx-color: var(--bg);
+ --bg-checker-dpx:
+  linear-gradient(45deg, var(--bg-checker-dpx-color) 25%, transparent 25%, transparent 75%, var(--bg-checker-dpx-color) 75%, var(--bg-checker-dpx-color)) 0 0 / var(--d2px) var(--d2px),
+  linear-gradient(45deg, var(--bg-checker-dpx-color) 25%, transparent 25%, transparent 75%, var(--bg-checker-dpx-color) 75%, var(--bg-checker-dpx-color)) var(--d1px) var(--d1px) / var(--d2px) var(--d2px);
+}
+
+body.dark wallpaper->* {
+ --deep-inset-dpx:
+  inset var(--d-1px) var(--d-1px) var(--bg-light-est),
+  inset var(--d1px) var(--d1px) var(--bg-dark),
+  inset var(--d-2px) var(--d-2px) var(--bg-light-er),
+  inset var(--d2px) var(--d2px) black;
+ --deep-outset-dpx:
+  inset var(--d-1px) var(--d-1px) black,
+  inset var(--d1px) var(--d1px) var(--bg-light),
+  inset var(--d-2px) var(--d-2px) var(--bg-dark),
+  inset var(--d2px) var(--d2px) var(--bg-light-er);
+ --bg-checker-dpx-color: var(--bg);
+ --bg-checker-dpx:
+  linear-gradient(45deg, var(--bg-checker-dpx-color) 25%, transparent 25%, transparent 75%, var(--bg-checker-dpx-color) 75%, var(--bg-checker-dpx-color)) 0 0 / var(--d2px) var(--d2px),
+  linear-gradient(45deg, var(--bg-checker-dpx-color) 25%, transparent 25%, transparent 75%, var(--bg-checker-dpx-color) 75%, var(--bg-checker-dpx-color)) var(--d1px) var(--d1px) / var(--d2px) var(--d2px);
+}
+
 scroll-bar {
  background: var(--bg-checker), white;
 }
@@ -197,11 +231,6 @@ task-bar {
 }
 
 body.dark {
- --deep-inset:
-  inset -1px -1px var(--bg-light-est),
-  inset 1px 1px var(--bg-dark),
-  inset -2px -2px var(--bg-light-er),
-  inset 2px 2px black;
  --deep-outset:
   inset -1px -1px black,
   inset 1px 1px var(--bg-light),

package/src/static.css

@@ -47,6 +47,30 @@ body {
  -ms-user-select: none;
 }
 
+html {
+ /* Default safe fallback (1x screens or older browsers) */
+ --dppx: 1;
+ --css-length-of-device-pixel: calc(1px / var(--dppx));
+}
+
+@media (min-resolution: 2dppx) {
+ html {
+  --dppx: 2;
+ }
+}
+
+@media (min-resolution: 3dppx) {
+ html {
+  --dppx: 3;
+ }
+}
+
+@media (min-resolution: 4dppx) {
+ html {
+  --dppx: 4;
+ }
+}
+
 wallpaper- {
  --app-height: var(--wallpaper-height);
  --app-width: var(--wallpaper-width);
@@ -58,6 +82,120 @@ wallpaper- {
  overflow: hidden;
  overflow: clip;
  touch-action: manipulation;
+ container-type: size;
+ container-name: design;
+}
+
+@container design (aspect-ratio >1 / 1) {
+
+ wallpaper->* {
+  --design-tiles-along-app-width: 16;
+  --design-tiles-along-app-height: 9;
+ }
+}
+
+@container design (aspect-ratio <=1 / 1) {
+
+ wallpaper->* {
+  --design-tiles-along-app-width: 9;
+  --design-tiles-along-app-height: 16;
+ }
+}
+
+wallpaper->* {
+
+ /* UI Design based on a simple 16 x 9 or 9 x 16 square layout,
+    with each tile having this many "design pixels". */
+ --design-pixels-per-tile: 20;
+
+ --design-pixels-along-app-width:
+  calc(var(--design-tiles-along-app-width) * var(--design-pixels-per-tile));
+
+ --design-pixels-along-app-height:
+  calc(var(--design-tiles-along-app-height) * var(--design-pixels-per-tile));
+
+ --css-length-of-design-pixel-if-using-app-width:
+  calc(var(--app-width) / var(--design-pixels-along-app-width));
+
+ --css-length-of-design-pixel-if-using-app-height:
+  calc(var(--app-height) / var(--design-pixels-along-app-height));
+
+ --css-length-of-design-pixel:
+  min(var(--css-length-of-design-pixel-if-using-app-width), var(--css-length-of-design-pixel-if-using-app-height));
+
+
+ /* Now, round the design pixel down to align the pixel art to
+  the user device's physical screen pixels. */
+ --design-pixel:
+  max(var(--css-length-of-device-pixel), round(down, var(--css-length-of-design-pixel), var(--css-length-of-device-pixel)));
+
+ /* Now, we can define the actual size of the design area in CSS pixels. */
+ --ui-width: calc(var(--d1px) * var(--design-pixels-along-app-width));
+ --ui-height: calc(var(--d1px) * var(--design-pixels-along-app-height));
+
+ /* The design area is likely smaller than the actual container,
+    so we determine the offset needed to center it. */
+ --ui-left: calc((var(--app-width) - var(--ui-width)) / 2);
+ --ui-top: calc((var(--app-height) - var(--ui-height)) / 2);
+
+ /* Add some shortcuts to common design pixel amounts. */
+ --d1px: calc(1 * var(--design-pixel));
+ --d2px: calc(2 * var(--d1px));
+ --d3px: calc(3 * var(--d1px));
+ --d4px: calc(4 * var(--d1px));
+ --d5px: calc(5 * var(--d1px));
+ --d6px: calc(6 * var(--d1px));
+ --d7px: calc(7 * var(--d1px));
+ --d8px: calc(8 * var(--d1px));
+ --d16px: calc(16 * var(--d1px));
+ --d-1px: calc(-1 * var(--d1px));
+ --d-2px: calc(-2 * var(--d1px));
+ --d-3px: calc(-3 * var(--d1px));
+ --d-4px: calc(-4 * var(--d1px));
+ --d-5px: calc(-5 * var(--d1px));
+ --d-6px: calc(-6 * var(--d1px));
+ --d-7px: calc(-7 * var(--d1px));
+ --d-8px: calc(-8 * var(--d1px));
+ --d-16px: calc(-16 * var(--d1px));
+
+ /* Compute the scalar ratio between a CSS pixel and a design pixel. */
+ --design-scale: calc(var(--d1px) / 1px);
+}
+
+@property --ui-width {
+ syntax: "<length>";
+ initial-value: 0px;
+ inherits: true;
+}
+
+@property --ui-height {
+ syntax: "<length>";
+ initial-value: 0px;
+ inherits: true;
+}
+
+@property --ui-left {
+ syntax: "<length>";
+ initial-value: 0px;
+ inherits: true;
+}
+
+@property --ui-top {
+ syntax: "<length>";
+ initial-value: 0px;
+ inherits: true;
+}
+
+@property --d1px {
+ syntax: "<length>";
+ initial-value: 0px;
+ inherits: true;
+}
+
+wallpaper->* {
+ /* Cross-platform bug fix for Firefox's inability
+ to divide two values if both have units. */
+ --design-scale: calc(10000 * tan(atan2(var(--d1px), 10000px))) !important;
 }
 
 @media (width < 640px) {
@@ -136,7 +274,7 @@ scroll-bar>:is(.scroll-up, thumb-, .scroll-down) {
 
 scroll-bar>thumb- {
  top: calc(var(--thumb-start) + var(--track-height) * var(--fraction));
- height: calc(var(--track-height) / var(--ratio));
+ height: calc(var(--track-height) / var(--design-scale));
 }
 
 body:not(.unhydrated) scroller- {

package/src/type.d.ts

@@ -56,7 +56,7 @@ declare interface IEcosystem
  /** The hash of the desired landing page, as computed from data parameters during the initial boot process. */
  readonly landingHash: string
  /** The model of the desired landing page, used during the initial boot process to compute `_.landingHash` and `_.landingRouteID`. */
- readonly landingModel: string
+ readonly landingModel: object
  /** The routeID of the desired landing page, as computed from data parameters during the initial boot process. */
  readonly landingRouteID: bigint
  /** A boolean that is set to `true` as soon as the route ID is set for the first time. */
@@ -398,21 +398,63 @@ declare class FenwickTree {
 }
 /** A utility class for handling arbitrary-length vectors. Any object with entirely numeric values can be treated as a vector. */
 declare class Vector {
- static magnitude(vector: IVector): number
- static normalize(vector: IVector): IVector
- static sign(vector: IVector): IVector
- static floor(vector: IVector): IVector
- /** Performs the given binary operation on the two values, which can each be either a vector or a number. If at least one of the values is a vector, returns a vector. Otherwise, returns a number. */
- static operate(value1: IVector | number, value2: IVector | number, operation: (a, b) => number): IVector | number
- /** Adds the two values, which can each be either a vector or a number. If at least one of the values is a vector, returns a vector. Otherwise, returns a number. */
- static add(value1: IVector | number, value2: IVector | number): IVector | number
- /** Subtracts the two values, which can each be either a vector or a number. If at least one of the values is a vector, returns a vector. Otherwise, returns a number. */
- static subtract(value1: IVector | number, value2: IVector | number): IVector | number
- /** Multiplies the two values, which can each be either a vector or a number. If at least one of the values is a vector, returns a vector. Otherwise, returns a number. */
- static multiply(value1: IVector | number, value2: IVector | number): IVector | number
- static dot(vector1: IVector, vector2: IVector): number
+
+ /** Creates the vector object `{ x, y }`. */
+ static 2(x: number = 0, y: number = 0): IVector2
+ /** Creates the vector object `{ x: 0, y: 0, z: 0 }`. */
+ static 3(x: number = 0, y: number = 0, z: number = 0): IVector3
+
+ /** Provides the absolute value (length) of the the given vector. Returns a number. */
+ static magnitude<TVector extends IVector>(vector: TVector): number
+ /** Normalizes the given vector so that its magnitude is exactly 1. Returns a vector of the same dimension. */
+ static normalize<TVector extends IVector>(vector: TVector): TVector
+ /** Returns the sign of the given vector. Returns a vector of the same dimension. */
+ static sign<TVector extends IVector>(vector: TVector): TVector
+ /** Returns a vector of the same dimension with all components floored. */
+ static floor<TVector extends IVector>(vector: TVector): TVector
+
+ /** Performs the given binary operation on vector a and number b. Returns a vector of the same dimension as vector a. */
+ static operate<TVector extends IVector>(a: TVector, b: number, operation: TOperation): TVector
+ /** Performs the given binary operation on number a and vector b. Returns a vector of the same dimension as vector b. */
+ static operate<TVector extends IVector>(a: number, b: TVector, operation: TOperation): TVector
+ /** Performs the given binary operation on vectors a and b. They must have the same dimension. Returns a vector of the same dimension. */
+ static operate<TVector extends IVector>(a: TVector, b: TVector, operation: TOperation): TVector
+ /** Performs the given binary operation on numbers a and b. Returns a number. */
+ static operate(a: number, b: number, operation: TOperation): number
+
+ /** Adds vector a to number b. Returns a vector of the same dimension as vector a. */
+ static add<TVector extends IVector>(a: TVector, b: number): TVector
+ /** Adds number a to bector b. Returns a vector of the same dimension as vector b. */
+ static add<TVector extends IVector>(a: number, b: TVector): TVector
+ /** Adds vectors a to b. They must have the same dimension. Returns a vector of the same dimension. */
+ static add<TVector extends IVector>(a: TVector, b: TVector): TVector
+ /** Adds numbers a to b. Returns a number. */
+ static add(a: number, b: number): number
+
+ /** Subtracts number b from vector a. Returns a vector of the same dimension as vector a. */
+ static subtract<TVector extends IVector>(a: TVector, b: number): TVector
+ /** Subtracts vector b from number a. Returns a vector of the same dimension as vector b. */
+ static subtract<TVector extends IVector>(a: number, b: TVector): TVector
+ /** Subtracts vector b from vector a. They must have the same dimension. Returns a vector of the same dimension. */
+ static subtract<TVector extends IVector>(a: TVector, b: TVector): TVector
+ /** Subtracts number b from number a. Returns a number. */
+ static subtract(a: number, b: number): number
+
+ /** Multiplies vector a by number b. Returns a vector of the same dimension as vector a. */
+ static multiply<TVector extends IVector>(a: TVector, b: number): TVector
+ /** Multiplies number a by bector b. Returns a vector of the same dimension as vector b. */
+ static multiply<TVector extends IVector>(a: number, b: TVector): TVector
+ /** Multiplies vectors a and b. They must have the same dimension. Returns a vector of the same dimension. */
+ static multiply<TVector extends IVector>(a: TVector, b: TVector): TVector
+ /** Multiplies numbers a and b. Returns a number. */
+ static multiply(a: number, b: number): number
+
+ /** Returns the dot product of the two vectors. The vectors must have the same dimension. Returns a number. */
+ static dot<TVector>(vector1: TVector, vector2: TVector): number
 }
 
+declare type TOperation = (a: number, b: number) => number
+
 declare type IVector = Record<string, number>
 declare type IVector2 = { x: number, y: number }
 declare type IVector3 = { x: number, y: number, z: number }

package/src/parts/abstract/mesh/constants.js

@@ -1 +0,0 @@
-const mesh = this

package/src/parts/abstract/mesh/data-get.js

@@ -1,11 +0,0 @@
-const { points, tris } = mesh.manifest
-
-const data = { collision: [[], []] }
-
-for (let index = 0; index < points.length; index += 2)
- data.collision[0].push([Math.round(points[index]), 0, Math.round(points[index + 1])])
-
-for (let index = 0; index < tris.length; index += 3)
- data.collision[1].push([tris[index], tris[index + 1], tris[index + 2]])
-
-return data

package/src/parts/abstract/mesh/model_.js

@@ -1 +0,0 @@
-return { ...mesh.position }

package/src/parts/abstract/mesh/point-tri-that-contains.js

@@ -1,10 +0,0 @@
-// Check current tri first.
-if (mesh.triIndex !== -1 && mesh.triContainsPoint(mesh.triIndex, POINT))
- return mesh.triIndex
-
-// Check all tris. 
-for (let triIndex = 0; triIndex < mesh.triTable.length; triIndex++)
- if (triIndex !== mesh.triIndex && mesh.triContainsPoint(triIndex, POINT))
-  return triIndex
-
-return -1

package/src/parts/abstract/mesh/type.d.ts

@@ -1,109 +0,0 @@
-declare interface IMesh<TOwner>
- extends IPart<TOwner, null> {
-
- // Serialized Properties.
- readonly getData(): IMeshData
- /** Casts a ray from the current mesh position along the force vector direction for the given delta time and returns a summary of the results. @param FORCE_VECTOR the force vector represent the position the uninterrupted ray will arrive at in one second. @param DELTA_TIME the duration of the time cast in seconds. @param ENABLE_SLIDING whether or not to enable the ray to "wrap" along the mesh boundary instead of stopping cold. */
- readonly castRay(FORCE_VECTOR: IVector3, DELTA_TIME: number, ENABLE_SLIDING: boolean): IMeshRayCastResult
- /** Checks if a point (x, y, z) rounds to a valid pixel within the specified tri's memoized row data. */
- readonly triContainsPoint(TRI_INDEX: IMeshTriIndex, POINT: IVector3): boolean
- /** Returns whether or not the given point is in a tri. @returns the index of the tri that contains the point. -1 otherwise. */
- readonly triThatContainsPoint(POINT: IVector3): IMeshTriIndex
-
- // Runtime Properties.
- /** The memoization data of every tri in the mesh, stored by tri index at build-time. */
- readonly triTable: IMeshTriData[]
- /** The index of the current tri in the mesh. */
- readonly triIndex?: IMeshTriIndex
- /** The current position of the state in the mesh. */
- readonly position: IVector3
- readonly manifest: IMeshManifest
- /** A cache of the pre-processed geometry data obtained by running the getData method. */
- readonly data: IMeshData
-}
-
-declare interface IMeshRayCastResult {
- /** Whether or not the ray hit the mesh boundary. */
- readonly hit: boolean
- /** The tri the ray most recently occupied when it hit the boundary or the index of the boundary where the ray stopped if there is no hit. */
- readonly triIndex: IMeshTriIndex
- /** The rounded cell position where the cast ray landed. */
- readonly point: IVector3
- /** The force vector used to cast the ray, which might be different from the input if sliding is enabled as it may point along the direction of the most recent sliding iteration. */
- readonly forceVector: IVector3
-}
-
-declare interface IMeshTriData {
- /** The original point array of the tri as taken from `mesh.getData()`. */
- readonly points: IMeshTriPoints
- /** The z-axis range of the tri. */
- readonly zRange: {
-  /** The z position of the top-most row of the tri. */
-  readonly min: number
-  /** The z position of the bottom-most row of the tri. */
-  readonly max: number
- }
- /** The rows of pixels in the tri. */
- readonly rows: IMeshTriDataRow[]
- /** The offset of the tri in the overall mesh. */
- readonly offset: bigint
- /** The total number of pixels in the tri. */
- readonly cardinality: bigint
-}
-
-declare interface IMeshTriDataRow {
- /** The z position of this row of the tri's space. */
- readonly z: number
- /** The x-axis range of the row stored with the corresponding y-axis coordinate at those two points. */
- readonly xyRange: {
-  /** The smallest x position that is within the tri row. */
-  readonly min: {
-   readonly x: number,
-   readonly y: number
-  }
-  /** The largest x position that is within the tri row. */
-  readonly max: {
-   readonly x: number,
-   readonly y: number
-  }
- }
- /** The bigint offset of this row in the overall tri. */
- readonly offset: bigint
- /** The number of points in the given row. */
- readonly cardinality: bigint
-}
-
-
-declare interface IMeshManifest
- extends IPartManifest {
- /** The available collision vertices as a flat array of 2D coordinates. Used for defining the world's collision tris. */
- readonly points: number[],
- /** The list of collision tris, as a flat array of point triples. Used to define the walkable area of the world. */
- readonly tris: number[]
-}
-
-declare type IMeshData = {
- readonly collision: [IMeshPoint[], IMeshTri[]]
-}
-
-declare type IMeshTri =
- [IMeshPointIndex, IMeshPointIndex, IMeshPointIndex]
-
-declare type IMeshPointIndex =
- number
-
-declare type IMeshTriPoints =
- [IMeshPoint, IMeshPoint, IMeshPoint]
-
-declare type IMeshPoint =
- [x: number, y: number, z: number]
-
-declare type IMeshTriIndex =
- number
-
-declare type IMeshAny =
- IMesh<IPartAny>
-
-declare const mesh: IMeshAny
-
-declare const TRI: IMeshTriData