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

Merge branch 'breadboarding' of https://github.com/Microsoft/pxt-microbit into breadboarding

Browse Source
This commit is contained in:
Peli de Halleux 2016-08-31 14:07:16 -07:00
commit 0f3c7b8c0f
4 changed files with 40 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
sim/instructions/instructions.ts
View File

@ -44,6 +44,10 @@ namespace pxsim.instructions {
const NUM_FONT = 40; const NUM_FONT = 40;
const NUM_MARGIN = 5; const NUM_MARGIN = 5;
const FRONT_PAGE_BOARD_WIDTH = 200; const FRONT_PAGE_BOARD_WIDTH = 200;
const PARTS_BOARD_SCALE = 0.17;
const PARTS_BB_SCALE = 0.25;
const PARTS_CMP_SCALE = 0.3;
const PARTS_WIRE_SCALE = 0.23;
const STYLE = ` const STYLE = `
.instr-panel { .instr-panel {
margin: ${PANEL_MARGIN}px; margin: ${PANEL_MARGIN}px;
@ -427,17 +431,12 @@ namespace pxsim.instructions {
function mkPartsPanel(props: BoardProps) { function mkPartsPanel(props: BoardProps) {
let panel = mkPanel(); let panel = mkPanel();
const BOARD_SCALE = 0.1;
const BB_SCALE = 0.25;
const CMP_SCALE = 0.3;
const WIRE_SCALE = 0.23;
// board and breadboard // board and breadboard
let boardImg = mkBoardImgSvg(<BoardImageDefinition>props.boardDef.visual); let boardImg = mkBoardImgSvg(<BoardImageDefinition>props.boardDef.visual);
let board = wrapSvg(boardImg, {left: QUANT_LBL(1), leftSize: QUANT_LBL_SIZE, cmpScale: BOARD_SCALE}); let board = wrapSvg(boardImg, {left: QUANT_LBL(1), leftSize: QUANT_LBL_SIZE, cmpScale: PARTS_BOARD_SCALE});
panel.appendChild(board); panel.appendChild(board);
let bbRaw = mkBBSvg(); let bbRaw = mkBBSvg();
let bb = wrapSvg(bbRaw, {left: QUANT_LBL(1), leftSize: QUANT_LBL_SIZE, cmpScale: BB_SCALE}); let bb = wrapSvg(bbRaw, {left: QUANT_LBL(1), leftSize: QUANT_LBL_SIZE, cmpScale: PARTS_BB_SCALE});
panel.appendChild(bb); panel.appendChild(bb);
// components // components
@ -453,7 +452,7 @@ namespace pxsim.instructions {
let cmp = mkCmpDiv(builtinVisual, { let cmp = mkCmpDiv(builtinVisual, {
left: QUANT_LBL(quant), left: QUANT_LBL(quant),
leftSize: QUANT_LBL_SIZE, leftSize: QUANT_LBL_SIZE,
cmpScale: CMP_SCALE, cmpScale: PARTS_CMP_SCALE,
}); });
addClass(cmp, "partslist-cmp"); addClass(cmp, "partslist-cmp");
panel.appendChild(cmp); panel.appendChild(cmp);
@ -469,7 +468,7 @@ namespace pxsim.instructions {
left: QUANT_LBL(quant), left: QUANT_LBL(quant),
leftSize: WIRE_QUANT_LBL_SIZE, leftSize: WIRE_QUANT_LBL_SIZE,
wireClr: clr, wireClr: clr,
cmpScale: WIRE_SCALE cmpScale: PARTS_WIRE_SCALE
}) })
addClass(cmp, "partslist-wire"); addClass(cmp, "partslist-wire");
panel.appendChild(cmp); panel.appendChild(cmp);
@ -664,7 +663,7 @@ ${tsPackage}
} }
//final //final
// let finalPanel = mkFinalPanel(props); let finalPanel = mkFinalPanel(props);
// document.body.appendChild(finalPanel); document.body.appendChild(finalPanel);
} }
} }

28
sim/microbit.ts
View File

@ -115,6 +115,26 @@ namespace pxsim.visuals {
fill: none; fill: none;
stroke: black; stroke: black;
} }
.sim-wireframe .sim-display,
.sim-wireframe .sim-led,
.sim-wireframe .sim-led-back,
.sim-wireframe .sim-head,
.sim-wireframe .sim-theme,
.sim-wireframe .sim-button-group,
.sim-wireframe .sim-button-label,
.sim-wireframe .sim-button,
.sim-wireframe .sim-text-pin
{
visibility: hidden;
}
.sim-wireframe .sim-label
{
stroke: none;
fill: #777;
}
.sim-wireframe .sim-board {
stroke-width: 2px;
}
`; `;
const pins4onXs = [66.7, 79.1, 91.4, 103.7, 164.3, 176.6, 188.9, 201.3, 213.6, 275.2, 287.5, 299.8, 312.1, 324.5, 385.1, 397.4, 409.7, 422]; const pins4onXs = [66.7, 79.1, 91.4, 103.7, 164.3, 176.6, 188.9, 201.3, 213.6, 275.2, 287.5, 299.8, 312.1, 324.5, 385.1, 397.4, 409.7, 422];
const pins4onMids = pins4onXs.map(x => x + 5); const pins4onMids = pins4onXs.map(x => x + 5);
@ -156,8 +176,8 @@ namespace pxsim.visuals {
"P20, I2C - SDA", "P20, I2C - SDA",
"GND", "GND", "+3v3", "GND" "GND", "GND", "+3v3", "GND"
]; ];
const MB_WIDTH = 498; const MB_WIDTH = 500;
const MB_HEIGHT = 406; const MB_HEIGHT = 408;
export interface IBoardTheme { export interface IBoardTheme {
accent?: string; accent?: string;
display?: string; display?: string;
@ -605,7 +625,7 @@ namespace pxsim.visuals {
} }
// head // head
this.head = <SVGGElement>svg.child(this.g, "g", {}); this.head = <SVGGElement>svg.child(this.g, "g", {class: "sim-head"});
svg.child(this.head, "circle", { cx: 258, cy: 75, r: 100, fill: "transparent" }) svg.child(this.head, "circle", { cx: 258, cy: 75, r: 100, fill: "transparent" })
this.logos.push(svg.path(this.head, "sim-theme sim-theme-glow", "M269.9,50.2L269.9,50.2l-39.5,0v0c-14.1,0.1-24.6,10.7-24.6,24.8c0,13.9,10.4,24.4,24.3,24.7v0h39.6c14.2,0,24.8-10.6,24.8-24.7C294.5,61,284,50.3,269.9,50.2 M269.7,89.2L269.7,89.2l-39.3,0c-7.7-0.1-14-6.4-14-14.2c0-7.8,6.4-14.2,14.2-14.2h39.1c7.8,0,14.2,6.4,14.2,14.2C283.9,82.9,277.5,89.2,269.7,89.2")); this.logos.push(svg.path(this.head, "sim-theme sim-theme-glow", "M269.9,50.2L269.9,50.2l-39.5,0v0c-14.1,0.1-24.6,10.7-24.6,24.8c0,13.9,10.4,24.4,24.3,24.7v0h39.6c14.2,0,24.8-10.6,24.8-24.7C294.5,61,284,50.3,269.9,50.2 M269.7,89.2L269.7,89.2l-39.3,0c-7.7-0.1-14-6.4-14-14.2c0-7.8,6.4-14.2,14.2-14.2h39.1c7.8,0,14.2,6.4,14.2,14.2C283.9,82.9,277.5,89.2,269.7,89.2"));
this.logos.push(svg.path(this.head, "sim-theme sim-theme-glow", "M230.6,69.7c-2.9,0-5.3,2.4-5.3,5.3c0,2.9,2.4,5.3,5.3,5.3c2.9,0,5.3-2.4,5.3-5.3C235.9,72.1,233.5,69.7,230.6,69.7")); this.logos.push(svg.path(this.head, "sim-theme sim-theme-glow", "M230.6,69.7c-2.9,0-5.3,2.4-5.3,5.3c0,2.9,2.4,5.3,5.3,5.3c2.9,0,5.3-2.4,5.3-5.3C235.9,72.1,233.5,69.7,230.6,69.7"));
@ -648,7 +668,7 @@ namespace pxsim.visuals {
const btnw = 56.2; const btnw = 56.2;
const btnn = 6; const btnn = 6;
const btnnm = 10 const btnnm = 10
let btng = svg.child(this.g, "g"); let btng = svg.child(this.g, "g", {class: "sim-button-group"});
this.buttonsOuter.push(btng); this.buttonsOuter.push(btng);
svg.child(btng, "rect", { class: "sim-button-outer", x: left, y: top, rx: btnr, ry: btnr, width: btnw, height: btnw }); svg.child(btng, "rect", { class: "sim-button-outer", x: left, y: top, rx: btnr, ry: btnr, width: btnw, height: btnw });
svg.child(btng, "circle", { class: "sim-button-nut", cx: left + btnnm, cy: top + btnnm, r: btnn }); svg.child(btng, "circle", { class: "sim-button-nut", cx: left + btnnm, cy: top + btnnm, r: btnn });

11
sim/visuals/boardhost.ts
View File

@ -45,7 +45,7 @@ namespace pxsim.visuals {
scaleUnit1: this.boardView.getPinDist(), scaleUnit1: this.boardView.getPinDist(),
el2: this.breadboard.getSVGAndSize(), el2: this.breadboard.getSVGAndSize(),
scaleUnit2: this.breadboard.getPinDist(), scaleUnit2: this.breadboard.getPinDist(),
margin: [0, 0, 10, 0], margin: [0, 0, 20, 0],
middleMargin: 80, middleMargin: 80,
maxWidth: opts.maxWidth, maxWidth: opts.maxWidth,
maxHeight: opts.maxHeight, maxHeight: opts.maxHeight,
@ -93,18 +93,15 @@ namespace pxsim.visuals {
} }
public highlightWire(wire: Wire) { public highlightWire(wire: Wire) {
//TODO: move to wiring.ts
//underboard wires //underboard wires
wire.wires.forEach(e => { wire.wires.forEach(e => {
svg.addClass(e, "highlight");
(<any>e).style["visibility"] = "visible"; (<any>e).style["visibility"] = "visible";
}); });
//un greyed out //un greyed out
[wire.end1, wire.end2].forEach(e => { svg.addClass(wire.endG, "highlight");
svg.addClass(e, "highlight");
});
wire.wires.forEach(e => {
svg.addClass(e, "highlight");
});
} }
public getView(): SVGElement { public getView(): SVGElement {

3
sim/visuals/wiring.ts
View File

@ -24,8 +24,9 @@ namespace pxsim.visuals {
stroke-dasharray: ${PIN_DIST / 10.0},${PIN_DIST / 1.5}; stroke-dasharray: ${PIN_DIST / 10.0},${PIN_DIST / 1.5};
/*stroke-opacity: 0.4;*/ /*stroke-opacity: 0.4;*/
} }
.grayed .sim-bb-wire-end:not(.highlight) { .grayed .sim-bb-wire-ends-g:not(.highlight) .sim-bb-wire-end {
stroke: #777; stroke: #777;
fill: #777;
} }
.grayed .sim-bb-wire:not(.highlight) { .grayed .sim-bb-wire:not(.highlight) {
stroke: #CCC; stroke: #CCC;