diff --git a/src/animation.js b/src/animation.js index 7f53b04..848bfee 100644 --- a/src/animation.js +++ b/src/animation.js @@ -15,6 +15,7 @@ class AnimationHandle { this.speed = this._speed = 1.0; this._lastChange = null; this._lastChangeX = null; + this._animationNaturalSpeed = animation.naturalSpeed; } play(player, time) { if (this._lastChange === null) { @@ -31,7 +32,7 @@ class AnimationHandle { } if (this.paused === false) { let dt = time - this._lastChange; - let x = this._lastChangeX + this.speed * dt; + let x = this._lastChangeX + (this.speed * this._animationNaturalSpeed) * dt; invokeAnimation(this.animation, player, x); } } @@ -55,17 +56,74 @@ class CompositeAnimation { } } -let WalkAnimation = (player, time) => { +let WalkingAnimation = (player, time) => { let skin = player.skin; - let angleRot = time + Math.PI / 2; - // Leg Swing - skin.leftLeg.rotation.x = Math.cos(angleRot); - skin.rightLeg.rotation.x = Math.cos(angleRot + (Math.PI)); + // Leg swing + skin.leftLeg.rotation.x = Math.sin(time) * 0.3; + skin.rightLeg.rotation.x = Math.sin(time + Math.PI) * 0.3; - // Arm Swing - skin.leftArm.rotation.x = Math.cos(angleRot + (Math.PI)); - skin.rightArm.rotation.x = Math.cos(angleRot); + // Arm swing + skin.leftArm.rotation.x = Math.sin(time + Math.PI) * 0.5; + skin.rightArm.rotation.x = Math.sin(time) * 0.5; + let basicArmRotationZ = Math.PI * 0.02; + skin.leftArm.rotation.z = Math.cos(time) * 0.03 + basicArmRotationZ; + skin.rightArm.rotation.z = Math.cos(time + Math.PI) * 0.03 - basicArmRotationZ; + + // Head shaking with different frequency & amplitude + skin.head.rotation.y = Math.sin(time / 2) * 0.2; + skin.head.rotation.x = Math.sin(time / 3) * 0.15; + + // Always add an angle for cape around the x axis + let basicCapeRotationX = Math.PI * 0.06; + player.cape.rotation.x = Math.sin(time / 1.5) * 0.06 + basicCapeRotationX; }; -export { CompositeAnimation, WalkAnimation, invokeAnimation }; +WalkingAnimation.naturalSpeed = 5; + +let RunningAnimation = (player, time) => { + let skin = player.skin; + + // Leg swing with larger amplitude + skin.leftLeg.rotation.x = Math.cos(time + Math.PI) * 1.3; + skin.rightLeg.rotation.x = Math.cos(time) * 1.3; + + // Arm swing + skin.leftArm.rotation.x = Math.cos(time) * 1.5; + skin.rightArm.rotation.x = Math.cos(time + Math.PI) * 1.5; + let basicArmRotationZ = Math.PI * 0.1; + skin.leftArm.rotation.z = Math.cos(time) * 0.1 + basicArmRotationZ; + skin.rightArm.rotation.z = Math.cos(time + Math.PI) * 0.1 - basicArmRotationZ; + + // Jumping + player.position.y = Math.cos(time * 2); + // Dodging when running + player.position.x = Math.cos(time) * 0.15; + // Slightly tilting when running + player.rotation.z = Math.cos(time + Math.PI) * 0.01; + + // Apply higher swing frequency, lower amplitude, + // and greater basic rotation around x axis, + // to cape when running. + let basicCapeRotationX = Math.PI * 0.3; + player.cape.rotation.x = Math.sin(time * 2) * 0.1 + basicCapeRotationX; + + // What about head shaking? + // You shouldn't glance right and left when running dude :P +}; + +RunningAnimation.naturalSpeed = 13; + +let RotatingAnimation = (player, time) => { + player.rotation.y = time; +}; + +RotatingAnimation.naturalSpeed = 1; + +export { + CompositeAnimation, + invokeAnimation, + WalkingAnimation, + RunningAnimation, + RotatingAnimation +}; diff --git a/src/skinview3d.js b/src/skinview3d.js index b5d5c86..a2a5644 100644 --- a/src/skinview3d.js +++ b/src/skinview3d.js @@ -1,3 +1,9 @@ export { SkinObject, CapeObject, PlayerObject } from "./model"; -export { SkinViewer, SkinControl } from "./viewer"; -export { invokeAnimation, CompositeAnimation, WalkAnimation } from "./animation"; +export { SkinViewer, MouseControl } from "./viewer"; +export { + invokeAnimation, + CompositeAnimation, + WalkingAnimation, + RunningAnimation, + RotatingAnimation +} from "./animation"; diff --git a/types/animation.d.ts b/types/animation.d.ts index 8fa4d62..0d00231 100644 --- a/types/animation.d.ts +++ b/types/animation.d.ts @@ -29,3 +29,5 @@ export class CompositeAnimation implements IAnimation { } export const WalkAnimation: AnimationFn; +export const RunningAnimation: AnimationFn; +export const RotatingAnimation: AnimationFn;