From e6cf490be2613b666b6f45d7e84e10a1b0567fbc Mon Sep 17 00:00:00 2001 From: Peli de Halleux Date: Mon, 4 Mar 2019 21:02:29 -0800 Subject: [PATCH] removing feild editors moved to pxt --- editor/deploy.ts | 2 +- fieldeditors/extension.ts | 8 --- fieldeditors/field_motors.ts | 6 +- fieldeditors/field_speed.ts | 97 ---------------------------- fieldeditors/field_turnratio.ts | 108 -------------------------------- sim/dalboard.ts | 10 +-- 6 files changed, 10 insertions(+), 221 deletions(-) delete mode 100644 fieldeditors/field_speed.ts delete mode 100644 fieldeditors/field_turnratio.ts diff --git a/editor/deploy.ts b/editor/deploy.ts index ced52bfb..f3b2c269 100644 --- a/editor/deploy.ts +++ b/editor/deploy.ts @@ -33,7 +33,7 @@ export function initAsync() { canHID = false } else { const forceHexDownload = /forceHexDownload/i.test(window.location.href); - if (pxt.Cloud.isLocalHost() && pxt.Cloud.localToken && !forceHexDownload) + if (pxt.BrowserUtils.isLocalHost() && pxt.Cloud.localToken && !forceHexDownload) canHID = true } diff --git a/fieldeditors/extension.ts b/fieldeditors/extension.ts index c687c6c5..10944a73 100644 --- a/fieldeditors/extension.ts +++ b/fieldeditors/extension.ts @@ -3,9 +3,7 @@ import { FieldPorts } from "./field_ports"; import { FieldMotors } from "./field_motors"; -import { FieldSpeed } from "./field_speed"; import { FieldBrickButtons } from "./field_brickbuttons"; -import { FieldTurnRatio } from "./field_turnratio"; import { FieldColorEnum } from "./field_color"; import { FieldMusic } from "./field_music"; @@ -19,15 +17,9 @@ pxt.editor.initFieldExtensionsAsync = function (opts: pxt.editor.FieldExtensionO }, { selector: "motors", editor: FieldMotors - }, { - selector: "speed", - editor: FieldSpeed }, { selector: "brickbuttons", editor: FieldBrickButtons - }, { - selector: "turnratio", - editor: FieldTurnRatio }, { selector: "colorenum", editor: FieldColorEnum diff --git a/fieldeditors/field_motors.ts b/fieldeditors/field_motors.ts index e24d3338..a9212afd 100644 --- a/fieldeditors/field_motors.ts +++ b/fieldeditors/field_motors.ts @@ -149,9 +149,9 @@ export class FieldMotors extends Blockly.FieldDropdown implements Blockly.FieldC getFirstValueI11n(value: string) { const firstValue = this.getFirstValue(value); const motorOptions = { - 'medium motor': lf('medium motor'), - 'large motor': lf('large motor'), - 'large motors': lf('large motors') + 'medium motor': lf("medium motor"), + 'large motor': lf("large motor"), + 'large motors': lf("large motors") } return motorOptions[firstValue]; } diff --git a/fieldeditors/field_speed.ts b/fieldeditors/field_speed.ts deleted file mode 100644 index 62300de5..00000000 --- a/fieldeditors/field_speed.ts +++ /dev/null @@ -1,97 +0,0 @@ -/// -/// - -export interface FieldSpeedOptions extends Blockly.FieldCustomOptions { - min?: string; - max?: string; - label?: string; -} - -export class FieldSpeed extends Blockly.FieldSlider implements Blockly.FieldCustom { - public isFieldCustom_ = true; - - private params: any; - - private speedSVG: SVGElement; - private circleBar: SVGCircleElement; - private reporter: SVGTextElement; - - /** - * Class for a color wheel field. - * @param {number|string} value The initial content of the field. - * @param {Function=} opt_validator An optional function that is called - * to validate any constraints on what the user entered. Takes the new - * text as an argument and returns either the accepted text, a replacement - * text, or null to abort the change. - * @extends {Blockly.FieldNumber} - * @constructor - */ - constructor(value_: any, params: FieldSpeedOptions, opt_validator?: Function) { - super(String(value_), '-100', '100', null, '10', 'Speed', opt_validator); - this.params = params; - if (this.params['min']) this.min_ = parseFloat(this.params.min); - if (this.params['max']) this.max_ = parseFloat(this.params.max); - if (this.params['label']) this.labelText_ = this.params.label; - - (this as any).sliderColor_ = '#a8aaa8'; - } - - createLabelDom_(labelText: string) { - var labelContainer = document.createElement('div'); - this.speedSVG = document.createElementNS("http://www.w3.org/2000/svg", "svg") as SVGGElement; - pxsim.svg.hydrate(this.speedSVG, { - viewBox: "0 0 200 100", - width: "170" - }); - - labelContainer.appendChild(this.speedSVG); - - const outerCircle = pxsim.svg.child(this.speedSVG, "circle", { - 'stroke-dasharray': '565.48', 'stroke-dashoffset': '0', - 'cx': 100, 'cy': 100, 'r': '90', 'style': `fill:transparent; transition: stroke-dashoffset 0.1s linear;`, - 'stroke': '#a8aaa8', 'stroke-width': '1rem' - }) as SVGCircleElement; - this.circleBar = pxsim.svg.child(this.speedSVG, "circle", { - 'stroke-dasharray': '565.48', 'stroke-dashoffset': '0', - 'cx': 100, 'cy': 100, 'r': '90', 'style': `fill:transparent; transition: stroke-dashoffset 0.1s linear;`, - 'stroke': '#f12a21', 'stroke-width': '1rem' - }) as SVGCircleElement; - - this.reporter = pxsim.svg.child(this.speedSVG, "text", { - 'x': 100, 'y': 80, - 'text-anchor': 'middle', 'dominant-baseline': 'middle', - 'style': 'font-size: 50px', - 'class': 'sim-text inverted number' - }) as SVGTextElement; - - // labelContainer.setAttribute('class', 'blocklyFieldSliderLabel'); - var readout = document.createElement('span'); - readout.setAttribute('class', 'blocklyFieldSliderReadout'); - // var label = document.createElement('span'); - // label.setAttribute('class', 'blocklyFieldSliderLabelText'); - // label.innerHTML = labelText; - // labelContainer.appendChild(label); - // labelContainer.appendChild(readout); - return [labelContainer, readout]; - }; - - setReadout_(readout: Element, value: string) { - this.updateSpeed(parseFloat(value)); - // Update reporter - this.reporter.textContent = `${value}%`; - } - - private updateSpeed(speed: number) { - let sign = this.sign(speed); - speed = (Math.abs(speed) / 100 * 50) + 50; - if (sign == -1) speed = 50 - speed; - let c = Math.PI * (90 * 2); - let pct = ((100 - speed) / 100) * c; - this.circleBar.setAttribute('stroke-dashoffset', `${pct}`); - } - - // A re-implementation of Math.sign (since IE11 doesn't support it) - private sign(num: number) { - return num ? num < 0 ? -1 : 1 : 0; - } -} \ No newline at end of file diff --git a/fieldeditors/field_turnratio.ts b/fieldeditors/field_turnratio.ts deleted file mode 100644 index 5273c590..00000000 --- a/fieldeditors/field_turnratio.ts +++ /dev/null @@ -1,108 +0,0 @@ -/// -/// - -export interface FieldTurnRatioOptions extends Blockly.FieldCustomOptions { -} - -export class FieldTurnRatio extends Blockly.FieldSlider implements Blockly.FieldCustom { - public isFieldCustom_ = true; - - private params: any; - - private path_: SVGPathElement; - private reporter_: SVGTextElement; - - /** - * Class for a color wheel field. - * @param {number|string} value The initial content of the field. - * @param {Function=} opt_validator An optional function that is called - * to validate any constraints on what the user entered. Takes the new - * text as an argument and returns either the accepted text, a replacement - * text, or null to abort the change. - * @extends {Blockly.FieldNumber} - * @constructor - */ - constructor(value_: any, params: FieldTurnRatioOptions, opt_validator?: Function) { - super(String(value_), '-100', '100', null, '10', 'TurnRatio', opt_validator); - this.params = params; - (this as any).sliderColor_ = '#a8aaa8'; - } - - static HALF = 80; - static HANDLE_RADIUS = 30; - static RADIUS = FieldTurnRatio.HALF - FieldTurnRatio.HANDLE_RADIUS - 1; - - createLabelDom_(labelText: string) { - let labelContainer = document.createElement('div'); - let svg = Blockly.utils.createSvgElement('svg', { - 'xmlns': 'http://www.w3.org/2000/svg', - 'xmlns:html': 'http://www.w3.org/1999/xhtml', - 'xmlns:xlink': 'http://www.w3.org/1999/xlink', - 'version': '1.1', - 'height': (FieldTurnRatio.HALF + FieldTurnRatio.HANDLE_RADIUS + 10) + 'px', - 'width': (FieldTurnRatio.HALF * 2) + 'px' - }, labelContainer); - let defs = Blockly.utils.createSvgElement('defs', {}, svg); - let marker = Blockly.utils.createSvgElement('marker', { - 'id': 'head', - 'orient': "auto", - 'markerWidth': '2', - 'markerHeight': '4', - 'refX': '0.1', 'refY': '1.5' - }, defs); - let markerPath = Blockly.utils.createSvgElement('path', { - 'd': 'M0,0 V3 L1.5,1.5 Z', - 'fill': '#f12a21' - }, marker); - this.reporter_ = pxsim.svg.child(svg, "text", { - 'x': FieldTurnRatio.HALF, 'y': 96, - 'text-anchor': 'middle', 'dominant-baseline': 'middle', - 'style': 'font-size: 50px', - 'class': 'sim-text inverted number' - }) as SVGTextElement; - this.path_ = Blockly.utils.createSvgElement('path', { - 'x1': FieldTurnRatio.HALF, - 'y1': FieldTurnRatio.HALF, - 'marker-end': 'url(#head)', - 'style': 'fill: none; stroke: #f12a21; stroke-width: 10' - }, svg); - this.updateGraph_(); - let readout = document.createElement('span'); - readout.setAttribute('class', 'blocklyFieldSliderReadout'); - return [labelContainer, readout]; - }; - - updateGraph_() { - if (!this.path_) { - return; - } - let v = goog.math.clamp(parseFloat(this.getText()), -100, 100); - if (isNaN(v)) { - v = 0; - } - - const x = goog.math.clamp(parseFloat(this.getText()), -100, 100) / 100; - const theta = x * Math.PI / 2; - const cx = FieldTurnRatio.HALF; - const cy = FieldTurnRatio.HALF - 14; - const gamma = Math.PI - 2 * theta; - const r = FieldTurnRatio.RADIUS; - const alpha = 0.2 + Math.abs(x) * 0.5; - const x1 = 0; - const y1 = r * alpha; - const y2 = r * Math.sin(Math.PI / 2 - theta); - const x2 = r * Math.cos(Math.PI / 2 - theta); - const y3 = y2 - r * alpha * Math.cos(2 * theta); - const x3 = x2 - r * alpha * Math.sin(2 * theta); - - - const d = `M ${cx} ${cy} C ${cx} ${cy - y1} ${cx + x3} ${cy - y3} ${cx + x2} ${cy - y2}`; - this.path_.setAttribute('d', d); - - this.reporter_.textContent = `${v}`; - } - - setReadout_(readout: Element, value: string) { - this.updateGraph_(); - } -} \ No newline at end of file diff --git a/sim/dalboard.ts b/sim/dalboard.ts index 9ccbe149..e8518f92 100644 --- a/sim/dalboard.ts +++ b/sim/dalboard.ts @@ -5,6 +5,7 @@ namespace pxsim { export class EV3Board extends CoreBoard { + viewHost: visuals.BoardHost; view: SVGSVGElement; outputState: EV3OutputState; @@ -83,15 +84,16 @@ namespace pxsim { highContrast: msg.highContrast, light: msg.light }; - const viewHost = new visuals.BoardHost(pxsim.visuals.mkBoardView({ + this.viewHost = new visuals.BoardHost(pxsim.visuals.mkBoardView({ visual: boardDef.visual, + boardDef, highContrast: msg.highContrast, light: msg.light }), opts); document.body.innerHTML = ""; // clear children document.body.className = msg.light ? "light" : ""; - document.body.appendChild(this.view = viewHost.getView() as SVGSVGElement); + document.body.appendChild(this.view = this.viewHost.getView() as SVGSVGElement); this.inputNodes = []; this.outputNodes = []; @@ -102,8 +104,8 @@ namespace pxsim { return Promise.resolve(); } - screenshot(): string { - return svg.toDataUri(new XMLSerializer().serializeToString(this.view)); + screenshotAsync(width?: number): Promise { + return this.viewHost.screenshotAsync(width); } getBrickNode() {