Some checks failed
CI/CD Pipeline / Test & Lint (16.x) (push) Has been cancelled
CI/CD Pipeline / Test & Lint (18.x) (push) Has been cancelled
CI/CD Pipeline / Test & Lint (20.x) (push) Has been cancelled
CI/CD Pipeline / Security Audit (push) Has been cancelled
Release / Validate Version (push) Has been cancelled
CI/CD Pipeline / Release (push) Has been cancelled
Release / Build and Test (push) Has been cancelled
Release / Create Release (push) Has been cancelled
Release / Publish to NPM (push) Has been cancelled
Release / Deploy Demo (push) Has been cancelled
Multi-Scheme Testing / Validate Naming Schemes (artist) (push) Has been cancelled
Multi-Scheme Testing / Validate Naming Schemes (hierarchical) (push) Has been cancelled
Multi-Scheme Testing / Validate Naming Schemes (legacy) (push) Has been cancelled
Multi-Scheme Testing / Validate Naming Schemes (semantic) (push) Has been cancelled
Multi-Scheme Testing / Test Scheme Conversions (push) Has been cancelled
Multi-Scheme Testing / Validate Demo Functionality (push) Has been cancelled
Multi-Scheme Testing / Performance Benchmarks (push) Has been cancelled
Performance Testing / Animation Conversion Performance (100, artist) (push) Has been cancelled
Performance Testing / Animation Conversion Performance (100, hierarchical) (push) Has been cancelled
Performance Testing / Animation Conversion Performance (100, legacy) (push) Has been cancelled
Performance Testing / Animation Conversion Performance (100, semantic) (push) Has been cancelled
Performance Testing / Animation Conversion Performance (1000, artist) (push) Has been cancelled
Performance Testing / Animation Conversion Performance (1000, hierarchical) (push) Has been cancelled
Performance Testing / Animation Conversion Performance (1000, legacy) (push) Has been cancelled
Performance Testing / Animation Conversion Performance (1000, semantic) (push) Has been cancelled
Performance Testing / Animation Conversion Performance (5000, artist) (push) Has been cancelled
Performance Testing / Animation Conversion Performance (5000, hierarchical) (push) Has been cancelled
Performance Testing / Animation Conversion Performance (5000, legacy) (push) Has been cancelled
Performance Testing / Animation Conversion Performance (5000, semantic) (push) Has been cancelled
Performance Testing / Memory Usage Analysis (push) Has been cancelled
Performance Testing / Demo Performance Audit (push) Has been cancelled
Performance Testing / Generate Performance Report (push) Has been cancelled
- Implemented StateHandler class with methods for entering, exiting, and updating states. - Created TypeStateHandler for handling typing state with appropriate animations and transitions. - Developed WaitStateHandler for managing idle state with quirk animations. - Added JSDoc documentation for all new classes and methods. - Included CSS styles for documentation formatting and syntax highlighting. fix: update standard configuration to include ignore for scripts directory
376 lines
9.7 KiB
HTML
376 lines
9.7 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<title>JSDoc: Source: animation/AnimationClip.js</title>
|
|
|
|
<script src="scripts/prettify/prettify.js"></script>
|
|
<script src="scripts/prettify/lang-css.js"></script>
|
|
<!--[if lt IE 9]>
|
|
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
|
|
<![endif]-->
|
|
<link
|
|
type="text/css"
|
|
rel="stylesheet"
|
|
href="styles/prettify-tomorrow.css"
|
|
/>
|
|
<link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css" />
|
|
</head>
|
|
|
|
<body>
|
|
<div id="main">
|
|
<h1 class="page-title">Source: animation/AnimationClip.js</h1>
|
|
|
|
<section>
|
|
<article>
|
|
<pre class="prettyprint source linenums"><code>/**
|
|
* @fileoverview Core animation classes for clip management and creation
|
|
* @module animation
|
|
*/
|
|
|
|
import * as THREE from 'three'
|
|
import { ClipTypes, Config } from '../constants.js'
|
|
|
|
/**
|
|
* Represents a single animation clip with metadata and Three.js action
|
|
* @class
|
|
*/
|
|
export class AnimationClip {
|
|
/**
|
|
* Create an animation clip
|
|
* @param {string} name - The name of the animation clip
|
|
* @param {THREE.AnimationClip} threeAnimation - The Three.js animation clip
|
|
* @param {Object} metadata - Parsed metadata from animation name
|
|
*/
|
|
constructor (name, threeAnimation, metadata) {
|
|
/**
|
|
* The name of the animation clip
|
|
* @type {string}
|
|
*/
|
|
this.name = name
|
|
|
|
/**
|
|
* The Three.js animation clip
|
|
* @type {THREE.AnimationClip}
|
|
*/
|
|
this.animation = threeAnimation
|
|
|
|
/**
|
|
* Parsed metadata about the animation
|
|
* @type {Object}
|
|
*/
|
|
this.metadata = metadata
|
|
|
|
/**
|
|
* The Three.js animation action
|
|
* @type {THREE.AnimationAction|null}
|
|
*/
|
|
this.action = null
|
|
|
|
/**
|
|
* The animation mixer
|
|
* @type {THREE.AnimationMixer|null}
|
|
*/
|
|
this.mixer = null
|
|
}
|
|
|
|
/**
|
|
* Create and configure a Three.js action for this clip
|
|
* @param {THREE.AnimationMixer} mixer - The animation mixer
|
|
* @returns {THREE.AnimationAction} The created action
|
|
*/
|
|
createAction (mixer) {
|
|
this.mixer = mixer
|
|
this.action = mixer.clipAction(this.animation)
|
|
|
|
// Configure based on type
|
|
if (
|
|
this.metadata.type === ClipTypes.LOOP ||
|
|
this.metadata.type === ClipTypes.NESTED_LOOP
|
|
) {
|
|
this.action.setLoop(THREE.LoopRepeat, Infinity)
|
|
} else {
|
|
this.action.setLoop(THREE.LoopOnce)
|
|
this.action.clampWhenFinished = true
|
|
}
|
|
|
|
return this.action
|
|
}
|
|
|
|
/**
|
|
* Play the animation with optional fade in
|
|
* @param {number} [fadeInDuration=0.3] - Fade in duration in seconds
|
|
* @returns {Promise<void>} Promise that resolves when fade in completes
|
|
*/
|
|
play (fadeInDuration = Config.DEFAULT_FADE_IN) {
|
|
if (this.action) {
|
|
this.action.reset()
|
|
this.action.fadeIn(fadeInDuration)
|
|
this.action.play()
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Stop the animation with optional fade out
|
|
* @param {number} [fadeOutDuration=0.3] - Fade out duration in seconds
|
|
* @returns {Promise<void>} Promise that resolves when fade out completes
|
|
*/
|
|
stop (fadeOutDuration = Config.DEFAULT_FADE_OUT) {
|
|
if (this.action) {
|
|
this.action.fadeOut(fadeOutDuration)
|
|
setTimeout(() => {
|
|
if (this.action) {
|
|
this.action.stop()
|
|
}
|
|
}, fadeOutDuration * 1000)
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Check if the animation is currently playing
|
|
* @returns {boolean} True if playing, false otherwise
|
|
*/
|
|
isPlaying () {
|
|
return this.action?.isRunning() || false
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Factory for creating animation clips with parsed metadata
|
|
* @class
|
|
*/
|
|
export class AnimationClipFactory {
|
|
/**
|
|
* Create an animation clip factory
|
|
* @param {AnimationLoader} animationLoader - The animation loader instance
|
|
*/
|
|
constructor (animationLoader) {
|
|
/**
|
|
* The animation loader for loading animation data
|
|
* @type {AnimationLoader}
|
|
*/
|
|
this.animationLoader = animationLoader
|
|
|
|
/**
|
|
* Cache for created animation clips
|
|
* @type {Map<string, AnimationClip>}
|
|
*/
|
|
this.clipCache = new Map()
|
|
}
|
|
|
|
/**
|
|
* Parse animation name and create clip metadata
|
|
* Format: [state]_[action]_[type] or [state]_[action]2[toState]_[emotion]_T
|
|
* @param {string} name - The animation name to parse
|
|
* @returns {Object} Parsed metadata object
|
|
*/
|
|
parseAnimationName (name) {
|
|
const parts = name.split('_')
|
|
const state = parts[0]
|
|
const action = parts[1]
|
|
|
|
// Handle transitions with emotions
|
|
if (parts[2]?.includes('2') && parts[3] === ClipTypes.TRANSITION) {
|
|
const [, toState] = parts[2].split('2')
|
|
return {
|
|
state,
|
|
action,
|
|
toState,
|
|
emotion: parts[2] || '',
|
|
type: ClipTypes.TRANSITION,
|
|
isTransition: true,
|
|
hasEmotion: true
|
|
}
|
|
}
|
|
|
|
// Handle regular transitions
|
|
if (parts[2] === ClipTypes.TRANSITION) {
|
|
return {
|
|
state,
|
|
action,
|
|
type: ClipTypes.TRANSITION,
|
|
isTransition: true
|
|
}
|
|
}
|
|
|
|
// Handle nested animations
|
|
if (parts[2] === ClipTypes.NESTED_IN || parts[2] === ClipTypes.NESTED_OUT) {
|
|
return {
|
|
state,
|
|
action,
|
|
type: parts[2],
|
|
nestedType: parts[3],
|
|
isNested: true
|
|
}
|
|
}
|
|
|
|
// Handle nested loops and quirks
|
|
if (
|
|
parts[3] === ClipTypes.NESTED_LOOP ||
|
|
parts[3] === ClipTypes.NESTED_QUIRK
|
|
) {
|
|
return {
|
|
state,
|
|
action,
|
|
subAction: parts[2],
|
|
type: parts[3],
|
|
isNested: true
|
|
}
|
|
}
|
|
|
|
// Handle standard loops and quirks
|
|
return {
|
|
state,
|
|
action,
|
|
type: parts[2],
|
|
isStandard: true
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Create an animation clip from a name
|
|
* @param {string} name - The animation name
|
|
* @returns {Promise<AnimationClip>} The created animation clip
|
|
*/
|
|
async createClip (name) {
|
|
if (this.clipCache.has(name)) {
|
|
return this.clipCache.get(name)
|
|
}
|
|
|
|
const metadata = this.parseAnimationName(name)
|
|
const animation = await this.animationLoader.loadAnimation(name)
|
|
|
|
const clip = new AnimationClip(name, animation, metadata)
|
|
this.clipCache.set(name, clip)
|
|
|
|
return clip
|
|
}
|
|
|
|
/**
|
|
* Create all animation clips from a model's animations
|
|
* @param {THREE.Object3D} model - The 3D model containing animations
|
|
* @returns {Promise<Map<string, AnimationClip>>} Map of animation name to clip
|
|
*/
|
|
async createClipsFromModel (model) {
|
|
const clips = new Map()
|
|
const animations = model.animations || []
|
|
|
|
for (const animation of animations) {
|
|
const clip = await this.createClip(animation.name, model)
|
|
clips.set(animation.name, clip)
|
|
}
|
|
|
|
return clips
|
|
}
|
|
|
|
/**
|
|
* Clear the clip cache
|
|
* @returns {void}
|
|
*/
|
|
clearCache () {
|
|
this.clipCache.clear()
|
|
}
|
|
|
|
/**
|
|
* Get cached clip by name
|
|
* @param {string} name - The animation name
|
|
* @returns {AnimationClip|undefined} The cached clip or undefined
|
|
*/
|
|
getCachedClip (name) {
|
|
return this.clipCache.get(name)
|
|
}
|
|
}
|
|
</code></pre>
|
|
</article>
|
|
</section>
|
|
</div>
|
|
|
|
<nav>
|
|
<h2><a href="index.html">Home</a></h2>
|
|
<h3>Modules</h3>
|
|
<ul>
|
|
<li><a href="module-StateHandler.html">StateHandler</a></li>
|
|
<li><a href="module-animation.html">animation</a></li>
|
|
<li>
|
|
<a href="module-animation_AnimationConstants.html"
|
|
>animation/AnimationConstants</a
|
|
>
|
|
</li>
|
|
<li>
|
|
<a href="module-animation_AnimationNameMapper.html"
|
|
>animation/AnimationNameMapper</a
|
|
>
|
|
</li>
|
|
<li><a href="module-constants.html">constants</a></li>
|
|
<li><a href="module-core.html">core</a></li>
|
|
<li><a href="module-factories.html">factories</a></li>
|
|
<li><a href="module-loaders.html">loaders</a></li>
|
|
<li><a href="module-owen.html">owen</a></li>
|
|
<li><a href="module-states.html">states</a></li>
|
|
</ul>
|
|
<h3>Classes</h3>
|
|
<ul>
|
|
<li>
|
|
<a href="module-StateHandler.StateHandler.html">StateHandler</a>
|
|
</li>
|
|
<li><a href="module-animation.AnimationClip.html">AnimationClip</a></li>
|
|
<li>
|
|
<a href="module-animation.AnimationClipFactory.html"
|
|
>AnimationClipFactory</a
|
|
>
|
|
</li>
|
|
<li>
|
|
<a
|
|
href="module-animation_AnimationNameMapper.AnimationNameMapper.html"
|
|
>AnimationNameMapper</a
|
|
>
|
|
</li>
|
|
<li>
|
|
<a href="module-core.OwenAnimationContext.html"
|
|
>OwenAnimationContext</a
|
|
>
|
|
</li>
|
|
<li>
|
|
<a href="module-factories.OwenSystemFactory.html"
|
|
>OwenSystemFactory</a
|
|
>
|
|
</li>
|
|
<li>
|
|
<a href="module-loaders.AnimationLoader.html">AnimationLoader</a>
|
|
</li>
|
|
<li>
|
|
<a href="module-loaders.GLTFAnimationLoader.html"
|
|
>GLTFAnimationLoader</a
|
|
>
|
|
</li>
|
|
<li>
|
|
<a href="module-states.ReactStateHandler.html">ReactStateHandler</a>
|
|
</li>
|
|
<li>
|
|
<a href="module-states.SleepStateHandler.html">SleepStateHandler</a>
|
|
</li>
|
|
<li><a href="module-states.StateFactory.html">StateFactory</a></li>
|
|
<li>
|
|
<a href="module-states.TypeStateHandler.html">TypeStateHandler</a>
|
|
</li>
|
|
<li>
|
|
<a href="module-states.WaitStateHandler.html">WaitStateHandler</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
|
|
<br class="clear" />
|
|
|
|
<footer>
|
|
Documentation generated by
|
|
<a href="https://github.com/jsdoc/jsdoc">JSDoc 4.0.4</a> on Sat May 24
|
|
2025 12:29:38 GMT+0200 (Midden-Europese zomertijd)
|
|
</footer>
|
|
|
|
<script>
|
|
prettyPrint();
|
|
</script>
|
|
<script src="scripts/linenumber.js"></script>
|
|
</body>
|
|
</html>
|