Embed jscut simulator

by Todd Fleming

HTML

<!-- Polymer Polyfill Libraries -->
<script src="http://api.jscut.org/bower_components/platform/platform.js"></script>

<!-- Polymer Components -->
<link rel="import" href="http://api.jscut.org/bower_components/core-localstorage/core-localstorage.html">
<link rel="import" href="http://api.jscut.org/bower_components/paper-slider/paper-slider.html">

<!-- jscut Components -->
<link rel="import" href="http://api.jscut.org/api/jscut-simulate-gcode.html">

<!-- Page Content -->
<template id="top" is="auto-binding">
    <!-- Bind parameters to local storage -->
    <core-localstorage name="test-cutterDiameter" value="{{cutterDiameter}}"></core-localstorage>
    <core-localstorage name="test-cutterHeight" value="{{cutterHeight}}"></core-localstorage>
    <core-localstorage name="test-gcode" value="{{gcode}}"></core-localstorage>

    <!-- gcode simulator -->
    <jscut-simulate-gcode
        width="400"
        height="400"
        gcode="{{gcode}}" 
        cutterdiameter="{{cutterDiameter}}" 
        cutterheight="{{cutterHeight}}"
        time1="{{time1}}"
        time2="{{time2}}"
        maxtimeRounded="{{maxTime}}"
        elementsurl="http://api.jscut.org/elements">
    </jscut-simulate-gcode>

    <!-- Controls with parameters bound to simulator -->
    <br><paper-slider pin editable value="{{time1}}" immediatevalue="{{time2}}" max="{{maxTime}}" step="0.1" id="paper_slider"></paper-slider>
    <br><input type="number" value="{{cutterDiameter}}">
    <br><input type="number" value="{{cutterHeight}}">
    <br><textarea value="{{gcode}}" rows="20" cols="60"></textarea>
</template>

JavaScript

// This executes after polymer finishes composing the templates.
// It sets default values for simulator.
document.addEventListener('polymer-ready', function () {
    var top = document.querySelector('#top');
    top.cutterDiameter = 0.125;
    top.cutterHeight = 1;
        top.gcode =
            'G1 Z0.1 F100\n'+
            'G1 X0 Y0 F100\n'+
            'G1 Z0.0000\n'+
            'G1 Z-0.1250 F20\n'+
            'G1 X1 Y1 F40\n';
});