c_meyer/pxt-ev3
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix resizing flickering issue, remove flip animation on start, remove the need for a default height and width in the layout engine

Browse Source
This commit is contained in:
Sam El-Husseini 2017-12-24 11:59:01 -08:00
parent 88df2e14cb
commit 0aa41e9a64
3 changed files with 14 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
pxtarget.json
View File

@ -139,9 +139,7 @@
},
"monacoColors": {
"editor.background": "#ecf6ff"
},
"simAnimationEnter": "horizontal flip in",
"simAnimationExit": "horizontal flip out"
}
},
"ignoreDocsErrors": true
}

14
sim/visuals/board.ts
View File

@ -286,18 +286,13 @@ namespace pxsim.visuals {
window.addEventListener("resize", e => {
this.resize();
});
setTimeout(() => {
this.resize();
}, 200);
}
public resize() {
if (!this.element) return;
const bounds = this.element.getBoundingClientRect();
this.width = bounds.width;
this.height = bounds.height;
this.layoutView.layout(bounds.width, bounds.height);
this.width = document.body.offsetWidth;
this.height = document.body.offsetHeight;
this.layoutView.layout(this.width, this.height);
this.updateState();
let state = ev3board().screenState;
@ -340,6 +335,7 @@ namespace pxsim.visuals {
private begin() {
this.running = true;
this.updateState();
}
private running: boolean = false;
@ -405,7 +401,7 @@ namespace pxsim.visuals {
});
let state = ev3board().screenState;
if (!state.didChange()) {
if (state.didChange()) {
this.updateScreenStep(state);
}
}

17
sim/visuals/layoutView.ts
View File

@ -3,9 +3,6 @@
/// <reference path="./nodes/portView.ts" />
namespace pxsim.visuals {
export const DEFAULT_WIDTH = 350;
export const DEFAULT_HEIGHT = 700;
export const BRICK_HEIGHT_RATIO = 1 / 3;
export const MODULE_AND_WIRING_HEIGHT_RATIO = 1 / 3; // For inputs and outputs
@ -220,8 +217,10 @@ namespace pxsim.visuals {
this.offsets = [];
const contentWidth = this.width || DEFAULT_WIDTH;
const contentHeight = this.height || DEFAULT_HEIGHT;
const contentWidth = this.width;
if (!contentWidth) return;
const contentHeight = this.height;
if (!contentHeight) return;
const moduleHeight = this.getModuleHeight();
@ -337,16 +336,16 @@ namespace pxsim.visuals {
}
public getBrickHeight() {
return (this.height || DEFAULT_HEIGHT) * BRICK_HEIGHT_RATIO;
return this.height * BRICK_HEIGHT_RATIO;
}
public getWiringHeight() {
return (this.height || DEFAULT_HEIGHT) * WIRING_HEIGHT_RATIO;
return this.height * WIRING_HEIGHT_RATIO;
}
public getModuleBounds() {
return {
width: (this.width || DEFAULT_WIDTH) / 4,
width: this.width / 4,
height: this.getModuleHeight()
}
}
@ -360,7 +359,7 @@ namespace pxsim.visuals {
}
public getModuleHeight() {
return (this.height || DEFAULT_HEIGHT) * MODULE_HEIGHT_RATIO;
return this.height * MODULE_HEIGHT_RATIO;
}
}
}