Merge pull request #8 from Doodle3D/feature/printersettings
Feature/printersettings
This commit is contained in:
Rick Companje
GitHub
commit
025798dbde
|
|
@ -99,6 +99,7 @@ module.exports = function(grunt) {
|
|||
NetworkAPI: true,
|
||||
InfoAPI: true,
|
||||
ConfigAPI: true,
|
||||
PrinterAPI: true,
|
||||
UpdateAPI:true,
|
||||
addToHomescreen: true
|
||||
},
|
||||
|
|
|
|||
|
|
@ -13,6 +13,7 @@
|
|||
var _intro;
|
||||
var _drawItem;
|
||||
var _updateItem;
|
||||
var _settingsItem;
|
||||
var _joinNetworkItem;
|
||||
var _defaultItems;
|
||||
|
||||
|
|
@ -36,6 +37,7 @@
|
|||
_defaultItems = _list.children();
|
||||
_drawItem = _list.find("#drawItem");
|
||||
_updateItem = _list.find("#updateItem");
|
||||
_settingsItem = _list.find("#settingsItem");
|
||||
_joinNetworkItem = _list.find("#joinNetworkItem");
|
||||
|
||||
// make sure draw link is opened in same WebApp (added to homescreen)
|
||||
|
|
@ -82,7 +84,7 @@
|
|||
var introText = "";
|
||||
if(status === NetworkAPI.STATUS.CONNECTED) { // online
|
||||
//console.log("online");
|
||||
_drawItem.find("a").text("Draw");
|
||||
_drawItem.find("a").text("Draw / Sketch");
|
||||
|
||||
// display the right buttons
|
||||
_defaultItems.toggleClass("ui-screen-hidden",false);
|
||||
|
|
@ -92,13 +94,18 @@
|
|||
updateLink = d3d.util.replaceURLParameters(updateLink,_boxData);
|
||||
_updateItem.find("a").attr("href",updateLink);
|
||||
|
||||
//settingsLink
|
||||
var settingsLink = _settingsItem.find("a").attr("href");
|
||||
settingsLink = d3d.util.replaceURLParameters(settingsLink,_boxData);
|
||||
_settingsItem.find("a").attr("href",settingsLink);
|
||||
|
||||
retrieveUpdateStatus();
|
||||
|
||||
} else { // offline
|
||||
//console.log("offline");
|
||||
introText = "Please connect your WiFi-Box to the internet. You can also use it offline, but then you won't be able to update.";
|
||||
|
||||
_drawItem.find("a").text("Draw (offline)");
|
||||
_drawItem.find("a").text("Draw / Sketch (offline)");
|
||||
|
||||
// display the right buttons
|
||||
_defaultItems.toggleClass("ui-screen-hidden",true);
|
||||
|
|
|
|||
|
|
@ -0,0 +1,182 @@
|
|||
/*
|
||||
* This file is part of the Doodle3D project (http://doodle3d.com).
|
||||
*
|
||||
* Copyright (c) 2013-2017, Doodle3D
|
||||
* This software is licensed under the terms of the GNU GPL v2 or later.
|
||||
* See file LICENSE.txt or visit http://www.gnu.org/licenses/gpl.html for full license details.
|
||||
*/
|
||||
|
||||
(function (w) {
|
||||
var _page;
|
||||
var _form;
|
||||
var _statusField;
|
||||
var _infoField;
|
||||
var _noRetainCheckbox;
|
||||
var _includeBetasCheckbox;
|
||||
var _submitButton;
|
||||
|
||||
var _updateAPI = new UpdateAPI();
|
||||
var _configAPI = new ConfigAPI();
|
||||
var _printerAPI = new PrinterAPI();
|
||||
var _pageData = {};
|
||||
var _updateStatus = {};
|
||||
var _title;
|
||||
|
||||
var PAGE_ID = "#settings";
|
||||
|
||||
var _self = this;
|
||||
|
||||
function showOrHideFields() {
|
||||
if ($("#chkBed").prop("checked")) {
|
||||
$("#grpBedTemp").show();
|
||||
} else {
|
||||
$("#grpBedTemp").hide();
|
||||
}
|
||||
}
|
||||
|
||||
$.mobile.document.on( "pageinit", PAGE_ID, function( event, data ) {
|
||||
console.log(PAGE_ID+":pageinit");
|
||||
|
||||
_page = $(this);
|
||||
_title = _page.find(".ui-title");
|
||||
|
||||
$("#divSettings").hide();
|
||||
d3d.util.showLoader();
|
||||
|
||||
$("#lstPrinters").on("change", function(data) {
|
||||
var printerType = $(this).val();
|
||||
|
||||
d3d.util.showLoader();
|
||||
|
||||
_configAPI.savePrinterType(printerType,function(successData) {
|
||||
refreshSettings();
|
||||
},function(failData) {
|
||||
console.log("savePrinterType fail",failData);
|
||||
});
|
||||
});
|
||||
|
||||
$("#nozzleTemperature").on('slidestop', function( event ) {
|
||||
_configAPI.save({"printer.temperature":$(this).val()});
|
||||
});
|
||||
|
||||
$("#nozzleTemperature").on('focusout', function( event ) {
|
||||
_configAPI.save({"printer.temperature":$(this).val()});
|
||||
});
|
||||
|
||||
$("#bedTemperature").on('slidestop', function( event ) {
|
||||
_configAPI.save({"printer.bed.temperature":$(this).val()});
|
||||
});
|
||||
|
||||
$("#bedTemperature").on('focusout', function( event ) {
|
||||
_configAPI.save({"printer.bed.temperature":$(this).val()});
|
||||
});
|
||||
|
||||
$("#filamentThickness").on("change", function(data) {
|
||||
_configAPI.save({"printer.filamentThickness":$(this).val()});
|
||||
});
|
||||
|
||||
$("#dimensionsX").on("change", function(data) {
|
||||
_configAPI.save({"printer.dimensions.x":$(this).val()});
|
||||
});
|
||||
|
||||
$("#dimensionsY").on("change", function(data) {
|
||||
_configAPI.save({"printer.dimensions.y":$(this).val()});
|
||||
});
|
||||
|
||||
$("#dimensionsZ").on("change", function(data) {
|
||||
_configAPI.save({"printer.dimensions.z":$(this).val()});
|
||||
});
|
||||
|
||||
$('#startgcode').on("change", function(data) {
|
||||
_configAPI.save({"printer.startcode":$(this).val()});
|
||||
});
|
||||
|
||||
$('#endgcode').on("change", function(data) {
|
||||
_configAPI.save({"printer.end":$(this).val()});
|
||||
});
|
||||
|
||||
$("#chkBed").on("change", function(data) {
|
||||
showOrHideFields();
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
$.mobile.document.on( "pagebeforeshow", PAGE_ID, function( event, data ) {
|
||||
_pageData = d3d.util.getPageParams(PAGE_ID);
|
||||
|
||||
if(_pageData === undefined) {
|
||||
console.log("ERROR",PAGE_ID,"_pageData undefined");
|
||||
$.mobile.changePage("#boxes");
|
||||
return;
|
||||
}
|
||||
var boxURL = "http://"+_pageData.localip;
|
||||
|
||||
_title.text("Settings for " + _pageData.wifiboxid);
|
||||
|
||||
_configAPI.init(boxURL);
|
||||
_printerAPI.init(boxURL);
|
||||
|
||||
refreshSettings();
|
||||
});
|
||||
|
||||
$.mobile.document.on( "pagebeforehide", PAGE_ID, function( event, data ) {
|
||||
|
||||
});
|
||||
|
||||
function refreshSettings() {
|
||||
_configAPI.loadAll(function(successData) {
|
||||
var printerType = successData["printer.type"];
|
||||
var printerStartGCode = successData["printer.startcode"];
|
||||
var printerEndGCode = successData["printer.endcode"];
|
||||
var heatedBedEnabled = successData["printer.heatedbed"];
|
||||
var bedTemperature = successData["printer.bed.temperature"];
|
||||
var dimensionsX = successData["printer.dimensions.x"];
|
||||
var dimensionsY = successData["printer.dimensions.y"];
|
||||
var dimensionsZ = successData["printer.dimensions.z"];
|
||||
var filamentThickness = successData["printer.filamentThickness"];
|
||||
var nozzleTemperature = successData["printer.temperature"];
|
||||
|
||||
$('#chkBed').prop('checked', heatedBedEnabled);
|
||||
$('#chkBed').val('on').flipswitch('refresh');
|
||||
$('#bedTemperature').val(bedTemperature);
|
||||
$('#dimensionsX').val(dimensionsX);
|
||||
$('#dimensionsY').val(dimensionsY);
|
||||
$('#dimensionsZ').val(dimensionsZ);
|
||||
$('#filamentThickness').val(filamentThickness);
|
||||
$('#startgcode').val(printerStartGCode);
|
||||
$('#endgcode').val(printerEndGCode);
|
||||
$('#nozzleTemperature').val(nozzleTemperature);
|
||||
|
||||
_printerAPI.listAll(function(printers) {
|
||||
|
||||
$("#lstPrinters").empty();
|
||||
|
||||
for (var id in printers) {
|
||||
var selected = (id===printerType) ? "selected " : "";
|
||||
$("#lstPrinters").append("<option "+selected+" value='"+id+"'>"+printers[id]+"</option>");
|
||||
}
|
||||
|
||||
$("#lstPrinters").selectmenu("refresh", true);
|
||||
|
||||
$("#divSettings").show();
|
||||
d3d.util.hideLoader();
|
||||
showOrHideFields();
|
||||
|
||||
$("#bedTemperature").slider("refresh");
|
||||
$("#nozzleTemperature").slider("refresh");
|
||||
|
||||
},function(failData) {
|
||||
console.log(PAGE_ID,'FAIL _printerAPI.listAll');
|
||||
$.mobile.changePage("#boxes");
|
||||
return;
|
||||
});
|
||||
|
||||
},function(failData) {
|
||||
console.log("FAIL loadPrinterType",failData);
|
||||
$.mobile.changePage("#boxes");
|
||||
return;
|
||||
});
|
||||
}
|
||||
|
||||
})(window);
|
||||
|
||||
|
|
@ -61,6 +61,17 @@ function ConfigAPI() {
|
|||
if(failedHandler) failedHandler();
|
||||
});
|
||||
};
|
||||
|
||||
this.loadSetting = function(settingName,completeHandler,failedHandler) {
|
||||
this.load(settingName+"=",function(successData) {
|
||||
completeHandler(successData[settingName]);
|
||||
},failedHandler);
|
||||
}
|
||||
|
||||
this.loadPrinterType = function(completeHandler,failedHandler) {
|
||||
this.loadSetting("printer.type",completeHandler,failedHandler);
|
||||
}
|
||||
|
||||
this.save = function(newSettings,completeHandler,failedHandler) {
|
||||
//console.log("ConfigAPI:save");
|
||||
$.ajax({
|
||||
|
|
@ -72,15 +83,22 @@ function ConfigAPI() {
|
|||
success: function(response){
|
||||
//console.log("ConfigAPI:save response: ",response);
|
||||
if(response.status == "error" || response.status == "fail") {
|
||||
if(failedHandler) failedHandler(response);
|
||||
if (failedHandler) failedHandler(response);
|
||||
} else {
|
||||
completeHandler(response.data);
|
||||
console.log("ConfigAPI.save",newSettings,response.data);
|
||||
if (completeHandler) completeHandler(response.data);
|
||||
}
|
||||
}
|
||||
}).fail(function() {
|
||||
if(failedHandler) failedHandler();
|
||||
});
|
||||
};
|
||||
|
||||
this.savePrinterType = function(printerType,completeHandler,failedHandler) {
|
||||
var settings = {"printer.type": printerType};
|
||||
this.save(settings,completeHandler,failedHandler);
|
||||
};
|
||||
|
||||
this.resetAll = function(completeHandler,failedHandler) {
|
||||
//console.log("ConfigAPI:resetAll");
|
||||
$.ajax({
|
||||
|
|
|
|||
|
|
@ -0,0 +1,49 @@
|
|||
/*
|
||||
* This file is part of the Doodle3D project (http://doodle3d.com).
|
||||
*
|
||||
* Copyright (c) 2013, Doodle3D
|
||||
* This software is licensed under the terms of the GNU GPL v2 or later.
|
||||
* See file LICENSE.txt or visit http://www.gnu.org/licenses/gpl.html for full license details.
|
||||
*/
|
||||
|
||||
function PrinterAPI() {
|
||||
|
||||
var _apiPath = "/d3dapi";
|
||||
var _apiCGIPath = "/cgi-bin"+_apiPath;
|
||||
var _wifiboxURL;
|
||||
var _wifiboxCGIBinURL;
|
||||
|
||||
var _timeoutTime = 3000;
|
||||
|
||||
var _configAPI = new ConfigAPI(); // needed for wifiboxid workaround
|
||||
|
||||
var _self = this;
|
||||
|
||||
this.init = function(wifiboxURL) {
|
||||
console.log("InfoAPI:init");
|
||||
|
||||
_wifiboxURL = wifiboxURL+_apiPath;
|
||||
_wifiboxCGIBinURL = wifiboxURL+_apiCGIPath;
|
||||
_configAPI.init(wifiboxURL);
|
||||
}
|
||||
|
||||
this.listAll = function(completeHandler,failedHandler) {
|
||||
console.log("listAll",_wifiboxURL);
|
||||
|
||||
$.ajax({
|
||||
url: _wifiboxURL + "/printer/listall",
|
||||
type: "GET",
|
||||
dataType: 'json',
|
||||
timeout: _timeoutTime,
|
||||
success: function(response){
|
||||
if(response.status == "error" || response.status == "fail") {
|
||||
if(failedHandler) failedHandler(response);
|
||||
} else {
|
||||
completeHandler(response.data.printers);
|
||||
}
|
||||
}
|
||||
}).fail(function() {
|
||||
if(failedHandler) failedHandler();
|
||||
});
|
||||
};
|
||||
}
|
||||
102
www/index.html
102
www/index.html
|
|
@ -15,6 +15,10 @@
|
|||
<link rel="icon" type="image/ico" href="./img/favicon.ico">
|
||||
|
||||
<!-- scripts -->
|
||||
<!-- <meta name="viewport" content="width=device-width, initial-scale=1"> -->
|
||||
<!-- <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script> -->
|
||||
<!-- <script src="http://code.jquery.com/mobile/1.1.2/jquery.mobile-1.1.2.min.js"></script> -->
|
||||
|
||||
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
|
||||
<script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
|
||||
<script src="js/doodle3d-server.min.js" type="text/javascript"></script>
|
||||
|
|
@ -22,6 +26,7 @@
|
|||
<!-- stylesheets -->
|
||||
<!-- <link href="https://fonts.googleapis.com/css?family=Abel" rel="stylesheet"> -->
|
||||
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css" />
|
||||
<!-- <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.2/jquery.mobile-1.1.2.min.css" /> -->
|
||||
<link rel="stylesheet" href="css/doodle3d-server.min.css"/>
|
||||
|
||||
</head>
|
||||
|
|
@ -61,9 +66,11 @@
|
|||
<p class="intro"></p>
|
||||
<ul data-role="listview">
|
||||
<li id="drawItem"><a href="#draw">Draw</a></li>
|
||||
<li id="updateItem"><a href="#update">Update<span class="ui-li-count"></span></a></li>
|
||||
<!-- <li id="transformItem"><a href="http://transform.doodle3d.com">Doodle3D Transform</a></li> -->
|
||||
<li id="settingsItem" data-icon="gear"><a href="#settings">Settings</a></li>
|
||||
<li id="updateItem"><a href="#update">Firmware Update<span class="ui-li-count"></span></a></li>
|
||||
<li id="joinNetworkItem"><a href="#join_network">Join network </a></li>
|
||||
<li><a href="#yourapp">Your app here?</a></li>
|
||||
<!-- <li><a href="#yourapp">Your app here?</a></li> -->
|
||||
</ul>
|
||||
</div><!-- /content -->
|
||||
</div><!-- /page -->
|
||||
|
|
@ -263,6 +270,97 @@
|
|||
</div><!-- /content -->
|
||||
</div><!-- /page -->
|
||||
|
||||
<div data-role="page" id="settings">
|
||||
<a href="#boxes" id="logo"><img src="img/logo_full.png"></a>
|
||||
<div data-role="header">
|
||||
<a href="../toolbar/" data-rel="back"
|
||||
class="ui-btn ui-btn-left ui-nodisc-icon ui-corner-all ui-btn-icon-notext ui-icon-carat-l">Back</a>
|
||||
<h1>Settings</h1>
|
||||
|
||||
</div><!-- /header -->
|
||||
<div id="divSettings" role="main" class="ui-content">
|
||||
<p class="intro">Use this page to select which 3D-printer is connected to your Doodle3D WiFi-Box. You can change settings per printer. Your settings are saved automatically.</p>
|
||||
|
||||
<label for="name">Please select your 3D-printer model:</label>
|
||||
<select id="lstPrinters"></select>
|
||||
|
||||
<div data-role="collapsible">
|
||||
|
||||
<h3>Printer settings</h3>
|
||||
|
||||
<div data-role="fieldcontain">
|
||||
<!-- <label for="name"></label>
|
||||
<label>
|
||||
<input type="checkbox" name="checkbox-0 ">Enable heated bed
|
||||
</label> -->
|
||||
<label for="chkBed">Heated bed:</label>
|
||||
<input type="checkbox" data-role="flipswitch" name="chkBed" id="chkBed">
|
||||
</div>
|
||||
|
||||
<div id="grpBedTemp" data-role="fieldcontain">
|
||||
<label for="bedTemperature">Bed temperature (°C):</label>
|
||||
<input type="range" name="bedTemperature" id="bedTemperature" value="70" min="20" max="120" data-highlight="true" />
|
||||
</div>
|
||||
|
||||
<div id="grpDimensions" data-role="fieldcontain">
|
||||
<label for="name">Dimensions XYZ (mm):</label>
|
||||
<div class="ui-grid-b">
|
||||
<div class="ui-block-a"><input placeholder="x" name="dimensionsX" id="dimensionsX" type="number" data-mini="true"/></div>
|
||||
<div class="ui-block-b"><input placeholder="y" name="dimensionsY" id="dimensionsY" type="number" data-mini="true"/></div>
|
||||
<div class="ui-block-c"><input placeholder="z" name="dimensionsZ" id="dimensionsZ" type="number" data-mini="true"/></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-role="collapsible">
|
||||
<h3>GCODE settings</h3>
|
||||
<div data-role="fieldcontain">
|
||||
<label for="startgcode">Start gcode:</label>
|
||||
<textarea name="startgcode" id="startgcode"></textarea>
|
||||
</div>
|
||||
|
||||
<div data-role="fieldcontain">
|
||||
<label for="endgcode">End gcode:</label>
|
||||
<textarea name="endgcode" id="endgcode"></textarea>
|
||||
</div>
|
||||
|
||||
<div data-role="collapsible" data-mini="true">
|
||||
<h3>Help</h3>
|
||||
<small>
|
||||
The following texts are replaced:
|
||||
<dl>
|
||||
<dt>{printingTemp}</dt><dd>Printing temperature</dd>
|
||||
<dt>{printingBedTemp}</dt><dd>Printing bed temperature</dd>
|
||||
<dt>{preheatTemp}</dt><dd>Preheat temperature</dd>
|
||||
<dt>{preheatBedTemp}</dt><dd>Preheat bed temperature</dd>
|
||||
<dt>{printerType}</dt><dd>Printer type</dd>
|
||||
<dt>{if heatedBed}</dt><dd>Enable line if printer has heated bed</dd>
|
||||
</dl>
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div data-role="collapsible">
|
||||
<h3>Material settings</h3>
|
||||
|
||||
<div data-role="fieldcontain">
|
||||
<label for="name">Filament thickness (mm):</label>
|
||||
<input type="number" id="filamentThickness" name="filamentThickness" data-mini="true" step=".01" min="1.75" max="3.3"/>
|
||||
</div>
|
||||
|
||||
<div data-role="fieldcontain">
|
||||
<label for="nozzleTemperature">Nozzle temperature (°C):</label>
|
||||
<input type="range" name="nozzleTemperature" id="nozzleTemperature" value="200" min="20" max="260" data-highlight="true" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
$( "[data-role='header'], [data-role='footer']" ).toolbar();
|
||||
|
|
|
|||
Loading…
Reference in New Issue