in sim/visuals/board.ts [822:858]
private updateGestures() {
let state = this.board;
if (state.accelerometerState.useShake && !this.shakeButtonGroup) {
const btnr = 2;
const width = 22;
const height = 10;
let btng = svg.child(this.g, "g", { class: "sim-button-group" });
this.shakeButtonGroup = btng;
this.shakeText = svg.child(this.g, "text", { x: 81, y: 32, class: "sim-text small" }) as SVGTextElement;
this.shakeText.textContent = "SHAKE"
svg.child(btng, "rect", { class: "sim-button-outer", x: 79, y: 25, rx: btnr, ry: btnr, width, height });
svg.fill(btng, this.props.theme.gestureButtonOff);
pointerEvents.down.forEach(evid => this.shakeButtonGroup.addEventListener(evid, ev => {
let state = this.board;
svg.fill(btng, this.props.theme.gestureButtonOn);
pxsim.U.addClass(this.shakeText, "inverted");
}));
this.shakeButtonGroup.addEventListener(pointerEvents.leave, ev => {
let state = this.board;
svg.fill(btng, this.props.theme.gestureButtonOff);
pxsim.U.removeClass(this.shakeText, "inverted");
})
this.shakeButtonGroup.addEventListener(pointerEvents.up, ev => {
let state = this.board;
svg.fill(btng, this.props.theme.gestureButtonOff);
this.board.bus.queue(DAL.DEVICE_ID_GESTURE, 11); // GESTURE_SHAKE
pxsim.U.removeClass(this.shakeText, "inverted");
})
accessibility.makeFocusable(this.shakeButtonGroup);
accessibility.enableKeyboardInteraction(this.shakeButtonGroup, () => {
this.board.bus.queue(DAL.DEVICE_ID_GESTURE, 11);
});
accessibility.setAria(this.shakeButtonGroup, "button", "Shake the board");
}
}