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

Fixes display and fonts (#85)

Browse Source 
* change simulator svg

* change radio image

* Remove google fonts cdn

* change color of 'advanced' button

* font fix

* font fix 2

* display fix

* change fullsceen simulator bg

* Continuous servo

* handle continuous state

* adding shims

* update rendering for continuous servos

* fixing sim

* fix sig

* typo

* fix sim

* bump pxt

* bump pxt

* rerun travis
This commit is contained in:
Amerlander
2020-02-15 22:16:34 +01:00
committed by GitHub
parent c200b042c6
commit e4008a3a73
9 changed files with 96 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
sim/state/edgeconnector.ts
View File

@ -81,6 +81,13 @@ namespace pxsim.pins {
pin.servoAngle = value;
}
export function servoSetContinuous(pinId: number, value: boolean) {
let pin = getPin(pinId);
if (!pin) return;
pin.servoSetContinuous(value);
}
export function servoSetPulse(pinId: number, micros: number) {
let pin = getPin(pinId);
if (!pin) return;

5
sim/state/edgeconnectorsim.ts
View File

@ -17,6 +17,7 @@ namespace pxsim {
mode = PinFlags.Unused;
pitch = false;
pull = 0; // PullDown
servoContinuous = false;
digitalReadPin(): number {
this.mode = PinFlags.Digital | PinFlags.Input;
@ -59,6 +60,10 @@ namespace pxsim {
runtime.queueDisplayUpdate();
}
servoSetContinuous(value: boolean) {
this.servoContinuous = !!value;
}
servoSetPulse(pinId: number, micros: number) {
// TODO
}

40
sim/state/microservo.ts
View File

@ -10,7 +10,7 @@ namespace pxsim.visuals {
<path id="VCC" fill="red" stroke-width="2" d="M53.72 21.93h5.504v22.627H53.72z"/>
<path id="LOGIC" fill="#fc0" stroke-width="2" d="M47.3 21.93h5.503v22.627H47.3z"/>
<path id="GND" fill="#a02c2c" stroke-width="2" d="M60.14 21.93h5.505v22.627H60.14z"/>
<path id="connector" fill="#111" stroke-width="2" d="M45.064 0a1.488 1.488 0 0 0-1.488 1.488v24.5a1.488 1.488 0 0 0 1.488 1.487h22.71a1.488 1.488 0 0 0 1.49-1.488v-24.5A1.488 1.488 0 0 0 67.774 0h-22.71z"/>
<path id="connector" stroke-width="2" d="M45.064 0a1.488 1.488 0 0 0-1.488 1.488v24.5a1.488 1.488 0 0 0 1.488 1.487h22.71a1.488 1.488 0 0 0 1.49-1.488v-24.5A1.488 1.488 0 0 0 67.774 0h-22.71z"/>
<g id="crank" transform="translate(0 -752.688)">
<path id="arm" fill="#ececec" stroke="#000" stroke-width="1.372" d="M47.767 880.88c-4.447 1.162-8.412 8.278-8.412 18.492s3.77 18.312 8.412 18.494c8.024.314 78.496 5.06 78.51-16.952.012-22.013-74.377-21.117-78.51-20.035z"/>
<circle id="path8216" cx="56.661" cy="899.475" r="8.972" fill="gray" stroke-width="2"/>
@ -24,6 +24,7 @@ namespace pxsim.visuals {
return { el: createMicroServoElement(), x: xy[0], y: xy[1], w: 112.188, h: 299.674 };
}
const SPEED = 300; // 0.1s/60 degree
export class MicroServoView implements IBoardPart<EdgeConnectorState> {
public style: string = "";
public overElement: SVGElement = undefined;
@ -61,21 +62,36 @@ namespace pxsim.visuals {
translateEl(this.element, [x, y])
}
updateState(): void {
this.targetAngle = 180.0 - this.state.getPin(this.pin).servoAngle;
if (this.targetAngle != this.currentAngle) {
const p = this.state.getPin(this.pin);
const continuous = !!p.servoContinuous;
const servoAngle = p.servoAngle;
if (continuous) {
// for a continuous servo, the angle is interpreted as a rotation speed
// 0 -> -100%, 90 - 0%, 180 - 100%
const now = U.now();
const cx = 56.661;
const cy = 899.475;
const speed = 300; // 0.1s/60 degree
const dt = Math.min(now - this.lastAngleTime, 50) / 1000;
const delta = this.targetAngle - this.currentAngle;
this.currentAngle += Math.min(Math.abs(delta), speed * dt) * (delta > 0 ? 1 : -1);
this.crankEl.setAttribute("transform", this.crankTransform
+ ` rotate(${this.currentAngle}, ${cx}, ${cy})`)
this.lastAngleTime = now;
setTimeout(() => runtime.updateDisplay(), 20);
this.currentAngle = this.targetAngle;
this.targetAngle += ((servoAngle - 90) / 90) * SPEED * dt;
} else {
this.targetAngle = 180.0 - servoAngle;
}
if (this.targetAngle != this.currentAngle)
this.renderAngle();
}
private renderAngle() {
const now = U.now();
const cx = 56.661;
const cy = 899.475;
const dt = Math.min(now - this.lastAngleTime, 50) / 1000;
const delta = this.targetAngle - this.currentAngle;
this.currentAngle += Math.min(Math.abs(delta), SPEED * dt) * (delta > 0 ? 1 : -1);
this.crankEl.setAttribute("transform", this.crankTransform
+ ` rotate(${this.currentAngle}, ${cx}, ${cy})`)
this.lastAngleTime = now;
setTimeout(() => runtime.updateDisplay(), 20);
}
updateTheme(): void {
}

56
sim/visuals/microbit.ts
View File

@ -145,7 +145,7 @@ namespace pxsim.visuals {
}
`;
const BOARD_SVG = `<?xml version="1.0" encoding="utf-8"?>
<svg version="1.1" id="CalliopeMini" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
y="0px" viewBox="0 0 530 530" style="enable-background:new 0 0 530 530;" xml:space="preserve">
<style type="text/css">
.st0{fill:#044854;}
@ -443,33 +443,33 @@ namespace pxsim.visuals {
<ellipse id="BTN_B" transform="matrix(0.1602 -0.9871 0.9871 0.1602 157.3084 627.5282)" class="st16" cx="447.4" cy="221.3" rx="11.6" ry="11.6"/>
</g>
<g id="Display">
<rect id="LED_0_0" x="208.4" y="139.1" class="st3" width="6.3" height="13.3"/>
<rect id="LED_0_1" x="234.3" y="139.1" class="st3" width="6.3" height="13.3"/>
<rect id="LED_0_2" x="260.3" y="139.1" class="st3" width="6.3" height="13.3"/>
<rect id="LED_0_3" x="286.2" y="139.1" class="st3" width="6.3" height="13.3"/>
<rect id="LED_0_4" x="312.2" y="139.1" class="st3" width="6.3" height="13.3"/>
<rect id="LED_1_0" x="208.4" y="167.2" class="st3" width="6.3" height="13.3"/>
<rect id="LED_1_1" x="234.3" y="167.2" class="st3" width="6.3" height="13.3"/>
<rect id="LED_1_2" x="260.3" y="167.2" class="st3" width="6.3" height="13.3"/>
<rect id="LED_1_3" x="286.2" y="167.2" class="st3" width="6.3" height="13.3"/>
<rect id="LED_1_4" x="312.2" y="167.2" class="st3" width="6.3" height="13.3"/>
<rect id="LED_2_0" x="208.4" y="195.3" class="st3" width="6.3" height="13.3"/>
<rect id="LED_2_1" x="234.3" y="195.3" class="st3" width="6.3" height="13.3"/>
<rect id="LED_2_2" x="260.3" y="195.3" class="st3" width="6.3" height="13.3"/>
<rect id="LED_2_3" x="286.2" y="195.3" class="st3" width="6.3" height="13.3"/>
<rect id="LED_2_4" x="312.2" y="195.3" class="st3" width="6.3" height="13.3"/>
<rect id="LED_3_0" x="208.4" y="223.4" class="st3" width="6.3" height="13.3"/>
<rect id="LED_3_1" x="234.3" y="223.4" class="st3" width="6.3" height="13.3"/>
<rect id="LED_3_2" x="260.3" y="223.4" class="st3" width="6.3" height="13.3"/>
<rect id="LED_3_3" x="286.2" y="223.4" class="st3" width="6.3" height="13.3"/>
<rect id="LED_3_4" x="312.2" y="223.4" class="st3" width="6.3" height="13.3"/>
<rect id="LED_4_0" x="208.4" y="251.5" class="st3" width="6.3" height="13.3"/>
<rect id="LED_4_1" x="234.3" y="251.5" class="st3" width="6.3" height="13.3"/>
<rect id="LED_4_2" x="260.3" y="251.5" class="st3" width="6.3" height="13.3"/>
<rect id="LED_4_3" x="286.2" y="251.5" class="st3" width="6.3" height="13.3"/>
<rect id="LED_4_4" x="312.2" y="251.5" class="st3" width="6.3" height="13.3"/>
</g>
<rect id="LED_0_0" x="210.7" y="146.2" class="st6" width="5.1" height="12.9"/>
<rect id="LED_1_0" x="236.8" y="146.2" class="st6" width="5.1" height="12.9"/>
<rect id="LED_2_0" x="262.7" y="146.2" class="st6" width="5.1" height="12.9"/>
<rect id="LED_3_0" x="288.7" y="146.2" class="st6" width="5.1" height="12.9"/>
<rect id="LED_4_0" x="314.6" y="146.2" class="st6" width="5.1" height="12.9"/>
<rect id="LED_0_1" x="210.7" y="171.7" class="st6" width="5.1" height="12.9"/>
<rect id="LED_1_1" x="236.8" y="171.7" class="st6" width="5.1" height="12.9"/>
<rect id="LED_2_1" x="262.7" y="171.7" class="st6" width="5.1" height="12.9"/>
<rect id="LED_3_1" x="288.7" y="171.7" class="st6" width="5.1" height="12.9"/>
<rect id="LED_4_1" x="314.6" y="171.7" class="st6" width="5.1" height="12.9"/>
<rect id="LED_0_2" x="210.7" y="197" class="st6" width="5.1" height="12.9"/>
<rect id="LED_1_2" x="236.8" y="197" class="st6" width="5.1" height="12.9"/>
<rect id="LED_2_2" x="262.7" y="197" class="st6" width="5.1" height="12.9"/>
<rect id="LED_3_2" x="288.7" y="197" class="st6" width="5.1" height="12.9"/>
<rect id="LED_4_2" x="314.6" y="197" class="st6" width="5.1" height="12.9"/>
<rect id="LED_0_3" x="210.7" y="222.5" class="st6" width="5.1" height="12.9"/>
<rect id="LED_1_3" x="236.8" y="222.5" class="st6" width="5.1" height="12.9"/>
<rect id="LED_2_3" x="262.7" y="222.5" class="st6" width="5.1" height="12.9"/>
<rect id="LED_3_3" x="288.7" y="222.5" class="st6" width="5.1" height="12.9"/>
<rect id="LED_4_3" x="314.6" y="222.5" class="st6" width="5.1" height="12.9"/>
<rect id="LED_0_4" x="210.7" y="247.8" class="st6" width="5.1" height="12.9"/>
<rect id="LED_1_4" x="236.8" y="247.8" class="st6" width="5.1" height="12.9"/>
<rect id="LED_2_4" x="262.7" y="247.8" class="st6" width="5.1" height="12.9"/>
<rect id="LED_3_4" x="288.7" y="247.8" class="st6" width="5.1" height="12.9"/>
<rect id="LED_4_4" x="314.6" y="247.8" class="st6" width="5.1" height="12.9"/>
<g id="PINS">
<g id="C_GND4">
<circle class="st11" cx="370.8" cy="422" r="5.2"/>