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

Merge branch 'master' into motorslider

Browse Source
This commit is contained in:
Sam El-Husseini
2018-01-10 09:56:59 -08:00
parent 16b9a5027d f64bf57000
commit 4e4f5495da
165 changed files with 13655 additions and 849 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
sim/visuals/board.ts
View File

@ -50,6 +50,15 @@ namespace pxsim.visuals {
fill:#5A5A5A;
}
.no-drag, .sim-text, .sim-text-pin {
user-drag: none;
user-select: none;
-moz-user-select: none;
-webkit-user-drag: none;
-webkit-user-select: none;
-ms-user-select: none;
}
/* Color Grid */
.sim-color-grid-circle:hover {
stroke-width: 0.4;
@ -192,8 +201,8 @@ namespace pxsim.visuals {
this.layoutView.updateTheme(theme);
}
private getControlForNode(id: NodeType, port: number) {
if (this.cachedControlNodes[id] && this.cachedControlNodes[id][port]) {
private getControlForNode(id: NodeType, port: number, useCache = true) {
if (useCache && this.cachedControlNodes[id] && this.cachedControlNodes[id][port]) {
return this.cachedControlNodes[id][port];
}
@ -352,6 +361,28 @@ namespace pxsim.visuals {
cancelAnimationFrame(animationId);
})
}
// 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);
}
private static previousSelectedInputs: number[];
private static previousSeletedOutputs: number[];
private static isPreviousInputSelected(index: number, id: number) {
if (EV3View.previousSelectedInputs && EV3View.previousSelectedInputs[index] == id) {
EV3View.previousSelectedInputs[index] = undefined;
return true;
}
return false;
}
private static isPreviousOutputSelected(index: number, id: number) {
if (EV3View.previousSeletedOutputs && EV3View.previousSeletedOutputs[index] == id) {
EV3View.previousSeletedOutputs[index] = undefined;
return true;
}
return false;
}
private begin() {
@ -394,7 +425,9 @@ namespace pxsim.visuals {
const view = this.getDisplayViewForNode(node.id, index);
if (!node.didChange() && !view.didChange()) return;
if (view) {
const control = view.getSelected() ? this.getControlForNode(node.id, index) : undefined;
const isSelected = EV3View.isPreviousInputSelected(index, node.id) || view.getSelected();
if (isSelected && !view.getSelected()) view.setSelected(true);
const control = isSelected ? this.getControlForNode(node.id, index, !node.modeChange()) : undefined;
const closeIcon = control ? this.getCloseIconView() : undefined;
this.layoutView.setInput(index, view, control, closeIcon);
view.updateState();
@ -413,7 +446,9 @@ namespace pxsim.visuals {
const view = this.getDisplayViewForNode(node.id, index);
if (!node.didChange() && !view.didChange()) return;
if (view) {
const control = view.getSelected() ? this.getControlForNode(node.id, index) : undefined;
const isSelected = EV3View.isPreviousOutputSelected(index, node.id) || view.getSelected();
if (isSelected && !view.getSelected()) view.setSelected(true);
const control = isSelected ? this.getControlForNode(node.id, index) : undefined;
const closeIcon = control ? this.getCloseIconView() : undefined;
this.layoutView.setOutput(index, view, control, closeIcon);
view.updateState();

2
sim/visuals/controls/colorGrid.ts
View File

@ -7,7 +7,7 @@ namespace pxsim.visuals {
getInnerView() {
this.group = svg.elt("g") as SVGGElement;
this.group.setAttribute("transform", `translate(1.02, 1.5) scale(0.8)`)
this.group.setAttribute("transform", `translate(2, 2.5) scale(0.6)`)
const colorIds = ['red', 'yellow', 'blue', 'green', undefined, 'grey'];
const colors = ['#f12a21', '#ffd01b', '#006db3', '#00934b', undefined, '#6c2d00'];

16
sim/visuals/layoutView.ts
View File

@ -173,15 +173,15 @@ namespace pxsim.visuals {
}
// Inject all ports
this.setInput(0, new PortView(0, 'A'));
this.setInput(1, new PortView(1, 'B'));
this.setInput(2, new PortView(2, 'C'));
this.setInput(3, new PortView(3, 'D'));
this.setInput(0, new PortView(0, '1'));
this.setInput(1, new PortView(1, '2'));
this.setInput(2, new PortView(2, '3'));
this.setInput(3, new PortView(3, '4'));
this.setOutput(0, new PortView(0, '1'));
this.setOutput(1, new PortView(1, '2'));
this.setOutput(2, new PortView(2, '3'));
this.setOutput(3, new PortView(3, '4'));
this.setOutput(0, new PortView(0, 'A'));
this.setOutput(1, new PortView(1, 'B'));
this.setOutput(2, new PortView(2, 'C'));
this.setOutput(3, new PortView(3, 'D'));
return this.contentGroup;
}

1
sim/visuals/nodes/colorSensorView.ts
View File

@ -14,6 +14,7 @@ namespace pxsim.visuals {
}
public updateState() {
super.updateState();
// TODO: show different color modes
}
}

44
sim/visuals/nodes/largeMotorView.ts
View File

@ -1,25 +1,51 @@
/// <reference path="./moduleView.ts" />
/// <reference path="./motorView.ts" />
namespace pxsim.visuals {
export class LargeMotorView extends ModuleView implements LayoutElement {
private static ROTATING_ECLIPSE_ID = "hole";
export class LargeMotorView extends MotorView implements LayoutElement {
constructor(port: number) {
super(LARGE_MOTOR_SVG, "large-motor", NodeType.LargeMotor, port);
super(LARGE_MOTOR_SVG, "large-motor", NodeType.LargeMotor, port, "hole");
}
private syncedMotor: MotorNode;
private syncedLabelG: SVGGElement;
updateState() {
super.updateState();
const motorState = ev3board().getMotors()[this.port];
if (!motorState) return;
const speed = motorState.getSpeed();
if (!speed) return;
this.setMotorAngle(motorState.getAngle());
const syncedMotor = motorState.getSynchedMotor();
if ((syncedMotor || this.syncedMotor) && syncedMotor != this.syncedMotor) {
this.syncedMotor = syncedMotor;
if (this.syncedMotor) {
this.showSyncedLabel(motorState, syncedMotor);
} else if (this.syncedLabelG) {
this.syncedLabelG.parentNode.removeChild(this.syncedLabelG);
}
}
}
private setMotorAngle(angle: number) {
const holeEl = this.content.getElementById(this.normalizeId(LargeMotorView.ROTATING_ECLIPSE_ID))
private showSyncedLabel(motorNode: MotorNode, syncedMotor: MotorNode) {
const a = String.fromCharCode('A'.charCodeAt(0) + motorNode.port);
const b = String.fromCharCode('A'.charCodeAt(0) + syncedMotor.port);
this.syncedLabelG = pxsim.svg.child(this.element, 'g', {'transform': 'scale(0.5)'}) as SVGGElement;
pxsim.svg.child(this.syncedLabelG, 'rect', {'rx': 15, 'ry': 15, 'x': 0, 'y': 0, 'width': 84, 'height': 34, 'fill': '#A8A9A8'});
pxsim.svg.child(this.syncedLabelG, 'circle', {'cx': 17, 'cy': 17, 'r': 15, 'fill': 'white'});
const leftLabel = pxsim.svg.child(this.syncedLabelG, 'text', {'transform': 'translate(11, 22)', 'class': 'no-drag', 'style': 'isolation: isolate;font-size: 16px;fill: #A8A9A8;font-family: ArialMT, Arial'});
leftLabel.textContent = a;
pxsim.svg.child(this.syncedLabelG, 'rect', {'rx': 0, 'ry': 0, 'x': 37, 'y': 12, 'width': 10, 'height': 3, 'fill': '#ffffff'});
pxsim.svg.child(this.syncedLabelG, 'rect', {'rx': 0, 'ry': 0, 'x': 37, 'y': 18, 'width': 10, 'height': 3, 'fill': '#ffffff'});
pxsim.svg.child(this.syncedLabelG, 'circle', {'cx': 67, 'cy': 17, 'r': 15, 'fill': 'white'});
const rightLabel = pxsim.svg.child(this.syncedLabelG, 'text', {'transform': 'translate(61, 22)', 'class': 'no-drag', 'style': 'isolation: isolate;font-size: 16px;fill: #A8A9A8;font-family: ArialMT, Arial'});
rightLabel.textContent = b;
}
protected renderMotorAngle(holeEl: Element, angle: number) {
const width = 125.92;
const height = 37.9;
const transform = `rotate(${angle} ${width / 2} ${height / 2})`;

23
sim/visuals/nodes/mediumMotorView.ts
View File

@ -2,34 +2,17 @@
namespace pxsim.visuals {
export const MOTOR_ROTATION_FPS = 32;
export class MediumMotorView extends ModuleView implements LayoutElement {
private static ROTATING_ECLIPSE_ID = "medmotor_Hole";
private hasPreviousAngle: boolean;
private previousAngle: number;
export class MediumMotorView extends MotorView implements LayoutElement {
constructor(port: number) {
super(MEDIUM_MOTOR_SVG, "medium-motor", NodeType.MediumMotor, port);
super(MEDIUM_MOTOR_SVG, "medium-motor", NodeType.MediumMotor, port, "medmotor_Hole");
}
public getPaddingRatio() {
return 1 / 5;
}
updateState() {
const motorState = ev3board().getMotors()[this.port];
if (!motorState) return;
const speed = motorState.getSpeed();
if (!speed) return;
this.setMotorAngle(motorState.getAngle());
}
private setMotorAngle(angle: number) {
const holeEl = this.content.getElementById(this.normalizeId(MediumMotorView.ROTATING_ECLIPSE_ID))
protected renderMotorAngle(holeEl: Element, angle: number) {
const width = 44.45;
const height = 44.45;
const transform = `translate(2 1.84) rotate(${angle} ${width / 2} ${height / 2})`;

18
sim/visuals/nodes/moduleView.ts
View File

@ -4,7 +4,8 @@ namespace pxsim.visuals {
protected content: SVGSVGElement;
protected controlShown: boolean;
protected selected: boolean;
protected opacity: number;
constructor(protected xml: string, protected prefix: string, protected id: NodeType, protected port: NodeType) {
super();
@ -106,19 +107,24 @@ namespace pxsim.visuals {
this.updateOpacity();
}
public updateState() {
this.updateOpacity();
}
protected updateOpacity() {
if (this.rendered) {
const opacity = this.selected ? "0.2" : "1";
if (this.hasClick()) {
this.setOpacity(opacity);
const opacity = this.selected ? 0.2 : 1;
if (this.hasClick() && this.opacity != opacity) {
this.opacity = opacity;
this.setOpacity(this.opacity);
if (this.selected) this.content.style.cursor = "";
else this.content.style.cursor = "pointer";
}
}
}
protected setOpacity(opacity: string) {
this.element.setAttribute("opacity", opacity);
protected setOpacity(opacity: number) {
this.element.setAttribute("opacity", `${opacity}`);
}
}
}

33
sim/visuals/nodes/motorView.ts Normal file
View File

@ -0,0 +1,33 @@
/// <reference path="./moduleView.ts" />
namespace pxsim.visuals {
export abstract class MotorView extends ModuleView implements LayoutElement {
constructor(xml: string, prefix: string, id: NodeType, port: NodeType,
protected rotating_hole_id: string) {
super(xml, prefix, id, port);
}
updateState() {
super.updateState();
const motorState = ev3board().getMotors()[this.port];
if (!motorState) return;
const speed = motorState.getSpeed();
if (!speed) return;
this.setMotorAngle(motorState.getAngle());
}
private setMotorAngle(angle: number) {
const holeEl = this.content.getElementById(this.normalizeId(this.rotating_hole_id))
this.renderMotorAngle(holeEl, angle);
}
protected abstract renderMotorAngle(holeEl: Element, angle: number): void;
getWiringRatio() {
return 0.37;
}
}
}

1
sim/visuals/view.ts
View File

@ -219,7 +219,6 @@ namespace pxsim.visuals {
this.changed = false;
return res;
}
}
export abstract class SimView<T extends BaseNode> extends View implements LayoutElement {