testeranto 0.177.0 → 0.189.0

package/videos/project0/smil30/smil-qname-1.mod.xsd

@@ -0,0 +1,121 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- ...................................................................... -->
+<!-- SMIL Qualified Names Module  ......................................... -->
+<!--
+  file: smil-qname-1.mod
+  
+  This is SMIL 3.0.
+  
+     Copyright: 1998-2008 W3C (MIT, ERCIM, Keio), All Rights
+     Reserved.  See http://www.w3.org/Consortium/Legal/.
+  
+     Editor for SMIL 3.0: Sjoerd Mullender, CWI
+     Editor for previous versions of SMIL: Jacco van Ossenbruggen,
+     Sjoerd Mullender.
+     $Revision: 1.9 $
+     $Date: 2008/09/07 20:36:50 $
+  
+  This DTD module is identified by the PUBLIC and SYSTEM identifiers:
+  
+    PUBLIC "-//W3C//ENTITIES SMIL 3.0 Qualified Names 1.0//EN"
+    SYSTEM "http://www.w3.org/2008/SMIL30/smil-qname-1.mod"
+  
+  ......................................................................
+-->
+<!--
+  SMIL Qualified Names
+  
+  This module is contained in two parts, labeled Section 'A' and 'B':
+  
+    Section A declares parameter entities to support namespace-
+    qualified names, namespace declarations, and name prefixing 
+    for SMIL and extensions.
+  
+    Section B declares parameter entities used to provide
+    namespace-qualified names for all SMIL element types:
+  
+      %SMIL.animation.qname; the xmlns-qualified name for <animation>
+      %SMIL.video.qname;     the xmlns-qualified name for <video>
+      ...
+  
+  SMIL extensions would create a module similar to this one, 
+  using the '%smil-qname-extra.mod;' parameter entity to insert 
+  it within Section A.  A template module suitable for this purpose 
+  ('template-qname-1.mod') is included in the XHTML distribution.
+-->
+<!-- Section A: SMIL XML Namespace Framework :::::::::::::::::::::::::::::: -->
+<!--
+  1. Declare a %SMIL.prefixed; conditional section keyword, used
+  to activate namespace prefixing. The default value should 
+  inherit '%NS.prefixed;' from the DTD driver, so that unless 
+  overridden, the default behavior follows the overall DTD 
+  prefixing scheme.
+-->
+<!--
+  2. Declare parameter entities (e.g., %SMIL.xmlns;) containing 
+  the URI reference used to identify the SMIL namespace:
+-->
+<!--
+  3. Declare parameter entities (e.g., %SMIL.prefix;) containing
+     the default namespace prefix string(s) to use when prefixing 
+     is enabled. This may be overridden in the DTD driver or the
+     internal subset of a document instance. If no default prefix
+     is desired, this may be declared as an empty string.
+  
+  NOTE: As specified in [XMLNAMES], the namespace prefix serves 
+  as a proxy for the URI reference, and is not in itself significant.
+-->
+<!--
+  4. Declare parameter entities (e.g., %SMIL.pfx;) containing the 
+  colonized prefix(es) (e.g., '%SMIL.prefix;:') used when 
+  prefixing is active, an empty string when it is not.
+-->
+<!--
+  5. The parameter entity %SMIL.xmlns.extra.attrib; may be
+  redeclared to contain any non-SMIL namespace declaration
+  attributes for namespaces embedded in SMIL. When prefixing
+  is active it contains the prefixed xmlns attribute and any
+  namespace declarations embedded in SMIL, otherwise an empty
+  string.
+-->
+<xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema" elementFormDefault="qualified" xmlns:its="http://www.w3.org/2005/11/its">
+  <xs:import namespace="http://www.w3.org/2005/11/its" schemaLocation="its.xsd"/>
+  <xs:import namespace="http://www.w3.org/XML/1998/namespace" schemaLocation="xml.xsd"/>
+</xs:schema>
+<!--
+  Declare the two parameter entities used to support XLink,
+  first the parameter entity container for the URI used to
+  identify the XLink namespace:
+-->
+<!-- This contains the XLink namespace declaration attribute. -->
+<!-- declare qualified name extensions here -->
+<!-- Section B: SMIL Qualified Names :::::::::::::::::::::::::::::::::::::: -->
+<!--
+  This section declares parameter entities used to provide
+  namespace-qualified names for all SMIL element types.
+-->
+<!-- Structure Module -->
+<!-- BasicMedia Module -->
+<!-- MediaParam Module -->
+<!-- BrushMedia Module -->
+<!-- BasicTimeContainers Module -->
+<!-- BasicExclTimeContainers Module -->
+<!-- BasicPriorityClassContainers Module -->
+<!-- BasicContentControl Module -->
+<!-- CustomTestAttributes Module -->
+<!-- PrefetchControl Module -->
+<!-- StructureLayout Module -->
+<!-- BasicLayout Module -->
+<!-- MultiWindowLayout Module -->
+<!-- AlignmentLayout Module -->
+<!-- BasicText Module -->
+<!-- TextStyling Module -->
+<!-- BasicLinking -->
+<!-- Metainformation Module -->
+<!-- BasicTransitions Module -->
+<!-- InlineTransitions Module -->
+<!-- BasicAnimation Module -->
+<!-- UserState Module -->
+<!-- StateSubmission Module -->
+<!-- External Timing (Timesheets) -->
+<!-- end of smil-qname-1.mod -->

package/videos/project0/smil30/smil-qname-1.mod.xsd.1

@@ -0,0 +1,121 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- ...................................................................... -->
+<!-- SMIL Qualified Names Module  ......................................... -->
+<!--
+  file: smil-qname-1.mod
+  
+  This is SMIL 3.0.
+  
+     Copyright: 1998-2008 W3C (MIT, ERCIM, Keio), All Rights
+     Reserved.  See http://www.w3.org/Consortium/Legal/.
+  
+     Editor for SMIL 3.0: Sjoerd Mullender, CWI
+     Editor for previous versions of SMIL: Jacco van Ossenbruggen,
+     Sjoerd Mullender.
+     $Revision: 1.9 $
+     $Date: 2008/09/07 20:36:50 $
+  
+  This DTD module is identified by the PUBLIC and SYSTEM identifiers:
+  
+    PUBLIC "-//W3C//ENTITIES SMIL 3.0 Qualified Names 1.0//EN"
+    SYSTEM "http://www.w3.org/2008/SMIL30/smil-qname-1.mod"
+  
+  ......................................................................
+-->
+<!--
+  SMIL Qualified Names
+  
+  This module is contained in two parts, labeled Section 'A' and 'B':
+  
+    Section A declares parameter entities to support namespace-
+    qualified names, namespace declarations, and name prefixing 
+    for SMIL and extensions.
+  
+    Section B declares parameter entities used to provide
+    namespace-qualified names for all SMIL element types:
+  
+      %SMIL.animation.qname; the xmlns-qualified name for <animation>
+      %SMIL.video.qname;     the xmlns-qualified name for <video>
+      ...
+  
+  SMIL extensions would create a module similar to this one, 
+  using the '%smil-qname-extra.mod;' parameter entity to insert 
+  it within Section A.  A template module suitable for this purpose 
+  ('template-qname-1.mod') is included in the XHTML distribution.
+-->
+<!-- Section A: SMIL XML Namespace Framework :::::::::::::::::::::::::::::: -->
+<!--
+  1. Declare a %SMIL.prefixed; conditional section keyword, used
+  to activate namespace prefixing. The default value should 
+  inherit '%NS.prefixed;' from the DTD driver, so that unless 
+  overridden, the default behavior follows the overall DTD 
+  prefixing scheme.
+-->
+<!--
+  2. Declare parameter entities (e.g., %SMIL.xmlns;) containing 
+  the URI reference used to identify the SMIL namespace:
+-->
+<!--
+  3. Declare parameter entities (e.g., %SMIL.prefix;) containing
+     the default namespace prefix string(s) to use when prefixing 
+     is enabled. This may be overridden in the DTD driver or the
+     internal subset of a document instance. If no default prefix
+     is desired, this may be declared as an empty string.
+  
+  NOTE: As specified in [XMLNAMES], the namespace prefix serves 
+  as a proxy for the URI reference, and is not in itself significant.
+-->
+<!--
+  4. Declare parameter entities (e.g., %SMIL.pfx;) containing the 
+  colonized prefix(es) (e.g., '%SMIL.prefix;:') used when 
+  prefixing is active, an empty string when it is not.
+-->
+<!--
+  5. The parameter entity %SMIL.xmlns.extra.attrib; may be
+  redeclared to contain any non-SMIL namespace declaration
+  attributes for namespaces embedded in SMIL. When prefixing
+  is active it contains the prefixed xmlns attribute and any
+  namespace declarations embedded in SMIL, otherwise an empty
+  string.
+-->
+<xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema" elementFormDefault="qualified" xmlns:its="http://www.w3.org/2005/11/its">
+  <xs:import namespace="http://www.w3.org/2005/11/its" schemaLocation="its.xsd"/>
+  <xs:import namespace="http://www.w3.org/XML/1998/namespace" schemaLocation="xml.xsd"/>
+</xs:schema>
+<!--
+  Declare the two parameter entities used to support XLink,
+  first the parameter entity container for the URI used to
+  identify the XLink namespace:
+-->
+<!-- This contains the XLink namespace declaration attribute. -->
+<!-- declare qualified name extensions here -->
+<!-- Section B: SMIL Qualified Names :::::::::::::::::::::::::::::::::::::: -->
+<!--
+  This section declares parameter entities used to provide
+  namespace-qualified names for all SMIL element types.
+-->
+<!-- Structure Module -->
+<!-- BasicMedia Module -->
+<!-- MediaParam Module -->
+<!-- BrushMedia Module -->
+<!-- BasicTimeContainers Module -->
+<!-- BasicExclTimeContainers Module -->
+<!-- BasicPriorityClassContainers Module -->
+<!-- BasicContentControl Module -->
+<!-- CustomTestAttributes Module -->
+<!-- PrefetchControl Module -->
+<!-- StructureLayout Module -->
+<!-- BasicLayout Module -->
+<!-- MultiWindowLayout Module -->
+<!-- AlignmentLayout Module -->
+<!-- BasicText Module -->
+<!-- TextStyling Module -->
+<!-- BasicLinking -->
+<!-- Metainformation Module -->
+<!-- BasicTransitions Module -->
+<!-- InlineTransitions Module -->
+<!-- BasicAnimation Module -->
+<!-- UserState Module -->
+<!-- StateSubmission Module -->
+<!-- External Timing (Timesheets) -->
+<!-- end of smil-qname-1.mod -->

package/videos/project0/smil30/xml.xsd

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema" elementFormDefault="qualified" targetNamespace="http://www.w3.org/XML/1998/namespace" xmlns:its="http://www.w3.org/2005/11/its">
+  <xs:import schemaLocation="SMIL.xsd"/>
+  <xs:import namespace="http://www.w3.org/2005/11/its" schemaLocation="its.xsd"/>
+  <xs:attribute name="id" type="xs:ID"/>
+  <xs:attribute name="lang" type="LanguageCode.datatype"/>
+  <xs:attribute name="base" type="URI.datatype"/>
+  <xs:attribute name="space">
+    <xs:simpleType>
+      <xs:restriction base="xs:token">
+        <xs:enumeration value="default"/>
+        <xs:enumeration value="preserve"/>
+      </xs:restriction>
+    </xs:simpleType>
+  </xs:attribute>
+</xs:schema>

package/videos/project0/smil30/xml.xsd.1

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema" elementFormDefault="qualified" targetNamespace="http://www.w3.org/XML/1998/namespace" xmlns:its="http://www.w3.org/2005/11/its">
+  <xs:import schemaLocation="SMIL.xsd"/>
+  <xs:import namespace="http://www.w3.org/2005/11/its" schemaLocation="its.xsd"/>
+  <xs:attribute name="id" type="xs:ID"/>
+  <xs:attribute name="lang" type="LanguageCode.datatype"/>
+  <xs:attribute name="base" type="URI.datatype"/>
+  <xs:attribute name="space">
+    <xs:simpleType>
+      <xs:restriction base="xs:token">
+        <xs:enumeration value="default"/>
+        <xs:enumeration value="preserve"/>
+      </xs:restriction>
+    </xs:simpleType>
+  </xs:attribute>
+</xs:schema>

package/videos/project0/smil30/xml.xsd.2

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema" elementFormDefault="qualified" targetNamespace="http://www.w3.org/XML/1998/namespace" xmlns:its="http://www.w3.org/2005/11/its">
+  <xs:import schemaLocation="SMIL.xsd"/>
+  <xs:import namespace="http://www.w3.org/2005/11/its" schemaLocation="its.xsd"/>
+  <xs:attribute name="id" type="xs:ID"/>
+  <xs:attribute name="lang" type="LanguageCode.datatype"/>
+  <xs:attribute name="base" type="URI.datatype"/>
+  <xs:attribute name="space">
+    <xs:simpleType>
+      <xs:restriction base="xs:token">
+        <xs:enumeration value="default"/>
+        <xs:enumeration value="preserve"/>
+      </xs:restriction>
+    </xs:simpleType>
+  </xs:attribute>
+</xs:schema>

package/videos/project0/smil30.xsd

@@ -0,0 +1,137 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
+<head>
+  <title>Error 404 - Not found</title>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    <link rel="Help" href="/Help/" />
+  <link rel="stylesheet" href="/2008/site/css/minimum" type="text/css" media="all" />
+  <style type="text/css"  media="print, screen and (min-width: 481px)">@import url("/2008/site/css/advanced");</style>
+  <link href="/2008/site/css/minimum" rel="stylesheet" type="text/css" media="only screen and (max-width: 480px)" />
+  <meta name="viewport" content="width=device-width"/>
+  <link rel="stylesheet" href="/2008/site/css/print" type="text/css" media="print" />
+  <link rel="shortcut icon" href="/2008/site/images/favicon.ico" type="image/x-icon" />
+  </head>
+<body id="www-w3-org" class="w3c_public">
+ <div id="w3c_container">
+  <div id="w3c_mast"> <!-- #w3c_mast / Page top header -->
+   <h1 class="logo"><a tabindex="2" accesskey="1" href="/"><img src="/2008/site/images/logo-w3c-mobile-lg" width="90" height="53" alt="W3C" /></a>
+   <span class="alt-logo">W3C</span>
+   </h1>
+   <div id="w3c_nav">
+     <form action="https://www.w3.org/Help/search" method="get" enctype="application/x-www-form-urlencoded">
+       <!-- w3c_sec_nav is populated through js -->
+       <div class="w3c_sec_nav"><!-- --></div>
+           <ul class="main_nav"> <!-- Main navigation menu -->
+     <li class="first-item"><a href="/standards/">Standards</a></li><li><a href="/participate/">Participate</a></li><li><a href="/Consortium/membership">Membership</a></li><li class="last-item"><a href="/Consortium/">About W3C</a></li>
+       <li class="search-item">
+      <div id="search-form">
+       <input tabindex="3" class="text" name="q" value="" title="Search" />
+       <button id="search-submit" name="search-submit" type="submit"><img class="submit" src="/2008/site/images/search-button" alt="Search" width="21" height="17" /></button> 
+      </div>
+    </li>
+   </ul>
+
+     </form>
+   </div>
+  </div> <!-- /end #w3c_mast -->
+
+  <div id="w3c_main"> 
+    <div id="w3c_logo_shadow" class="w3c_leftCol">
+      <img height="32" alt="" src="/2008/site/images/logo-shadow" />
+    </div>
+   <div id="w3c_sidenavigation" class="w3c_leftCol">       <h2 class="offscreen">Site Navigation</h2>
+    <h3 class="category"><span class="ribbon"><a href="/Help/" title="Up to Help and FAQ">Help and FAQ <img src="/2008/site/images/header-link" alt="Header link" width="13" height="13" class="header-link"/></a></span></h3>
+       <ul class="theme">
+        <li><a href="/Help/Webmaster.html">FAQ about W3C Web Site</a></li>
+        <li><a href="/Consortium/siteindex.html">W3C Site Map</a></li>
+        <li><a href="/Help/Account/">W3C User Account Management</a></li>
+       </ul>
+       <br/>
+      </div>
+   <div class="w3c_mainCol">
+          <div id="w3c_crumbs">
+       <div id="w3c_crumbs_frame">
+        <ul class="bct"> <!-- .bct / Breadcrumbs -->
+          <li class="skip"><a tabindex="1" accesskey="2" title="Skip to content (e.g., when browsing via audio)" href="#w3c_content_body">Skip</a></li>
+          <li><a href="/">W3C</a>&#160;<span class="cr">&#x00bb;</span>&#160;</li>
+          <li><a href="/Consortium/">About&#160;W3C</a>&#160;<span class="cr">&#x00bb;</span>&#160;</li>
+          <li><a href="/Help/">Help&#160;and&#160;FAQ</a>&#160;<span class="cr">&#x00bb;</span>&#160;</li>
+          <li class="current">404 Not Found</li>
+        </ul>            
+     </div>
+    </div>
+    <h1 class="title">Document not found</h1>
+    <div id="w3c_content_body">
+    <div class="line">
+
+<p class="intro tPadding">
+  Sorry, the document you requested is not available.
+  Here are some steps you may try to find the page you were
+  looking for:
+</p>
+<ol class="show_items">
+  <li>If you typed the URL by hand then please make sure that it is exactly
+  as it should be. Also check the capitalization and that you are using
+  forward slashes ( / ).</li>
+  <li>If you are looking for information on a particular subject, please
+  start on the <a href="https://www.w3.org/">W3C Home
+  page</a> or <a href="https://www.w3.org/Consortium/siteindex.html">Site
+  Map</a>.</li>
+  <li>Try searching the site using the search box at the top of this page.</li>
+</ol>
+
+<p>The <a href="https://www.w3.org/Help/Webmaster">W3C Webmaster FAQ</a> has
+answers to frequently asked questions about our site.</p>
+          </div> <!-- /end .line -->
+        </div> <!-- /end #w3c_content_body -->
+      </div> <!-- /end #w3c_mainCol -->
+    </div> <!-- end #w3c_main -->
+  </div> <!-- /end #w3c_container -->
+
+<div id="w3c_footer">
+  <div id="w3c_footer-inner">
+    <h2 class="offscreen">Footer Navigation</h2>
+    <div class="w3c_footer-nav">
+      <h3>Navigation</h3>
+      <ul class="footer_top_nav">   
+       <li><a href="/">Home</a></li>
+       <li><a href="/standards/">Standards</a></li>
+       <li><a href="/participate/">Participate</a></li>
+       <li><a href="/Consortium/membership">Membership</a></li>
+       <li class="last-item"><a href="/Consortium/">About W3C</a></li>
+      </ul>
+    </div>
+    <div class="w3c_footer-nav">
+      <h3>Contact W3C</h3>
+      <ul class="footer_bottom_nav">
+           <li><a href="/Consortium/contact">Contact</a></li>
+           <li><a accesskey="0" href="/Help/">Help and FAQ</a></li>
+           <li><a href="/Consortium/sponsor/">Sponsor / Donate</a></li>
+           <li><a href="/Consortium/siteindex">Site Map</a></li>
+           <li><address id="w3c_signature"><a href="https://lists.w3.org/Archives/Public/site-comments/">Feedback</a></address></li>
+      </ul>
+    </div>
+    <div class="w3c_footer-nav">
+      <h3>W3C Updates</h3>
+      <ul class="footer_follow_nav">
+           <li>
+	   	   <a href="https://twitter.com/W3C" title="Follow W3C on Twitter"><img src="/2008/site/images/Twitter_bird_logo_2012.svg" alt="Twitter" class="social-icon" height="40"/></a>
+          </li>
+     </ul>
+    </div>
+    <!-- #footer address / page signature -->
+    <p class="copyright">Copyright &copy; 2025 <a href="https://www.w3.org/">World Wide Web Consortium</a>.
+    <abbr title="World Wide Web Consortium">W3C</abbr><sup>&reg;</sup>
+    <a href="https://www.w3.org/Consortium/Legal/ipr-notice#Legal_Disclaimer">liability</a>,
+    <a href="https://www.w3.org/Consortium/Legal/ipr-notice#W3C_Trademarks">trademark</a> and
+    <a rel="license" href="https://www.w3.org/Consortium/Legal/copyright-software" title="W3C Software and Document License">permissive document license</a> rules apply.</p>
+    
+  </div>
+</div><!-- /end #footer -->
+<div id="w3c_scripts">
+  <script type="text/javascript" src="/2008/site/js/main"></script>
+</div>
+
+</body>
+</html>
+

package/videos/project0/src/audio/metadata.json

@@ -0,0 +1,5 @@
+{
+  "duration": 121.752,
+  "file": "./narration.mp3",
+  "generatedAt": "2025-08-15T01:12:28.076Z"
+}

package/videos/project0/src/motion-canvas.d.ts

@@ -0,0 +1 @@
+/// <reference types="@motion-canvas/core/project" />

package/videos/project0/src/project.meta

@@ -0,0 +1,31 @@
+{
+  "version": 0,
+  "shared": {
+    "background": null,
+    "range": [
+      0,
+      null
+    ],
+    "size": {
+      "x": 1920,
+      "y": 1080
+    },
+    "audioOffset": 0
+  },
+  "preview": {
+    "fps": 30,
+    "resolutionScale": 1
+  },
+  "rendering": {
+    "fps": 60,
+    "resolutionScale": 1,
+    "colorSpace": "srgb",
+    "exporter": {
+      "name": "@motion-canvas/ffmpeg",
+      "options": {
+        "fastStart": true,
+        "includeAudio": true
+      }
+    }
+  }
+}

package/videos/project0/src/project.ts

@@ -0,0 +1,13 @@
+import { makeProject } from "@motion-canvas/core";
+import combinedAudio from "./audio/combined.mp3"; // Single combined audio file
+import durations from "./audio/durations.json";
+
+import scene1 from "./scenes/scene1";
+import scene2 from "./scenes/scene2";
+import scene3 from './scenes/scene3?scene';
+
+export default makeProject({
+  scenes: [scene1, scene2, scene3],
+  audio: combinedAudio,
+  experimentalFeatures: true
+});

package/videos/project0/src/scenes/example.meta

@@ -0,0 +1,5 @@
+{
+  "version": 0,
+  "timeEvents": [],
+  "seed": 1230194655
+}

package/videos/project0/src/scenes/scene1.meta

@@ -0,0 +1,3 @@
+{
+  "version": 0
+}

package/videos/project0/src/scenes/scene1.tsx

@@ -0,0 +1,129 @@
+import { makeScene2D, Txt, Rect } from '@motion-canvas/2d';
+import { all, createRef, waitFor } from '@motion-canvas/core';
+import problemAudio from '../audio/problem.mp3'; // Ensure this path is correct
+import durations from '../audio/durations.json';
+import { Layout } from '@motion-canvas/2d';
+
+// import testerantoLogo from '../../../../logo.svg';
+
+
+// import { all, createRef, waitFor, waitUntil } from '@motion-canvas/core';
+import { CodeBlock } from '@motion-canvas/2d/lib/components/CodeBlock';
+import { createSignal } from '@motion-canvas/core/lib/signals';
+
+export default makeScene2D(function* (view) {
+  // Create background
+  const background = createRef<Rect>();
+  const title = createRef<Txt>();
+  const codeExplosion = createRef<Layout>();
+  const codeCount = createSignal(0);
+
+  // console.log('Logo path:', testerantoLogo); // Debug logo path
+  view.add(
+    <>
+      <Rect
+        ref={background}
+        width={'100%'}
+        height={'100%'}
+        fill={'#1e1e2e'}
+      />
+      <Txt
+        ref={title}
+        text={"AI has changed the game forever"}
+        fontSize={60}
+        fontFamily={'JetBrains Mono'}
+        fill={'#cdd6f4'}
+        y={-300}
+        opacity={0}
+      />
+      <Layout
+        ref={codeExplosion}
+        layout
+        direction={'column'}
+        gap={20}
+        wrap={'wrap'}
+        width={1000}
+        height={600}
+      />
+    </>
+  );
+
+  // Animation sequence - perfectly timed to audio
+  const totalDuration = durations.problem.duration;
+
+  // Audio synchronization setup
+  const audioOffset = 0.5; // Start animation 0.5s before audio
+  yield* waitFor(audioOffset);
+
+  // Start audio playback with precise timing
+  try {
+    yield* all(
+      title().opacity(1, totalDuration * 0.08), // ~1.5s for title
+      waitFor(totalDuration * 0.08 - audioOffset)
+    );
+  } catch (error) {
+    console.error('Audio synchronization error:', error);
+    yield* title().opacity(1, 1.5); // Fallback timing
+  }
+
+  yield* title().opacity(1, totalDuration * 0.08); // ~1.5s for title
+
+  // Code explosion effect
+  const explosionDuration = totalDuration * 0.16; // ~3s
+  const colors = ['#f38ba8', '#fab387', '#f9e2af', '#a6e3a1', '#89b4fa', '#cba6f7'];
+  const files = ['App.tsx', 'index.html', 'styles.css', 'utils.js', 'config.json', 'api.ts'];
+
+  for (let i = 0; i < 50; i++) {
+    const x = (Math.random() - 0.5) * 1800;
+    const y = (Math.random() - 0.5) * 1000;
+    const scale = 0.5 + Math.random() * 1.5;
+    const color = colors[Math.floor(Math.random() * colors.length)];
+    const file = files[Math.floor(Math.random() * files.length)];
+
+    codeExplosion().add(
+      <CodeBlock
+        code={`// ${file}`}
+        fontSize={24}
+        fontFamily={'JetBrains Mono'}
+        fill={color}
+        x={x}
+        y={y}
+        scale={scale}
+        opacity={0}
+      />
+    );
+    codeCount(codeCount() + 1);
+    yield* waitFor(explosionDuration / 50); // Divide by number of iterations
+  }
+
+  // Files appear
+  yield* all(
+    ...codeExplosion().children().map(child =>
+      child.opacity(1, totalDuration * 0.08)
+    )
+  );
+
+  // Highlight relevant files
+  const relevantFiles = codeExplosion().children().slice(0, 3);
+  yield* all(
+    ...relevantFiles.map(file =>
+      file.scale(2, totalDuration * 0.08).to(1, totalDuration * 0.08)
+    )
+  );
+
+  // Zoom effect
+  yield* all(
+    ...relevantFiles.map(file =>
+      file.scale(3, totalDuration * 0.11).to(2, totalDuration * 0.11)
+    )
+  );
+
+  // Final message
+  yield* all(
+    title().text("AI has changed testing forever", totalDuration * 0.11),
+    ...relevantFiles.map(file =>
+      file.fill('#a6e3a1', totalDuration * 0.11)
+    )
+  );
+  yield* waitFor(totalDuration * 0.2); // Final buffer
+});