technicalkiwi
/
animate
mirror of https://github.com/SamEyeBam/animate.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

EAT ANiMation, duration is now number of bites. also fixxed timestamp

This commit is contained in:
Sam 2024-06-29 21:37:51 +12:00
parent ecd605e6e4
commit 8a6aa8beab
3 changed files with 23 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
Larry the snail/js/helper.js
View File

@ -24,15 +24,15 @@ async function fetchConfig(className) {
{ {
type: "range", type: "range",
min: 0, min: 0,
max: 20, max: 100,
defaultValue: 2, defaultValue: 50,
property: "eatSpeed" property: "eatSpeed"
}, },
{ {
type: "range", type: "range",
min: 0, min: 0,
max: 10000, max: 10,
defaultValue: 3000, defaultValue: 1,
property: "eatDuration" property: "eatDuration"
}, },
// Button control to start eating // Button control to start eating

2
Larry the snail/js/index.js
View File

@ -8,7 +8,7 @@ centerY = ctx.canvas.height / 2;
ctx.imageSmoothingEnabled = false; ctx.imageSmoothingEnabled = false;
let deg_per_sec = 10; let deg_per_sec = 60;
let targetFps = 60; let targetFps = 60;
let frameDuration = 1000 / targetFps; let frameDuration = 1000 / targetFps;

27
Larry the snail/js/objects.js
View File

@ -60,6 +60,7 @@ class Larry extends BaseShape {
this.speedMultiplier = 100; this.speedMultiplier = 100;
this.isEating = false; this.isEating = false;
this.eatEndTimestamp= 0;
this.eatDuration = eatDuration; this.eatDuration = eatDuration;
this.eatSpeed = eatSpeed; this.eatSpeed = eatSpeed;
@ -77,13 +78,16 @@ class Larry extends BaseShape {
this.hatXoffset = 0; this.hatXoffset = 0;
this.hatYoffset = 0; this.hatYoffset = 0;
this.lastTimestamp = 0;
} }
draw(timestamp) { draw(timestamp) {
timestamp *= (this.speedMultiplier / 100); timestamp *= (this.speedMultiplier / 100);
// console.log(timestamp - this.lastTimestamp)
this.lastTimestamp = timestamp;
// Draw background // Draw background
if (this.backgroundImage.src) { if (this.backgroundImage.src) {
console.log("drawing background: " + this.backgroundImage.src) // console.log("drawing background: " + this.backgroundImage.src)
ctx.drawImage(this.backgroundImage, centerX - (this.backgroundImage.width), centerY - this.backgroundImage.height, this.backgroundImage.width * 2, this.backgroundImage.height * 2); ctx.drawImage(this.backgroundImage, centerX - (this.backgroundImage.width), centerY - this.backgroundImage.height, this.backgroundImage.width * 2, this.backgroundImage.height * 2);
} }
@ -98,10 +102,14 @@ class Larry extends BaseShape {
// let headY = bodyY + this.headOffsetY - this.headHeight; // let headY = bodyY + this.headOffsetY - this.headHeight;
const headX = bodyX + (53.5 * this.magnitude - this.headWidth * this.magnitude / 2); const headX = bodyX + (53.5 * this.magnitude - this.headWidth * this.magnitude / 2);
let headY = bodyY + (this.bodyHeight * this.magnitude - 7 * this.magnitude) - this.headHeight * this.magnitude; let headY = bodyY + (this.bodyHeight * this.magnitude - 7 * this.magnitude) - this.headHeight * this.magnitude;
if (this.isEating === true) { if (timestamp < this.eatEndTimestamp) {
console.log("eating")
const adjustedTimestamp = timestamp -this.eatEndTimestamp + parseInt(this.eatDuration)/(1000/60);
console.log(adjustedTimestamp)
const eatMaxHeight = 20; const eatMaxHeight = 20;
const eatingYOffset = ((Math.sin((timestamp * 2 * Math.PI * this.eatSpeed * 0.1) - Math.PI / 2) + 1) / 2) * eatMaxHeight; // const eatingYOffset = ((Math.cos((adjustedTimestamp -Math.PI/2+ 0.5 * Math.PI) * (this.eatSpeed/100)*0.1 - Math.PI / 2) + 1) / 2) * eatMaxHeight;
const eatingYOffset = ((Math.sin((adjustedTimestamp * 2 * Math.PI * this.eatSpeed/100 * 0.1) - Math.PI / 2) + 1) / 2) * eatMaxHeight;
headY -= eatingYOffset; headY -= eatingYOffset;
} }
ctx.drawImage(this.headImage, headX, headY, this.headWidth * this.magnitude, this.headHeight * this.magnitude); ctx.drawImage(this.headImage, headX, headY, this.headWidth * this.magnitude, this.headHeight * this.magnitude);
@ -133,12 +141,13 @@ class Larry extends BaseShape {
startEating() { startEating() {
console.log("Larry starts eating"); console.log("Larry starts eating");
console.log(this.eatDuration)
this.isEating = true; this.isEating = true;
setTimeout(() => { this.eatEndTimestamp = this.lastTimestamp + (parseInt(this.eatDuration)/3)*1000/(1000/60);
this.isEating = false; console.log(this.eatEndTimestamp)
console.log("Larry stops eating"); // setTimeout(() => {
}, this.eatDuration); // Adjust duration as needed // this.isEating = false;
// console.log("Larry stops eating");
// }, this.eatDuration); // Adjust duration as needed
} }
applyHat() { applyHat() {