animate_it 0.2.0 → 0.3.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: fb4e829854a53280979963178429b03b60d9deaf1350b26f06d5f30a69cc44fb
-  data.tar.gz: c1b96fbeb407a50e073a7e2e59df91d9287d3e02f6df7bdf6b2aef7053628e45
+  metadata.gz: 95bcfafc0a059c64d5f3a4097a308ba2b7b9fff58cafdb18de720926e02cb07e
+  data.tar.gz: 268da7e42d644633ee56bafb7528e7051280474647873d31bad585b07bd472cb
 SHA512:
-  metadata.gz: a4cfbbca87fe87459fed715f909d3c80743dc2ff1da0df7fc9acf82daf1e9d9319993a8733d2e417e5b46cd477becd2c7f716947f1fdf33c1707e173626c95b8
-  data.tar.gz: 034c051d6bb5a16f98a4682caee7c0290fb80ca6a0289735b71447246592ad003eb96f869b7da3d920e30c758cceac88d87d8f3831bbe1c2739366a61ec71d10
+  metadata.gz: d4cd9739b39aecc9d9cedf7d159718a768b7ba26ad3c4382e6f1bd96226ba70c4d59d708c57c263124eb07d39f0ff21bf3daab91733e774ffa15457dd8f3cf9e
+  data.tar.gz: c6f480ba02780a0c2cff836d061247961985138916607a318e6a4311456e8627684179dd52a81d16ab8fe30b413192f9126e9c3073306799299c8a8ff5ec06ec

data/CHANGELOG.md

@@ -6,6 +6,29 @@ adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
 ## [Unreleased]
 
+### Fixed
+- Studio audio is now served with HTTP byte-range support (Accept-Ranges,
+  206 Partial Content). Browsers refuse to seek media served without it, so
+  play-pause-play and scrub-then-play restarted clips from 0:00.
+
+## [0.3.1] - 2026-07-22
+
+### Changed
+- Relaxed the HAML dependency from `~> 6.3` to `>= 6.3` so hosts on HAML 7 are
+  not forced to downgrade.
+
+## [0.3.0] - 2026-07-22
+
+### Fixed
+- Studio playback started from a scrubbed position could seek the audio before
+  its metadata had loaded; the seek silently failed and the clip played from
+  0:00 instead of the playhead offset. The seek is now deferred until
+  `loadedmetadata`.
+- Studio playback now stops on Turbo navigation (`turbo:before-visit`,
+  `turbo:before-cache`) and `pagehide` — Turbo swaps the body without unloading
+  the window, so a detached, still-playing audio element kept sounding under
+  the next page.
+
 ## [0.2.0] - 2026-07-09
 
 ### Added
@@ -35,6 +58,8 @@ adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 - `render_animate_it_video` executable and `animate_it:render` rake task.
 - `animate_it:install` generator.
 
-[Unreleased]: https://github.com/growth-constant/animate_it/compare/v0.2.0...HEAD
+[Unreleased]: https://github.com/joinbuildit/animate_it/compare/v0.3.1...HEAD
+[0.3.1]: https://github.com/joinbuildit/animate_it/compare/v0.3.0...v0.3.1
+[0.3.0]: https://github.com/growth-constant/animate_it/compare/v0.2.0...v0.3.0
 [0.2.0]: https://github.com/growth-constant/animate_it/compare/v0.1.0...v0.2.0
 [0.1.0]: https://github.com/growth-constant/animate_it/releases/tag/v0.1.0

data/README.md

@@ -176,6 +176,19 @@ end
 Render concurrency for the Studio's background renderer is tunable via
 `ANIMATE_IT_RENDER_CONCURRENCY` and `ANIMATE_IT_RENDER_STARTS_PER_SECOND`.
 
+## Claude skill
+
+If you use [Claude Code](https://claude.com/claude-code), this repo ships an
+Agent Skill that teaches Claude how to author AnimateIt compositions — the DSL,
+the render pipeline, embedding, rendering your app's real partials, motion
+craft, and the gotchas. Install it into your project's `.claude/skills/`:
+
+```bash
+npx animate-it-skills          # copies the skill into ./.claude/skills
+```
+
+The skill source lives in [`skills/`](skills/).
+
 ## Development
 
 ```bash

data/app/controllers/animate_it/audio_controller.rb

@@ -10,12 +10,25 @@ module AnimateIt
       file_path = resolve_audio_path(segment.source[:path])
       return head :not_found unless file_path && File.file?(file_path)
 
-      send_file file_path, type: Mime::Type.lookup_by_extension(File.extname(file_path).delete(".")),
-                           disposition: "inline"
+      serve_with_byte_ranges(file_path)
     end
 
     private
 
+    # send_file ignores Range headers, and browsers refuse to seek media
+    # served without byte-range support — every currentTime seek snaps back
+    # to 0:00, so the Studio player restarts clips from the beginning.
+    # Rack::Files implements range semantics (Accept-Ranges, 206/416).
+    def serve_with_byte_ranges(file_path)
+      status, headers, body = Rack::Files.new(File.dirname(file_path)).serving(request, file_path)
+      headers["content-type"] = Mime::Type.lookup_by_extension(File.extname(file_path).delete(".")).to_s
+      headers["content-disposition"] = "inline"
+      headers["accept-ranges"] = "bytes"
+      self.status = status
+      self.response_body = body
+      headers.each { |key, value| response.headers[key] = value }
+    end
+
     def resolve_audio_path(path)
       return nil if path.blank?
 

data/app/views/animate_it/studio/_studio_script.html.haml

@@ -141,6 +141,21 @@
       playheads.forEach((el) => { el.style.left = `${pct}%`; });
     };
 
+    // Seeking before the clip's metadata has loaded doesn't stick — it would
+    // start at 0:00 regardless of the scrubbed position. Defer the seek
+    // (recomputed from the then-current frame) until metadata is available.
+    const startAudio = (el) => {
+      const begin = () => {
+        if (timer === null) return; // stopped before metadata arrived
+        const { start, len } = audioWindow(el);
+        if (frame < start || frame >= start + len) return; // playhead left the window
+        el.currentTime = (frame - start) / fps;
+        el.play().catch(() => {});
+      };
+      if (el.readyState >= 1) begin();
+      else el.addEventListener("loadedmetadata", begin, { once: true });
+    };
+
     // Audio is audible only while actually playing — seeking/scrubbing is
     // silent. Each element plays only inside its own window, seeked to the
     // matching offset, so you hear exactly what belongs at the current frame.
@@ -153,10 +168,7 @@
           // playing, leave it on its own real-time clock: re-seeking every
           // frame to chase the setInterval-driven frame counter (which lags
           // real time) is what chops the audio.
-          if (el.paused) {
-            el.currentTime = (currentFrame - start) / fps;
-            el.play().catch(() => {});
-          }
+          if (el.paused) startAudio(el);
         } else if (!el.paused) {
           el.pause();
         }
@@ -264,6 +276,13 @@
       }
     });
 
+    // Turbo Drive swaps the body without unloading the window: detached
+    // <audio> elements keep playing and the playback loop keeps ticking.
+    // Stop this page's playback before navigating away or caching.
+    document.addEventListener("turbo:before-visit", stop, { once: true });
+    document.addEventListener("turbo:before-cache", stop, { once: true });
+    window.addEventListener("pagehide", stop, { once: true });
+
     window.AnimateItStudio = {
       setFrame,
       currentFrame: () => frame

data/lib/animate_it/version.rb

@@ -1,3 +1,3 @@
 module AnimateIt
-  VERSION = "0.2.0".freeze
+  VERSION = "0.3.1".freeze
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: animate_it
 version: !ruby/object:Gem::Version
-  version: 0.2.0
+  version: 0.3.1
 platform: ruby
 authors:
 - growth-constant
@@ -13,14 +13,14 @@ dependencies:
   name: haml
   requirement: !ruby/object:Gem::Requirement
     requirements:
-    - - "~>"
+    - - ">="
       - !ruby/object:Gem::Version
         version: '6.3'
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
-    - - "~>"
+    - - ">="
       - !ruby/object:Gem::Version
         version: '6.3'
 - !ruby/object:Gem::Dependency