cubing 0.20.2 → 0.21.0-pre12

package/src/cubing/twisty/model/props/puzzle/state/CurrentLeavesProp.ts

@@ -0,0 +1,91 @@
+import { Move } from "../../../../../alg";
+import { Direction } from "../../../../old/animation/cursor/CursorTypes";
+import type {
+  AlgIndexer,
+  CurrentMoveInfo,
+} from "../../../../old/animation/indexer/AlgIndexer";
+import type { DetailedTimelineInfo } from "../../timeline/DetailedTimelineInfoProp";
+import { TwistyPropDerived } from "../../TwistyProp";
+
+interface PositionPropInputs {
+  indexer: AlgIndexer<any>;
+  detailedTimelineInfo: DetailedTimelineInfo;
+}
+
+// TODO: Rename "current" (implies a single one) to "active"?
+export class CurrentLeavesProp extends TwistyPropDerived<
+  PositionPropInputs,
+  CurrentMoveInfo
+> {
+  derive(inputs: PositionPropInputs): CurrentMoveInfo {
+    // Copied from AlgCursor
+    if (inputs.indexer.currentMoveInfo) {
+      return inputs.indexer.currentMoveInfo(
+        inputs.detailedTimelineInfo.timestamp,
+      );
+    } else {
+      const idx = inputs.indexer.timestampToIndex(
+        inputs.detailedTimelineInfo.timestamp,
+      );
+      const currentMoveInfo: CurrentMoveInfo = {
+        stateIndex: idx,
+        currentMoves: [],
+        movesFinishing: [],
+        movesFinished: [],
+        movesStarting: [],
+        latestStart: -Infinity,
+        earliestEnd: Infinity,
+      };
+
+      if (inputs.indexer.numAnimatedLeaves() > 0) {
+        const move = inputs.indexer.getAnimLeaf(idx)?.as(Move);
+        if (!move) {
+          return currentMoveInfo;
+        }
+        const start = inputs.indexer.indexToMoveStartTimestamp(idx);
+        const duration = inputs.indexer.moveDuration(idx);
+        const fraction =
+          (inputs.detailedTimelineInfo.timestamp - start) / duration;
+        const end = start + duration;
+        const currentMove = {
+          move,
+          direction: Direction.Forwards,
+          fraction,
+          startTimestamp: start,
+          endTimestamp: end,
+        };
+        if (fraction === 0) {
+          currentMoveInfo.movesStarting.push(currentMove);
+          // // TODO: push this into the indexer
+          // position.state = combineTransformations(
+          //   inputs.def,
+          //   state,
+          //   transformationForMove(inputs.def, move),
+          // ) as Transformation;
+        } else if (fraction === 1) {
+          currentMoveInfo.movesFinishing.push(currentMove);
+          // // TODO: push this into the indexer
+          // position.state = combineTransformations(
+          //   inputs.def,
+          //   state,
+          //   transformationForMove(inputs.def, move),
+          // ) as Transformation;
+        } else {
+          // TODO
+          currentMoveInfo.currentMoves.push(currentMove);
+          currentMoveInfo.latestStart = Math.max(
+            currentMoveInfo.latestStart,
+            start,
+          );
+          currentMoveInfo.earliestEnd = Math.min(
+            currentMoveInfo.earliestEnd,
+            end,
+          );
+        }
+        // }
+        // }
+      }
+      return currentMoveInfo;
+    }
+  }
+}

package/src/cubing/twisty/model/props/puzzle/state/CurrentLeavesSimplified.ts

@@ -0,0 +1,48 @@
+import type { Move } from "../../../../../alg";
+import type { CurrentMoveInfo } from "../../../../old/animation/indexer/AlgIndexer";
+import { arrayEqualsCompare } from "../../../helpers";
+import { TwistyPropDerived } from "../../TwistyProp";
+
+interface CurrentLeavesSimplifiedPropInputs {
+  currentMoveInfo: CurrentMoveInfo;
+}
+
+export interface CurrentLeavesSimplified {
+  stateIndex: number;
+  movesFinishing: Move[];
+  movesFinished: Move[];
+}
+
+// This started as a version of `CurrentLeaves` without highly timestamp-sensitive info like fractions, to enable easier caching.
+export class CurrentLeavesSimplifiedProp extends TwistyPropDerived<
+  CurrentLeavesSimplifiedPropInputs,
+  CurrentLeavesSimplified
+> {
+  derive(inputs: CurrentLeavesSimplifiedPropInputs): CurrentLeavesSimplified {
+    return {
+      stateIndex: inputs.currentMoveInfo.stateIndex,
+      movesFinishing: inputs.currentMoveInfo.movesFinishing.map(
+        (currentMoveInfo) => currentMoveInfo.move,
+      ),
+      movesFinished: inputs.currentMoveInfo.movesFinished.map(
+        (currentMoveInfo) => currentMoveInfo.move,
+      ),
+    };
+  }
+
+  canReuse(v1: CurrentLeavesSimplified, v2: CurrentLeavesSimplified): boolean {
+    return (
+      v1.stateIndex === v2.stateIndex &&
+      arrayEqualsCompare(
+        v1.movesFinishing,
+        v2.movesFinishing,
+        (m1: Move, m2: Move) => m1.isIdentical(m2),
+      ) &&
+      arrayEqualsCompare(
+        v1.movesFinished,
+        v2.movesFinished,
+        (m1: Move, m2: Move) => m1.isIdentical(m2),
+      )
+    );
+  }
+}

package/src/cubing/twisty/model/props/puzzle/state/CurrentTransformationProp.ts

@@ -0,0 +1,46 @@
+import { KSolvePuzzle } from "../../../..";
+import {
+  combineTransformations,
+  KPuzzleDefinition,
+  Transformation,
+} from "../../../../../kpuzzle";
+import type { AlgIndexer } from "../../../../old/animation/indexer/AlgIndexer";
+import type { CurrentLeavesSimplified } from "./CurrentLeavesSimplified";
+import { TwistyPropDerived } from "../../TwistyProp";
+
+interface CurrentTransformationPropInputs {
+  anchoredStart: Transformation;
+  currentLeavesSimplified: CurrentLeavesSimplified;
+  indexer: AlgIndexer<any>;
+  def: KPuzzleDefinition;
+}
+
+// TODO: Make this so we don't have to handle the finishing moves?
+export class CurrentTransformationProp extends TwistyPropDerived<
+  CurrentTransformationPropInputs,
+  Transformation
+> {
+  derive(inputs: CurrentTransformationPropInputs): Transformation {
+    let state: Transformation = inputs.indexer.transformAtIndex(
+      inputs.currentLeavesSimplified.stateIndex,
+    ) as any;
+    state = combineTransformations(inputs.def, inputs.anchoredStart, state);
+    const ksolvePuzzle = new KSolvePuzzle(inputs.def); // TODO: put this elsewhere.
+    // TODO: handle non-commutative finished/finishing/current moves.
+    for (const finishingMove of inputs.currentLeavesSimplified.movesFinishing) {
+      state = combineTransformations(
+        inputs.def,
+        state,
+        ksolvePuzzle.stateFromMove(finishingMove),
+      );
+    }
+    for (const finishedMove of inputs.currentLeavesSimplified.movesFinished) {
+      state = combineTransformations(
+        inputs.def,
+        state,
+        ksolvePuzzle.stateFromMove(finishedMove),
+      );
+    }
+    return state;
+  }
+}

package/src/cubing/twisty/model/props/puzzle/state/IndexerConstructorProp.ts

@@ -0,0 +1,46 @@
+import { countMoves } from "../../../../../notation";
+import type { IndexerConstructor } from "../../../../old/animation/cursor/AlgCursor";
+import { SimpleAlgIndexer } from "../../../../old/animation/indexer/SimpleAlgIndexer";
+import { SimultaneousMoveIndexerV2 } from "../../../../old/animation/indexer/simultaneous-moves/SimultaneousMoveIndexerV2";
+import { TreeAlgIndexer } from "../../../../old/animation/indexer/tree/TreeAlgIndexer";
+import type { PuzzleID } from "../../../../old/dom/TwistyPlayerConfig";
+import type { AlgWithIssues } from "./AlgProp";
+import type { IndexerStrategyName } from "./IndexerConstructorRequestProp";
+import type { VisualizationStrategy } from "../../viewer/VisualizationStrategyProp";
+import { TwistyPropDerived } from "../../TwistyProp";
+
+interface IndexerConstructorPropInputs {
+  puzzle: PuzzleID;
+  alg: AlgWithIssues;
+  visualizationStrategy: VisualizationStrategy;
+  indexerConstructorRequest: IndexerStrategyName;
+}
+
+// TODO: Also handle PG3D vs. 3D
+export class IndexerConstructorProp extends TwistyPropDerived<
+  IndexerConstructorPropInputs,
+  IndexerConstructor
+> {
+  derive(inputs: IndexerConstructorPropInputs): IndexerConstructor {
+    switch (inputs.indexerConstructorRequest) {
+      case "auto":
+        if (
+          countMoves(inputs.alg.alg) < 100 &&
+          inputs.puzzle === "3x3x3" &&
+          inputs.visualizationStrategy === "Cube3D"
+        ) {
+          return SimultaneousMoveIndexerV2;
+        } else {
+          return TreeAlgIndexer;
+        }
+      case "tree":
+        return TreeAlgIndexer;
+      case "simple":
+        return SimpleAlgIndexer;
+      case "simultaneous":
+        return SimultaneousMoveIndexerV2;
+      default:
+        throw new Error("Invalid indexer request!");
+    }
+  }
+}

package/src/cubing/twisty/model/props/puzzle/state/IndexerConstructorRequestProp.ts

@@ -0,0 +1,15 @@
+import { SimpleTwistyPropSource } from "../../TwistyProp";
+
+export const indexerStrategyNames = {
+  auto: true,
+  simple: true,
+  tree: true,
+  simultaneous: true,
+};
+export type IndexerStrategyName = keyof typeof indexerStrategyNames;
+
+export class IndexerConstructorRequestProp extends SimpleTwistyPropSource<IndexerStrategyName> {
+  getDefaultValue(): IndexerStrategyName {
+    return "auto";
+  }
+}

package/src/cubing/twisty/model/props/puzzle/state/IndexerProp.ts

@@ -0,0 +1,24 @@
+import type { KPuzzleDefinition } from "../../../../../kpuzzle";
+import { KPuzzleWrapper } from "../../../../views/3D/puzzles/KPuzzleWrapper";
+import type { IndexerConstructor } from "../../../../old/animation/cursor/AlgCursor";
+import type { AlgIndexer } from "../../../../old/animation/indexer/AlgIndexer";
+import type { AlgWithIssues } from "./AlgProp";
+import { TwistyPropDerived } from "../../TwistyProp";
+
+type IndexerPropInputs = {
+  indexerConstructor: IndexerConstructor;
+  algWithIssues: AlgWithIssues;
+  def: KPuzzleDefinition;
+};
+export class IndexerProp extends TwistyPropDerived<
+  IndexerPropInputs,
+  AlgIndexer<any>
+> {
+  derive(input: IndexerPropInputs): AlgIndexer<any> {
+    const kpuzzleWrapper = new KPuzzleWrapper(input.def); // TODO: Remove this layer.
+    return new input.indexerConstructor(
+      kpuzzleWrapper,
+      input.algWithIssues.alg,
+    );
+  }
+}

package/src/cubing/twisty/model/props/puzzle/state/LegacyPositionProp.ts

@@ -0,0 +1,22 @@
+import type { Transformation } from "../../../../../kpuzzle";
+import type { PuzzlePosition } from "../../../../old/animation/cursor/CursorTypes";
+import type { CurrentMoveInfo } from "../../../../old/animation/indexer/AlgIndexer";
+import { TwistyPropDerived } from "../../TwistyProp";
+
+export interface LegacyPositionPropInputs {
+  currentMoveInfo: CurrentMoveInfo;
+  transformation: Transformation;
+}
+
+// TODO: This exist as a convenience for old `Twisty3D` implementations. Get rid of this.
+export class LegacyPositionProp extends TwistyPropDerived<
+  LegacyPositionPropInputs,
+  PuzzlePosition
+> {
+  derive(inputs: LegacyPositionPropInputs): PuzzlePosition {
+    return {
+      state: inputs.transformation,
+      movesInProgress: inputs.currentMoveInfo.currentMoves,
+    };
+  }
+}

package/src/cubing/twisty/model/props/puzzle/state/PuzzleAlgProp.ts

@@ -0,0 +1,28 @@
+import { Alg } from "../../../../../alg";
+import { KPuzzle, KPuzzleDefinition } from "../../../../../kpuzzle";
+import { AlgIssues, AlgWithIssues } from "./AlgProp";
+import { TwistyPropDerived } from "../../TwistyProp";
+
+export class PuzzleAlgProp extends TwistyPropDerived<
+  { algWithIssues: AlgWithIssues; puzzleDef: KPuzzleDefinition },
+  AlgWithIssues
+> {
+  async derive(inputs: {
+    algWithIssues: AlgWithIssues;
+    puzzleDef: KPuzzleDefinition;
+  }): Promise<AlgWithIssues> {
+    try {
+      const kpuzzle = new KPuzzle(inputs.puzzleDef);
+      kpuzzle.applyAlg(inputs.algWithIssues.alg);
+      // Looks like we could apply the alg!
+      return inputs.algWithIssues;
+    } catch (e) {
+      return {
+        alg: new Alg(),
+        issues: new AlgIssues({
+          errors: [`Invalid alg for puzzle: ${(e as Error).toString()}`],
+        }),
+      };
+    }
+  }
+}

package/src/cubing/twisty/model/props/puzzle/state/SetupAnchorProp.ts

@@ -0,0 +1,8 @@
+import type { SetupToLocation } from "../../../../old/dom/TwistyPlayerConfig";
+import { SimpleTwistyPropSource } from "../../TwistyProp";
+
+export class SetupAnchorProp extends SimpleTwistyPropSource<SetupToLocation> {
+  getDefaultValue(): SetupToLocation {
+    return "start";
+  }
+}

package/src/cubing/twisty/model/props/puzzle/structure/PuzzleDefProp.ts

@@ -0,0 +1,14 @@
+import type { KPuzzleDefinition } from "../../../../../kpuzzle";
+import type { PuzzleLoader } from "../../../../../puzzles";
+import { TwistyPropDerived } from "../../TwistyProp";
+
+export class PuzzleDefProp extends TwistyPropDerived<
+  { puzzleLoader: PuzzleLoader },
+  KPuzzleDefinition
+> {
+  async derive(inputs: {
+    puzzleLoader: PuzzleLoader;
+  }): Promise<KPuzzleDefinition> {
+    return inputs.puzzleLoader.def();
+  }
+}

package/src/cubing/twisty/model/props/puzzle/structure/PuzzleDescriptionProp.ts

@@ -0,0 +1,14 @@
+import type { PuzzleDescriptionString } from "../../../../../puzzle-geometry/PGPuzzles";
+import {
+  NoValueType,
+  NO_VALUE,
+  SimpleTwistyPropSource,
+} from "../../TwistyProp";
+
+export class PGPuzzleDescriptionStringProp extends SimpleTwistyPropSource<
+  PuzzleDescriptionString | NoValueType
+> {
+  getDefaultValue(): PuzzleDescriptionString | NoValueType {
+    return NO_VALUE;
+  }
+}

package/src/cubing/twisty/model/props/puzzle/structure/PuzzleIDProp.ts

@@ -0,0 +1,12 @@
+import type { PuzzleLoader } from "../../../../../puzzles";
+import type { PuzzleID } from "../../../../old/dom/TwistyPlayerConfig";
+import { TwistyPropDerived } from "../../TwistyProp";
+
+export class PuzzleIDProp extends TwistyPropDerived<
+  { puzzleLoader: PuzzleLoader },
+  PuzzleID
+> {
+  async derive(inputs: { puzzleLoader: PuzzleLoader }): Promise<PuzzleID> {
+    return inputs.puzzleLoader.id as PuzzleID;
+  }
+}

package/src/cubing/twisty/model/props/puzzle/structure/PuzzleIDRequestProp.ts

@@ -0,0 +1,17 @@
+import type { PuzzleID } from "../../../../old/dom/TwistyPlayerConfig";
+import {
+  NoValueType,
+  NO_VALUE,
+  SimpleTwistyPropSource,
+} from "../../TwistyProp";
+
+// TODO: Ideally we'd use `null` to mean "no value", but `null` has a special meaning
+// for `TwistyProp` and might mess with caching.
+// https://github.com/cubing/cubing.js/blob/63b0a55b83963f68410bb117a2e481052a07e086/src/cubing/twisty/model/TwistyProp.ts#L189-L189
+export class PuzzleIDRequestProp extends SimpleTwistyPropSource<
+  PuzzleID | NoValueType
+> {
+  getDefaultValue(): PuzzleID | NoValueType {
+    return NO_VALUE;
+  }
+}

package/src/cubing/twisty/model/props/puzzle/structure/PuzzleLoaderProp.ts

@@ -0,0 +1,38 @@
+import type { PuzzleDescriptionString } from "../../../../../puzzle-geometry/PGPuzzles";
+import {
+  cube3x3x3,
+  experimentalCustomPGPuzzleLoader,
+  PuzzleLoader,
+  puzzles,
+} from "../../../../../puzzles";
+import type { PuzzleID } from "../../../../old/dom/TwistyPlayerConfig";
+import { NoValueType, NO_VALUE, TwistyPropDerived } from "../../TwistyProp";
+8;
+interface PuzzleLoaderPropInputs {
+  puzzleIDRequest: PuzzleID | NoValueType;
+  puzzleDescriptionRequest: PuzzleDescriptionString | NoValueType;
+}
+
+export class PuzzleLoaderProp extends TwistyPropDerived<
+  PuzzleLoaderPropInputs,
+  PuzzleLoader
+> {
+  derive(inputs: PuzzleLoaderPropInputs): PuzzleLoader {
+    if (inputs.puzzleIDRequest && inputs.puzzleIDRequest !== NO_VALUE) {
+      const puzzleLoader = puzzles[inputs.puzzleIDRequest];
+      if (!puzzleLoader) {
+        this.userVisibleErrorTracker!.set({
+          errors: [`Invalid puzzle ID: ${inputs.puzzleIDRequest}`],
+        });
+      }
+      return puzzleLoader;
+    }
+    if (
+      inputs.puzzleDescriptionRequest &&
+      inputs.puzzleDescriptionRequest !== NO_VALUE
+    ) {
+      return experimentalCustomPGPuzzleLoader(inputs.puzzleDescriptionRequest);
+    }
+    return cube3x3x3;
+  }
+}

package/src/cubing/twisty/model/props/timeline/CoarseTimelineInfoProp.ts

@@ -0,0 +1,45 @@
+import type { ButtonCommand } from "../../../views/control-panel/TwistyButtonsV2";
+import type { PlayingInfo } from "./PlayingInfoProp";
+import type { DetailedTimelineInfo } from "./DetailedTimelineInfoProp";
+import { TwistyPropDerived } from "../TwistyProp";
+
+interface ButtonAppearance {
+  enabled: boolean;
+  icon: string;
+  title: string;
+}
+export type ButtonAppearances = Record<ButtonCommand, ButtonAppearance>;
+
+interface CoarseTimelineInfoInputs {
+  playingInfo: PlayingInfo;
+  detailedTimelineInfo: DetailedTimelineInfo;
+}
+
+export interface CoarseTimelineInfo {
+  playing: boolean;
+  atStart: boolean;
+  atEnd: boolean;
+}
+
+// This started as a version of `EffectiveTimestamp` without the actual
+// timestamp, to enable easier caching.
+export class CoarseTimelineInfoProp extends TwistyPropDerived<
+  CoarseTimelineInfoInputs,
+  CoarseTimelineInfo
+> {
+  derive(inputs: CoarseTimelineInfoInputs): CoarseTimelineInfo {
+    return {
+      playing: inputs.playingInfo.playing,
+      atStart: inputs.detailedTimelineInfo.atStart,
+      atEnd: inputs.detailedTimelineInfo.atEnd,
+    };
+  }
+
+  canReuseValue(v1: CoarseTimelineInfo, v2: CoarseTimelineInfo): boolean {
+    return (
+      v1.playing === v2.playing &&
+      v1.atStart === v2.atStart &&
+      v1.atEnd === v2.atEnd
+    );
+  }
+}

package/src/cubing/twisty/model/props/timeline/DetailedTimelineInfoProp.ts

@@ -0,0 +1,76 @@
+import type { TimeRange } from "../../../old/animation/cursor/AlgCursor";
+import type { MillisecondTimestamp } from "../../../old/animation/cursor/CursorTypes";
+import type { SetupToLocation } from "../../../old/dom/TwistyPlayerConfig";
+import type { TimestampRequest } from "./TimestampRequestProp";
+import { TwistyPropDerived } from "../TwistyProp";
+
+interface DetailedTimelineInfoInputs {
+  timestampRequest: TimestampRequest;
+  timeRange: TimeRange;
+  setupAnchor: SetupToLocation;
+}
+
+export interface DetailedTimelineInfo {
+  timestamp: MillisecondTimestamp;
+  timeRange: TimeRange; // TODO: Don't incluede this, and let fresh listeners listen to multiple inputs?
+  // Note: `atStart` and `atEnd` can both be true. This is the case with the
+  // default (empty) alg, which has a duration of 0 ms.
+  atStart: boolean;
+  atEnd: boolean;
+}
+
+export class DetailedTimelineInfoProp extends TwistyPropDerived<
+  DetailedTimelineInfoInputs,
+  DetailedTimelineInfo
+> {
+  derive(inputs: DetailedTimelineInfoInputs): DetailedTimelineInfo {
+    let timestamp = this.#requestedTimestampToMilliseconds(inputs);
+    let atStart: boolean = false;
+    let atEnd: boolean = false;
+    if (timestamp >= inputs.timeRange.end) {
+      atEnd = true;
+      timestamp = Math.min(inputs.timeRange.end, timestamp);
+    }
+    if (timestamp <= inputs.timeRange.start) {
+      atStart = true;
+      timestamp = Math.max(inputs.timeRange.start, timestamp);
+    }
+    return {
+      timestamp,
+      timeRange: inputs.timeRange,
+      atStart,
+      atEnd,
+    };
+  }
+
+  #requestedTimestampToMilliseconds(
+    inputs: DetailedTimelineInfoInputs,
+  ): MillisecondTimestamp {
+    switch (inputs.timestampRequest) {
+      case "start":
+        return inputs.timeRange.start;
+      case "end":
+        return inputs.timeRange.end;
+      case "anchor":
+        return inputs.setupAnchor === "start"
+          ? inputs.timeRange.start
+          : inputs.timeRange.end;
+      case "opposite-anchor":
+        return inputs.setupAnchor === "start"
+          ? inputs.timeRange.end
+          : inputs.timeRange.start;
+      default:
+        return inputs.timestampRequest;
+    }
+  }
+
+  canReuse(v1: DetailedTimelineInfo, v2: DetailedTimelineInfo) {
+    return (
+      v1.timestamp === v2.timestamp &&
+      v1.timeRange.start === v2.timeRange.start &&
+      v1.timeRange.end === v2.timeRange.end &&
+      v1.atStart === v2.atStart &&
+      v1.atEnd === v2.atEnd
+    );
+  }
+}

package/src/cubing/twisty/model/props/timeline/PlayingInfoProp.ts

@@ -0,0 +1,51 @@
+import {
+  BoundaryType,
+  Direction,
+} from "../../../old/animation/cursor/CursorTypes";
+import { TwistyPropSource } from "../TwistyProp";
+
+export type SimpleDirection = Direction.Forwards | Direction.Backwards;
+
+export interface PlayingInfo {
+  playing: boolean;
+  direction: SimpleDirection;
+  untilBoundary: BoundaryType; // TODO: allows this to be optional in the setter?
+  // TODO: Is `loop` responsible to add at this point? Maybe we should wait until we've figured out autoplay?
+  // TODO: Combine `loop` into something with BoundaryType?
+  loop: boolean;
+}
+
+// TODO: direction,
+export class PlayingInfoProp extends TwistyPropSource<
+  PlayingInfo,
+  Partial<PlayingInfo>
+> {
+  async getDefaultValue(): Promise<PlayingInfo> {
+    return {
+      direction: Direction.Forwards,
+      playing: false,
+      untilBoundary: BoundaryType.EntireTimeline,
+      loop: false,
+    };
+  }
+
+  async derive(
+    newInfo: Partial<PlayingInfo>,
+    oldValuePromise: Promise<PlayingInfo>,
+  ): Promise<PlayingInfo> {
+    const oldValue = await oldValuePromise;
+
+    const newValue: PlayingInfo = Object.assign({}, oldValue);
+    Object.assign(newValue, newInfo);
+    return newValue;
+  }
+
+  canReuseValue(v1: PlayingInfo, v2: PlayingInfo) {
+    return (
+      v1.direction === v2.direction &&
+      v1.playing === v2.playing &&
+      v1.untilBoundary === v2.untilBoundary &&
+      v1.loop === v2.loop
+    );
+  }
+}

package/src/cubing/twisty/model/props/timeline/TempoScaleProp.ts

@@ -0,0 +1,13 @@
+import { TwistyPropSource } from "../TwistyProp";
+
+// TODO: Pick a better name. `speed` is probably good, although that could mean
+// something else (e.g. shorter, faster moves but still with the same spacing).
+export class TempoScaleProp extends TwistyPropSource<number, number> {
+  getDefaultValue(): number {
+    return 1;
+  }
+
+  derive(v: number): number {
+    return v < 0 ? 1 : v;
+  }
+}

package/src/cubing/twisty/model/props/timeline/TimestampRequestProp.ts

@@ -0,0 +1,38 @@
+import type { MillisecondTimestamp } from "../../../old/animation/cursor/CursorTypes";
+import { SimpleTwistyPropSource } from "../TwistyProp";
+
+const smartTimestamps = {
+  "start": true,
+  "end": true,
+  "anchor": true,
+  "opposite-anchor": true,
+};
+
+export type TimestampRequest =
+  | MillisecondTimestamp
+  | keyof typeof smartTimestamps;
+
+export class TimestampRequestProp extends SimpleTwistyPropSource<TimestampRequest> {
+  getDefaultValue(): TimestampRequest {
+    return "opposite-anchor";
+  }
+
+  // TODO: Support `Promise`
+  set(v: TimestampRequest) {
+    if (!this.validInput(v)) {
+      // TODO: Generalize this to more props. How do we surface this? Throw an error and catch it from sync setters that call into this?
+      return;
+    }
+    super.set(v);
+  }
+
+  validInput(v: TimestampRequest): boolean {
+    if (typeof v === "number") {
+      return true;
+    }
+    if (smartTimestamps[v]) {
+      return true;
+    }
+    return false;
+  }
+}

package/src/cubing/twisty/model/props/viewer/BackViewProp.ts

@@ -0,0 +1,10 @@
+import type { BackViewLayout } from "../../../old/dom/viewers/TwistyViewerWrapper";
+import { SimpleTwistyPropSource } from "../TwistyProp";
+
+export type BackViewLayoutWithAuto = BackViewLayout | "auto";
+
+export class BackViewProp extends SimpleTwistyPropSource<BackViewLayoutWithAuto> {
+  getDefaultValue(): BackViewLayoutWithAuto {
+    return "auto";
+  }
+}