JuliusHerrmann/simulation_react
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

everyting but gif is missing 1 frame

Browse Source
This commit is contained in:
JuliusHerrmann 2022-01-07 02:00:50 +01:00
parent bf6f99e87c
commit 4042f232ff
2 changed files with 64 additions and 61 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/Simulation/visualizations/GIFGenerator.jsx
View File

@ -21,7 +21,8 @@ class GIFGenerator extends React.Component {
return;
}
this.setState({rendering: true});
this.setState({duration: Math.abs(this.state.duration)});
this.setState({duration: Number(Math.abs(this.state.duration))},
() => {
var gif = new GIF( {
workers: 2,
quality: 10,
@ -50,28 +51,31 @@ class GIFGenerator extends React.Component {
clearInterval(this.animationId);
this.props.setState({step: 0}, () => {
this.stepTime = 1;
//this.animationId = setInterval(this.visualizeOneStep, this.stepTime);
this.animationId = setInterval(this.grabImageAndNextStep.bind(null, gif, stepBefore), this.stepTime);
this.animationId = setInterval(this.grabImageAndNextStep.bind(null, gif, stepBefore,this.state.duration * 1000 / this.props.animationLength), 1);
this.props.setState({playing: true});
});
});
}
grabImageAndNextStep = (gif, stepBefore) => {
grabImageAndNextStep = (gif, stepBefore, delay) => {
//check if we are at the end
if (this.props.state.step > this.props.animationLength) {
if (this.props.state.step >= this.props.animationLength) {
//add last frame and finish
this.props.visualizeOneStep();
clearInterval(this.animationId);
gif.addFrame(document.querySelectorAll("canvas")[2],
{copy: true, delay: delay});
//reset animation
this.props.setState({playing: false});
this.props.setState({step: stepBefore});
this.props.visualizeOneStep(false);
clearInterval(this.animationId);
gif.render();
this.props.setState({playing: false});
return;
}
this.props.visualizeOneStep();
//select the canvas (this is a bit hacky but ey it works)
gif.addFrame(document.querySelectorAll("canvas")[2],
// there is probably a minimum cap.... I'm not sure
{copy: true, delay: this.state.duration / this.props.animationLength});
{copy: true, delay: delay});
}
getButtonText = () => {

1
src/Simulation/visualizations/Graph.jsx
View File

@ -124,7 +124,6 @@ class Graph extends React.Component {
this.setState({playing: true});
return;
}
console.log("here")
this.neverPlayed = false;
//check if we pause the animation
clearInterval(this.animationId);