cubing 0.23.0 → 0.24.0-pre1

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

@@ -1,48 +0,0 @@
-import { BoundaryType, Direction } from "../../../controllers/AnimationTypes";
-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

@@ -1,13 +0,0 @@
-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

@@ -1,38 +0,0 @@
-import type { MillisecondTimestamp } from "../../../controllers/AnimationTypes";
-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

@@ -1,16 +0,0 @@
-import { SimpleTwistyPropSource } from "../TwistyProp";
-
-export const backViewLayouts = {
-  "none": true, // default
-  "side-by-side": true,
-  "top-right": true,
-};
-export type BackViewLayout = keyof typeof backViewLayouts;
-
-export type BackViewLayoutWithAuto = BackViewLayout | "auto";
-
-export class BackViewProp extends SimpleTwistyPropSource<BackViewLayoutWithAuto> {
-  getDefaultValue(): BackViewLayoutWithAuto {
-    return "auto";
-  }
-}

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

@@ -1,15 +0,0 @@
-import { SimpleTwistyPropSource } from "../TwistyProp";
-
-export const backgroundThemes = {
-  checkered: true, // default
-  none: true,
-};
-export type BackgroundTheme = keyof typeof backgroundThemes;
-
-export type BackgroundThemeWithAuto = BackgroundTheme | "auto";
-
-export class BackgroundProp extends SimpleTwistyPropSource<BackgroundThemeWithAuto> {
-  getDefaultValue(): BackgroundThemeWithAuto {
-    return "auto";
-  }
-}

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

@@ -1,86 +0,0 @@
-import type { ButtonCommand } from "../../../views/control-panel/TwistyButtonsV2";
-import { fullscreenEnabled } from "../../../views/control-panel/webkit-fullscreen";
-import type { ViewerLinkPageWithAuto } from "./ViewerLinkProp";
-import type { CoarseTimelineInfo as CoarseTimelineInfo } from "../timeline/CoarseTimelineInfoProp";
-import { TwistyPropDerived } from "../TwistyProp";
-
-export const buttonIcons = [
-  "skip-to-start",
-  "skip-to-end",
-  "step-forward",
-  "step-backward",
-  "pause",
-  "play",
-  "enter-fullscreen",
-  "exit-fullscreen",
-  "twizzle-tw",
-];
-export type ButtonIcon = typeof buttonIcons[number];
-
-interface ButtonAppearance {
-  enabled: boolean;
-  icon: ButtonIcon;
-  title: string;
-  hidden?: boolean;
-}
-export type ButtonAppearances = Record<ButtonCommand, ButtonAppearance>;
-
-// TODO: reduce inputs to avoid unnecessary updates.
-interface ButtonAppearancePropInputs {
-  coarseTimelineInfo: CoarseTimelineInfo;
-  viewerLink: ViewerLinkPageWithAuto;
-}
-
-export class ButtonAppearanceProp extends TwistyPropDerived<
-  ButtonAppearancePropInputs,
-  ButtonAppearances
-> {
-  // TODO: This still seems to fire twice for play/pause?
-  derive(inputs: ButtonAppearancePropInputs): ButtonAppearances {
-    const buttonAppearances = {
-      "fullscreen": {
-        // TODO: Cache?// TODO: Cache?
-        enabled: fullscreenEnabled,
-        icon:
-          // TODO: Check against the expected element?
-          // TODO: This will *not* update when we enter/leave fullscreen. We need to work more closely with the controller.
-          document.fullscreenElement === null
-            ? "enter-fullscreen"
-            : "exit-fullscreen",
-        title: "Enter fullscreen",
-      },
-      "jump-to-start": {
-        enabled: !inputs.coarseTimelineInfo.atStart,
-        icon: "skip-to-start",
-        title: "Restart",
-      },
-      "play-step-backwards": {
-        enabled: !inputs.coarseTimelineInfo.atStart,
-        icon: "step-backward",
-        title: "Step backward",
-      },
-      "play-pause": {
-        enabled: true,
-        icon: inputs.coarseTimelineInfo.playing ? "pause" : "play",
-        title: inputs.coarseTimelineInfo.playing ? "Pause" : "Play",
-      },
-      "play-step": {
-        enabled: !inputs.coarseTimelineInfo.atEnd,
-        icon: "step-forward",
-        title: "Step forward",
-      },
-      "jump-to-end": {
-        enabled: !inputs.coarseTimelineInfo.atEnd,
-        icon: "skip-to-end",
-        title: "Skip to End",
-      },
-      "twizzle-link": {
-        enabled: true,
-        icon: "twizzle-tw",
-        title: "View at Twizzle",
-        hidden: inputs.viewerLink === "none",
-      },
-    };
-    return buttonAppearances;
-  }
-}

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

@@ -1,14 +0,0 @@
-import { SimpleTwistyPropSource } from "../TwistyProp";
-
-export const controlsLocations = {
-  "bottom-row": true, // default
-  "none": true,
-};
-export type ControlsLocation = keyof typeof controlsLocations;
-export type ControlPanelThemeWithAuto = ControlsLocation | "auto";
-
-export class ControlPanelProp extends SimpleTwistyPropSource<ControlPanelThemeWithAuto> {
-  getDefaultValue(): ControlPanelThemeWithAuto {
-    return "auto";
-  }
-}

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

@@ -1,11 +0,0 @@
-import { SimpleTwistyPropSource } from "../TwistyProp";
-import type { CoordinateDegrees } from "./OrbitCoordinatesRequestProp";
-
-// Similar to https://alg.cubing.net/
-const DEFAULT_LATITUDE_LIMIT = 35;
-
-export class LatitudeLimitProp extends SimpleTwistyPropSource<CoordinateDegrees> {
-  getDefaultValue(): CoordinateDegrees {
-    return DEFAULT_LATITUDE_LIMIT;
-  }
-}

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

@@ -1,127 +0,0 @@
-import { DEGREES_PER_RADIAN } from "../../../views/3D/TAU";
-import type { PuzzleID } from "../puzzle/structure/PuzzleIDRequestProp";
-import { TwistyPropDerived } from "../TwistyProp";
-import {
-  CoordinateDegrees,
-  OrbitCoordinates,
-  orbitCoordinatesEqual,
-  OrbitCoordinatesRequest,
-} from "./OrbitCoordinatesRequestProp";
-import type { VisualizationStrategy } from "./VisualizationStrategyProp";
-
-interface OrbitCoordinatesPropInputs {
-  orbitCoordinatesRequest: OrbitCoordinatesRequest;
-  latitudeLimit: CoordinateDegrees;
-  puzzleID: PuzzleID;
-  strategy: VisualizationStrategy;
-}
-
-export class OrbitCoordinatesProp extends TwistyPropDerived<
-  OrbitCoordinatesPropInputs,
-  OrbitCoordinates
-> {
-  canReuseValue(v1: OrbitCoordinates, v2: OrbitCoordinates) {
-    return orbitCoordinatesEqual(v1, v2);
-  }
-
-  async derive(inputs: OrbitCoordinatesPropInputs): Promise<OrbitCoordinates> {
-    if (inputs.orbitCoordinatesRequest === "auto") {
-      return defaultCameraOrbitCoordinates(inputs.puzzleID, inputs.strategy);
-    }
-
-    const req: OrbitCoordinates = Object.assign(
-      Object.assign(
-        {},
-        defaultCameraOrbitCoordinates(inputs.puzzleID, inputs.strategy),
-        inputs.orbitCoordinatesRequest,
-      ),
-    );
-
-    if (Math.abs(req.latitude) <= inputs.latitudeLimit) {
-      return req;
-    } else {
-      const { latitude, longitude, distance } = req;
-      // TODO: Should we re-normalize the request, so we don't depend on normalization in the input?
-      return {
-        latitude: inputs.latitudeLimit * Math.sign(latitude),
-        longitude,
-        distance,
-      };
-    }
-  }
-}
-
-// const DEFAULT_CAMERA_Z = 5;
-// // Golden ratio is perfect for FTO and Megaminx.
-// const DEFAULT_CAMERA_Y = DEFAULT_CAMERA_Z * (2 / (1 + Math.sqrt(5)));
-export const centeredCameraOrbitCoordinates: OrbitCoordinates = {
-  latitude: 31.717474411461005,
-  longitude: 0,
-  distance: 5.877852522924731,
-};
-
-// This is tuned so that the hint facelets for 3x3x3 always fit in the canvas.
-export const cubeCube3DCameraOrbitCoordinates: OrbitCoordinates = {
-  latitude: 35,
-  longitude: 30,
-  distance: 6,
-};
-
-// This is tuned so that the hint facelets always fit in the canvas.
-export const cubePG3DCameraOrbitCoordinates: OrbitCoordinates = {
-  latitude: 35,
-  longitude: 30,
-  distance: 6.25,
-};
-
-export const megaminxCameraOrbitCoordinates: OrbitCoordinates = {
-  latitude: Math.atan(1 / 2) * DEGREES_PER_RADIAN,
-  longitude: 0,
-  distance: 6.7,
-};
-
-export const pyraminxCameraOrbitCoordinates: OrbitCoordinates = {
-  latitude: 26.56505117707799,
-  longitude: 0,
-  distance: 6,
-};
-
-export const cornerCameraOrbitCoordinates: OrbitCoordinates = {
-  latitude: 35.264389682754654,
-  longitude: 45,
-  distance: 6.928203230275509,
-};
-
-// TODO
-export function defaultCameraOrbitCoordinates(
-  puzzleID: PuzzleID,
-  strategy: VisualizationStrategy,
-): OrbitCoordinates {
-  if (puzzleID[1] === "x") {
-    if (strategy === "Cube3D") {
-      return cubeCube3DCameraOrbitCoordinates;
-    } else {
-      return cubePG3DCameraOrbitCoordinates;
-    }
-  } else {
-    switch (puzzleID) {
-      case "megaminx":
-      case "gigaminx":
-        return megaminxCameraOrbitCoordinates;
-      case "pyraminx":
-      case "master_tetraminx":
-        return pyraminxCameraOrbitCoordinates;
-      case "skewb":
-        return cubePG3DCameraOrbitCoordinates;
-      default:
-        return centeredCameraOrbitCoordinates;
-    }
-  }
-}
-// TODO: templatize
-export interface ManagedAttribute<K> {
-  string: string;
-  value: K;
-  setString(s: string): boolean;
-  setValue(v: K): boolean;
-}

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

@@ -1,69 +0,0 @@
-import { mod } from "../../helpers";
-import { TwistyPropSource } from "../TwistyProp";
-
-export type CoordinateDegrees = number;
-
-export interface OrbitCoordinates {
-  latitude: CoordinateDegrees;
-  longitude: CoordinateDegrees;
-  distance: number;
-}
-
-export function orbitCoordinatesEqual(
-  c1: OrbitCoordinates,
-  c2: OrbitCoordinates,
-): boolean {
-  return (
-    c1.latitude === c2.latitude &&
-    c1.longitude === c2.longitude &&
-    c1.distance === c2.distance
-  );
-}
-
-// TOOD: Check if freezing affects perf.
-// const DEFAULT_COORDINATES = Object.freeze({
-//   latitude: 35,
-//   longitude: 30,
-//   distance: 6,
-// });
-
-export type OrbitCoordinatesRequest = Partial<OrbitCoordinates> | "auto";
-
-// TODO: Put the "auto" calculations in a separate place.
-export class OrbitCoordinatesRequestProp extends TwistyPropSource<
-  OrbitCoordinatesRequest,
-  Partial<OrbitCoordinates> | "auto"
-> {
-  getDefaultValue(): OrbitCoordinatesRequest {
-    return "auto";
-  }
-
-  canReuseValue(v1: OrbitCoordinates, v2: OrbitCoordinates) {
-    return v1 === v2 || orbitCoordinatesEqual(v1, v2);
-  }
-
-  async derive(
-    newCoordinates: Partial<OrbitCoordinates> | "auto",
-    oldValuePromise: Promise<OrbitCoordinatesRequest>,
-  ): Promise<OrbitCoordinatesRequest> {
-    if (newCoordinates === "auto") {
-      return "auto";
-    }
-
-    let oldValue = await oldValuePromise;
-    if (oldValue === "auto") {
-      oldValue = {};
-    }
-
-    const newValue: Partial<OrbitCoordinates> = Object.assign({}, oldValue);
-    Object.assign(newValue, newCoordinates);
-
-    if (typeof newValue.latitude !== "undefined") {
-      newValue.latitude = Math.min(Math.max(newValue.latitude, -90), 90);
-    }
-    if (typeof newValue.longitude !== "undefined") {
-      newValue.longitude = mod(newValue.longitude, 360, 180);
-    }
-    return newValue;
-  }
-}

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

@@ -1,15 +0,0 @@
-import type { TimeRange } from "../../../controllers/AnimationTypes";
-import type { AlgIndexer } from "../../../controllers/indexer/AlgIndexer";
-import { TwistyPropDerived } from "../TwistyProp";
-
-export class TimeRangeProp extends TwistyPropDerived<
-  { indexer: AlgIndexer<any> },
-  TimeRange
-> {
-  derive(inputs: { indexer: AlgIndexer<any> }): TimeRange {
-    return {
-      start: 0,
-      end: inputs.indexer.algDuration(),
-    };
-  }
-}

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

@@ -1,14 +0,0 @@
-import { SimpleTwistyPropSource } from "../TwistyProp";
-
-export const viewerLinkPages = {
-  twizzle: true, // default
-  none: true,
-};
-export type ViewerLinkPage = keyof typeof viewerLinkPages;
-export type ViewerLinkPageWithAuto = ViewerLinkPage | "auto";
-
-export class ViewerLinkProp extends SimpleTwistyPropSource<ViewerLinkPageWithAuto> {
-  getDefaultValue(): ViewerLinkPageWithAuto {
-    return "auto";
-  }
-}

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

@@ -1,17 +0,0 @@
-import { SimpleTwistyPropSource } from "../TwistyProp";
-
-// TODO: turn these maps into lists?
-export const visualizationFormats = {
-  "3D": true, // default
-  "2D": true,
-  "experimental-2D-LL": true, // TODO
-  "PG3D": true,
-};
-export type VisualizationFormat = keyof typeof visualizationFormats;
-export type VisualizationFormatWithAuto = VisualizationFormat | "auto";
-
-export class VisualizationFormatProp extends SimpleTwistyPropSource<VisualizationFormatWithAuto> {
-  getDefaultValue(): VisualizationFormatWithAuto {
-    return "auto";
-  }
-}

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

@@ -1,45 +0,0 @@
-import type { VisualizationFormatWithAuto } from "./VisualizationProp";
-import { TwistyPropDerived } from "../TwistyProp";
-import type { PuzzleID } from "../../..";
-
-type VisualizationStrategyPropInputs = {
-  visualizationRequest: VisualizationFormatWithAuto;
-  puzzleID: PuzzleID;
-};
-
-export type VisualizationStrategy =
-  | "Cube3D"
-  | "2D"
-  | "experimental-2D-LL"
-  | "PG3D";
-
-export class VisualizationStrategyProp extends TwistyPropDerived<
-  VisualizationStrategyPropInputs,
-  VisualizationStrategy
-> {
-  derive(inputs: VisualizationStrategyPropInputs): VisualizationStrategy {
-    switch (inputs.puzzleID) {
-      case "clock":
-      case "square1":
-        return "2D";
-      case "3x3x3":
-        switch (inputs.visualizationRequest) {
-          case "auto":
-          case "3D":
-            return "Cube3D";
-          default:
-            return inputs.visualizationRequest;
-        }
-      default:
-        switch (inputs.visualizationRequest) {
-          case "auto":
-          case "3D":
-            return "PG3D";
-          case "experimental-2D-LL":
-            return "2D";
-          default:
-            return inputs.visualizationRequest;
-        }
-    }
-  }
-}

package/src/cubing/twisty/views/2D/Twisty2DPuzzle.css.ts

@@ -1,26 +0,0 @@
-import { CSSSource } from "../ManagedCustomElement";
-
-// TODO: Can we do this without so much nesting, and styling all the nested elems?
-export const twisty2DSVGCSS = new CSSSource(`
-:host {
-  width: 384px;
-  height: 256px;
-  display: grid;
-}
-
-.wrapper {
-  width: 100%;
-  height: 100%;
-  display: grid;
-  overflow: hidden;
-}
-
-.svg-wrapper,
-twisty-2d-svg,
-svg {
-  width: 100%;
-  height: 100%;
-  display: grid;
-  min-height: 0;
-}
-`);