vmario
/
doodle3d-client
mirror of https://github.com/Doodle3D/doodle3d-client.git
0
0
Fork 0
Code Issues Releases Wiki Activity

Merge branch 'master' of https://github.com/Doodle3D/doodle3d-client 

Conflicts:
	js/buttonbehaviors.js
This commit is contained in:
peteruithoven 2013-09-13 16:06:27 +02:00
parent b830205a73 3a11106535
commit a57a36f420
18 changed files with 196 additions and 127 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
css/d3d_btns.css
View File

@ -23,6 +23,7 @@ img {
/* http://stackoverflow.com/questions/5348092/prevent-default-press-but-not-default-drag-in-ios-mobilesafari */
.btn {
background-repeat: no-repeat;
cursor: pointer
}
/*
@ -94,10 +95,14 @@ img {
*/
#drawAreaContainer > .buttons {
#drawAreaContainer > .manipulationBtns {
margin: 5px;
}
.manipulationBtn {
cursor: pointer;
}
#btnsUpDown {
position: absolute;
right: 200px;

6
css/fixedPosInterface.css
View File

@ -94,7 +94,7 @@ body {
}
#svg {
cursor: hand;
cursor: pointer;
}
#drawAreaContainer {
@ -103,8 +103,8 @@ body {
left: 193px;
width: 650px;
height: 450px;
background-color: white;
border: 4px solid black;
background-color: #fff;
border: 4px solid #000;
border-radius: 15px;
}

2
css/settingsPopup.css
View File

@ -58,7 +58,7 @@ div.content > div.settings {
overflow-x: hidden;
padding: 10px 10px 10px 10px;
}
div.content > div.buttons {
div.content > div.manipulationBtns {
display: table-cell;
vertical-align: bottom;
width: 125px;

2
fixedPosInterface01_v02.html
View File

@ -70,7 +70,7 @@
<path id="path" d="M200 100 L450 100 L450 350 L200 350 L200 100" fill="none" stroke="black" stroke-width="3"/>
</svg>
<canvas id="preview" width="150" height="450"></canvas>
<div class="buttons cf">
<div class="manipulationBtns cf">
<div id="btnsUpDown">
<img id="btnUp" src="img/buttons/btnUp.png">
<img id="btnDown" src="img/buttons/btnDown.png">

BIN
img/logo_full_8bit.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 19 KiB

BIN
img/logo_small.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 53 KiB

After

Width:  |  Height:  |  Size: 46 KiB

BIN
img/logo_small_8bit.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

BIN
img/logo_smaller.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 19 KiB

BIN
img/logo_smaller_8bit.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.1 KiB

BIN
img/logo_smaller_wide.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 19 KiB

BIN
img/logo_smaller_wide_8bit.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.2 KiB

12
index.html
View File

@ -51,14 +51,14 @@
<!--</svg>-->
<canvas id="preview"></canvas>
<canvas id="preview_tmp"></canvas>
<div class="buttons cf">
<div class="manipulationBtns cf">
<div id="btnsUpDown">
<div id="btnMoveUp"></div>
<div id="btnMoveDown"></div>
<div class="manipulationBtn" id="btnMoveUp"></div>
<div class="manipulationBtn" id="btnMoveDown"></div>
</div>
<div id="btnsTurnLeftRight">
<div id="btnTwistLeft"></div>
<div id="btnTwistRight"></div>
<div class="manipulationBtn" id="btnTwistLeft"></div>
<div class="manipulationBtn" id="btnTwistRight"></div>
</div>
</div>
</div>
@ -72,7 +72,7 @@
</header>
<div class="content">
<div class="settings">henk</div>
<div class="buttons">
<div class="manipulationBtns">
<div class="btnOK"></div>
</div>
</div>

25
js/Printer.js
View File

@ -1,3 +1,28 @@
var $printProgressContainer = $("#printProgressContainer");
var $progressbar = $("#progressbar");
var $progressAmount = $(".progressAmount");
function setPrintprogress(val) {
if (isNaN(val)) return;
// console.log("f:setPrintprogress() >> val " + val);
$progressbar.css("width", val*100 + "%");
$progressAmount.text(Math.floor(val*100) + "%");
}
var thermoVal = 0;
var thermocounter = 0;
var $displayThermometer = $("#thermometerContainer");
var $thermometer = $("#thermometer");
//var thermoInterval;
function updateThermometer(curr, targ) {
console.log("f:updateThermometer() >> curr temp " + curr + ", targ temp " + targ);
if (isNaN(curr) || isNaN(targ)) return;
$thermometer.css("height", (curr/targ)*100 + "%");
// $thermometer.css("background-position", -val*100 + "%");
$(".thermoAmount").text(curr+"/"+targ);
}
function Printer() {
this.temperature = 0;
this.targetTemperature = 0;

34
js/SettingsWindow.js
View File

@ -4,12 +4,15 @@ var settings = {
"network.ap.address": "192.168.10.1",
"network.ap.netmask": "255.255.255.0",
"printer.temperature": 220,
"printer.objectHeight": '???',
"printer.objectHeight": 20,
"printer.maxObjectHeight": 150,
"printer.layerHeight": 0.2,
"printer.wallThickness": 0.7,
"printer.screenToMillimeterScale": 0.3,
"printer.speed": 50,
"printer.travelSpeed": 200,
"printer.filamentThickness": 2.85,
"printer.enableTraveling": true,
"printer.useSubLayers": true,
"printer.firstLayerSlow": true,
"printer.autoWarmUp": true,
@ -17,12 +20,13 @@ var settings = {
"printer.simplify.minNumPoints": 15,
"printer.simplify.minDistance": 3,
"printer.retraction.enabled": true,
"printer.retraction.speed": 250,
"printer.retraction.speed": 50,
"printer.retraction.minDistance": 1,
"printer.retraction.amount": 2,
"printer.retraction.amount": 5,
"printer.autoWarmUpCommand": "M104 S220 (hardcoded temperature)"
}
function SettingsWindow() {
this.wifiboxURL;
this.window;
@ -130,7 +134,7 @@ function SettingsWindow() {
timeout: this.timeoutTime,
success: function(data){
console.log("Settings:loadSettings response: ",data);
settings = data.data;
settings = data.data;
console.log(" settings: ",settings);
self.fillForm();
$(document).trigger(SettingsWindow.SETTINGS_LOADED);
@ -501,7 +505,7 @@ function SettingsWindow() {
var objectHeight = 20;
var layerHeight = .2;
//var wallThickness = .5;
var hop = 0;
//var hop = 0;
//var speed = 70;
//var travelSpeed = 200;
var enableTraveling = true;
@ -510,10 +514,10 @@ var minScale = .3;
var maxScale = 1;
var shape = "%";
var twists = 0;
var useSubLayers = true;
//var useSubLayers = true;
//var debug = false; // debug moved to main.js
var loglevel = 2;
var zOffset = 0;
//var zOffset = 0;
var serverport = 8888;
var autoLoadImage = "hand.txt";
var loadOffset = [0, 0]; // x en y ?
@ -522,18 +526,18 @@ var loopAlways = false;
var firstLayerSlow = true;
var useSubpathColors = false;
var autoWarmUp = true;
var maxObjectHeight = 150;
//var maxObjectHeight = 150;
var maxScaleDifference = .1;
var frameRate = 60;
var quitOnEscape = true;
var screenToMillimeterScale = .3; // 0.3
var targetTemperature = 230;
var simplifyiterations = 10;
var simplifyminNumPoints = 15;
var simplifyminDistance = 3;
var retractionspeed = 50;
var retractionminDistance = 5;
var retractionamount = 3;
//var targetTemperature = 220;
//var simplifyiterations = 10;
//var simplifyminNumPoints = 15;
//var simplifyminDistance = 3;
//var retractionspeed = 50;
//var retractionminDistance = 5;
//var retractionamount = 3;
var sideis3D = true;
var sidevisible = true;
var sidebounds = [900, 210, 131, 390];

105
js/buttonbehaviors.js
View File

@ -12,6 +12,7 @@ var btnOops, btnStop, btnClear;
var btnMoveUp, btnMoveDown, btnTwistLeft, btnTwistRight;
var btnInfo, btnSettings;
var btnDebug; // debug
var displayTemp, displayProgress;
var displayTempEnabled = false;
@ -36,6 +37,7 @@ function initButtonBehavior() {
btnPrint= $("#btnPrint");
btnStop = $("#btnStop");
displayTemp = $("#displayTemp");
displayProgress = $("#printProgressContainer");
// btnPrevious = $("#btnPrevious");
// btnNext = $("#btnNext");
@ -43,28 +45,6 @@ function initButtonBehavior() {
//debug
btnDebug = $(".debugBtn");
/*if (!btnNew.addEventListener) {
btnNew.attachEvent('onmousedown',clearDoodle);
btnNew.attachEvent('ontouchstart',clearDoodle);
btnPrint.attachEvent('onmousedown',print);
btnPrint.attachEvent('ontouchstart',print);
// btnPrevious.attachEvent('onmousedown',prevDoodle);
// btnPrevious.attachEvent('ontouchstart',prevDoodle);
// btnNext.attachEvent('onmousedown',nextDoodle);
// btnNext.attachEvent('ontouchstart',nextDoodle);
} else {
btnNew.addEventListener('mousedown',clearDoodle,false);
btnNew.addEventListener('touchstart',clearDoodle,false);
btnPrint.addEventListener('mousedown',print,false);
btnPrint.addEventListener('touchstart',print,false);
// btnPrevious.addEventListener('mousedown',prevDoodle,false);
// btnPrevious.addEventListener('touchstart',prevDoodle,false);
// btnNext.addEventListener('mousedown',nextDoodle,false);
// btnNext.addEventListener('touchstart',nextDoodle,false);
}*/
btnNew.bind('touchstart mousedown',clearDoodle);
btnPrint.bind('touchstart mousedown',print);
@ -81,23 +61,6 @@ function initButtonBehavior() {
clearDoodle();
});
// btnPrevious.mouseup(function(e) {
// e.preventDefault();
// console.log("btnPrevious");
// })
// btnPrevious.bind("touchend", function(e) {
// e.preventDefault();
// console.log("btnPrevious");
// })
// btnNext.mouseup(function(e) {
// e.preventDefault();
// console.log("btnNext");
// })
// btnNext.bind("touchend", function(e) {
// e.preventDefault();
// console.log("btnPrevious");
// })
function startOops(e) {
// console.log("btnOops mouse down");
e.preventDefault();
@ -188,7 +151,7 @@ function initButtonBehavior() {
e.preventDefault();
// console.log("btnTwistRight mouse up");
clearInterval(btnTwistRightInterval);
previewTwistLeft();
previewTwistRight();
}
btnTwistRight.mousedown(function(e) { startTwistRight(e) });
btnTwistRight.mouseup(function(e) { stopTwistRight(e) });
@ -244,41 +207,34 @@ function nextDoodle(e) {
function print(e) {
console.log("f:print() >> sendPrintCommands = " + sendPrintCommands);
if (sendPrintCommands) {
$("#textdump").text("");
if (_points.length > 2) {
$("#textdump").text("");
if (_points.length > 2) {
setState(PRINTING_STATE);
var gcode = generate_gcode();
//startPrint(gencode);
setState(PRINTING_STATE);
var gcode = generate_gcode();
//startPrint(gencode);
if (sendPrintCommands) {
printer.print(gcode);
// console.log("");
// console.log("");
// console.log("-------------------------------------------------");
// console.log("generated gcode:");
// console.log(gencode);
// console.log("-------------------------------------------------");
// console.log("");
// console.log("");
// console.log("");
//if (debugMode)
$("#textdump").text(gcode.join("\n"));
// copyToClipboard(gencode);
//*/
} else {
console.log("f:print >> not enough points!");
console.log("sendPrintCommands is false: not sending print command to 3dprinter");
}
//if (debugMode) {
//console.log("f:print() >> debugMode is true, dumping gcode to textarea #textdump");
$("#textdump").text(gcode.join("\n"));
//}
// $.post("/doodle3d.of", { data:output }, function(data) {
// btnPrint.disabled = false;
// });
// copyToClipboard(gencode);
//*/
} else {
console.log("sendPrintCommands is false: not sending print command to 3dprinter");
console.log("f:print >> not enough points!");
}
// $.post("/doodle3d.of", { data:output }, function(data) {
// btnPrint.disabled = false;
// });
}
@ -303,7 +259,7 @@ function oopsUndo() {
}
function previewUp(redrawLess) {
// console.log("f:previewUp()");
if (numLayers < 100) {
if (numLayers < maxNumLayers) {
numLayers++;
}
// redrawPreview(redrawLess);
@ -311,7 +267,7 @@ function previewUp(redrawLess) {
}
function previewDown(redrawLess) {
// console.log("f:previewDown()");
if (numLayers > 2) {
if (numLayers > minNumLayers) {
numLayers--;
}
// redrawPreview(redrawLess);
@ -340,17 +296,22 @@ function previewTwistRight(redrawLess) {
function update() {
if(!displayTempEnabled && printer.alive) {
displayTemp.show();
$displayThermometer.show();
displayTempEnabled = true;
} else if(displayTempEnabled && !printer.alive) {
displayTemp.hide();
$displayThermometer.hide();
displayTempEnabled = false;
}
if(displayTempEnabled) {
displayTemp.text(printer.temperature+"/"+printer.targetTemperature);
updateThermometer(printer.temperature, printer.targetTemperature);
}
var btnPrint= $("#btnPrint");
setPrintprogress(printer.currentLine/printer.num_lines);
var btnPrint= $("#btnPrint");
setState(printer.printing? PRINTING_STATE : IDLE_STATE);
}
@ -365,6 +326,7 @@ function setState(newState) {
btnPrint.removeClass("disabled"); // enable print button
btnStop.addClass("disabled"); // disable stop button
btnPrint.bind('touchstart mousedown',print);
displayProgress.hide();
break;
case PRINTING_STATE:
@ -372,7 +334,8 @@ function setState(newState) {
btnPrint.addClass("disabled"); // disable print button
btnStop.removeClass("disabled"); // enable stop button
btnPrint.unbind('touchstart mousedown');
displayProgress.show();
break;
}

89
js/gcodeGenerating_v01.js
View File

@ -24,12 +24,72 @@ gcodeEnd.push("M84"); // disable axes / steppers
gcodeEnd.push("G90"); // absolute positioning
gcodeEnd.push("M117 Done "); // display message (20 characters to clear whole screen)
var gcode = [];
function generate_gcode(callback) {
console.log("f:generategcode()");
var startGcode = [];
var endGcode = [];
// get gcode start statements
if ($("#startgcode").val().trim().length != 0) {
console.log(" found contents for start-gcode in settings.html")
startGcode = $("#startgcode").val().trim().split("\n");
} else {
console.log(" no start-gcode in settings.html, using defaults")
startGcode.concat(gcodeStart);
}
// get gcode end statements
if ($("#endgcode").val().trim().length != 0) {
console.log(" found contents for end-gcode in settings.html")
endGcode = $("#endgcode").val().trim().split("\n");
} else {
console.log(" no end-gcode in settings.html, using defaults")
endGcode.concat(gcodeEnd);
}
gcode = [];
console.log("settings: ",settings);
var speed = settings["printer.speed"]
var normalSpeed = speed;
var bottomSpeed = speed*0.5;
var travelSpeed = settings["printer.travelSpeed"]
var filamentThickness = settings["printer.filamentThickness"];
var wallThickness = settings["printer.wallThickness"];
var screenToMillimeterScale = isNaN(settings["printer.screenToMillimeterScale"]) ? 0.3 : settings["printer.screenToMillimeterScale"]; // TODO add this item to the settings on 'kastje'
var layerHeight = settings["printer.layerHeight"];
var objectHeight = settings["printer.objectHeight"];
var maxObjectHeight = isNaN(settings["printer.maxObjectHeight"]) ? 150 : settings["printer.maxObjectHeight"]; // TODO add this item to the settings on 'kastje'
var temperature = settings["printer.temperature"];
var useSubLayers = settings["printer.useSubLayers"];
var enableTraveling = isNaN(settings["printer.enableTraveling"]) ? true : settings["printer.enableTraveling"]; // TODO add this item to the settings on 'kastje'
var retractionspeed = settings["printer.retraction.speed"];
var retractionminDistance = settings["printer.retraction.minDistance"];
var retractionamount = settings["printer.retraction.amount"];
/*
console.log("f:generate_gcode >> EFFE CHECKEN:");
console.log(" speed: " + speed);
console.log(" travelSpeed: " + travelSpeed);
console.log(" filamentThickness: " + filamentThickness);
console.log(" wallThickness: " + wallThickness);
console.log(" screenToMillimeterScale: " + screenToMillimeterScale);
console.log(" layerHeight: " + layerHeight);
console.log(" objectHeight: " + objectHeight);
console.log(" maxObjectHeight: " + maxObjectHeight);
console.log(" temperature: " + temperature);
console.log(" maxObjectHeight: " + maxObjectHeight);
console.log(" useSubLayers: " + useSubLayers);
console.log(" enableTraveling: " + enableTraveling);
console.log(" retractionspeed: " + retractionspeed);
console.log(" retractionminDistance: " + retractionminDistance);
console.log(" retractionamount: " + retractionamount);
console.log("");
//*/
objectHeight = Math.ceil(numLayers / 5); // in settings objectHeight = 20, in previewRendering_v01.js numLayers is 100, hence the / 5
objectHeight = numLayers; // in settings objectHeight = 20, in previewRendering_v01.js numLayers is 100, hence the / 5
@ -43,20 +103,10 @@ function generate_gcode(callback) {
// console.log("paths.toString(): " + paths.toString());
// return;
console.log("settings: ",settings);
var speed = settings["printer.speed"]
var normalSpeed = speed;
var bottomSpeed = speed*0.5;
var travelSpeed = settings["printer.travelSpeed"]
var filamentThickness = settings["printer.filamentThickness"];
var wallThickness = settings["printer.wallThickness"];
var layerHeight = settings["printer.layerHeight"];
var temperature = settings["printer.temperature"];
console.log("printer temperature: ",temperature);
gcode.push("M109 S" + temperature); // set target temperature and wait for the extruder to reach it
// add gcode begin commands
gcode = gcode.concat(gcodeStart);
gcode = gcode.concat(startGcode);
//gcode.push("M109 S" + temperature); // set target temperature and wait for the extruder to reach it
@ -71,13 +121,10 @@ function generate_gcode(callback) {
// x: doodleBounds[0],
// y: doodleBounds[1]
}
console.log("f:generategcode() >> layers: " + layers);
if (layers == Infinity) return;
for (var layer = 0; layer < layers; layer++) {
var p = JSON.parse(JSON.stringify(points)); // [].concat(points);
@ -149,7 +196,7 @@ function generate_gcode(callback) {
// ofPoint to = commands[(even || isLoop || loopAlways) ? i : last-i].to;
var to = new Point(); to.set(commands[i][0], commands[i][1]);
var sublayer = (layer == 0) ? 0.0 : layer + (useSubLayers ? (curLayerCommand/totalLayerCommands) : 0);
var z = (sublayer + 1) * layerHeight + zOffset;
var z = (sublayer + 1) * layerHeight; // 2013-09-06 removed zOffset (seemed to be useless)
var isTraveling = !isLoop && i==0;
var doRetract = prev.distance(to) > retractionminDistance;
@ -157,7 +204,7 @@ function generate_gcode(callback) {
if (enableTraveling && isTraveling) {
// console.log("enableTraveling && isTraveling >> doRetract: " + doRetract + ", retractionspeed: " + retractionspeed);
if (doRetract) gcode.push("G0 E" + (extruder - retractionamount).toFixed(3) + " F" + (retractionspeed * 60).toFixed(3)); //retract
gcode.push("G0 X" + to.x.toFixed(3) + " Y" + to.y.toFixed(3) + " Z" + (z + (doRetract ? hop : 0)).toFixed(3) + " F" + (travelSpeed * 60).toFixed(3));
gcode.push("G0 X" + to.x.toFixed(3) + " Y" + to.y.toFixed(3) + " Z" + z.toFixed(3) + " F" + (travelSpeed * 60).toFixed(3));
if (doRetract) gcode.push("G0 E" + extruder.toFixed(3) + " F" + (retractionspeed * 60).toFixed(3)); // return to normal
} else {
// console.log(" else");
@ -174,7 +221,7 @@ function generate_gcode(callback) {
}
if ((layer/layers) > (objectHeight/maxObjectHeight)) {
console.log("f:generategcode() >> (layer/layers) > (objectHeight/maxObjectHeight) is true -> breaking");
console.log("f:generategcode() >> (layer/layers) > (objectHeight/maxObjectHeight) is true -> breaking at layer " + (layer + 1));
break;
}
@ -182,7 +229,7 @@ function generate_gcode(callback) {
}
// add gcode end commands
gcode = gcode.concat(gcodeEnd);
gcode = gcode.concat(endGcode);
// debug
// var _gc = gc.join("\n");

26
js/main.js
View File

@ -40,12 +40,36 @@ $(function() {
settingsWindow.init(wifiboxURL);
$(document).on(SettingsWindow.SETTINGS_LOADED,settingsLoaded);
if(debugMode) {
console.log("debug mode is true");
$("body").css("overflow", "auto");
$("#debug_textArea").css("display", "block");
$("#preview_tmp").css("display", "block");
/* TEMP CODE!! -> artificially populates the startgcode and endgcode textareas in the settings window */
// todo remove this temporary code...
/*
setTimeout(function() {
$("#startgcode").text("");
$("#startgcode").append("G21 (mm) \n");
$("#startgcode").append("G91 (relative) \n");
$("#startgcode").append("G28 X0 Y0 Z0 (physical home) \n");
$("#startgcode").append("M104 S230 (temperature) \n");
$("#startgcode").append("G1 E10 F250 (flow) \n");
$("#startgcode").append("G92 X-100 Y-100 Z0 E10 \n");
$("#startgcode").append("G1 Z3 F5000 (prevent diagonal line) \n");
$("#startgcode").append("G90 (absolute) \n");
$("#startgcode").append("M106 (fan on)");
console.log("$('#startgcode'): " + $("#startgcode").val());
$("#endgcode").text("");
$("#endgcode").append("G1 X-100 Y-100 F15000 (fast homing) \n");
$("#endgcode").append("M107 \n");
$("#endgcode").append("M84 (disable axes) \n");
console.log("$('#endgcode'): " + $("#endgcode").val());
}, 1000);
//*/
}
})
function settingsLoaded() {

15
js/previewRendering_v02.js
View File

@ -37,15 +37,16 @@ function initPreviewRendering() {
redrawPreview();
}
//var numLayers = 100; //50
var numLayers = 100; // 100
var numLayers = 10; // current number of preview layers
var maxNumLayers= 100; // maximum number of preview layers
var minNumLayers= 2; // minimum number of preview layers
var globalScale = 0.3; // global scale of preview (width preview / width canvas)
var globalAlpha = 0.20; // global alpha of preview
var scaleY = 0.4; // additional vertical scale per path for 3d effect
var viewerScale = 0.65; // additional scale to fit into preview nicely (otherwise is fills out totally)
var strokeWidth = 2; //4;
var globalAlpha = 0.20; // global alpha of preview
var scaleY = 0.4; // additional vertical scale per path for 3d effect
var viewerScale = 0.65; // additional scale to fit into preview nicely (otherwise is fills out totally)
var strokeWidth = 2; //4;
//var rStep = Math.PI/40; //Math.PI/40; //
var rStep = Math.PI/45; // Math.PI/180; //Math.PI/40; //
var rStep = Math.PI/90; // Math.PI/180; //Math.PI/40; //
var yStep;// = preview.height / 150; // 3; //6;
//var svgWidth = 500; // 650 //parseInt($(svg).css("width"));
//var svgHeight = 450; //450; //parseInt($(svg).css("height"));