@unabridged/midwest 0.23.4 → 0.24.0

package/dist/javascript/collection/app/components/midwest/panorama_component/panorama_component_controller.js

@@ -0,0 +1,296 @@
+import { Controller } from '@hotwired/stimulus';
+
+const FRICTION = 0.92;
+const MIN_VELOCITY = 0.05;
+const KEY_STEP_FRACTION = 0.12;
+class Panorama extends Controller {
+  static targets = ["viewport", "stage", "media", "status", "hint", "reset"];
+  static values = {
+    wrap: { type: Boolean, default: false },
+    autoRotate: { type: Number, default: 0 },
+    start: { type: Number, default: 0 }
+  };
+  offset = 0;
+  // current translateX, always <= 0
+  mediaWidth = 0;
+  // rendered width of a single media copy
+  viewportWidth = 0;
+  dragging = false;
+  pointerId = null;
+  lastX = 0;
+  lastMoveTime = 0;
+  velocity = 0;
+  inertiaRaf = null;
+  autoRaf = null;
+  lastAutoTime = 0;
+  clone = null;
+  resizeObserver = null;
+  interacted = false;
+  connect() {
+    this.viewportTarget.addEventListener("pointerdown", this.onPointerDown);
+    this.element.addEventListener("keydown", this.onKeydown);
+    this.element.addEventListener("pointerenter", this.pauseAuto);
+    this.element.addEventListener("pointerleave", this.resumeAuto);
+    this.element.addEventListener("focusin", this.pauseAuto);
+    this.element.addEventListener("focusout", this.resumeAuto);
+    this.resizeObserver = new ResizeObserver(() => this.measure());
+    this.resizeObserver.observe(this.viewportTarget);
+    this.whenMediaReady(() => {
+      this.setupWrap();
+      this.measure();
+      this.offset = this.startOffset();
+      this.apply();
+      this.startAuto();
+    });
+  }
+  disconnect() {
+    this.viewportTarget.removeEventListener("pointerdown", this.onPointerDown);
+    window.removeEventListener("pointermove", this.onPointerMove);
+    window.removeEventListener("pointerup", this.onPointerUp);
+    window.removeEventListener("pointercancel", this.onPointerUp);
+    this.element.removeEventListener("keydown", this.onKeydown);
+    this.element.removeEventListener("pointerenter", this.pauseAuto);
+    this.element.removeEventListener("pointerleave", this.resumeAuto);
+    this.element.removeEventListener("focusin", this.pauseAuto);
+    this.element.removeEventListener("focusout", this.resumeAuto);
+    this.resizeObserver?.disconnect();
+    this.stopInertia();
+    this.stopAuto();
+  }
+  // Recenters the view to its starting position (wired to the reset button).
+  reset() {
+    this.stopInertia();
+    this.markInteracted();
+    this.offset = this.startOffset();
+    this.apply();
+    this.announce("View reset");
+  }
+  // --- media readiness & measurement -----------------------------------------
+  whenMediaReady(cb) {
+    const media = this.mediaTarget;
+    if (media instanceof HTMLImageElement) {
+      if (media.complete && media.naturalWidth > 0) {
+        cb();
+        return;
+      }
+      media.addEventListener("load", cb, { once: true });
+      media.addEventListener("error", cb, { once: true });
+    } else {
+      if (media.readyState >= 1 && media.videoWidth > 0) {
+        cb();
+        return;
+      }
+      media.addEventListener("loadedmetadata", cb, { once: true });
+    }
+  }
+  measure() {
+    this.viewportWidth = this.viewportTarget.clientWidth;
+    const first = this.stageTarget.querySelector(".midwest-panorama-media");
+    this.mediaWidth = first?.getBoundingClientRect().width ?? 0;
+    this.offset = this.normalize(this.offset);
+    this.apply();
+  }
+  // Duplicates the image once so the stage can loop seamlessly. Only images
+  // wrap — a live <video> can't be cheaply cloned/kept in sync.
+  setupWrap() {
+    if (!this.wrapValue || this.clone)
+      return;
+    if (!(this.mediaTarget instanceof HTMLImageElement))
+      return;
+    const clone = this.mediaTarget.cloneNode(true);
+    clone.setAttribute("aria-hidden", "true");
+    clone.setAttribute("alt", "");
+    clone.removeAttribute("data-midwest-panorama-target");
+    this.stageTarget.appendChild(clone);
+    this.clone = clone;
+  }
+  // --- geometry --------------------------------------------------------------
+  canWrap() {
+    return this.wrapValue && this.clone !== null && this.mediaWidth > 0;
+  }
+  // Constrains an offset: modulo for seamless wrap, hard clamp otherwise.
+  normalize(x) {
+    const w = this.mediaWidth;
+    if (this.canWrap()) {
+      if (w <= 0)
+        return 0;
+      let n = x % w;
+      if (n > 0)
+        n -= w;
+      return n;
+    }
+    const min = Math.min(0, this.viewportWidth - w);
+    return Math.max(min, Math.min(0, x));
+  }
+  startOffset() {
+    if (this.canWrap())
+      return this.normalize(-this.startValue * this.mediaWidth);
+    const min = Math.min(0, this.viewportWidth - this.mediaWidth);
+    return min * this.startValue;
+  }
+  apply() {
+    this.stageTarget.style.transform = `translate3d(${this.offset}px, 0, 0)`;
+  }
+  // --- pointer dragging ------------------------------------------------------
+  onPointerDown = (event) => {
+    if (event.button !== 0)
+      return;
+    this.dragging = true;
+    this.pointerId = event.pointerId;
+    this.lastX = event.clientX;
+    this.lastMoveTime = performance.now();
+    this.velocity = 0;
+    this.stopInertia();
+    this.pauseAuto();
+    this.markInteracted();
+    this.element.classList.add("is-dragging");
+    this.viewportTarget.setPointerCapture(event.pointerId);
+    window.addEventListener("pointermove", this.onPointerMove);
+    window.addEventListener("pointerup", this.onPointerUp);
+    window.addEventListener("pointercancel", this.onPointerUp);
+  };
+  onPointerMove = (event) => {
+    if (!this.dragging)
+      return;
+    const dx = event.clientX - this.lastX;
+    const now = performance.now();
+    const dt = now - this.lastMoveTime;
+    if (dt > 0)
+      this.velocity = dx / dt * 16;
+    this.lastX = event.clientX;
+    this.lastMoveTime = now;
+    this.offset = this.normalize(this.offset + dx);
+    this.apply();
+  };
+  onPointerUp = () => {
+    if (!this.dragging)
+      return;
+    this.dragging = false;
+    this.element.classList.remove("is-dragging");
+    if (this.pointerId !== null) {
+      try {
+        this.viewportTarget.releasePointerCapture(this.pointerId);
+      } catch {
+      }
+    }
+    this.pointerId = null;
+    window.removeEventListener("pointermove", this.onPointerMove);
+    window.removeEventListener("pointerup", this.onPointerUp);
+    window.removeEventListener("pointercancel", this.onPointerUp);
+    this.startInertia();
+  };
+  startInertia() {
+    if (Math.abs(this.velocity) < MIN_VELOCITY) {
+      this.resumeAuto();
+      return;
+    }
+    const step = () => {
+      this.offset = this.normalize(this.offset + this.velocity);
+      this.apply();
+      this.velocity *= FRICTION;
+      if (!this.canWrap()) {
+        const min = Math.min(0, this.viewportWidth - this.mediaWidth);
+        if (this.offset <= min || this.offset >= 0)
+          this.velocity = 0;
+      }
+      if (Math.abs(this.velocity) < MIN_VELOCITY) {
+        this.inertiaRaf = null;
+        this.resumeAuto();
+        return;
+      }
+      this.inertiaRaf = requestAnimationFrame(step);
+    };
+    this.inertiaRaf = requestAnimationFrame(step);
+  }
+  stopInertia() {
+    if (this.inertiaRaf !== null) {
+      cancelAnimationFrame(this.inertiaRaf);
+      this.inertiaRaf = null;
+    }
+  }
+  // --- keyboard --------------------------------------------------------------
+  onKeydown = (event) => {
+    const step = this.viewportWidth * KEY_STEP_FRACTION;
+    let handled = true;
+    switch (event.key) {
+      case "ArrowLeft":
+        this.offset = this.normalize(this.offset + step);
+        break;
+      case "ArrowRight":
+        this.offset = this.normalize(this.offset - step);
+        break;
+      case "Home":
+        this.offset = this.startOffset();
+        break;
+      default:
+        handled = false;
+    }
+    if (!handled)
+      return;
+    event.preventDefault();
+    this.stopInertia();
+    this.pauseAuto();
+    this.markInteracted();
+    this.apply();
+    this.announce();
+  };
+  // --- auto-rotate -----------------------------------------------------------
+  startAuto() {
+    if (this.autoRotateValue <= 0 || this.autoRaf !== null || this.dragging)
+      return;
+    if (this.prefersReducedMotion())
+      return;
+    this.lastAutoTime = performance.now();
+    const step = (now) => {
+      const dt = (now - this.lastAutoTime) / 1e3;
+      this.lastAutoTime = now;
+      this.offset = this.normalize(this.offset - this.autoRotateValue * dt);
+      this.apply();
+      this.autoRaf = requestAnimationFrame(step);
+    };
+    this.autoRaf = requestAnimationFrame(step);
+  }
+  stopAuto() {
+    if (this.autoRaf !== null) {
+      cancelAnimationFrame(this.autoRaf);
+      this.autoRaf = null;
+    }
+  }
+  pauseAuto = () => {
+    this.stopAuto();
+  };
+  resumeAuto = () => {
+    if (this.dragging)
+      return;
+    this.startAuto();
+  };
+  // --- helpers ---------------------------------------------------------------
+  markInteracted() {
+    if (this.interacted)
+      return;
+    this.interacted = true;
+    this.element.classList.add("has-interacted");
+  }
+  announce(message) {
+    if (!this.hasStatusTarget)
+      return;
+    this.statusTarget.textContent = message ?? `Viewing ${this.percent()}%`;
+  }
+  percent() {
+    const w = this.mediaWidth;
+    if (w <= 0)
+      return 0;
+    if (this.canWrap()) {
+      const n = (-this.offset % w + w) % w;
+      return Math.round(n / w * 100);
+    }
+    const min = Math.min(0, this.viewportWidth - w);
+    return min === 0 ? 0 : Math.round(this.offset / min * 100);
+  }
+  prefersReducedMotion() {
+    return window.matchMedia?.("(prefers-reduced-motion: reduce)").matches ?? false;
+  }
+}
+
+export { Panorama as default };
+//# sourceMappingURL=panorama_component_controller.js.map

package/dist/javascript/collection/app/components/midwest/panorama_component/panorama_component_controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"panorama_component_controller.js","sources":["../../../../../../../app/components/midwest/panorama_component/panorama_component_controller.ts"],"sourcesContent":["import { Controller } from '@hotwired/stimulus'\n\n// Inertia decay per frame, and the velocity below which the glide stops.\nconst FRICTION = 0.92\nconst MIN_VELOCITY = 0.05\n// Fraction of the viewport width panned per arrow-key press.\nconst KEY_STEP_FRACTION = 0.12\n\n// Drag-to-pan viewer for wide panoramic images and video. The stage (media +\n// optional seamless-wrap clone) is translated horizontally; pointer, keyboard,\n// inertia, and auto-rotate all funnel through `normalize()` so bounds/wrap are\n// enforced in one place.\nexport default class Panorama extends Controller<HTMLElement> {\n  static targets = ['viewport', 'stage', 'media', 'status', 'hint', 'reset']\n  static values = {\n    wrap: { type: Boolean, default: false },\n    autoRotate: { type: Number, default: 0 },\n    start: { type: Number, default: 0 }\n  }\n\n  declare readonly viewportTarget: HTMLElement\n  declare readonly stageTarget: HTMLElement\n  declare readonly mediaTarget: HTMLImageElement | HTMLVideoElement\n  declare readonly statusTarget: HTMLElement\n  declare readonly hasStatusTarget: boolean\n  declare wrapValue: boolean\n  declare autoRotateValue: number\n  declare startValue: number\n\n  private offset = 0 // current translateX, always <= 0\n  private mediaWidth = 0 // rendered width of a single media copy\n  private viewportWidth = 0\n  private dragging = false\n  private pointerId: number | null = null\n  private lastX = 0\n  private lastMoveTime = 0\n  private velocity = 0\n  private inertiaRaf: number | null = null\n  private autoRaf: number | null = null\n  private lastAutoTime = 0\n  private clone: HTMLElement | null = null\n  private resizeObserver: ResizeObserver | null = null\n  private interacted = false\n\n  connect () {\n    this.viewportTarget.addEventListener('pointerdown', this.onPointerDown)\n    this.element.addEventListener('keydown', this.onKeydown)\n    this.element.addEventListener('pointerenter', this.pauseAuto)\n    this.element.addEventListener('pointerleave', this.resumeAuto)\n    this.element.addEventListener('focusin', this.pauseAuto)\n    this.element.addEventListener('focusout', this.resumeAuto)\n\n    this.resizeObserver = new ResizeObserver(() => this.measure())\n    this.resizeObserver.observe(this.viewportTarget)\n\n    this.whenMediaReady(() => {\n      this.setupWrap()\n      this.measure()\n      this.offset = this.startOffset()\n      this.apply()\n      this.startAuto()\n    })\n  }\n\n  disconnect () {\n    this.viewportTarget.removeEventListener('pointerdown', this.onPointerDown)\n    window.removeEventListener('pointermove', this.onPointerMove)\n    window.removeEventListener('pointerup', this.onPointerUp)\n    window.removeEventListener('pointercancel', this.onPointerUp)\n    this.element.removeEventListener('keydown', this.onKeydown)\n    this.element.removeEventListener('pointerenter', this.pauseAuto)\n    this.element.removeEventListener('pointerleave', this.resumeAuto)\n    this.element.removeEventListener('focusin', this.pauseAuto)\n    this.element.removeEventListener('focusout', this.resumeAuto)\n    this.resizeObserver?.disconnect()\n    this.stopInertia()\n    this.stopAuto()\n  }\n\n  // Recenters the view to its starting position (wired to the reset button).\n  reset () {\n    this.stopInertia()\n    this.markInteracted()\n    this.offset = this.startOffset()\n    this.apply()\n    this.announce('View reset')\n  }\n\n  // --- media readiness & measurement -----------------------------------------\n\n  private whenMediaReady (cb: () => void) {\n    const media = this.mediaTarget\n    if (media instanceof HTMLImageElement) {\n      if (media.complete && media.naturalWidth > 0) { cb(); return }\n      media.addEventListener('load', cb, { once: true })\n      media.addEventListener('error', cb, { once: true })\n    } else {\n      if (media.readyState >= 1 && media.videoWidth > 0) { cb(); return }\n      media.addEventListener('loadedmetadata', cb, { once: true })\n    }\n  }\n\n  private measure () {\n    this.viewportWidth = this.viewportTarget.clientWidth\n    const first = this.stageTarget.querySelector('.midwest-panorama-media') as HTMLElement | null\n    this.mediaWidth = first?.getBoundingClientRect().width ?? 0\n    // Re-clamp after any resize so we never rest out of bounds.\n    this.offset = this.normalize(this.offset)\n    this.apply()\n  }\n\n  // Duplicates the image once so the stage can loop seamlessly. Only images\n  // wrap — a live <video> can't be cheaply cloned/kept in sync.\n  private setupWrap () {\n    if (!this.wrapValue || this.clone) return\n    if (!(this.mediaTarget instanceof HTMLImageElement)) return\n\n    const clone = this.mediaTarget.cloneNode(true) as HTMLElement\n    clone.setAttribute('aria-hidden', 'true')\n    clone.setAttribute('alt', '')\n    clone.removeAttribute('data-midwest-panorama-target')\n    this.stageTarget.appendChild(clone)\n    this.clone = clone\n  }\n\n  // --- geometry --------------------------------------------------------------\n\n  private canWrap (): boolean {\n    return this.wrapValue && this.clone !== null && this.mediaWidth > 0\n  }\n\n  // Constrains an offset: modulo for seamless wrap, hard clamp otherwise.\n  private normalize (x: number): number {\n    const w = this.mediaWidth\n    if (this.canWrap()) {\n      if (w <= 0) return 0\n      let n = x % w\n      if (n > 0) n -= w\n      return n\n    }\n    const min = Math.min(0, this.viewportWidth - w)\n    return Math.max(min, Math.min(0, x))\n  }\n\n  private startOffset (): number {\n    if (this.canWrap()) return this.normalize(-this.startValue * this.mediaWidth)\n    const min = Math.min(0, this.viewportWidth - this.mediaWidth)\n    return min * this.startValue\n  }\n\n  private apply () {\n    this.stageTarget.style.transform = `translate3d(${this.offset}px, 0, 0)`\n  }\n\n  // --- pointer dragging ------------------------------------------------------\n\n  private onPointerDown = (event: PointerEvent) => {\n    if (event.button !== 0) return\n    this.dragging = true\n    this.pointerId = event.pointerId\n    this.lastX = event.clientX\n    this.lastMoveTime = performance.now()\n    this.velocity = 0\n    this.stopInertia()\n    this.pauseAuto()\n    this.markInteracted()\n    this.element.classList.add('is-dragging')\n    this.viewportTarget.setPointerCapture(event.pointerId)\n    window.addEventListener('pointermove', this.onPointerMove)\n    window.addEventListener('pointerup', this.onPointerUp)\n    window.addEventListener('pointercancel', this.onPointerUp)\n  }\n\n  private onPointerMove = (event: PointerEvent) => {\n    if (!this.dragging) return\n    const dx = event.clientX - this.lastX\n    const now = performance.now()\n    const dt = now - this.lastMoveTime\n    // Normalize velocity to px-per-frame (~16ms) for a consistent glide.\n    if (dt > 0) this.velocity = (dx / dt) * 16\n    this.lastX = event.clientX\n    this.lastMoveTime = now\n    this.offset = this.normalize(this.offset + dx)\n    this.apply()\n  }\n\n  private onPointerUp = () => {\n    if (!this.dragging) return\n    this.dragging = false\n    this.element.classList.remove('is-dragging')\n    if (this.pointerId !== null) {\n      try { this.viewportTarget.releasePointerCapture(this.pointerId) } catch { /* already released */ }\n    }\n    this.pointerId = null\n    window.removeEventListener('pointermove', this.onPointerMove)\n    window.removeEventListener('pointerup', this.onPointerUp)\n    window.removeEventListener('pointercancel', this.onPointerUp)\n    this.startInertia()\n  }\n\n  private startInertia () {\n    if (Math.abs(this.velocity) < MIN_VELOCITY) { this.resumeAuto(); return }\n    const step = () => {\n      this.offset = this.normalize(this.offset + this.velocity)\n      this.apply()\n      this.velocity *= FRICTION\n      // A hard clamp edge kills the glide immediately.\n      if (!this.canWrap()) {\n        const min = Math.min(0, this.viewportWidth - this.mediaWidth)\n        if (this.offset <= min || this.offset >= 0) this.velocity = 0\n      }\n      if (Math.abs(this.velocity) < MIN_VELOCITY) {\n        this.inertiaRaf = null\n        this.resumeAuto()\n        return\n      }\n      this.inertiaRaf = requestAnimationFrame(step)\n    }\n    this.inertiaRaf = requestAnimationFrame(step)\n  }\n\n  private stopInertia () {\n    if (this.inertiaRaf !== null) {\n      cancelAnimationFrame(this.inertiaRaf)\n      this.inertiaRaf = null\n    }\n  }\n\n  // --- keyboard --------------------------------------------------------------\n\n  private onKeydown = (event: KeyboardEvent) => {\n    const step = this.viewportWidth * KEY_STEP_FRACTION\n    let handled = true\n    switch (event.key) {\n      case 'ArrowLeft': this.offset = this.normalize(this.offset + step); break\n      case 'ArrowRight': this.offset = this.normalize(this.offset - step); break\n      case 'Home': this.offset = this.startOffset(); break\n      default: handled = false\n    }\n    if (!handled) return\n    event.preventDefault()\n    this.stopInertia()\n    this.pauseAuto()\n    this.markInteracted()\n    this.apply()\n    this.announce()\n  }\n\n  // --- auto-rotate -----------------------------------------------------------\n\n  private startAuto () {\n    if (this.autoRotateValue <= 0 || this.autoRaf !== null || this.dragging) return\n    if (this.prefersReducedMotion()) return\n    this.lastAutoTime = performance.now()\n    const step = (now: number) => {\n      const dt = (now - this.lastAutoTime) / 1000\n      this.lastAutoTime = now\n      this.offset = this.normalize(this.offset - this.autoRotateValue * dt)\n      this.apply()\n      this.autoRaf = requestAnimationFrame(step)\n    }\n    this.autoRaf = requestAnimationFrame(step)\n  }\n\n  private stopAuto () {\n    if (this.autoRaf !== null) {\n      cancelAnimationFrame(this.autoRaf)\n      this.autoRaf = null\n    }\n  }\n\n  private pauseAuto = () => {\n    this.stopAuto()\n  }\n\n  private resumeAuto = () => {\n    if (this.dragging) return\n    this.startAuto()\n  }\n\n  // --- helpers ---------------------------------------------------------------\n\n  private markInteracted () {\n    if (this.interacted) return\n    this.interacted = true\n    this.element.classList.add('has-interacted')\n  }\n\n  private announce (message?: string) {\n    if (!this.hasStatusTarget) return\n    this.statusTarget.textContent = message ?? `Viewing ${this.percent()}%`\n  }\n\n  private percent (): number {\n    const w = this.mediaWidth\n    if (w <= 0) return 0\n    if (this.canWrap()) {\n      const n = ((-this.offset % w) + w) % w\n      return Math.round((n / w) * 100)\n    }\n    const min = Math.min(0, this.viewportWidth - w)\n    return min === 0 ? 0 : Math.round((this.offset / min) * 100)\n  }\n\n  private prefersReducedMotion (): boolean {\n    return window.matchMedia?.('(prefers-reduced-motion: reduce)').matches ?? false\n  }\n}\n"],"names":[],"mappings":";;AAGA,MAAM,QAAW,GAAA,IAAA,CAAA;AACjB,MAAM,YAAe,GAAA,IAAA,CAAA;AAErB,MAAM,iBAAoB,GAAA,IAAA,CAAA;AAM1B,MAAqB,iBAAiB,UAAwB,CAAA;AAAA,EAC5D,OAAO,UAAU,CAAC,UAAA,EAAY,SAAS,OAAS,EAAA,QAAA,EAAU,QAAQ,OAAO,CAAA,CAAA;AAAA,EACzE,OAAO,MAAS,GAAA;AAAA,IACd,IAAM,EAAA,EAAE,IAAM,EAAA,OAAA,EAAS,SAAS,KAAM,EAAA;AAAA,IACtC,UAAY,EAAA,EAAE,IAAM,EAAA,MAAA,EAAQ,SAAS,CAAE,EAAA;AAAA,IACvC,KAAO,EAAA,EAAE,IAAM,EAAA,MAAA,EAAQ,SAAS,CAAE,EAAA;AAAA,GACpC,CAAA;AAAA,EAWQ,MAAS,GAAA,CAAA,CAAA;AAAA;AAAA,EACT,UAAa,GAAA,CAAA,CAAA;AAAA;AAAA,EACb,aAAgB,GAAA,CAAA,CAAA;AAAA,EAChB,QAAW,GAAA,KAAA,CAAA;AAAA,EACX,SAA2B,GAAA,IAAA,CAAA;AAAA,EAC3B,KAAQ,GAAA,CAAA,CAAA;AAAA,EACR,YAAe,GAAA,CAAA,CAAA;AAAA,EACf,QAAW,GAAA,CAAA,CAAA;AAAA,EACX,UAA4B,GAAA,IAAA,CAAA;AAAA,EAC5B,OAAyB,GAAA,IAAA,CAAA;AAAA,EACzB,YAAe,GAAA,CAAA,CAAA;AAAA,EACf,KAA4B,GAAA,IAAA,CAAA;AAAA,EAC5B,cAAwC,GAAA,IAAA,CAAA;AAAA,EACxC,UAAa,GAAA,KAAA,CAAA;AAAA,EAErB,OAAW,GAAA;AACT,IAAA,IAAA,CAAK,cAAe,CAAA,gBAAA,CAAiB,aAAe,EAAA,IAAA,CAAK,aAAa,CAAA,CAAA;AACtE,IAAA,IAAA,CAAK,OAAQ,CAAA,gBAAA,CAAiB,SAAW,EAAA,IAAA,CAAK,SAAS,CAAA,CAAA;AACvD,IAAA,IAAA,CAAK,OAAQ,CAAA,gBAAA,CAAiB,cAAgB,EAAA,IAAA,CAAK,SAAS,CAAA,CAAA;AAC5D,IAAA,IAAA,CAAK,OAAQ,CAAA,gBAAA,CAAiB,cAAgB,EAAA,IAAA,CAAK,UAAU,CAAA,CAAA;AAC7D,IAAA,IAAA,CAAK,OAAQ,CAAA,gBAAA,CAAiB,SAAW,EAAA,IAAA,CAAK,SAAS,CAAA,CAAA;AACvD,IAAA,IAAA,CAAK,OAAQ,CAAA,gBAAA,CAAiB,UAAY,EAAA,IAAA,CAAK,UAAU,CAAA,CAAA;AAEzD,IAAA,IAAA,CAAK,iBAAiB,IAAI,cAAA,CAAe,MAAM,IAAA,CAAK,SAAS,CAAA,CAAA;AAC7D,IAAK,IAAA,CAAA,cAAA,CAAe,OAAQ,CAAA,IAAA,CAAK,cAAc,CAAA,CAAA;AAE/C,IAAA,IAAA,CAAK,eAAe,MAAM;AACxB,MAAA,IAAA,CAAK,SAAU,EAAA,CAAA;AACf,MAAA,IAAA,CAAK,OAAQ,EAAA,CAAA;AACb,MAAK,IAAA,CAAA,MAAA,GAAS,KAAK,WAAY,EAAA,CAAA;AAC/B,MAAA,IAAA,CAAK,KAAM,EAAA,CAAA;AACX,MAAA,IAAA,CAAK,SAAU,EAAA,CAAA;AAAA,KAChB,CAAA,CAAA;AAAA,GACH;AAAA,EAEA,UAAc,GAAA;AACZ,IAAA,IAAA,CAAK,cAAe,CAAA,mBAAA,CAAoB,aAAe,EAAA,IAAA,CAAK,aAAa,CAAA,CAAA;AACzE,IAAO,MAAA,CAAA,mBAAA,CAAoB,aAAe,EAAA,IAAA,CAAK,aAAa,CAAA,CAAA;AAC5D,IAAO,MAAA,CAAA,mBAAA,CAAoB,WAAa,EAAA,IAAA,CAAK,WAAW,CAAA,CAAA;AACxD,IAAO,MAAA,CAAA,mBAAA,CAAoB,eAAiB,EAAA,IAAA,CAAK,WAAW,CAAA,CAAA;AAC5D,IAAA,IAAA,CAAK,OAAQ,CAAA,mBAAA,CAAoB,SAAW,EAAA,IAAA,CAAK,SAAS,CAAA,CAAA;AAC1D,IAAA,IAAA,CAAK,OAAQ,CAAA,mBAAA,CAAoB,cAAgB,EAAA,IAAA,CAAK,SAAS,CAAA,CAAA;AAC/D,IAAA,IAAA,CAAK,OAAQ,CAAA,mBAAA,CAAoB,cAAgB,EAAA,IAAA,CAAK,UAAU,CAAA,CAAA;AAChE,IAAA,IAAA,CAAK,OAAQ,CAAA,mBAAA,CAAoB,SAAW,EAAA,IAAA,CAAK,SAAS,CAAA,CAAA;AAC1D,IAAA,IAAA,CAAK,OAAQ,CAAA,mBAAA,CAAoB,UAAY,EAAA,IAAA,CAAK,UAAU,CAAA,CAAA;AAC5D,IAAA,IAAA,CAAK,gBAAgB,UAAW,EAAA,CAAA;AAChC,IAAA,IAAA,CAAK,WAAY,EAAA,CAAA;AACjB,IAAA,IAAA,CAAK,QAAS,EAAA,CAAA;AAAA,GAChB;AAAA;AAAA,EAGA,KAAS,GAAA;AACP,IAAA,IAAA,CAAK,WAAY,EAAA,CAAA;AACjB,IAAA,IAAA,CAAK,cAAe,EAAA,CAAA;AACpB,IAAK,IAAA,CAAA,MAAA,GAAS,KAAK,WAAY,EAAA,CAAA;AAC/B,IAAA,IAAA,CAAK,KAAM,EAAA,CAAA;AACX,IAAA,IAAA,CAAK,SAAS,YAAY,CAAA,CAAA;AAAA,GAC5B;AAAA;AAAA,EAIQ,eAAgB,EAAgB,EAAA;AACtC,IAAA,MAAM,QAAQ,IAAK,CAAA,WAAA,CAAA;AACnB,IAAA,IAAI,iBAAiB,gBAAkB,EAAA;AACrC,MAAA,IAAI,KAAM,CAAA,QAAA,IAAY,KAAM,CAAA,YAAA,GAAe,CAAG,EAAA;AAAE,QAAG,EAAA,EAAA,CAAA;AAAG,QAAA,OAAA;AAAA,OAAO;AAC7D,MAAA,KAAA,CAAM,iBAAiB,MAAQ,EAAA,EAAA,EAAI,EAAE,IAAA,EAAM,MAAM,CAAA,CAAA;AACjD,MAAA,KAAA,CAAM,iBAAiB,OAAS,EAAA,EAAA,EAAI,EAAE,IAAA,EAAM,MAAM,CAAA,CAAA;AAAA,KAC7C,MAAA;AACL,MAAA,IAAI,KAAM,CAAA,UAAA,IAAc,CAAK,IAAA,KAAA,CAAM,aAAa,CAAG,EAAA;AAAE,QAAG,EAAA,EAAA,CAAA;AAAG,QAAA,OAAA;AAAA,OAAO;AAClE,MAAA,KAAA,CAAM,iBAAiB,gBAAkB,EAAA,EAAA,EAAI,EAAE,IAAA,EAAM,MAAM,CAAA,CAAA;AAAA,KAC7D;AAAA,GACF;AAAA,EAEQ,OAAW,GAAA;AACjB,IAAK,IAAA,CAAA,aAAA,GAAgB,KAAK,cAAe,CAAA,WAAA,CAAA;AACzC,IAAA,MAAM,KAAQ,GAAA,IAAA,CAAK,WAAY,CAAA,aAAA,CAAc,yBAAyB,CAAA,CAAA;AACtE,IAAA,IAAA,CAAK,UAAa,GAAA,KAAA,EAAO,qBAAsB,EAAA,CAAE,KAAS,IAAA,CAAA,CAAA;AAE1D,IAAA,IAAA,CAAK,MAAS,GAAA,IAAA,CAAK,SAAU,CAAA,IAAA,CAAK,MAAM,CAAA,CAAA;AACxC,IAAA,IAAA,CAAK,KAAM,EAAA,CAAA;AAAA,GACb;AAAA;AAAA;AAAA,EAIQ,SAAa,GAAA;AACnB,IAAI,IAAA,CAAC,IAAK,CAAA,SAAA,IAAa,IAAK,CAAA,KAAA;AAAO,MAAA,OAAA;AACnC,IAAI,IAAA,EAAE,KAAK,WAAuB,YAAA,gBAAA,CAAA;AAAmB,MAAA,OAAA;AAErD,IAAA,MAAM,KAAQ,GAAA,IAAA,CAAK,WAAY,CAAA,SAAA,CAAU,IAAI,CAAA,CAAA;AAC7C,IAAM,KAAA,CAAA,YAAA,CAAa,eAAe,MAAM,CAAA,CAAA;AACxC,IAAM,KAAA,CAAA,YAAA,CAAa,OAAO,EAAE,CAAA,CAAA;AAC5B,IAAA,KAAA,CAAM,gBAAgB,8BAA8B,CAAA,CAAA;AACpD,IAAK,IAAA,CAAA,WAAA,CAAY,YAAY,KAAK,CAAA,CAAA;AAClC,IAAA,IAAA,CAAK,KAAQ,GAAA,KAAA,CAAA;AAAA,GACf;AAAA;AAAA,EAIQ,OAAoB,GAAA;AAC1B,IAAA,OAAO,KAAK,SAAa,IAAA,IAAA,CAAK,KAAU,KAAA,IAAA,IAAQ,KAAK,UAAa,GAAA,CAAA,CAAA;AAAA,GACpE;AAAA;AAAA,EAGQ,UAAW,CAAmB,EAAA;AACpC,IAAA,MAAM,IAAI,IAAK,CAAA,UAAA,CAAA;AACf,IAAI,IAAA,IAAA,CAAK,SAAW,EAAA;AAClB,MAAA,IAAI,CAAK,IAAA,CAAA;AAAG,QAAO,OAAA,CAAA,CAAA;AACnB,MAAA,IAAI,IAAI,CAAI,GAAA,CAAA,CAAA;AACZ,MAAA,IAAI,CAAI,GAAA,CAAA;AAAG,QAAK,CAAA,IAAA,CAAA,CAAA;AAChB,MAAO,OAAA,CAAA,CAAA;AAAA,KACT;AACA,IAAA,MAAM,MAAM,IAAK,CAAA,GAAA,CAAI,CAAG,EAAA,IAAA,CAAK,gBAAgB,CAAC,CAAA,CAAA;AAC9C,IAAA,OAAO,KAAK,GAAI,CAAA,GAAA,EAAK,KAAK,GAAI,CAAA,CAAA,EAAG,CAAC,CAAC,CAAA,CAAA;AAAA,GACrC;AAAA,EAEQ,WAAuB,GAAA;AAC7B,IAAA,IAAI,KAAK,OAAQ,EAAA;AAAG,MAAA,OAAO,KAAK,SAAU,CAAA,CAAC,IAAK,CAAA,UAAA,GAAa,KAAK,UAAU,CAAA,CAAA;AAC5E,IAAA,MAAM,MAAM,IAAK,CAAA,GAAA,CAAI,GAAG,IAAK,CAAA,aAAA,GAAgB,KAAK,UAAU,CAAA,CAAA;AAC5D,IAAA,OAAO,MAAM,IAAK,CAAA,UAAA,CAAA;AAAA,GACpB;AAAA,EAEQ,KAAS,GAAA;AACf,IAAA,IAAA,CAAK,WAAY,CAAA,KAAA,CAAM,SAAY,GAAA,CAAA,YAAA,EAAe,IAAK,CAAA,MAAA,CAAA,SAAA,CAAA,CAAA;AAAA,GACzD;AAAA;AAAA,EAIQ,aAAA,GAAgB,CAAC,KAAwB,KAAA;AAC/C,IAAA,IAAI,MAAM,MAAW,KAAA,CAAA;AAAG,MAAA,OAAA;AACxB,IAAA,IAAA,CAAK,QAAW,GAAA,IAAA,CAAA;AAChB,IAAA,IAAA,CAAK,YAAY,KAAM,CAAA,SAAA,CAAA;AACvB,IAAA,IAAA,CAAK,QAAQ,KAAM,CAAA,OAAA,CAAA;AACnB,IAAK,IAAA,CAAA,YAAA,GAAe,YAAY,GAAI,EAAA,CAAA;AACpC,IAAA,IAAA,CAAK,QAAW,GAAA,CAAA,CAAA;AAChB,IAAA,IAAA,CAAK,WAAY,EAAA,CAAA;AACjB,IAAA,IAAA,CAAK,SAAU,EAAA,CAAA;AACf,IAAA,IAAA,CAAK,cAAe,EAAA,CAAA;AACpB,IAAK,IAAA,CAAA,OAAA,CAAQ,SAAU,CAAA,GAAA,CAAI,aAAa,CAAA,CAAA;AACxC,IAAK,IAAA,CAAA,cAAA,CAAe,iBAAkB,CAAA,KAAA,CAAM,SAAS,CAAA,CAAA;AACrD,IAAO,MAAA,CAAA,gBAAA,CAAiB,aAAe,EAAA,IAAA,CAAK,aAAa,CAAA,CAAA;AACzD,IAAO,MAAA,CAAA,gBAAA,CAAiB,WAAa,EAAA,IAAA,CAAK,WAAW,CAAA,CAAA;AACrD,IAAO,MAAA,CAAA,gBAAA,CAAiB,eAAiB,EAAA,IAAA,CAAK,WAAW,CAAA,CAAA;AAAA,GAC3D,CAAA;AAAA,EAEQ,aAAA,GAAgB,CAAC,KAAwB,KAAA;AAC/C,IAAA,IAAI,CAAC,IAAK,CAAA,QAAA;AAAU,MAAA,OAAA;AACpB,IAAM,MAAA,EAAA,GAAK,KAAM,CAAA,OAAA,GAAU,IAAK,CAAA,KAAA,CAAA;AAChC,IAAM,MAAA,GAAA,GAAM,YAAY,GAAI,EAAA,CAAA;AAC5B,IAAM,MAAA,EAAA,GAAK,MAAM,IAAK,CAAA,YAAA,CAAA;AAEtB,IAAA,IAAI,EAAK,GAAA,CAAA;AAAG,MAAK,IAAA,CAAA,QAAA,GAAY,KAAK,EAAM,GAAA,EAAA,CAAA;AACxC,IAAA,IAAA,CAAK,QAAQ,KAAM,CAAA,OAAA,CAAA;AACnB,IAAA,IAAA,CAAK,YAAe,GAAA,GAAA,CAAA;AACpB,IAAA,IAAA,CAAK,MAAS,GAAA,IAAA,CAAK,SAAU,CAAA,IAAA,CAAK,SAAS,EAAE,CAAA,CAAA;AAC7C,IAAA,IAAA,CAAK,KAAM,EAAA,CAAA;AAAA,GACb,CAAA;AAAA,EAEQ,cAAc,MAAM;AAC1B,IAAA,IAAI,CAAC,IAAK,CAAA,QAAA;AAAU,MAAA,OAAA;AACpB,IAAA,IAAA,CAAK,QAAW,GAAA,KAAA,CAAA;AAChB,IAAK,IAAA,CAAA,OAAA,CAAQ,SAAU,CAAA,MAAA,CAAO,aAAa,CAAA,CAAA;AAC3C,IAAI,IAAA,IAAA,CAAK,cAAc,IAAM,EAAA;AAC3B,MAAI,IAAA;AAAE,QAAK,IAAA,CAAA,cAAA,CAAe,qBAAsB,CAAA,IAAA,CAAK,SAAS,CAAA,CAAA;AAAA,OAAI,CAAA,MAAA;AAAA,OAA+B;AAAA,KACnG;AACA,IAAA,IAAA,CAAK,SAAY,GAAA,IAAA,CAAA;AACjB,IAAO,MAAA,CAAA,mBAAA,CAAoB,aAAe,EAAA,IAAA,CAAK,aAAa,CAAA,CAAA;AAC5D,IAAO,MAAA,CAAA,mBAAA,CAAoB,WAAa,EAAA,IAAA,CAAK,WAAW,CAAA,CAAA;AACxD,IAAO,MAAA,CAAA,mBAAA,CAAoB,eAAiB,EAAA,IAAA,CAAK,WAAW,CAAA,CAAA;AAC5D,IAAA,IAAA,CAAK,YAAa,EAAA,CAAA;AAAA,GACpB,CAAA;AAAA,EAEQ,YAAgB,GAAA;AACtB,IAAA,IAAI,IAAK,CAAA,GAAA,CAAI,IAAK,CAAA,QAAQ,IAAI,YAAc,EAAA;AAAE,MAAA,IAAA,CAAK,UAAW,EAAA,CAAA;AAAG,MAAA,OAAA;AAAA,KAAO;AACxE,IAAA,MAAM,OAAO,MAAM;AACjB,MAAA,IAAA,CAAK,SAAS,IAAK,CAAA,SAAA,CAAU,IAAK,CAAA,MAAA,GAAS,KAAK,QAAQ,CAAA,CAAA;AACxD,MAAA,IAAA,CAAK,KAAM,EAAA,CAAA;AACX,MAAA,IAAA,CAAK,QAAY,IAAA,QAAA,CAAA;AAEjB,MAAI,IAAA,CAAC,IAAK,CAAA,OAAA,EAAW,EAAA;AACnB,QAAA,MAAM,MAAM,IAAK,CAAA,GAAA,CAAI,GAAG,IAAK,CAAA,aAAA,GAAgB,KAAK,UAAU,CAAA,CAAA;AAC5D,QAAA,IAAI,IAAK,CAAA,MAAA,IAAU,GAAO,IAAA,IAAA,CAAK,MAAU,IAAA,CAAA;AAAG,UAAA,IAAA,CAAK,QAAW,GAAA,CAAA,CAAA;AAAA,OAC9D;AACA,MAAA,IAAI,IAAK,CAAA,GAAA,CAAI,IAAK,CAAA,QAAQ,IAAI,YAAc,EAAA;AAC1C,QAAA,IAAA,CAAK,UAAa,GAAA,IAAA,CAAA;AAClB,QAAA,IAAA,CAAK,UAAW,EAAA,CAAA;AAChB,QAAA,OAAA;AAAA,OACF;AACA,MAAK,IAAA,CAAA,UAAA,GAAa,sBAAsB,IAAI,CAAA,CAAA;AAAA,KAC9C,CAAA;AACA,IAAK,IAAA,CAAA,UAAA,GAAa,sBAAsB,IAAI,CAAA,CAAA;AAAA,GAC9C;AAAA,EAEQ,WAAe,GAAA;AACrB,IAAI,IAAA,IAAA,CAAK,eAAe,IAAM,EAAA;AAC5B,MAAA,oBAAA,CAAqB,KAAK,UAAU,CAAA,CAAA;AACpC,MAAA,IAAA,CAAK,UAAa,GAAA,IAAA,CAAA;AAAA,KACpB;AAAA,GACF;AAAA;AAAA,EAIQ,SAAA,GAAY,CAAC,KAAyB,KAAA;AAC5C,IAAM,MAAA,IAAA,GAAO,KAAK,aAAgB,GAAA,iBAAA,CAAA;AAClC,IAAA,IAAI,OAAU,GAAA,IAAA,CAAA;AACd,IAAA,QAAQ,MAAM,GAAK;AAAA,MACjB,KAAK,WAAA;AAAa,QAAA,IAAA,CAAK,MAAS,GAAA,IAAA,CAAK,SAAU,CAAA,IAAA,CAAK,SAAS,IAAI,CAAA,CAAA;AAAG,QAAA,MAAA;AAAA,MACpE,KAAK,YAAA;AAAc,QAAA,IAAA,CAAK,MAAS,GAAA,IAAA,CAAK,SAAU,CAAA,IAAA,CAAK,SAAS,IAAI,CAAA,CAAA;AAAG,QAAA,MAAA;AAAA,MACrE,KAAK,MAAA;AAAQ,QAAK,IAAA,CAAA,MAAA,GAAS,KAAK,WAAY,EAAA,CAAA;AAAG,QAAA,MAAA;AAAA,MAC/C;AAAS,QAAU,OAAA,GAAA,KAAA,CAAA;AAAA,KACrB;AACA,IAAA,IAAI,CAAC,OAAA;AAAS,MAAA,OAAA;AACd,IAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AACrB,IAAA,IAAA,CAAK,WAAY,EAAA,CAAA;AACjB,IAAA,IAAA,CAAK,SAAU,EAAA,CAAA;AACf,IAAA,IAAA,CAAK,cAAe,EAAA,CAAA;AACpB,IAAA,IAAA,CAAK,KAAM,EAAA,CAAA;AACX,IAAA,IAAA,CAAK,QAAS,EAAA,CAAA;AAAA,GAChB,CAAA;AAAA;AAAA,EAIQ,SAAa,GAAA;AACnB,IAAA,IAAI,KAAK,eAAmB,IAAA,CAAA,IAAK,IAAK,CAAA,OAAA,KAAY,QAAQ,IAAK,CAAA,QAAA;AAAU,MAAA,OAAA;AACzE,IAAA,IAAI,KAAK,oBAAqB,EAAA;AAAG,MAAA,OAAA;AACjC,IAAK,IAAA,CAAA,YAAA,GAAe,YAAY,GAAI,EAAA,CAAA;AACpC,IAAM,MAAA,IAAA,GAAO,CAAC,GAAgB,KAAA;AAC5B,MAAM,MAAA,EAAA,GAAA,CAAM,GAAM,GAAA,IAAA,CAAK,YAAgB,IAAA,GAAA,CAAA;AACvC,MAAA,IAAA,CAAK,YAAe,GAAA,GAAA,CAAA;AACpB,MAAA,IAAA,CAAK,SAAS,IAAK,CAAA,SAAA,CAAU,KAAK,MAAS,GAAA,IAAA,CAAK,kBAAkB,EAAE,CAAA,CAAA;AACpE,MAAA,IAAA,CAAK,KAAM,EAAA,CAAA;AACX,MAAK,IAAA,CAAA,OAAA,GAAU,sBAAsB,IAAI,CAAA,CAAA;AAAA,KAC3C,CAAA;AACA,IAAK,IAAA,CAAA,OAAA,GAAU,sBAAsB,IAAI,CAAA,CAAA;AAAA,GAC3C;AAAA,EAEQ,QAAY,GAAA;AAClB,IAAI,IAAA,IAAA,CAAK,YAAY,IAAM,EAAA;AACzB,MAAA,oBAAA,CAAqB,KAAK,OAAO,CAAA,CAAA;AACjC,MAAA,IAAA,CAAK,OAAU,GAAA,IAAA,CAAA;AAAA,KACjB;AAAA,GACF;AAAA,EAEQ,YAAY,MAAM;AACxB,IAAA,IAAA,CAAK,QAAS,EAAA,CAAA;AAAA,GAChB,CAAA;AAAA,EAEQ,aAAa,MAAM;AACzB,IAAA,IAAI,IAAK,CAAA,QAAA;AAAU,MAAA,OAAA;AACnB,IAAA,IAAA,CAAK,SAAU,EAAA,CAAA;AAAA,GACjB,CAAA;AAAA;AAAA,EAIQ,cAAkB,GAAA;AACxB,IAAA,IAAI,IAAK,CAAA,UAAA;AAAY,MAAA,OAAA;AACrB,IAAA,IAAA,CAAK,UAAa,GAAA,IAAA,CAAA;AAClB,IAAK,IAAA,CAAA,OAAA,CAAQ,SAAU,CAAA,GAAA,CAAI,gBAAgB,CAAA,CAAA;AAAA,GAC7C;AAAA,EAEQ,SAAU,OAAkB,EAAA;AAClC,IAAA,IAAI,CAAC,IAAK,CAAA,eAAA;AAAiB,MAAA,OAAA;AAC3B,IAAA,IAAA,CAAK,YAAa,CAAA,WAAA,GAAc,OAAW,IAAA,CAAA,QAAA,EAAW,KAAK,OAAQ,EAAA,CAAA,CAAA,CAAA,CAAA;AAAA,GACrE;AAAA,EAEQ,OAAmB,GAAA;AACzB,IAAA,MAAM,IAAI,IAAK,CAAA,UAAA,CAAA;AACf,IAAA,IAAI,CAAK,IAAA,CAAA;AAAG,MAAO,OAAA,CAAA,CAAA;AACnB,IAAI,IAAA,IAAA,CAAK,SAAW,EAAA;AAClB,MAAA,MAAM,CAAM,GAAA,CAAA,CAAC,IAAK,CAAA,MAAA,GAAS,IAAK,CAAK,IAAA,CAAA,CAAA;AACrC,MAAA,OAAO,IAAK,CAAA,KAAA,CAAO,CAAI,GAAA,CAAA,GAAK,GAAG,CAAA,CAAA;AAAA,KACjC;AACA,IAAA,MAAM,MAAM,IAAK,CAAA,GAAA,CAAI,CAAG,EAAA,IAAA,CAAK,gBAAgB,CAAC,CAAA,CAAA;AAC9C,IAAO,OAAA,GAAA,KAAQ,IAAI,CAAI,GAAA,IAAA,CAAK,MAAO,IAAK,CAAA,MAAA,GAAS,MAAO,GAAG,CAAA,CAAA;AAAA,GAC7D;AAAA,EAEQ,oBAAiC,GAAA;AACvC,IAAA,OAAO,MAAO,CAAA,UAAA,GAAa,kCAAkC,CAAA,CAAE,OAAW,IAAA,KAAA,CAAA;AAAA,GAC5E;AACF;;;;"}

package/dist/javascript/collection/app/components/midwest/playlist_component/playlist_component_controller.js

@@ -0,0 +1,220 @@
+import { Controller } from '@hotwired/stimulus';
+
+function formatTime(seconds) {
+  const mins = Math.floor(seconds / 60);
+  const secs = Math.floor(seconds % 60);
+  return `${mins}:${secs.toString().padStart(2, "0")}`;
+}
+class Playlist extends Controller {
+  static targets = [
+    "audio",
+    "audioSource",
+    "playIcon",
+    "pauseIcon",
+    "trackTitle",
+    "trackArtist",
+    "artworkContainer",
+    "placeholderIcon",
+    "progressBar",
+    "currentTime",
+    "totalTime",
+    "songList",
+    "details"
+  ];
+  static values = {
+    playlistName: { type: String, default: "Playlist" },
+    autoplay: { type: Boolean, default: false },
+    view: { type: String, default: "playlist" },
+    playlistVisible: { type: Boolean, default: true },
+    artwork: { type: Boolean, default: false }
+  };
+  currentIndex = 0;
+  songElements = [];
+  connect() {
+    this.songElements = Array.from(this.songListTarget.querySelectorAll(".midwest-song button"));
+    this.updatePlaylistVisibility();
+    this.audioTarget.addEventListener("timeupdate", this.handleTimeUpdate);
+    this.audioTarget.addEventListener("loadedmetadata", this.handleMetadataLoaded);
+    this.audioTarget.addEventListener("ended", this.handleEnded);
+    this.audioTarget.addEventListener("play", this.handlePlayEvent);
+    this.audioTarget.addEventListener("pause", this.handlePauseEvent);
+    this.element.addEventListener("keydown", this.handleKeydown);
+    if (this.autoplayValue && this.songElements.length > 0) {
+      this.loadSong(0);
+    }
+  }
+  disconnect() {
+    this.audioTarget.removeEventListener("timeupdate", this.handleTimeUpdate);
+    this.audioTarget.removeEventListener("loadedmetadata", this.handleMetadataLoaded);
+    this.audioTarget.removeEventListener("ended", this.handleEnded);
+    this.audioTarget.removeEventListener("play", this.handlePlayEvent);
+    this.audioTarget.removeEventListener("pause", this.handlePauseEvent);
+    this.element.removeEventListener("keydown", this.handleKeydown);
+  }
+  // Play/pause toggle
+  togglePlay() {
+    if (this.audioTarget.paused) {
+      if (this.audioSourceTarget.src) {
+        this.audioTarget.play();
+      } else if (this.songElements.length > 0) {
+        this.loadSong(0);
+      }
+    } else {
+      this.audioTarget.pause();
+    }
+  }
+  // Play the song whose button was clicked (wired from the song template)
+  playSong(event) {
+    const button = event.currentTarget;
+    const index = this.songElements.indexOf(button);
+    if (index === -1)
+      return;
+    if (index === this.currentIndex && this.audioSourceTarget.src) {
+      this.togglePlay();
+      return;
+    }
+    this.loadSong(index);
+  }
+  // Load and play a specific song by index
+  loadSong(index) {
+    const songButton = this.songElements[index];
+    if (!songButton)
+      return;
+    const songElement = songButton.closest(".midwest-song");
+    if (!songElement)
+      return;
+    const src = songElement.dataset.src;
+    const title = songElement.dataset.title || "Unknown";
+    const artist = songElement.dataset.artist || "Unknown";
+    const picture = songElement.dataset.picture;
+    if (!src)
+      return;
+    this.audioSourceTarget.src = src;
+    this.audioTarget.load();
+    this.trackTitleTarget.textContent = title;
+    this.trackArtistTarget.textContent = artist;
+    if (picture) {
+      const img = document.createElement("img");
+      img.src = picture;
+      img.alt = `Album art for ${title}`;
+      img.className = "midwest-playlist__artwork-image";
+      const existingImg = this.artworkContainerTarget.querySelector(".midwest-playlist__artwork-image");
+      if (existingImg) {
+        existingImg.replaceWith(img);
+      } else {
+        this.artworkContainerTarget.appendChild(img);
+      }
+      this.placeholderIconTarget.classList.add("hidden");
+    } else {
+      this.placeholderIconTarget.classList.remove("hidden");
+    }
+    this.songElements.forEach((btn, i) => {
+      const song = btn.closest(".midwest-song");
+      if (i === index) {
+        song.classList.add("is-playing");
+      } else {
+        song.classList.remove("is-playing");
+      }
+    });
+    this.currentIndex = index;
+    this.audioTarget.play().catch(() => {
+    });
+  }
+  // Play next song
+  next() {
+    const nextIndex = (this.currentIndex + 1) % this.songElements.length;
+    this.loadSong(nextIndex);
+  }
+  // Play previous song
+  previous() {
+    const prevIndex = this.currentIndex === 0 ? this.songElements.length - 1 : this.currentIndex - 1;
+    this.loadSong(prevIndex);
+  }
+  // Seek to position in track
+  seek(event) {
+    const rect = this.progressBarTarget.getBoundingClientRect();
+    const x = event.clientX - rect.left;
+    const percentage = Math.max(0, Math.min(1, x / rect.width));
+    if (this.audioTarget.duration) {
+      this.audioTarget.currentTime = percentage * this.audioTarget.duration;
+    }
+  }
+  // Toggle playlist visibility
+  togglePlaylist() {
+    this.playlistVisibleValue = !this.playlistVisibleValue;
+    this.updatePlaylistVisibility();
+    this.savePlaylistVisibility();
+  }
+  // Toggle between playlist and art view
+  toggleView() {
+    this.viewValue = this.viewValue === "playlist" ? "art" : "playlist";
+    this.updateView();
+  }
+  // Private: Handle time update for progress bar
+  handleTimeUpdate = () => {
+    const { currentTime, duration } = this.audioTarget;
+    if (duration) {
+      const percentage = currentTime / duration * 100;
+      this.progressBarTarget.value = percentage;
+      this.currentTimeTarget.textContent = formatTime(currentTime);
+      this.totalTimeTarget.textContent = formatTime(duration);
+    }
+  };
+  // Private: Handle metadata loaded
+  handleMetadataLoaded = () => {
+    const { duration } = this.audioTarget;
+    if (duration) {
+      this.totalTimeTarget.textContent = formatTime(duration);
+    }
+  };
+  // Private: advance to the next track when the current one finishes
+  handleEnded = () => {
+    this.next();
+  };
+  // Private: reflect the <audio> playing state in the UI
+  handlePlayEvent = () => {
+    this.playIconTarget.hidden = true;
+    this.pauseIconTarget.hidden = false;
+    this.element.classList.add("is-playing");
+  };
+  handlePauseEvent = () => {
+    this.playIconTarget.hidden = false;
+    this.pauseIconTarget.hidden = true;
+    this.element.classList.remove("is-playing");
+  };
+  // Private: Handle keyboard controls
+  handleKeydown = (event) => {
+    if (event.key === " " || event.key === "k") {
+      event.preventDefault();
+      this.togglePlay();
+    } else if (event.key === "ArrowLeft") {
+      event.preventDefault();
+      this.previous();
+    } else if (event.key === "ArrowRight") {
+      event.preventDefault();
+      this.next();
+    }
+  };
+  // Private: Update playlist visibility
+  updatePlaylistVisibility() {
+    if (this.playlistVisibleValue) {
+      this.songListTarget.classList.remove("is-hidden");
+    } else {
+      this.songListTarget.classList.add("is-hidden");
+    }
+  }
+  // Private: Update view mode
+  updateView() {
+    this.element.setAttribute("view", this.viewValue);
+  }
+  // Private: Save playlist visibility to localStorage
+  savePlaylistVisibility() {
+    try {
+      localStorage.setItem(`playlist-${this.playlistNameValue}-visibility`, this.playlistVisibleValue.toString());
+    } catch {
+    }
+  }
+}
+
+export { Playlist as default };
+//# sourceMappingURL=playlist_component_controller.js.map

package/dist/javascript/collection/app/components/midwest/playlist_component/playlist_component_controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"playlist_component_controller.js","sources":["../../../../../../../app/components/midwest/playlist_component/playlist_component_controller.ts"],"sourcesContent":["import { Controller } from '@hotwired/stimulus'\n\n// Format seconds as M:SS or MM:SS\nfunction formatTime(seconds: number): string {\n  const mins = Math.floor(seconds / 60)\n  const secs = Math.floor(seconds % 60)\n  return `${mins}:${secs.toString().padStart(2, '0')}`\n}\n\nexport default class Playlist extends Controller<HTMLElement> {\n  static targets = [\n    'audio',\n    'audioSource',\n    'playIcon',\n    'pauseIcon',\n    'trackTitle',\n    'trackArtist',\n    'artworkContainer',\n    'placeholderIcon',\n    'progressBar',\n    'currentTime',\n    'totalTime',\n    'songList',\n    'details'\n  ]\n\n  static values = {\n    playlistName: { type: String, default: 'Playlist' },\n    autoplay: { type: Boolean, default: false },\n    view: { type: String, default: 'playlist' },\n    playlistVisible: { type: Boolean, default: true },\n    artwork: { type: Boolean, default: false }\n  }\n\n  declare readonly audioTarget: HTMLAudioElement\n  declare readonly audioSourceTarget: HTMLSourceElement\n  declare readonly playIconTarget: HTMLElement\n  declare readonly pauseIconTarget: HTMLElement\n  declare readonly trackTitleTarget: HTMLHeadingElement\n  declare readonly trackArtistTarget: HTMLHeadingElement\n  declare readonly artworkContainerTarget: HTMLDivElement\n  declare readonly placeholderIconTarget: SVGElement\n  declare readonly progressBarTarget: HTMLProgressElement\n  declare readonly currentTimeTarget: HTMLHeadingElement\n  declare readonly totalTimeTarget: HTMLHeadingElement\n  declare readonly songListTarget: HTMLDivElement\n  declare readonly detailsTarget: HTMLDivElement\n\n  declare playlistNameValue: string\n  declare autoplayValue: boolean\n  declare viewValue: string\n  declare playlistVisibleValue: boolean\n  declare artworkValue: boolean\n\n  private currentIndex = 0\n  private songElements: HTMLElement[] = []\n\n  connect () {\n    // Find all song buttons in the playlist\n    this.songElements = Array.from(this.songListTarget.querySelectorAll<HTMLElement>('.midwest-song button'))\n\n    // Set initial playlist visibility\n    this.updatePlaylistVisibility()\n\n    // Set up audio event listeners (stable references so disconnect can remove them)\n    this.audioTarget.addEventListener('timeupdate', this.handleTimeUpdate)\n    this.audioTarget.addEventListener('loadedmetadata', this.handleMetadataLoaded)\n    this.audioTarget.addEventListener('ended', this.handleEnded)\n    this.audioTarget.addEventListener('play', this.handlePlayEvent)\n    this.audioTarget.addEventListener('pause', this.handlePauseEvent)\n\n    // Set up keyboard controls\n    this.element.addEventListener('keydown', this.handleKeydown)\n\n    // Auto-play if enabled\n    if (this.autoplayValue && this.songElements.length > 0) {\n      this.loadSong(0)\n    }\n  }\n\n  disconnect () {\n    this.audioTarget.removeEventListener('timeupdate', this.handleTimeUpdate)\n    this.audioTarget.removeEventListener('loadedmetadata', this.handleMetadataLoaded)\n    this.audioTarget.removeEventListener('ended', this.handleEnded)\n    this.audioTarget.removeEventListener('play', this.handlePlayEvent)\n    this.audioTarget.removeEventListener('pause', this.handlePauseEvent)\n    this.element.removeEventListener('keydown', this.handleKeydown)\n  }\n\n  // Play/pause toggle\n  togglePlay () {\n    if (this.audioTarget.paused) {\n      if (this.audioSourceTarget.src) {\n        this.audioTarget.play()\n      } else if (this.songElements.length > 0) {\n        this.loadSong(0)\n      }\n    } else {\n      this.audioTarget.pause()\n    }\n  }\n\n  // Play the song whose button was clicked (wired from the song template)\n  playSong (event: Event) {\n    const button = event.currentTarget as HTMLElement\n    const index = this.songElements.indexOf(button)\n    if (index === -1) return\n\n    // Clicking the already-playing track toggles play/pause instead of reloading\n    if (index === this.currentIndex && this.audioSourceTarget.src) {\n      this.togglePlay()\n      return\n    }\n\n    this.loadSong(index)\n  }\n\n  // Load and play a specific song by index\n  loadSong (index: number) {\n    const songButton = this.songElements[index]\n    if (!songButton) return\n\n    const songElement = songButton.closest('.midwest-song') as HTMLElement\n    if (!songElement) return\n\n    // Get song data from data attributes\n    const src = songElement.dataset.src\n    const title = songElement.dataset.title || 'Unknown'\n    const artist = songElement.dataset.artist || 'Unknown'\n    const picture = songElement.dataset.picture\n\n    if (!src) return\n\n    // Update audio source\n    this.audioSourceTarget.src = src\n    this.audioTarget.load()\n\n    // Update track info\n    this.trackTitleTarget.textContent = title\n    this.trackArtistTarget.textContent = artist\n\n    // Update artwork\n    if (picture) {\n      const img = document.createElement('img')\n      img.src = picture\n      img.alt = `Album art for ${title}`\n      img.className = 'midwest-playlist__artwork-image'\n\n      // Remove existing image\n      const existingImg = this.artworkContainerTarget.querySelector('.midwest-playlist__artwork-image')\n      if (existingImg) {\n        existingImg.replaceWith(img)\n      } else {\n        this.artworkContainerTarget.appendChild(img)\n      }\n\n      this.placeholderIconTarget.classList.add('hidden')\n    } else {\n      this.placeholderIconTarget.classList.remove('hidden')\n    }\n\n    // Update playing state on all songs\n    this.songElements.forEach((btn, i) => {\n      const song = btn.closest('.midwest-song') as HTMLElement\n      if (i === index) {\n        song.classList.add('is-playing')\n      } else {\n        song.classList.remove('is-playing')\n      }\n    })\n\n    this.currentIndex = index\n\n    // Auto-play after loading\n    this.audioTarget.play().catch(() => {\n      // Auto-play was prevented, that's ok\n    })\n  }\n\n  // Play next song\n  next () {\n    const nextIndex = (this.currentIndex + 1) % this.songElements.length\n    this.loadSong(nextIndex)\n  }\n\n  // Play previous song\n  previous () {\n    const prevIndex = this.currentIndex === 0\n      ? this.songElements.length - 1\n      : this.currentIndex - 1\n    this.loadSong(prevIndex)\n  }\n\n  // Seek to position in track\n  seek (event: Event) {\n    const rect = this.progressBarTarget.getBoundingClientRect()\n    const x = (event as MouseEvent).clientX - rect.left\n    const percentage = Math.max(0, Math.min(1, x / rect.width))\n\n    if (this.audioTarget.duration) {\n      this.audioTarget.currentTime = percentage * this.audioTarget.duration\n    }\n  }\n\n  // Toggle playlist visibility\n  togglePlaylist () {\n    this.playlistVisibleValue = !this.playlistVisibleValue\n    this.updatePlaylistVisibility()\n    this.savePlaylistVisibility()\n  }\n\n  // Toggle between playlist and art view\n  toggleView () {\n    this.viewValue = this.viewValue === 'playlist' ? 'art' : 'playlist'\n    this.updateView()\n  }\n\n  // Private: Handle time update for progress bar\n  private handleTimeUpdate = () => {\n    const { currentTime, duration } = this.audioTarget\n\n    if (duration) {\n      const percentage = (currentTime / duration) * 100\n      this.progressBarTarget.value = percentage\n\n      this.currentTimeTarget.textContent = formatTime(currentTime)\n      this.totalTimeTarget.textContent = formatTime(duration)\n    }\n  }\n\n  // Private: Handle metadata loaded\n  private handleMetadataLoaded = () => {\n    const { duration } = this.audioTarget\n    if (duration) {\n      this.totalTimeTarget.textContent = formatTime(duration)\n    }\n  }\n\n  // Private: advance to the next track when the current one finishes\n  private handleEnded = () => {\n    this.next()\n  }\n\n  // Private: reflect the <audio> playing state in the UI\n  private handlePlayEvent = () => {\n    this.playIconTarget.hidden = true\n    this.pauseIconTarget.hidden = false\n    this.element.classList.add('is-playing')\n  }\n\n  private handlePauseEvent = () => {\n    this.playIconTarget.hidden = false\n    this.pauseIconTarget.hidden = true\n    this.element.classList.remove('is-playing')\n  }\n\n  // Private: Handle keyboard controls\n  private handleKeydown = (event: KeyboardEvent) => {\n    if (event.key === ' ' || event.key === 'k') {\n      event.preventDefault()\n      this.togglePlay()\n    } else if (event.key === 'ArrowLeft') {\n      event.preventDefault()\n      this.previous()\n    } else if (event.key === 'ArrowRight') {\n      event.preventDefault()\n      this.next()\n    }\n  }\n\n  // Private: Update playlist visibility\n  private updatePlaylistVisibility () {\n    if (this.playlistVisibleValue) {\n      this.songListTarget.classList.remove('is-hidden')\n    } else {\n      this.songListTarget.classList.add('is-hidden')\n    }\n  }\n\n  // Private: Update view mode\n  private updateView () {\n    this.element.setAttribute('view', this.viewValue)\n  }\n\n  // Private: Save playlist visibility to localStorage\n  private savePlaylistVisibility () {\n    try {\n      localStorage.setItem(`playlist-${this.playlistNameValue}-visibility`, this.playlistVisibleValue.toString())\n    } catch {\n      // Ignore localStorage errors\n    }\n  }\n}\n"],"names":[],"mappings":"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"}