added progress bar

settings/user_settings.json

@@ -3,7 +3,7 @@
 	"printer.bottomFlowRate": 2.0, 
 	"printer.bottomLayerSpeed": 35.0, 
 	"printer.bottomThickness": 0.4, 
-	"printer.fillSize": 10.0, 
+	"printer.fillSize": 5.0, 
 	"printer.firstLayerSlow": true, 
 	"printer.layerHeight": 0.2, 
 	"printer.retraction.amount": 3.0, 

slice_test.html

@@ -72,14 +72,11 @@ function init () {
 		mesh.position.x = 100;
 		mesh.position.z = 100;
 
-		//scene.add(mesh);
+		scene.add(mesh);
 
 		mesh.updateMatrix();
 		var slicer = new D3D.Slicer().setMesh(mesh.geometry, mesh.matrix);
 
-		var mesh = new THREE.Mesh(slicer.geometry, material);
-		scene.add(mesh);
-		
 		//var canvas = document.getElementById("canvas");
 		//var context = canvas.getContext("2d");
 

src/slicer.js

@@ -14,14 +14,21 @@
 
 D3D.Slicer = function () {
 	"use strict";
+
+	this.progress = {
+		totalLayers: 0, 
+		sliceLayer: 0, 
+		dataLayer: 0, 
+		gcodeLayer: 0
+	};
 };
 D3D.Slicer.prototype.setMesh = function (geometry, matrix) {
 	"use strict";
 
 	//convert buffergeometry to geometry;
-	//if (geometry instanceof THREE.BufferGeometry) {
+	if (geometry instanceof THREE.BufferGeometry) {
-	//	geometry = new THREE.Geometry().fromBufferGeometry(geometry);
+		geometry = new THREE.Geometry().fromBufferGeometry(geometry);
-	//}
+	}
 
 	//remove duplicate vertices;
 	/*
@@ -51,6 +58,11 @@ D3D.Slicer.prototype.setMesh = function (geometry, matrix) {
 
 	return this;
 };
+D3D.Slicer.prototype.updateProgress = function () {
+	if (this.onProgress !== undefined) {
+		this.onProgress(this.progress);
+	}
+};
 D3D.Slicer.prototype.createLines = function () {
 	"use strict";
 
@@ -70,8 +82,7 @@ D3D.Slicer.prototype.createLines = function () {
 			self.lines.push({
 				line: new THREE.Line3(self.geometry.vertices[a], self.geometry.vertices[b]), 
 				connects: [], 
-				normals: [],
+				normals: []
-				ignore: 0
 			});
 		}
 
@@ -168,12 +179,12 @@ D3D.Slicer.prototype.slice = function (layerHeight, height) {
 							var normal = a.sub(b).normal().normalize();
 							var faceNormal = faceNormals[Math.floor(j/2)];
 
-							if (normal.dot(faceNormal) > 0) {
+							//if (normal.dot(faceNormal) > 0) {
 								break;
-							}
+							//}
-							else {
+							//else {
-								index = -1;
+							//	index = -1;
-							}
+							//}
 						}
 						else {
 							index = -1;
@@ -237,6 +248,9 @@ D3D.Slicer.prototype.slice = function (layerHeight, height) {
 		else {
 			break;
 		}
+
+		this.progress.sliceLayer = layer;
+		this.updateProgress();
 	}
 
 	return slices;
@@ -351,6 +365,9 @@ D3D.Slicer.prototype.slicesToData = function (slices, printer) {
 				});
 			}
 		}
+
+		this.progress.dataLayer = layer;
+		this.updateProgress();
 	}
 
 	return data;
@@ -481,6 +498,9 @@ D3D.Slicer.prototype.dataToGcode = function (data, printer) {
 			gcode = gcode.concat(sliceToGcode(layerPart.insets));
 			gcode = gcode.concat(sliceToGcode(layerPart.fill));
 		}
+
+		this.progress.gcodeLayer = layer;
+		this.updateProgress();
 	}
 
 	gcode = gcode.concat(printer.getEndCode());
@@ -523,6 +543,11 @@ D3D.Slicer.prototype.getGcode = function (printer) {
 	var layerHeight = printer.config["printer.layerHeight"];
 	var dimensionsZ = printer.config["printer.dimensions.z"];
 
+	this.progress.totalLayers = Math.floor(this.geometry.boundingBox.max.y / layerHeight);
+	this.progress.sliceLayer = 0;
+	this.progress.dataLayer = 0;
+	this.progress.gcodeLayer = 0;
+
 	var start = new Date().getTime();
 	var slices = this.slice(layerHeight, dimensionsZ);
 	var end = new Date().getTime();

src/slicerworker.js

@@ -3,9 +3,21 @@ D3D.SlicerWorker = function () {
 
 	this.worker = new Worker('webworker/worker.js');
 
+	var progressBar = document.getElementById("progress-bar");
+	var scope = this;
 	this.worker.addEventListener('message', function (event) {
-		console.log(event);
+
-		gcode = event.data;
+		switch (event.data["cmd"]) {
+			case "PROGRESS":
+				var progress = event.data["progress"];
+				var procent = (progress.sliceLayer + progress.dataLayer + progress.gcodeLayer) / progress.totalLayers / 3;
+				progressBar.style.width = procent * 100 + "%";
+			break;
+
+			case "GCODE":
+				gcode = event.data["gcode"];
+			break;
+		}
 	}, false);
 }
 D3D.SlicerWorker.prototype.setSettings = function (USER_SETTINGS, PRINTER_SETTINGS) {

webworker/worker.js

@@ -7,6 +7,16 @@ importScripts("../src/slicer.js");
 
 var printer = new D3D.Printer();
 var slicer = new D3D.Slicer();
+slicer.onProgress = function (progress) {
+	"use strict";
+
+	self.postMessage({
+		"cmd": "PROGRESS", 
+		"progress": progress
+	});
+
+	//console.log(progress);
+};
 
 self.addEventListener("message", function (event) {
 	"use strict";
@@ -29,17 +39,15 @@ self.addEventListener("message", function (event) {
 		case "SLICE":
 			var gcode = slicer.getGcode(printer);
 
-			self.postMessage(gcode);
+			self.postMessage({
+				"cmd": "GCODE", 
+				"gcode": gcode
+			});
 		break;
 
 		case "CLOSE": 			
 			self.close();
 		break;
 
-		default: 
-
-			//console.log(event);
-
-		break;
 	}
 });

webworker_benchmark_resutaten.txt

@@ -0,0 +1,19 @@
+----------- RESULTATEN TORUS KNOT --------------
+
+Buffer Geometry x 0.53 ops/sec ±134.70% (8 runs sampled)
+
+Buffer Geometry Transferrable Object x 63.04 ops/sec ±2.19% (67 runs sampled)
+
+Geometry JSON x 0.50 ops/sec ±6.55% (6 runs sampled)
+
+Fastest is "Buffer Geometry Transferrable Object"
+
+----------- RESULTATEN KUBUS --------------
+
+Buffer Geometry x 5,360 ops/sec ±19.42% (85 runs sampled)
+
+Buffer Geometry Transferrable Object x 1,535 ops/sec ±10.17% (35 runs sampled)
+
+Geometry JSON x 3,831 ops/sec ±2.52% (82 runs sampled)
+
+Fastest is "Buffer Geometry"

webworker_test.html

@@ -12,36 +12,38 @@
 <title>Doedel Drie Dee || Webworker Test</title>
 <style>
 canvas {border: 1px solid black;}
+#progress {height: 20px; width: 200px; border: 1px solid black; overflow: hidden;}
+#progress-bar {height: 20px; background-color: lightblue; width: 0%;}
 </style>
 </head>
 <body>
 
 <canvas id="3d-preview" height="400" width="400"></canvas>
 <canvas id="canvas" width="400" height="400"></canvas>
+<div id="progress"><div id="progress-bar"></div></div>
 
 <script>
 
 var USER_SETTINGS, PRINTER_SETTINGS, doodleBox, gcode, slicerWorker;
 
-
 function init () {
 	"use strict";
 	var scene = createScene();
 
 	var localIp = location.hash.substring(1);
-	doodleBox = new D3D.Box(localIp);
+	//doodleBox = new D3D.Box(localIp);
 
 	var slicer = new D3D.SlicerWorker();
 
 	slicer.setSettings(USER_SETTINGS, PRINTER_SETTINGS["ultimaker"]);
 
 	var loader = new THREE.STLLoader();
-	loader.load("models/pokemon/pikachu.stl", function (geometry) {
+	loader.load("models/stanford_bunny_high.stl", function (geometry) {
 		var material = new THREE.MeshPhongMaterial({color: 0x00ff00, wireframe: false});
 		var mesh = new THREE.Mesh(geometry, material);
 		
 		mesh.rotation.x = -Math.PI/2;
-		mesh.scale.x = mesh.scale.y = mesh.scale.z = 1;
+		mesh.scale.x = mesh.scale.y = mesh.scale.z = 0.5;
 		mesh.position.y = -9.260265119962973e-17;
 		mesh.position.x = 100;
 		mesh.position.z = 100;