diff --git a/css/d3d_btns.css b/css/d3d_btns.css
index a750422..da0f5a1 100644
--- a/css/d3d_btns.css
+++ b/css/d3d_btns.css
@@ -152,7 +152,7 @@ img {
.btn {
position: absolute;
-webkit-user-select: none;
- cursor: hand;
+ cursor: pointer;
}
#displayTemp {
position: absolute;
@@ -163,7 +163,7 @@ img {
display:none;
}
-.disabled {
+.disabled {
opacity: 0.3;
cursor: default;
}
diff --git a/css/fixedPosInterface.css b/css/fixedPosInterface.css
index 75dcdd6..49c43f9 100644
--- a/css/fixedPosInterface.css
+++ b/css/fixedPosInterface.css
@@ -90,7 +90,10 @@ body {
position: absolute;
top: 15px;
left: 31%;
- content:url("../img/logo_full.png");
+ width: 399px;
+ height: 139px;
+ background-image: url('../img/logo_full.png');
+ cursor: pointer;
}
#svg {
@@ -168,6 +171,55 @@ body {
z-index: -5;
}
+/* PRINT PROGRESS DISPLAY */
+#printProgressContainer {
+ position: absolute;
+ right: 30px;
+ top: 370px;
+ width: 110px;
+ margin: 5px 0px;
+ font-weight: bold;
+ display:none;
+}
+#progressbarContainer {
+ margin: 3px 0px;
+ width: inherit;
+ height: 20px;
+ background-color: #fff;
+ border: 2px solid #333;
+ border-radius: 5px;
+ -o-border-radius: 5px;
+ -moz-border-radius: 5px;
+ -webkit-border-radius: 5px;
+}
+.progressAmount {
+ margin: 0px 5px;
+}
+#progressbar {
+ position: relative;
+ /*margin-bottom: -20px;*/
+ width: 0%;
+ height: 100%;
+ background-color: #4c4;
+ border: 0px solid #f0f;
+ border-radius: 3px;
+ -o-border-radius: 3px;
+ -moz-border-radius: 3px;
+ -webkit-border-radius: 3px;
+}
+
+/* THERMOMETER */
+#thermometerContainer {
+ position: absolute;
+ right: 30px;
+ top: 410px;
+}
+#thermometerCanvas {
+ /*background: #59b2b8;*/
+ /*zoom: 2;*/
+}
+
+
/* The code below is for resizing UI elements as the viewport becomes less high (suitable for tablets & smartphones) */
@media screen and (max-height: 675px) {
@@ -176,8 +228,10 @@ body {
}
#d3dlogo {
- content:url("../img/logo_small.png");
- margin-top: 7px;
+ width: 399px;
+ height: 74px;
+ background-image: url('../img/logo_small.png');
+ margin-top: 9px;
}
#btnsUpDown, #btnsTurnLeftRight {
@@ -215,10 +269,14 @@ body {
@media screen and (max-height: 560px) {
#d3dlogo {
- zoom: 0.8;
- -moz-transform: translate(-20px,-15px) scale(.8);
+ width: 399px;
+ height: 57px;
+ background-image: url('../img/logo_smaller_wide.png');
+ margin-top: 14px;
+ /*zoom: 0.8;*/
+ /*-moz-transform: translate(-20px,-15px) scale(.8);*/
/*-moz-transform: ;*/
- left: 34%;
+ /*left: 34%;*/
}
#btnsUpDown, #btnsTurnLeftRight {
diff --git a/img/thermometer_fg_overlay.png b/img/thermometer_fg_overlay.png
new file mode 100644
index 0000000..398b4fa
Binary files /dev/null and b/img/thermometer_fg_overlay.png differ
diff --git a/index.html b/index.html
index 8cf1756..9e234f4 100755
--- a/index.html
+++ b/index.html
@@ -10,8 +10,6 @@
-
-
@@ -30,9 +28,8 @@
-
+
+
+
+
@@ -83,7 +90,6 @@
-
@@ -92,7 +98,7 @@
-
+
diff --git a/js/Printer.js b/js/Printer.js
index 0d0467e..8a089d1 100644
--- a/js/Printer.js
+++ b/js/Printer.js
@@ -1,3 +1,4 @@
+/* not using this now
var $printProgressContainer = $("#printProgressContainer");
var $progressbar = $("#progressbar");
var $progressAmount = $(".progressAmount");
@@ -7,21 +8,7 @@ function setPrintprogress(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;
diff --git a/js/Thermometer.js b/js/Thermometer.js
new file mode 100644
index 0000000..0d0467e
--- /dev/null
+++ b/js/Thermometer.js
@@ -0,0 +1,270 @@
+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;
+ this.printing;
+
+ this.wifiboxURL;
+
+ this.maxTempLastMod = 5; // max time (seconds) since the last temp info modification before the printer connection is considered lost
+
+ this.checkTemperatureInterval = 3000;
+ this.checkTemperatureDelay;
+ this.checkProgressInterval = 3000;
+ this.checkProgressDelay;
+ this.timeoutTime = 3000;
+
+ this.gcode; // gcode to be printed
+ this.sendLength = 6000; // max amount of gcode lines per post (limited because WiFi box can't handle to much)
+
+ this.retryDelay = 2000; // retry setTimout delay
+ this.retrySendPrintPartDelay; // retry setTimout instance
+ this.retryCheckTemperatureDelay; // retry setTimout instance
+ this.retryCheckProgressDelay; // retry setTimout instance
+ this.retryStopDelay; // retry setTimout instance
+ this.retryPreheatDelay; // retry setTimout instance
+
+ this.maxGCodeSize = 10; // max size of gcode in MB's (estimation)
+
+ this.sendStopGCodeDelay = 1000;
+
+ // Events
+ Printer.UPDATE = "update";
+
+ this.init = function() {
+ console.log("Printer:init");
+ //this.wifiboxURL = "http://" + window.location.host + "/cgi-bin/d3dapi";
+ //this.wifiboxURL = "http://192.168.5.1/cgi-bin/d3dapi";
+ this.wifiboxURL = wifiboxURL;
+ //this.wifiboxURL = "proxy5.php";
+ console.log(" wifiboxURL: ",this.wifiboxURL);
+
+ if(autoUpdate) {
+ this.checkTemperature();
+ this.checkProgress();
+ }
+ }
+
+ this.preheat = function() {
+ console.log("Printer:preheat");
+ var postData = { id: 0 };
+ var self = this;
+ if (communicateWithWifibox) {
+ $.ajax({
+ url: this.wifiboxURL + "/printer/heatup",
+ type: "POST",
+ data: postData,
+ dataType: 'json',
+ timeout: this.timeoutTime,
+ success: function(data){
+ console.log("Printer:preheat response: ",data);
+ if(data.status == "error") {
+ clearTimeout(self.retryPreheatDelay);
+ self.retryPreheatDelay = setTimeout(function() { self.preheat() },self.retryDelay); // retry after delay
+ }
+ }
+ }).fail(function() {
+ console.log("Printer:preheat: failed");
+ clearTimeout(self.retryPreheatDelay);
+ self.retryPreheatDelay = setTimeout(function() { self.preheat() },self.retryDelay); // retry after delay
+ });
+ } else {
+ console.log ("Printer >> f:preheat() >> communicateWithWifibox is false, so not executing this function");
+ }
+ }
+
+ this.print = function(gcode) {
+ console.log("Printer:print");
+ console.log(" gcode total # of lines: " + gcode.length);
+
+ /*for (i = 0; i < gcode.length; i++) {
+ gcode[i] += " (" + i + ")";
+ }*/
+
+ this.sendIndex = 0;
+ this.gcode = gcode;
+
+ //console.log(" gcode[20]: ",gcode[20]);
+ var gcodeLineSize = this.byteSize(gcode[20]);
+ //console.log(" gcodeLineSize: ",gcodeLineSize);
+ var gcodeSize = gcodeLineSize*gcode.length/1024/1024; // estimate gcode size in MB's
+ console.log(" gcodeSize: ",gcodeSize);
+
+ if(gcodeSize > this.maxGCodeSize) {
+ console.log("Error: Printer:print: gcode file is probably to big ("+gcodeSize+"MB) (max: "+this.maxGCodeSize+"MB)");
+ return;
+ }
+
+ this.sendPrintPart(this.sendIndex, this.sendLength);
+ }
+ this.byteSize = function(s){
+ return~-encodeURI(s).split(/%..|./).length;
+ }
+ this.sendPrintPart = function(sendIndex,sendLength) {
+ console.log("Printer:sendPrintPart sendIndex: " + sendIndex + "/" + this.gcode.length + ", sendLength: " + sendLength);
+
+ var firstOne = (sendIndex == 0)? true : false;
+ var lastOne = false;
+ if (this.gcode.length < (sendIndex + sendLength)) {
+ console.log(" sending less than max sendLength (and last)");
+ sendLength = this.gcode.length - sendIndex;
+ lastOne = true;
+ }
+ var gcodePart = this.gcode.slice(sendIndex, sendIndex+sendLength);
+
+ var postData = { id: 0, gcode: gcodePart.join("\n"), first: firstOne, last: lastOne};
+ var self = this;
+ if (communicateWithWifibox) {
+ $.ajax({
+ url: this.wifiboxURL + "/printer/print",
+ type: "POST",
+ data: postData,
+ dataType: 'json',
+ timeout: this.timeoutTime,
+ success: function(data){
+ console.log("Printer:sendPrintPart response: ",data);
+
+ if(data.status == "success") {
+ if (lastOne) {
+ console.log("Printer:sendPrintPart:gcode sending completed");
+ this.gcode = [];
+ } else {
+ self.sendPrintPart(sendIndex + sendLength, sendLength);
+ }
+ }
+ }
+ }).fail(function() {
+ console.log("Printer:sendPrintPart: failed");
+ clearTimeout(self.retrySendPrintPartDelay);
+ self.retrySendPrintPartDelay = setTimeout(function() { self.sendPrintPart(sendIndex, sendLength) },self.retryDelay); // retry after delay
+ });
+ } else {
+ console.log ("Printer >> f:sendPrintPart() >> communicateWithWifibox is false, so not executing this function");
+ }
+ }
+
+
+ this.stop = function() {
+ console.log("Printer:stop");
+ var postData = { id: 0 };
+ var self = this;
+ if (communicateWithWifibox) {
+ $.ajax({
+ url: this.wifiboxURL + "/printer/stop",
+ type: "POST",
+ data: postData,
+ dataType: 'json',
+ timeout: this.timeoutTime,
+ success: function(data){
+ console.log("Printer:stop response: ", data);
+
+ setTimeout(function() { console.log("send: ",gcodeEnd); self.print(gcodeEnd) },self.sendStopGCodeDelay);
+ }
+ }).fail(function() {
+ console.log("Printer:stop: failed");
+ clearTimeout(self.retryStopDelay);
+ self.retryStopDelay = setTimeout(function() { self.stop() },self.retryDelay); // retry after delay
+ });
+ } else {
+ console.log ("Printer >> f:communicateWithWifibox() >> communicateWithWifibox is false, so not executing this function");
+ }
+ }
+
+ this.checkTemperature = function() {
+ //console.log("Printer:checkTemperature");
+ var getData = { id: 0 };
+ var self = this;
+ if (communicateWithWifibox) {
+ $.ajax({
+ url: this.wifiboxURL + "/printer/temperature",
+ data: getData,
+ dataType: 'json',
+ timeout: this.timeoutTime,
+ success: function(data){
+ //console.log("Printer:temperature response: ",data);
+ if(data.status == "success") {
+ //console.log("temp: ",response.data.hotend+"/"+response.data.hotend_target+" ("+response.data.last_mod+")");
+ self.temperature = data.data.hotend;
+ if(data.data.hotend_target != undefined) {
+ self.targetTemperature = data.data.hotend_target;
+ }
+ self.alive = (data.data.last_mod < self.maxTempLastMod);
+ } else {
+ self.alive = false;
+ }
+ //console.log(" this.alive: ",self.alive);
+ $(document).trigger(Printer.UPDATE);
+
+ self.checkTemperatureDelay = setTimeout(function() { self.checkTemperature() }, self.checkTemperatureInterval);
+ }
+ }).fail(function() {
+ console.log("Printer:checkTemperature: failed");
+ clearTimeout(self.retryCheckTemperatureDelay);
+ self.retryCheckTemperatureDelay = setTimeout(function() { self.checkTemperature() },self.retryDelay); // retry after delay
+ });
+ } else {
+ console.log ("Printer >> f:checkTemperature() >> communicateWithWifibox is false, so not executing this function");
+ }
+ }
+ this.checkProgress = function() {
+ //console.log("Printer:checkProgress");
+ var getData = { id: 0 };
+ var self = this;
+ if (communicateWithWifibox) {
+ $.ajax({
+ url: this.wifiboxURL + "/printer/progress",
+ data: getData,
+ dataType: 'json',
+ timeout: this.timeoutTime,
+ success: function(data){
+ if(data.status == "success") {
+
+ self.printing = data.data.printing;
+ self.currentLine = data.data.current_line;
+ self.num_lines = data.data.num_lines;
+
+ if(self.printing) {
+ console.log("progress: ",data.data.current_line+"/"+data.data.num_lines+" ("+data.data.last_mod+")");
+ }
+ } else {
+ self.printing = false;
+ }
+ //console.log(" this.alive: ",self.alive);
+ $(document).trigger(Printer.UPDATE);
+
+ self.checkProgressDelay = setTimeout(function() { self.checkProgress() },self.checkProgressInterval);
+ }
+ }).fail(function() {
+ console.log("Printer:checkProgress: failed");
+ clearTimeout(self.retryCheckProgressDelay);
+ self.retryCheckProgressDelay = setTimeout(function() { self.checkProgress() },self.retryDelay); // retry after delay
+ });
+ } else {
+ console.log ("Printer >> f:checkProgress() >> communicateWithWifibox is false, so not executing this function");
+ }
+ }
+}
\ No newline at end of file
diff --git a/js/buttonbehaviors.js b/js/buttonbehaviors.js
index 45fb102..b8a1ee9 100644
--- a/js/buttonbehaviors.js
+++ b/js/buttonbehaviors.js
@@ -253,11 +253,17 @@ function clearMainView() {
ctx.clearRect(0,0,canvas.width, canvas.height);
ctx.restore();
}
-function clearPreview() {
- // console.log("f:clearPreview()");
+function resetPreview() {
+ // console.log("f:resetPreview()");
+
+ // clear preview canvas
previewCtx.save();
previewCtx.clearRect(0,0,canvas.width, canvas.height);
previewCtx.restore();
+
+ // reset height and rotation to default values
+ numLayers = previewDefaults.numLayers; // current number of preview layers
+ rStep = previewDefaults.rotation; // Math.PI/180; //Math.PI/40; //
}
function oopsUndo() {
@@ -285,17 +291,13 @@ function previewDown(redrawLess) {
function previewTwistLeft(redrawLess) {
if (redrawLess == undefined) redrawLess = false;
// console.log("f:previewTwistLeft()");
- // if (rStep < Math.PI) {
- rStep -= twistIncrement;
- // }
+ if (rStep > -previewRotationLimit) rStep -= twistIncrement;
// redrawPreview(redrawLess);
redrawRenderedPreview(redrawLess);
}
function previewTwistRight(redrawLess) {
// console.log("f:previewTwistRight()");
- // if (rStep < Math.PI) {
- rStep += twistIncrement;
- // }
+ if (rStep < previewRotationLimit) rStep += twistIncrement;
// redrawPreview(redrawLess);
redrawRenderedPreview(redrawLess);
}
@@ -315,7 +317,7 @@ function update() {
if(displayTempEnabled) {
displayTemp.text(printer.temperature+"/"+printer.targetTemperature);
- updateThermometer(printer.temperature, printer.targetTemperature);
+ thermometer.update(printer.temperature, printer.targetTemperature);
}
setPrintprogress(printer.currentLine/printer.num_lines);
diff --git a/js/main.js b/js/main.js
index c49aa73..4d5ca0d 100644
--- a/js/main.js
+++ b/js/main.js
@@ -4,8 +4,10 @@ var communicateWithWifibox = true; // if Doodle3d should try interfacing with t
var wifiboxIsRemote = false; // when you want to run the client on a computer and have it remotely connect to the wifibox
var autoUpdate = true; // auto retrieve updates about temperature and progress from printer
-var printer = new Printer();
+var printer = new Printer();
+var thermometer = new Thermometer();
var settingsWindow = new SettingsWindow();
+
$(function() {
console.log("ready");
@@ -35,7 +37,9 @@ $(function() {
initPreviewRendering();
initButtonBehavior();
- printer.init();
+ thermometer.init($("#thermometerCanvas"));
+
+ printer.init();
$(document).on(Printer.UPDATE,update);
settingsWindow.init(wifiboxURL);