From cbbe820d7748ab8cfe6be698eafd01060c3dee0e Mon Sep 17 00:00:00 2001 From: Adriaan Wormgoor Date: Sun, 28 Jul 2013 02:47:42 +0200 Subject: [PATCH] added a settings popup -> the gearbox icon botomright is now clickable -> a settings popup will appear, showing various 3d printer settings. These settings are partially loaded from and saved back to the wifibox --- css/settings.css | 60 ++++++++++ css/settingsPopup.css | 73 ++++++++++++ img/settings_lable.png | Bin 0 -> 6838 bytes js/settings.js | 136 +++++++++++++++++++++++ settings.html | 247 +++++++++++++++++++++++++++++++++++++++++ 5 files changed, 516 insertions(+) create mode 100644 css/settings.css create mode 100644 css/settingsPopup.css create mode 100644 img/settings_lable.png create mode 100755 settings.html diff --git a/css/settings.css b/css/settings.css new file mode 100644 index 0000000..135d31e --- /dev/null +++ b/css/settings.css @@ -0,0 +1,60 @@ +form { + margin: 10px; +} +input { + margin: 1px; +} + +body,th,td { + font-family: Arial; + font-size: 13px; +} +#advancedSettings { + width: 96.3%; + height: 300px; + padding: 10px; +} +fieldset { + width: 600px; + border: 1px solid black; + border-radius: 10px; + margin-bottom: 20px; + /*padding-left: 20px;*/ +} +fieldset legend { + margin-left: 10px; +} +label { + min-width: 150px; + display: inline-block; +} +textarea { + border-radius: 10px; +} +input[type="text"] { + border: 1px solid black; + margin-right: 5px; +} +input[type="text"].small { + width: 50px; +} +input[type="text"].large { + width: 250px; +} +legend { + font-weight: bold; + font-family: Arial; +} +select { + margin-left: -4px; +} +textarea.gcode { + width: 270px; + height: 150px; + margin-right: 20px; +} + +.retractionSettings { + display: none; + margin-top: 5px; +} diff --git a/css/settingsPopup.css b/css/settingsPopup.css new file mode 100644 index 0000000..898a4d6 --- /dev/null +++ b/css/settingsPopup.css @@ -0,0 +1,73 @@ +#contentOverlay { + background-color: rgba(255, 255, 255, 0.65); + top: 0px; + left: 0px; + width: 1024px; + height: 100%; + z-index: 10; + position: absolute; + display:table; +} +.contentOverlayHidden { + display:none; +} +#settingsContainer { + display: table-cell; + /*text-align: center;*/ + vertical-align: middle; +} +#settings { + position: relative; + background-color: #fff; + border: 2px solid #222; + border-radius: 15px; + -moz-border-radius: 15px; + -webkit-border-radius: 15px; + z-index: 15; + margin: 0 auto; + padding: 25px; + width: 850px; + height: 450px; + /*overflow: scroll;*/ + /*overflow-y: hidden;*/ + -moz-box-shadow: 0px 2px 6px 0px rgba(16, 16, 16, 0.65); + -webkit-box-shadow: 0px 2px 6px 0px rgba(16, 16, 16, 0.65); + box-shadow: 0px 2px 6px 0px rgba(16, 16, 16, 0.65); + overflow: hidden; +} + + +#settings header { + height: 44px; +} + +div.content { + margin: 15px 0px; + height: 388px; + display: table; +} + +div.content > div { + height: 100%; +} + +div.content > div.settings { + border: 1px solid #333; + width: 725px; + overflow: scroll; + max-height: 368px; + overflow-x: hidden; + padding: 10px 10px 10px 10px; +} +div.content > div.buttons { + display: table-cell; + vertical-align: bottom; + width: 125px; +} + +div.content .btnOK { + width: 85px; + height: 86px; + background: url('../img/buttons/btnOk_settings.png') no-repeat; + margin: 10px auto; +} diff --git a/img/settings_lable.png b/img/settings_lable.png new file mode 100644 index 0000000000000000000000000000000000000000..a8efabada30a7a91f138c0a34ba562424500e18c GIT binary patch literal 6838 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 literal 0 HcmV?d00001 diff --git a/js/settings.js b/js/settings.js index f230fbd..eae1a8d 100644 --- a/js/settings.js +++ b/js/settings.js @@ -1,3 +1,139 @@ +var wifiboxURL = "http://192.168.5.1/cgi-bin/d3dapi"; + +var settings = { + layerHeight: 0.2, + wallThickness: 0.6, + filamentThickness: 2.89, + speed: 50, + travelSpeed: 200, + autoWarmup: true, + firstLayerSlow: true, + useSubLayers: true, + useRetraction: true, + retractionAmount: 2, + retractionMinDistance: 1, + retractionSpeed: 250, + networkIP: "192.168.10.1", + networkNetmask: "255.255.255.0", + networkSsid: "d3d-ap-%%MAC_ADDR_TAIL%%" +} + +var settingsForm = $("#settingsForm"); +settingsForm.submit(function(e) { + e.preventDefault(); + saveSettings(); + return false; +}) + +function initSettingsPopup() { + console.log("f:initSettingsPopup()"); + + $("#contentOverlay").hide(); + + $("div.content .btnOK").click(function(e) { + e.preventDefault(); + e.stopPropagation(); + // TODO something like a callback or feedback that saving went well / or failed + saveSettings(); + + $("#contentOverlay").fadeOut(375, function() { + document.body.addEventListener('touchmove',prevent,false); + }); + + console.log("button OK in settings popup pressed"); + }); +} + +function showSettings() { + console.log("f:showSettings()"); + $("#contentOverlay").fadeIn(375, function() { + console.log("#contentOverlay faded in..."); + loadSettings(); + document.body.removeEventListener('touchmove',prevent,false); + }); +} + +function loadSettings() { + console.log("f:loadSettings() >> getting new data..."); + $.get(wifiboxURL + "/config/all", {}, function(data) { +// console.log("f:loadSettings()"); + var settings = JSON.parse(data).data; + // var printer_layerHeight = settings["printer.layerHeight"]; + // var printer_autoWarmup = settings["printer.autoWarmUp"]; + console.log("print_layerHeight = " + settings["printer.layerHeight"]); + console.log("printer_autoWarmup = " + settings["printer.autoWarmUp"] + ", type: " + (typeof settings["printer.autoWarmUp"])); + console.log("printer_useSubLayers = " + settings["printer.useSubLayers"] + " type: " + (typeof settings["printer.useSubLayers"])); + $("#formpje input[name='printer.layerHeight']").attr('value', settings["printer.layerHeight"]); + + // printer settings + $('#autoWarmUp').prop('checked', settings["printer.autoWarmUp"]); + $('#firstLayerSlow').prop('checked', settings["printer.firstLayerSlow"]); + $('#useSubLayers').prop('checked', settings["printer.useSubLayers"]); + $("#layerHeight").attr('value', settings["printer.layerHeight"]); + $("#wallThickness").attr('value', settings["printer.wallThickness"]); + $("#filamentThickness").attr('value', settings["printer.filamentThickness"]); + $("#speed").attr('value', settings["printer.speed"]); + $("#travelSpeed").attr('value', settings["printer.travelSpeed"]); + $("#retractionAmount").attr('value', settings["printer.retraction.amount"]); + $("#retractionMinDistance").attr('value', settings["printer.retraction.minDistance"]); + $("#retractionSpeed").attr('value', settings["printer.retraction.speed"]); + + // wifi settings + $("#ipaddress").attr('value', settings["network.ap.address"]); + $("#netmask").attr('value', settings["network.ap.netmask"]); + $("#ssid").attr('value', settings["network.ap.ssid"]); + // network.ap.address: "192.168.10.1" + // network.ap.netmask: "255.255.255.0" + // network.ap.ssid: "d3d-ap-%%MAC_ADDR_TAIL%%" + + }); +} + +function saveSettings(callback) { + console.log("settings form submitted"); + console.log(" printer.layerHeight:" + $("#formpje input[name='printer.layerHeight']").attr('value')); + console.log(" first layer slow (checkbox):" + $('#firstLayerSlow').prop('checked')); + console.log(" use sublayers (checkbox):" + $('#useSubLayers').prop('checked')); + $.post( + wifiboxURL + "/config", + { + "printer.autoWarmUp" : ($('#autoWarmUp').prop('checked') == true) ? 1 : 0, + "printer.firstLayerSlow": ($('#firstLayerSlow').prop('checked') == true) ? 1 : 0, + "printer.useSubLayers": ($('#useSubLayers').prop('checked') == true) ? true : false, + // "printer.useSubLayers": $('#useSubLayers').prop('checked'), + "printer.layerHeight": $("#layerHeight").attr('value'), + "printer.wallThickness": $("#wallThickness").attr('value'), + "printer.filamentThickness": $("#filamentThickness").attr('value'), + "printer.speed": $("#speed").attr('value'), + "printer.travelSpeed": $("#travelSpeed").attr('value'), + "printer.retraction.amount": $("#retractionAmount").attr('value'), + "printer.retraction.minDistance": $("#retractionMinDistance").attr('value'), + "printer.retraction.speed": $("#retractionSpeed").attr('value') + }, + function(data) { + var res = JSON.parse(data).data; + $.each(res, function(index, val) { + if (val != "ok") { + console.log("ERROR: value '" + index + "' not successfully set. Message: " + val); + } + }); + if (callback != undefined) { + callback(); + } + // console.log(JSON.stringify(data)); + // console.log(JSON.parse(data).data); + } + ); +} + + + +/************************* + * + * + * FROM DOODLE3D.INI + * + */ var objectHeight = 20; var layerHeight = .2; var wallThickness = .5; diff --git a/settings.html b/settings.html new file mode 100755 index 0000000..a7db2f9 --- /dev/null +++ b/settings.html @@ -0,0 +1,247 @@ + + + + settings + + + + + + + + + + + + + + + + +
+

+ Not all fields are saveable at the moment +

+ +
+
+ 3D printer + + +
+ + +
+ + + +
+ +
+ Print settings + mm
+ mm
+ mm
+
+ mm/s
+ mm/s
+
+
+
+
+
+
+ mm
+ mm
+ mm/s
+
+ +
+ Access point settings +
+
+
+
+ * The macro %%MAC_ADDR_TAIL%% will be replaced by the last 6 digits of your Doodle3D Wi-Fi box's MAC address.
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ GCODE settings
+ + + + + + +
+
+ + + 		+
+ +
+
+
+ +
+ Advanced settings + +
+ + +
+
+ + + + + + + +