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

Update simulator as per latest lego UI design for sensors. Fix full screen layout issues. (#554)

Browse Source
This commit is contained in:
Sam El-Husseini
2018-05-02 13:58:59 -07:00
committed by GitHub
parent 4825172423
commit 84990d66a9
14 changed files with 376 additions and 207 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
sim/visuals/board.ts
View File

@ -49,14 +49,14 @@ namespace pxsim.visuals {
font-size:16px;
}
.sim-text.large {
font-size:30px;
font-size:20px;
}
.sim-text.number {
font-family: Courier, Lato, Work Sans, PT Serif, Source Serif Pro;
/*font-weight: bold;*/
}
.sim-text.inverted {
fill:#5A5A5A;
fill: #5A5A5A; /*#F12B21;*/
}
.no-drag, .sim-text, .sim-text-pin {
@ -74,6 +74,10 @@ namespace pxsim.visuals {
stroke: #000;
cursor: pointer;
}
.sim-color-selected {
stroke-width: 1px !important;
stroke: #A8AAA8 !important;
}
.sim-color-wheel-half:hover {
stroke-width: 1;
stroke: #000;
@ -136,6 +140,8 @@ namespace pxsim.visuals {
private cachedControlNodes: { [index: string]: View[] } = {};
private cachedDisplayViews: { [index: string]: LayoutElement[] } = {};
private cachedCloseIcons: { [index: string]: View } = {};
private cachedBackgroundViews: { [index: string]: View } = {};
private screenCanvas: HTMLCanvasElement;
private screenCanvasCtx: CanvasRenderingContext2D;
@ -298,8 +304,22 @@ namespace pxsim.visuals {
return undefined;
}
private getCloseIconView() {
return new CloseIconControl(this.element, this.defs, new PortNode(-1), -1);
private getCloseIconView(port: number) {
if (this.cachedCloseIcons[port]) {
return this.cachedCloseIcons[port];
}
const closeIcon = new CloseIconControl(this.element, this.defs, new PortNode(-1), -1);
this.cachedCloseIcons[port] = closeIcon;
return closeIcon;
}
private getBackgroundView(port: number) {
if (this.cachedBackgroundViews[port]) {
return this.cachedBackgroundViews[port];
}
const backgroundView = new BackgroundViewControl(this.element, this.defs, new PortNode(-1), -1);
this.cachedBackgroundViews[port] = backgroundView;
return backgroundView;
}
private buildDom() {
@ -319,7 +339,7 @@ namespace pxsim.visuals {
const brick = new BrickViewPortrait(-1);
this.layoutView.setBrick(brick);
EV3View.isPreviousBrickLandscape() ? this.layoutView.setlectBrick() : this.layoutView.unselectBrick();
this.resize();
// Add Screen canvas to board
@ -392,29 +412,29 @@ namespace pxsim.visuals {
this.layoutView.getLandscapeBrick().kill();
// Save previous inputs for the next cycle
EV3View.previousSelectedInputs = ev3board().getInputNodes().map((node, index) => (this.getDisplayViewForNode(node.id, index).getSelected()) ? node.id : -1)
EV3View.previousSeletedOutputs = ev3board().getMotors().map((node, index) => (this.getDisplayViewForNode(node.id, index).getSelected()) ? node.id : -1);
EV3View.previousSelectedInputs = {};
ev3board().getInputNodes().forEach((node, index) =>
EV3View.previousSelectedInputs[index] = (this.getDisplayViewForNode(node.id, index).getSelected()));
EV3View.previousSeletedOutputs = {};
ev3board().getMotors().forEach((node, index) =>
EV3View.previousSeletedOutputs[index] = (this.getDisplayViewForNode(node.id, index).getSelected()));
EV3View.previousBrickLandscape = this.layoutView.isBrickLandscape();
}
private static previousSelectedInputs: number[];
private static previousSeletedOutputs: number[];
private static previousSelectedInputs: pxt.Map<boolean> = {};
private static previousSeletedOutputs: pxt.Map<boolean> = {};
private static previousBrickLandscape: boolean;
private static isPreviousInputSelected(index: number, id: number) {
if (EV3View.previousSelectedInputs && EV3View.previousSelectedInputs[index] == id) {
EV3View.previousSelectedInputs[index] = undefined;
return true;
}
return false;
private static isPreviousInputSelected(index: number) {
const previousInput = EV3View.previousSelectedInputs[index];
delete EV3View.previousSelectedInputs[index];
return previousInput;
}
private static isPreviousOutputSelected(index: number, id: number) {
if (EV3View.previousSeletedOutputs && EV3View.previousSeletedOutputs[index] == id) {
EV3View.previousSeletedOutputs[index] = undefined;
return true;
}
return false;
private static isPreviousOutputSelected(index: number) {
const previousOutput = EV3View.previousSeletedOutputs[index];
delete EV3View.previousSeletedOutputs[index];
return previousOutput;
}
private static isPreviousBrickLandscape() {
@ -463,11 +483,13 @@ namespace pxsim.visuals {
const view = this.getDisplayViewForNode(node.id, index);
if (!node.didChange() && !view.didChange()) return;
if (view) {
const isSelected = EV3View.isPreviousInputSelected(index, node.id) || view.getSelected();
if (isSelected && !view.getSelected()) view.setSelected(true);
const previousSelected = EV3View.isPreviousInputSelected(index);
const isSelected = previousSelected != undefined ? previousSelected : view.getSelected();
view.setSelected(isSelected);
const control = isSelected ? this.getControlForNode(node.id, index, !node.modeChange()) : undefined;
const closeIcon = control && view.hasClose() ? this.getCloseIconView() : undefined;
this.layoutView.setInput(index, view, control, closeIcon);
const closeIcon = control ? this.getCloseIconView(index + 10) : undefined;
const backgroundView = control && view.hasBackground() ? this.getBackgroundView(index + 10) : undefined;
this.layoutView.setInput(index, view, control, closeIcon, backgroundView);
view.updateState();
if (control) control.updateState();
}
@ -485,11 +507,13 @@ namespace pxsim.visuals {
const view = this.getDisplayViewForNode(node.id, index);
if (!node.didChange() && !view.didChange()) return;
if (view) {
const isSelected = EV3View.isPreviousOutputSelected(index, node.id) || view.getSelected();
if (isSelected && !view.getSelected()) view.setSelected(true);
const previousSelected = EV3View.isPreviousOutputSelected(index);
const isSelected = previousSelected != undefined ? previousSelected : view.getSelected();
view.setSelected(isSelected);
const control = isSelected ? this.getControlForNode(node.id, index) : undefined;
const closeIcon = control ? this.getCloseIconView() : undefined;
this.layoutView.setOutput(index, view, control, closeIcon);
const closeIcon = control ? this.getCloseIconView(index) : undefined;
const backgroundView = control && view.hasBackground() ? this.getBackgroundView(index) : undefined;
this.layoutView.setOutput(index, view, control, closeIcon, backgroundView);
view.updateState();
if (control) control.updateState();
}