@vectoriox/iox-ui 5.76.1 → 5.78.0

package/src/harness-core/harness-spec.generated.ts

@@ -206,6 +206,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "subtle",
       "between": "cinematic"
     },
+    "ceiling": "expressive",
     "imagery": "Your own photos only, large and uncropped; never stock.",
     "pages": [
       "home",
@@ -310,6 +311,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "subtle",
       "between": "cinematic"
     },
+    "ceiling": "expressive",
     "imagery": "Wide, bright room shots; details of materials.",
     "pages": [
       "home",
@@ -419,6 +421,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "subtle",
       "between": "fade"
     },
+    "ceiling": "expressive",
     "imagery": "Large project photos and drawings.",
     "pages": [
       "home",
@@ -524,9 +527,10 @@ export const SPEC_BUSINESS_TYPES = [
     "motion": "standard",
     "moves": {
       "scroll": "smooth",
-      "animate": "lively",
+      "animate": "expressive",
       "between": "slide"
     },
+    "ceiling": "expressive",
     "imagery": "Case-study images of your own work.",
     "pages": [
       "home",
@@ -625,6 +629,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "standard",
       "between": "fade"
     },
+    "ceiling": "expressive",
     "imagery": "Your pieces, photographed flat and true to colour.",
     "pages": [
       "home",
@@ -726,9 +731,10 @@ export const SPEC_BUSINESS_TYPES = [
     "motion": "calm",
     "moves": {
       "scroll": "normal",
-      "animate": "lively",
+      "animate": "expressive",
       "between": "slide"
     },
+    "ceiling": "expressive",
     "imagery": "Your pieces and hands at work; natural light.",
     "pages": [
       "home",
@@ -826,6 +832,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "subtle",
       "between": "cinematic"
     },
+    "ceiling": "expressive",
     "imagery": "Close-ups on a plain ground.",
     "pages": [
       "home",
@@ -927,6 +934,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "standard",
       "between": "slide"
     },
+    "ceiling": "expressive",
     "imagery": "Healed work, clean photos.",
     "pages": [
       "home",
@@ -1022,6 +1030,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "subtle",
       "between": "fade"
     },
+    "ceiling": "standard",
     "imagery": "Rooms, textures, hands; no faces needed.",
     "pages": [
       "home",
@@ -1140,6 +1149,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "standard",
       "between": "fade"
     },
+    "ceiling": "lively",
     "imagery": "Your own before-and-after photos.",
     "pages": [
       "home",
@@ -1241,6 +1251,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "subtle",
       "between": "fade"
     },
+    "ceiling": "lively",
     "imagery": "The room, real classes, daylight.",
     "pages": [
       "home",
@@ -1350,6 +1361,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "lively",
       "between": "slide"
     },
+    "ceiling": "lively",
     "imagery": "Real people training; movement.",
     "pages": [
       "home",
@@ -1451,6 +1463,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "subtle",
       "between": "none"
     },
+    "ceiling": "subtle",
     "imagery": "A calm room, daylight; your portrait.",
     "pages": [
       "home",
@@ -1560,6 +1573,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "subtle",
       "between": "fade"
     },
+    "ceiling": "subtle",
     "imagery": "Your team and rooms; no stock doctors.",
     "pages": [
       "home",
@@ -1664,6 +1678,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "subtle",
       "between": "fade"
     },
+    "ceiling": "subtle",
     "imagery": "Your clinic and team.",
     "pages": [
       "home",
@@ -1769,6 +1784,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "standard",
       "between": "fade"
     },
+    "ceiling": "standard",
     "imagery": "Real animals you treat (with permission).",
     "pages": [
       "home",
@@ -1866,6 +1882,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "standard",
       "between": "fade"
     },
+    "ceiling": "expressive",
     "imagery": "Your own food and room photos.",
     "pages": [
       "home",
@@ -1974,6 +1991,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "standard",
       "between": "slide"
     },
+    "ceiling": "lively",
     "imagery": "Your bakes and drinks, close up.",
     "pages": [
       "home",
@@ -2076,6 +2094,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "subtle",
       "between": "cinematic"
     },
+    "ceiling": "expressive",
     "imagery": "The cellar, the bar, the bottle.",
     "pages": [
       "home",
@@ -2178,6 +2197,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "standard",
       "between": "slide"
     },
+    "ceiling": "expressive",
     "imagery": "Product photos on plain grounds; real people wearing them.",
     "pages": [
       "home",
@@ -2272,6 +2292,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "standard",
       "between": "fade"
     },
+    "ceiling": "lively",
     "imagery": "Your own arrangements in daylight.",
     "pages": [
       "home",
@@ -2367,6 +2388,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "subtle",
       "between": "fade"
     },
+    "ceiling": "expressive",
     "imagery": "Pieces in real rooms and on plain grounds.",
     "pages": [
       "home",
@@ -2463,6 +2485,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "subtle",
       "between": "fade"
     },
+    "ceiling": "standard",
     "imagery": "Your portrait; diagrams over stock.",
     "pages": [
       "home",
@@ -2563,6 +2586,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "standard",
       "between": "fade"
     },
+    "ceiling": "standard",
     "imagery": "Your portrait, working with people.",
     "pages": [
       "home",
@@ -2658,6 +2682,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "still",
       "between": "none"
     },
+    "ceiling": "subtle",
     "imagery": "Your team; your office.",
     "pages": [
       "home",
@@ -2767,6 +2792,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "standard",
       "between": "slide"
     },
+    "ceiling": "lively",
     "imagery": "Your own property photos; never stock.",
     "pages": [
       "home",
@@ -2871,6 +2897,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "standard",
       "between": "fade"
     },
+    "ceiling": "standard",
     "imagery": "Real people you help (with permission).",
     "pages": [
       "home",
@@ -2963,6 +2990,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "standard",
       "between": "cinematic"
     },
+    "ceiling": "expressive",
     "imagery": "Real events at your venue.",
     "pages": [
       "home",
@@ -3064,6 +3092,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "subtle",
       "between": "cinematic"
     },
+    "ceiling": "expressive",
     "imagery": "Rooms, views, breakfast; your own photos.",
     "pages": [
       "home",
@@ -3171,6 +3200,7 @@ export const SPEC_BUSINESS_TYPES = [
       "animate": "lively",
       "between": "slide"
     },
+    "ceiling": "lively",
     "imagery": "Real classes (with permission).",
     "pages": [
       "home",

package/src/harness-core/motion.ts

@@ -25,6 +25,8 @@ export interface MotionBasis {
     references: boolean;
     /** The owner asked for little movement: all three were capped. */
     littleMovement: boolean;
+    /** SC6: How animated was held at the type's ceiling (a law firm stays calm whatever the style or references). */
+    ceiling: boolean;
 }
 
 export interface MotionStart extends DesignMotion {
@@ -66,9 +68,14 @@ export function motionFor(
     const wanted = ref ?? base.animate;
     let out: DesignMotion = { scroll: base.scroll, animate: calmerChoice('animate', wanted, preset.moves.animate), between: base.between };
     const why = [type ? `${type.label}: ${triple(base)}` : `${preset.name}: the style's own`];
-    const basis: MotionBasis = { type: type?.id ?? null, calmerStyle: out.animate !== wanted, references: !!(ref && type), littleMovement: false };
+    const basis: MotionBasis = { type: type?.id ?? null, calmerStyle: out.animate !== wanted, references: !!(ref && type), littleMovement: false, ceiling: false };
     if (basis.calmerStyle) why.push(`${preset.name} moves less (${label('animate', preset.moves.animate)})`);
     if (basis.references) why.push(`your references: ${label('animate', ref!)}`);
+    if (type && calmerChoice('animate', out.animate, type.ceiling) !== out.animate) {
+        out = { ...out, animate: type.ceiling };
+        basis.ceiling = true;
+        why.push(`${type.label} goes no further than ${label('animate', type.ceiling)}`);
+    }
     if ((input.avoid ?? []).includes(LITTLE_MOVEMENT_AVOID)) {
         basis.littleMovement = true;
         out = {

package/src/media-core/frames.ts

@@ -42,8 +42,12 @@ export enum FrameExtension {
     Jpeg = 'jpg',
 }
 
-/** The most pictures one set may hold. Past this a phone runs out of memory before the visitor runs out of scroll. */
-export const MAX_FRAMES = 300;
+/**
+ * The most pictures one set may hold. A film's smoothness is its density, pictures per screen of scrolling: 210 over 18
+ * screens stepped on Doron's iPhone as a glide slowed, 1050 did not (2026-11-05). Memory is not what limits it: the player
+ * keeps the downloaded files (about 10 kB a phone picture) and only a window of them unpacked (`unpackedFrameCount`).
+ */
+export const MAX_FRAMES = 1200;
 /** The most one picture may weigh when uploaded. */
 export const MAX_FRAME_BYTES = 3 * 1024 * 1024;
 /** A sequence's name in storage: what the browser generates and what the server accepts in a key. */
@@ -206,10 +210,10 @@ export interface FrameSizes {
  *  tall stage by its height, so a picture sized to the phone's width would be enlarged five times. */
 export const WIDE_LONG_SIDE = 1600;
 export const PHONE_LONG_SIDE = 1100;
-/** How many pictures a second of video becomes, before the cap. */
-const VIDEO_FRAMES_PER_SECOND = 24;
-/** A video's cap: the pictures a scroll can show, at a weight a page can carry. A set of pictures is the author's own count. */
-const VIDEO_MAX_FRAMES = 180;
+/** How many pictures a second of video becomes, before the cap: what most recordings hold, so few are the same twice. */
+const VIDEO_FRAMES_PER_SECOND = 30;
+/** A video's cap: half a minute at that rate. A set of pictures is the author's own count, up to `MAX_FRAMES`. */
+const VIDEO_MAX_FRAMES = 900;
 
 /** `width`×`height` fitted inside `longSide`, never enlarged. */
 export function fittedFrameSize(width: number, height: number, longSide: number): FrameSizes {
@@ -229,11 +233,6 @@ export function sampledFrameIndexes(sourceCount: number, count: number): number[
     return Array.from({ length: count }, (_, i) => Math.round((i * (sourceCount - 1)) / (count - 1)));
 }
 
-/** A phone plays half the pictures: it has less memory, and half is plenty on a small screen. */
-export function phoneFrameCount(wideCount: number): number {
-    return Math.max(2, Math.ceil(wideCount / 2));
-}
-
 const NATURAL = new Intl.Collator('en', { numeric: true, sensitivity: 'base' });
 
 /** Rendered frames in their real order: `frame2` before `frame10`. */

package/src/scene-core/scene-edit.ts

@@ -238,6 +238,41 @@ export function sceneHeightForScreens(screens: number): string {
     return `${roundTo((held + 1) * 100, 1)}vh`;
 }
 
+/**
+ * Pictures per screen of scrolling at which a played film stays smooth as a glide slows to a stop. Measured on Doron's
+ * iPhone (2026-11-05): Studio Alma's film at about 11 a screen stepped, at about 55 it did not.
+ */
+export const SCENE_FILM_SMOOTH = 40;
+
+export interface SceneFilmDensity {
+    /** Pictures per screen of scrolling over most of the play: half its scroll holds at least this many. */
+    perScreen: number;
+    /** The screens of scrolling the film plays over; where it holds still is not counted. */
+    screens: number;
+    smooth: boolean;
+}
+
+/**
+ * How densely a film of `count` pictures plays on a Scene of `screens`, by its Play track; null when nothing plays. A
+ * film's smoothness is its density, never the drawing: spread thin, a slowing glide holds each picture for many refreshes.
+ */
+export function sceneFilmDensity(tracks: ReadonlyArray<SceneTrack> | null | undefined, screens: number | null, count: number): SceneFilmDensity | null {
+    const keys = normalizeTracks(tracks).find(track => track.prop === SceneProp.Play)?.keys ?? [];
+    if (count < 2 || !screens || screens <= 0) return null;
+    const stretches: { perScreen: number; screens: number }[] = [];
+    for (let i = 1; i < keys.length; i++) {
+        const scrolled = (keys[i][0] - keys[i - 1][0]) * screens;
+        const played = Math.abs(Number(keys[i][1]) - Number(keys[i - 1][1]));
+        if (scrolled > 0 && played > 0) stretches.push({ perScreen: ((played / 100) * (count - 1)) / scrolled, screens: scrolled });
+    }
+    if (!stretches.length) return null;
+    stretches.sort((a, b) => a.perScreen - b.perScreen);
+    const total = stretches.reduce((sum, stretch) => sum + stretch.screens, 0);
+    let covered = 0;
+    const typical = stretches.find(stretch => (covered += stretch.screens) >= total / 2)!;
+    return { perScreen: Math.round(typical.perScreen), screens: roundTo(total, 1), smooth: typical.perScreen >= SCENE_FILM_SMOOTH };
+}
+
 /** Motion v2 §3d's limits for scroll-linked work on one page. */
 export const SCENE_BUDGET = { heldSections: 1, movingLayers: 8 } as const;