<!DOCTYPE HTML>
<html lang="en">
<head>
<title>Doedel Drie Dee</title>
<!--<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>-->
<script src="library/jquery.js"></script>
<script src="library/cal.js"></script>
<script src="library/three.js"></script>

<script src="src/utils.js"></script>
<script src="src/box.js"></script>
<script src="src/printer.js"></script>
<script src="src/slicer.js"></script>

<script src="gcode/testgcode.js"></script>
<script src="gcode/easterbunny.js"></script>
</head>
<body>

<script>
var localIp = location.hash.substring(1);
var doodleBox, drawing;

$(document).ready(function () {
	"use strict";

	doodleBox = new D3D.Box(localIp);

	CAL.Scene.setCanvas(document.getElementById("canvas"));

	var shape = new CAL.Shape({
		shapeColor: false,
		closePath: false,
		points: [
			new CAL.Vector(20, 180),
			new CAL.Vector(180, 100),
			new CAL.Vector(20, 80),
			new CAL.Vector(180, 60)
		]
	});
	CAL.Scene.add(shape);

	drawing = new Drawing(shape);
	CAL.Scene.add(drawing);
});


function Drawing (shape) {
	this.shape = shape;

	this.active = true;
	this.mouse = false;
}
Drawing.prototype.mouseDown = function (mouse) {
	this.mouse = mouse;
};
Drawing.prototype.mouseUp = function (mouse) {
	this.mouse = false;
};
Drawing.prototype.generateGcode = function () {
	var gcode = doodleBox.printer.getStartCode();

	var extruder = 0.0;
	var points = this.shape.points;

	var normalSpeed = doodleBox.printer["printer.speed"] * 60;
	var bottomSpeed = doodleBox.printer["printer.bottomLayerSpeed"] * 60;
	var firstLayerSlow = doodleBox.printer["printer.firstLayerSlow"] * 60;
	var bottomFlowRate = doodleBox.printer["printer.bottomFlowRate"];
	var travelSpeed = doodleBox.printer["printer.travelSpeed"] * 60;
	var filamentThickness = doodleBox.printer["printer.filamentThickness"];
	var wallThickness = doodleBox.printer["printer.wallThickness"];
	var screenToMillimeterScale = doodleBox.printer["printer.screenToMillimeterScale"];
	var layerHeight = doodleBox.printer["printer.layerHeight"];
	var useSubLayers = doodleBox.printer["printer.useSubLayers"];
	var enableTraveling = doodleBox.printer["printer.enableTraveling"];
	var retractionEnabled = doodleBox.printer["printer.retraction.enabled"];
	var retractionspeed = doodleBox.printer["printer.retraction.speed"] * 60;
	var retractionminDistance = doodleBox.printer["printer.retraction.minDistance"];
	var retractionamount = doodleBox.printer["printer.retraction.amount"];

	var speed = bottomSpeed.toFixed(3);

	for (var layer = 0; layer < 10; layer ++) {
		var lastPoint;

		//turn on fan on layer 2
		if (layer === 2) {
			gcode.push("M106");
			speed = normalSpeed.toFixed(3);
		}

		for (var i = 0; i < points.length; i ++) {
			var point = points[i];

			var x = point.x.toFixed(3);
			var y = point.y.toFixed(3);
			var z = ((layer + 1) * layerHeight).toFixed(3);

			if (i === 0) {
				if (layer >= 2 && retractionEnabled) {
					gcode.push("G0 E" + (extruder - retractionamount).toFixed(3) + " F" + (retractionspeed * 60).toFixed(3));
				}

				gcode.push("G0 X" + x + " Y" + y + " Z" + z + " F" + travelSpeed);
				
				if (layer >= 2 && retractionEnabled) {
	            	gcode.push("G0 E" + extruder.toFixed(3) + " F" + (retractionspeed * 60).toFixed(3));
				}
			}
			else {
				var distance = point.subtract(lastPoint).length();

				var flowRate = (layer < 2) ? bottomFlowRate : 1;

				var filamentSurfaceArea = Math.pow((filamentThickness/2), 2) * Math.PI;

				//extruder code from gcodeGenerating.js
				extruder += distance * wallThickness * layerHeight / filamentSurfaceArea * flowRate;

				gcode.push("G1 X" + x + " Y" + y + " Z" + z + " F" + speed + " E" + extruder.toFixed(3));
			}

			lastPoint = point;
		}
	}

	gcode = gcode.concat(doodleBox.printer.getEndCode());
	return gcode;
};
Drawing.prototype.step = function (dt, group) {
	if (this.mouse) {
		this.shape.addPoint(new CAL.Vector(this.mouse.x, this.mouse.y));

		group.drawCanvas = true;
		group.clearCanvas = true;
	}
};

(function loop () {
	requestAnimFrame(loop);
	CAL.Scene.cycle();
})();

</script>

<canvas id="canvas" width="200" height="200"></canvas>

</body>
</html>