@@ -1,51 +1,36 @@
 | 
			
		||||
screen.clear()
 | 
			
		||||
screen.print("PXT!", 10, 30, Draw.Quad)
 | 
			
		||||
brick.print("PXT!", 10, 30, Draw.Quad)
 | 
			
		||||
 | 
			
		||||
screen.drawRect(40, 40, 20, 10, Draw.Fill)
 | 
			
		||||
motors.setStatusLight(LightsPattern.Orange)
 | 
			
		||||
brick.drawRect(40, 40, 20, 10, Draw.Fill)
 | 
			
		||||
brick.setStatusLight(LightsPattern.Orange)
 | 
			
		||||
 | 
			
		||||
screen.heart.doubled().draw(100, 50, Draw.Double | Draw.Transparent)
 | 
			
		||||
brick.heart.doubled().draw(100, 50, Draw.Double | Draw.Transparent)
 | 
			
		||||
 | 
			
		||||
sensors.buttonEnter.onEvent(ButtonEvent.Click, () => {
 | 
			
		||||
brick.buttonEnter.onEvent(ButtonEvent.Click, () => {
 | 
			
		||||
    screen.clear()
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
sensors.buttonLeft.onEvent(ButtonEvent.Click, () => {
 | 
			
		||||
    screen.drawRect(10, 70, 20, 10, Draw.Fill)
 | 
			
		||||
    motors.setStatusLight(LightsPattern.Red)
 | 
			
		||||
    screen.setFont(screen.microbitFont())
 | 
			
		||||
brick.buttonLeft.onEvent(ButtonEvent.Click, () => {
 | 
			
		||||
    brick.drawRect(10, 70, 20, 10, Draw.Fill)
 | 
			
		||||
    brick.setStatusLight(LightsPattern.Red)
 | 
			
		||||
    brick.setFont(brick.microbitFont())
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
sensors.buttonRight.onEvent(ButtonEvent.Click, () => {
 | 
			
		||||
    screen.print("Right!", 10, 60)
 | 
			
		||||
brick.buttonRight.onEvent(ButtonEvent.Click, () => {
 | 
			
		||||
    brick.print("Right!", 10, 60)
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
sensors.buttonDown.onEvent(ButtonEvent.Click, () => {
 | 
			
		||||
    screen.print("Down! ", 10, 60)
 | 
			
		||||
brick.buttonDown.onEvent(ButtonEvent.Click, () => {
 | 
			
		||||
    brick.print("Down! ", 10, 60)
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
sensors.buttonUp.onEvent(ButtonEvent.Click, () => {
 | 
			
		||||
    screen.print("Up!  ", 10, 60)
 | 
			
		||||
brick.buttonUp.onEvent(ButtonEvent.Click, () => {
 | 
			
		||||
    brick.print("Up!  ", 10, 60)
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
let num = 0
 | 
			
		||||
 | 
			
		||||
sensors.touchSensor1.onEvent(TouchSensorEvent.Bumped, () => {
 | 
			
		||||
    screen.print("Click!  " + num, 10, 60)
 | 
			
		||||
    num++
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
sensors.remoteButtonTopLeft.onEvent(ButtonEvent.Click, () => {
 | 
			
		||||
    screen.print("TOPLEFT " + num, 10, 60)
 | 
			
		||||
    num++
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
sensors.remoteButtonTopRight.onEvent(ButtonEvent.Down, () => {
 | 
			
		||||
    screen.print("TOPRIGH " + num, 10, 60)
 | 
			
		||||
    num++
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
loops.forever(() => {
 | 
			
		||||
    serial.writeDmesg()
 | 
			
		||||
    loops.pause(100)
 | 
			
		||||
 
 | 
			
		||||
@@ -39,6 +39,7 @@
 | 
			
		||||
    "semantic-ui-less": "^2.2.4",
 | 
			
		||||
    "@types/bluebird": "2.0.33",
 | 
			
		||||
    "@types/jquery": "3.2.16",
 | 
			
		||||
    "@types/marked": "0.3.0",
 | 
			
		||||
    "@types/node": "8.0.53"
 | 
			
		||||
  },
 | 
			
		||||
  "dependencies": {
 | 
			
		||||
 
 | 
			
		||||
@@ -137,5 +137,6 @@
 | 
			
		||||
        "monacoColors": {
 | 
			
		||||
            "editor.background": "#ecf6ff"
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
    },
 | 
			
		||||
    "ignoreDocsErrors": true
 | 
			
		||||
}
 | 
			
		||||
 
 | 
			
		||||
@@ -1,91 +0,0 @@
 | 
			
		||||
/// <reference path="../node_modules/pxt-core/built/pxtsim.d.ts"/>
 | 
			
		||||
/// <reference path="../node_modules/pxt-core/built/pxtrunner.d.ts"/>
 | 
			
		||||
 | 
			
		||||
//HACK: allows instructions.html to access pxtblocks without requiring simulator.html to import blocks as well
 | 
			
		||||
if (!(<any>window).pxt) (<any>window).pxt = {};
 | 
			
		||||
import pxtrunner = pxt.runner;
 | 
			
		||||
import pxtdocs = pxt.docs;
 | 
			
		||||
 | 
			
		||||
namespace pxsim.instructions {
 | 
			
		||||
    export function drawInstructions() {
 | 
			
		||||
        pxsim.visuals.mkBoardView = (opts: pxsim.visuals.BoardViewOptions): pxsim.visuals.BoardView => {
 | 
			
		||||
            return new visuals.EV3BoardSvg({
 | 
			
		||||
                runtime: runtime,
 | 
			
		||||
                theme: visuals.randomTheme(),
 | 
			
		||||
                disableTilt: false,
 | 
			
		||||
                wireframe: opts.wireframe,
 | 
			
		||||
            });
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        let getQsVal = parseQueryString();
 | 
			
		||||
 | 
			
		||||
        //project name
 | 
			
		||||
        let name = getQsVal("name") || "Untitled";
 | 
			
		||||
 | 
			
		||||
        // board def
 | 
			
		||||
        const boardDef = JSON.parse(getQsVal("board")) as pxsim.BoardDefinition;
 | 
			
		||||
 | 
			
		||||
        //parts list
 | 
			
		||||
        let parts = (getQsVal("parts") || "").split(" ");
 | 
			
		||||
        parts.sort();
 | 
			
		||||
 | 
			
		||||
        // parts definitions
 | 
			
		||||
        let partDefinitions = JSON.parse(getQsVal("partdefs") || "{}") as pxsim.Map<PartDefinition>
 | 
			
		||||
 | 
			
		||||
        //fn args
 | 
			
		||||
        let fnArgs = JSON.parse((getQsVal("fnArgs") || "{}"));
 | 
			
		||||
 | 
			
		||||
        //project code
 | 
			
		||||
        let tsCode = getQsVal("code");
 | 
			
		||||
        let tsPackage = getQsVal("package") || "";
 | 
			
		||||
        let codeSpinnerDiv = document.getElementById("proj-code-spinner");
 | 
			
		||||
        let codeContainerDiv = document.getElementById("proj-code-container");
 | 
			
		||||
        if (tsCode) {
 | 
			
		||||
            //we use the docs renderer to decompile the code to blocks and render it
 | 
			
		||||
            //TODO: render the blocks code directly
 | 
			
		||||
            let md =
 | 
			
		||||
                `\`\`\`blocks
 | 
			
		||||
${tsCode}
 | 
			
		||||
\`\`\`
 | 
			
		||||
\`\`\`package
 | 
			
		||||
${tsPackage}
 | 
			
		||||
\`\`\`
 | 
			
		||||
`
 | 
			
		||||
 | 
			
		||||
            pxtdocs.requireMarked = function () { return (<any>window).marked; }
 | 
			
		||||
            pxtrunner.renderMarkdownAsync(codeContainerDiv, md)
 | 
			
		||||
                .done(function () {
 | 
			
		||||
                    let codeSvg = $("#proj-code-container svg");
 | 
			
		||||
                    if (codeSvg.length > 0) {
 | 
			
		||||
                        //code rendered successfully as blocks
 | 
			
		||||
                        codeSvg.css("width", "inherit");
 | 
			
		||||
                        codeSvg.css("height", "inherit");
 | 
			
		||||
                        //takes the svg out of the wrapper markdown
 | 
			
		||||
                        codeContainerDiv.innerHTML = "";
 | 
			
		||||
                        codeContainerDiv.appendChild(codeSvg[0]);
 | 
			
		||||
                    } else {
 | 
			
		||||
                        //code failed to convert to blocks, display as typescript instead
 | 
			
		||||
                        codeContainerDiv.innerText = tsCode;
 | 
			
		||||
                    }
 | 
			
		||||
                    $(codeContainerDiv).show();
 | 
			
		||||
                    $(codeSpinnerDiv).hide();
 | 
			
		||||
                });
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
        if (name)
 | 
			
		||||
            $("#proj-title").text(name);
 | 
			
		||||
 | 
			
		||||
        //init runtime
 | 
			
		||||
        if (!pxsim.initCurrentRuntime)
 | 
			
		||||
            pxsim.initCurrentRuntime = initRuntimeWithDalBoard;
 | 
			
		||||
 | 
			
		||||
        renderParts({
 | 
			
		||||
            name,
 | 
			
		||||
            boardDef,
 | 
			
		||||
            parts,
 | 
			
		||||
            partDefinitions,
 | 
			
		||||
            fnArgs
 | 
			
		||||
        })
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
@@ -1,201 +0,0 @@
 | 
			
		||||
<!doctype html>
 | 
			
		||||
<html lang="en" data-framework="typescript">
 | 
			
		||||
 | 
			
		||||
<head>
 | 
			
		||||
    <meta charset="utf-8">
 | 
			
		||||
    <title>Assembly Instructions</title>
 | 
			
		||||
    <style>
 | 
			
		||||
 | 
			
		||||
        svg {
 | 
			
		||||
            max-width: 100%;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        .blocklyText, .ace_editor {
 | 
			
		||||
            font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace !important;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        .blocklyText, .ace_editor {
 | 
			
		||||
            font-size: 1rem !important;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        .blocklyTreeLabel {
 | 
			
		||||
            font-size: 1.25rem !important;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        .blocklyCheckbox {
 | 
			
		||||
            fill: #ff3030 !important;
 | 
			
		||||
            text-shadow: 0px 0px 6px #f00;
 | 
			
		||||
            font-size: 17pt !important;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        .ui.card .blocklyPreview {
 | 
			
		||||
            position: absolute;
 | 
			
		||||
            top: 50%;
 | 
			
		||||
            left: 50%;
 | 
			
		||||
            transform: translate(-50%, -50%);
 | 
			
		||||
            width: calc(100% - 1em);
 | 
			
		||||
            max-height: calc(100% - 1em);
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        code {
 | 
			
		||||
            white-space: pre-wrap;
 | 
			
		||||
        }
 | 
			
		||||
        code.lang-config, code.lang-package { display:none; }
 | 
			
		||||
 | 
			
		||||
        code.lang-blocks::before,
 | 
			
		||||
        code.lang-sig::before,
 | 
			
		||||
        code.lang-block::before,
 | 
			
		||||
        code.lang-shuffle::before,
 | 
			
		||||
        code.lang-sim::before,
 | 
			
		||||
        code.lang-cards::before,
 | 
			
		||||
        code.lang-namespaces::before,
 | 
			
		||||
        code.lang-codecard::before {
 | 
			
		||||
            content: "...";
 | 
			
		||||
            position: absolute;
 | 
			
		||||
            top: calc(50% - 0.5em);
 | 
			
		||||
            left: calc(50% - 5em);
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        code.lang-blocks,
 | 
			
		||||
        code.lang-sig,
 | 
			
		||||
        code.lang-block,
 | 
			
		||||
        code.lang-shuffle,
 | 
			
		||||
        code.lang-sim,
 | 
			
		||||
        code.lang-cards,
 | 
			
		||||
        code.lang-namespaces,
 | 
			
		||||
        code.lang-codecard {
 | 
			
		||||
            color: transparent;
 | 
			
		||||
        }
 | 
			
		||||
    </style>
 | 
			
		||||
    <style type="text/css">
 | 
			
		||||
        @import "/cdn/semantic.css";
 | 
			
		||||
        @import "/cdn/icons.css";
 | 
			
		||||
    </style>
 | 
			
		||||
    <style>
 | 
			
		||||
        html {
 | 
			
		||||
            padding: 0;
 | 
			
		||||
            margin: 0;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        body {
 | 
			
		||||
            padding: 0;
 | 
			
		||||
            margin: 0;
 | 
			
		||||
            font-family: "Lucida Console", Monaco, monospace;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        div {
 | 
			
		||||
            /*undo semantic UI*/
 | 
			
		||||
            box-sizing: content-box;
 | 
			
		||||
            line-height: normal;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        img {
 | 
			
		||||
            border: 0;
 | 
			
		||||
        }
 | 
			
		||||
        /*TODO: Share CSS with main webpage*/
 | 
			
		||||
 | 
			
		||||
        .organization {
 | 
			
		||||
            position: absolute;
 | 
			
		||||
            bottom: 2rem;
 | 
			
		||||
            right: 2rem;
 | 
			
		||||
            height: 4rem;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        h1 {
 | 
			
		||||
            font-size: 2em;
 | 
			
		||||
            font-weight: normal;
 | 
			
		||||
            color: rgba(0, 0, 0, 0.87);
 | 
			
		||||
            font-family: 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
 | 
			
		||||
            display: block;
 | 
			
		||||
            text-align: center;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        #front-panel .board-svg {
 | 
			
		||||
            position: absolute;
 | 
			
		||||
            left: 2rem;
 | 
			
		||||
            width: 300px;
 | 
			
		||||
            top: 16rem;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        #proj-title {
 | 
			
		||||
            width: 100%;
 | 
			
		||||
            font-size: 70px;
 | 
			
		||||
            margin-top: 20px;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        #proj-code {
 | 
			
		||||
            width: 300px;
 | 
			
		||||
            height: 400px;
 | 
			
		||||
            position: absolute;
 | 
			
		||||
            right: 2rem;
 | 
			
		||||
            top: 16rem;
 | 
			
		||||
        }
 | 
			
		||||
        #proj-code-container {
 | 
			
		||||
            width: 100%;
 | 
			
		||||
            height: 100%;
 | 
			
		||||
            font-size: 4px;
 | 
			
		||||
            overflow: hidden;
 | 
			
		||||
            display: none;
 | 
			
		||||
        }
 | 
			
		||||
        #proj-code-spinner {
 | 
			
		||||
            width: 100%;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        .back-panel svg {
 | 
			
		||||
            position: relative;
 | 
			
		||||
            margin: 0 auto;
 | 
			
		||||
            left: inherit;
 | 
			
		||||
            bottom: -7px;
 | 
			
		||||
        }
 | 
			
		||||
    </style>
 | 
			
		||||
</head>
 | 
			
		||||
<body>
 | 
			
		||||
    <div id='loading' class="ui active inverted dimmer">
 | 
			
		||||
        <div class="ui large loader"></div>
 | 
			
		||||
    </div>
 | 
			
		||||
    <script>
 | 
			
		||||
        // This line gets patched up by the cloud
 | 
			
		||||
        var pxtConfig = null;
 | 
			
		||||
    </script>
 | 
			
		||||
    <script type="text/javascript" src="/cdn/lzma/lzma_worker-min.js"></script>
 | 
			
		||||
    <script type="text/javascript" src="/cdn/marked/marked.min.js"></script>
 | 
			
		||||
    <script type="text/javascript" src="/cdn/jquery.js"></script>
 | 
			
		||||
    <script type="text/javascript" src="/cdn/typescript.js"></script>
 | 
			
		||||
    <script type="text/javascript" src="/cdn/blockly/blockly_compressed.js"></script>
 | 
			
		||||
    <script type="text/javascript" src="/cdn/blockly/blocks_compressed.js"></script>
 | 
			
		||||
    <script type="text/javascript" src="/cdn/blockly/msg/js/en.js"></script>
 | 
			
		||||
    <script type="text/javascript" src="/cdn/pxtlib.js"></script>
 | 
			
		||||
    <script type="text/javascript" src="/cdn/pxtblocks.js"></script>
 | 
			
		||||
    <script type="text/javascript" src="/cdn/pxtsim.js"></script>
 | 
			
		||||
    <script type="text/javascript" src="/cdn/pxtrunner.js"></script>
 | 
			
		||||
    <script type="text/javascript" src="/cdn/semantic.js"></script>
 | 
			
		||||
    <script type="text/javascript" src="/embed.js"></script>
 | 
			
		||||
    <script type="text/javascript" src="/sim/common-sim.js"></script>
 | 
			
		||||
    <script type="text/javascript" src="/sim/sim.js"></script>
 | 
			
		||||
    <script type="text/javascript">
 | 
			
		||||
        (function () {
 | 
			
		||||
        ksRunnerReady(function() {
 | 
			
		||||
            var orgLogo = pxt.appTarget.appTheme.organizationLogo;
 | 
			
		||||
            if (orgLogo)
 | 
			
		||||
                $('#front-panel').append(
 | 
			
		||||
                    $('<img/>').attr('class', 'organization').attr('src', orgLogo)
 | 
			
		||||
                );
 | 
			
		||||
            var loading = document.getElementById('loading');
 | 
			
		||||
            pxsim.instructions.drawInstructions();
 | 
			
		||||
            $(loading).hide();
 | 
			
		||||
        });
 | 
			
		||||
        })();
 | 
			
		||||
    </script>
 | 
			
		||||
 | 
			
		||||
    <div id="front-panel" class="instr-panel">
 | 
			
		||||
        <h1 id="proj-title"></h1>
 | 
			
		||||
 | 
			
		||||
        <!--TODO: extract real code snapshot from PXT -->
 | 
			
		||||
        <div id="proj-code">
 | 
			
		||||
            <i id="proj-code-spinner" class="spinner loading icon"></i>
 | 
			
		||||
            <div id="proj-code-container">
 | 
			
		||||
            </div>
 | 
			
		||||
        </div>
 | 
			
		||||
    </div>
 | 
			
		||||
</body>
 | 
			
		||||
</html>
 | 
			
		||||
		Reference in New Issue
	
	Block a user