diff --git a/libs/infrared-sensor/ir.ts b/libs/infrared-sensor/ir.ts
index 028e7d79..bef06d5e 100644
--- a/libs/infrared-sensor/ir.ts
+++ b/libs/infrared-sensor/ir.ts
@@ -129,7 +129,7 @@ namespace sensors {
* @param ev the event to wait for
*/
//% help=input/remote-infrared-beacon/pause-until
- //% blockId=remotebuttonEvent block="pause until %button|%event"
+ //% blockId=remoteButtonPauseUntil block="pause until %button|%event"
//% parts="remote"
//% blockNamespace=sensors
//% weight=99 blockGap=8
diff --git a/sim/visuals/assets/RemoteSvg.ts b/sim/visuals/assets/RemoteSvg.ts
new file mode 100644
index 00000000..bbd85312
--- /dev/null
+++ b/sim/visuals/assets/RemoteSvg.ts
@@ -0,0 +1,21 @@
+namespace pxsim.visuals {
+ export const REMOVE_SVG = `
+
+
+ `;
+}
\ No newline at end of file
diff --git a/sim/visuals/assets/infrared.svg b/sim/visuals/assets/infrared.svg
new file mode 100644
index 00000000..dd329ffb
--- /dev/null
+++ b/sim/visuals/assets/infrared.svg
@@ -0,0 +1,48 @@
+
diff --git a/sim/visuals/assets/infraredsvg.ts b/sim/visuals/assets/infraredsvg.ts
index 00768506..b54a59ae 100644
--- a/sim/visuals/assets/infraredsvg.ts
+++ b/sim/visuals/assets/infraredsvg.ts
@@ -1,79 +1,53 @@
namespace pxsim {
- export const INFRARED_SVG = `
+
+ `;
}
\ No newline at end of file
diff --git a/sim/visuals/assets/remote.svg b/sim/visuals/assets/remote.svg
new file mode 100644
index 00000000..6fa2e99b
--- /dev/null
+++ b/sim/visuals/assets/remote.svg
@@ -0,0 +1,16 @@
+
diff --git a/sim/visuals/controls/remoteBeaconButtons.ts b/sim/visuals/controls/remoteBeaconButtons.ts
index 5ef78e1f..d547449c 100644
--- a/sim/visuals/controls/remoteBeaconButtons.ts
+++ b/sim/visuals/controls/remoteBeaconButtons.ts
@@ -11,47 +11,47 @@ namespace pxsim.visuals {
export class RemoteBeaconButtonsControl extends ControlView {
private group: SVGGElement;
-
+ private id = Math.random().toString();
+
getInnerView() {
this.group = svg.elt("g") as SVGGElement;
- this.group.setAttribute("transform", `translate(2, 2.5) scale(0.6)`)
+ this.group.setAttribute("transform", `scale(0.25, 0.25)`)
+
+ const xml = pxsim.visuals.normalizeXml(this.id, pxsim.visuals.REMOVE_SVG);
+ const content = svg.parseString(xml);
+ this.group.appendChild(content);
- const btnIds = [
- InfraredRemoteButton.CenterBeacon,
- InfraredRemoteButton.TopLeft,
- InfraredRemoteButton.TopRight,
- InfraredRemoteButton.BottomLeft,
- InfraredRemoteButton.BottomRight];
- const colors = ['#f12a21', '#ffd01b', '#006db3', '#00934b', '#6c2d00'];
-
- let cy = -4;
- btnIds.forEach((cid, c) => {
- const cx = c % 2 == 0 ? 2.2 : 8.2;
- if (c % 2 == 0) cy += 5;
- if (btnIds[c]) {
- const circle = pxsim.svg.child(this.group, "circle", { 'class': 'sim-color-grid-circle', 'cx': cx, 'cy': cy, 'r': '2', 'style': `fill: ${colors[c]}` });
- pointerEvents.down.forEach(evid => circle.addEventListener(evid, ev => {
- ev3board().remoteState.setPressed(cid, true);
- }));
- circle.addEventListener(pointerEvents.leave, ev => {
- ev3board().remoteState.setPressed(cid, false);
- });
- circle.addEventListener(pointerEvents.up, ev => {
- ev3board().remoteState.setPressed(cid, true);
- });
- }
-
- })
+ const btns: Map = {
+ "center": InfraredRemoteButton.CenterBeacon,
+ "topleft": InfraredRemoteButton.TopLeft,
+ "topright": InfraredRemoteButton.TopRight,
+ "bottomleft": InfraredRemoteButton.BottomLeft,
+ "bottomright": InfraredRemoteButton.BottomRight
+ }
+ Object.keys(btns).forEach(bid => {
+ const cid = btns[bid];
+ const bel = content.getElementById(pxsim.visuals.normalizeId(this.id, bid));
+ bel.className += " sim-button";
+ pointerEvents.down.forEach(evid => bel.addEventListener(evid, ev => {
+ ev3board().remoteState.setPressed(cid, true);
+ }));
+ bel.addEventListener(pointerEvents.leave, ev => {
+ ev3board().remoteState.setPressed(cid, false);
+ });
+ bel.addEventListener(pointerEvents.up, ev => {
+ ev3board().remoteState.setPressed(cid, false);
+ });
+ });
return this.group;
}
getInnerWidth() {
- return 10.2;
+ return 98.3;
}
getInnerHeight() {
- return 15;
+ return 110.8;
}
}
}
\ No newline at end of file
diff --git a/sim/visuals/nodes/moduleView.ts b/sim/visuals/nodes/moduleView.ts
index b9d2adc0..6b68034c 100644
--- a/sim/visuals/nodes/moduleView.ts
+++ b/sim/visuals/nodes/moduleView.ts
@@ -1,4 +1,20 @@
namespace pxsim.visuals {
+ export function normalizeId(prefix: string, svgId: string) {
+ return `${prefix}-${svgId}`;
+ }
+
+ export function normalizeXml(prefix: string, xml: string): string {
+ xml = xml.replace(/id=\"(.*?)\"/g, (m: string, id: string) => {
+ return `id="${normalizeId(prefix, id)}"`;
+ });
+ xml = xml.replace(/url\(#(.*?)\)/g, (m: string, id: string) => {
+ return `url(#${normalizeId(prefix, id)})`;
+ });
+ xml = xml.replace(/xlink:href=\"#(.*?)\"/g, (m: string, id: string) => {
+ return `xlink:href="#${normalizeId(prefix, id)}"`;
+ });
+ return xml;
+ }
export class ModuleView extends View implements LayoutElement {
protected content: SVGSVGElement;
@@ -9,21 +25,11 @@ namespace pxsim.visuals {
constructor(protected xml: string, protected prefix: string, protected id: NodeType, protected port: NodeType) {
super();
- this.xml = this.normalizeXml(xml);
+ this.xml = normalizeXml(this.prefix, xml);
}
private normalizeXml(xml: string) {
- const prefix = this.prefix;
- xml = xml.replace(/id=\"(.*?)\"/g, (m: string, id: string) => {
- return `id="${this.normalizeId(id)}"`;
- });
- xml = xml.replace(/url\(#(.*?)\)/g, (m: string, id: string) => {
- return `url(#${this.normalizeId(id)})`;
- });
- xml = xml.replace(/xlink:href=\"#(.*?)\"/g, (m: string, id: string) => {
- return `xlink:href="#${this.normalizeId(id)}"`;
- });
- return xml;
+ return pxsim.visuals.normalizeXml(this.prefix, xml);
}
protected normalizeId(svgId: string) {