Fixing race condition of button animation (#292)

This commit is contained in:
Peli de Halleux 2018-01-31 11:48:53 -08:00 committed by GitHub
parent 69d3938d85
commit 635d4a7624
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -47,14 +47,17 @@ namespace pxsim.visuals {
} }
private lastLightPattern: number = -1; private lastLightPattern: number = -1;
private lastLightAnimationId: any; private lastLightAnimationId: any = undefined;
private updateLight() { private updateLight() {
let state = ev3board().getBrickNode().lightState; let state = ev3board().getBrickNode().lightState;
const lightPattern = state.lightPattern; const lightPattern = state.lightPattern;
if (lightPattern == this.lastLightPattern) return; if (lightPattern == this.lastLightPattern) return;
this.lastLightPattern = lightPattern; this.lastLightPattern = lightPattern;
if (this.lastLightAnimationId) cancelAnimationFrame(this.lastLightAnimationId); if (this.lastLightAnimationId) {
cancelAnimationFrame(this.lastLightAnimationId);
delete this.lastLightAnimationId;
}
switch (lightPattern) { switch (lightPattern) {
case 0: // LED_BLACK case 0: // LED_BLACK
this.setStyleFill(this.normalizeId(BrickView.EV3_LIGHT_ID), this.normalizeId(`linear-gradient-black`)); this.setStyleFill(this.normalizeId(BrickView.EV3_LIGHT_ID), this.normalizeId(`linear-gradient-black`));
@ -94,6 +97,7 @@ namespace pxsim.visuals {
} }
private flashLightAnimation(id: string) { private flashLightAnimation(id: string) {
const pattern = this.lastLightPattern;
let fps = 3; let fps = 3;
let now; let now;
let then = Date.now(); let then = Date.now();
@ -101,8 +105,9 @@ namespace pxsim.visuals {
let delta; let delta;
let that = this; let that = this;
function draw() { function draw() {
if (that.lastLightPattern != pattern) return;
that.lastLightAnimationId = requestAnimationFrame(draw); that.lastLightAnimationId = requestAnimationFrame(draw);
now = Date.now(); now = pxsim.U.now();
delta = now - then; delta = now - then;
if (delta > interval) { if (delta > interval) {
then = now - (delta % interval); then = now - (delta % interval);
@ -124,6 +129,7 @@ namespace pxsim.visuals {
private pulseLightAnimation(id: string) { private pulseLightAnimation(id: string) {
const pattern = this.lastLightPattern;
let fps = 8; let fps = 8;
let now; let now;
let then = Date.now(); let then = Date.now();
@ -131,8 +137,9 @@ namespace pxsim.visuals {
let delta; let delta;
let that = this; let that = this;
function draw() { function draw() {
if (that.lastLightPattern != pattern) return;
that.lastLightAnimationId = requestAnimationFrame(draw); that.lastLightAnimationId = requestAnimationFrame(draw);
now = Date.now(); now = pxsim.U.now();
delta = now - then; delta = now - then;
if (delta > interval) { if (delta > interval) {
// update time stuffs // update time stuffs