From b0f4764a82b6676e5194ac4625a83f794f48af3e Mon Sep 17 00:00:00 2001 From: Rick Companje Date: Tue, 15 Aug 2017 18:12:17 +0200 Subject: [PATCH] simplify Print page (#13) and add WiFi-Box banner --- js/BoxesPage.js | 5 ++++ js/PrintPage.js | 65 +++++++++++++++++++++++++++++++++++++++-------- js/api/InfoAPI.js | 2 +- js/main.js | 7 ++++- less/styles.less | 23 +++++++++++++++++ www/index.html | 45 ++++++++++++++++++++++---------- 6 files changed, 121 insertions(+), 26 deletions(-) diff --git a/js/BoxesPage.js b/js/BoxesPage.js index 9602816..122d243 100644 --- a/js/BoxesPage.js +++ b/js/BoxesPage.js @@ -41,6 +41,11 @@ //displayPace: 0, // do not obey the display pace //maxDisplayCount: 0 // do not obey the max display count }); + + if (localStorage.getItem("hideBanner")==="true") { + $("#getyours").hide(); + } + }); $.mobile.document.on( "pagebeforehide", PAGE_ID, function( event, data ) { //console.log("Boxes page pagehide"); diff --git a/js/PrintPage.js b/js/PrintPage.js index 9993eb6..462d4b6 100644 --- a/js/PrintPage.js +++ b/js/PrintPage.js @@ -14,11 +14,14 @@ var _networkAPI = new NetworkAPI(); var _printerAPI = new PrinterAPI(); var _configAPI = new ConfigAPI(); + var _updateAPI = new UpdateAPI(); var PAGE_ID = "#print"; var _pageData = {}; var _self = this; var _wifiboxSettings; var _slicerSettings; + var timerId; + $.mobile.document.on("pagebeforeshow", PAGE_ID, function( event, data ) { _pageData = d3d.util.getPageParams(PAGE_ID); @@ -40,6 +43,7 @@ //disabled by default $("#btnPrint").button().on("click", print); $("#btnPrint").button('disable'); + $("#pleaseUpgrade").hide(); loadGCodeInfoFromServer(d3d.pageParams.uuid); @@ -75,18 +79,53 @@ $("#lstBoxes").on("change", function(data) { var ip = $(this).val(); console.log("lstBoxes change",ip); - + $("#infoWiFiBox").text("..."); + $("#pleaseUpgrade").hide(); onSelectWiFiBox(ip); }); + timerId = setInterval(refreshWiFiBoxInfo,5000); + }); $.mobile.document.on( "pagebeforehide", PAGE_ID, function( event, data ) { _connectAPI.stop(); + clearInterval(timerId); }); + function retrieveUpdateStatus() { + + + _updateAPI.status(function(data) { // completed + var canUpdate = data.can_update; + + if (canUpdate) { + $("#pleaseUpgrade").show(); + $("#newest_version").text(" ("+data.newest_version+")"); + + console.log("_pageData",_pageData); + + var updateLink = $("#pleaseUpgrade a").attr("href"); + updateLink = d3d.util.replaceURLParameters(updateLink,_pageData); + $("#pleaseUpgrade a").attr("href",updateLink); + } + + }); + } + function onSelectWiFiBox(ip) { - $("#infoWiFiBox").text(""); + refreshWiFiBoxInfo(ip); + } + + function refreshWiFiBoxInfo(ip) { + if (!ip) { + ip = _pageData.localip; + if (!ip) { + return; + } + } + + $("#infoWiFiBox").show(); if (!ip) { $("#btnPrint").button('disable'); @@ -96,21 +135,27 @@ // redirect $.mobile.changePage("#boxes"); } else { + + // console.log("IP:",ip); + var boxURL = "http://"+ip; _infoAPI.init(boxURL); _networkAPI.init(boxURL); _printerAPI.init(boxURL); _configAPI.init(boxURL); + _updateAPI.init(boxURL); + + retrieveUpdateStatus(); var localip = localStorage.setItem("localip",ip); _networkAPI.status(function(successData) { - console.log("network status",successData); + // console.log("network status",successData); // $("#lstPrint li.boxItem p").text( var netInfo = successData.statusMessage + " (" + successData.ssid + " @ "+successData.localip+")"; _infoAPI.getStatus(function(successData) { - console.log(successData); + // console.log(successData); var state = successData.state; if (state==="idle") { state="ready"; @@ -123,7 +168,7 @@ info += ""+state+""; $("#infoWiFiBox").html(info); }, function(failData) { - console.log(failData); + console.log("_infoAPI.getStatus failData:",failData); $("#infoWiFiBox").html("failed to retrieve printer status from WiFi-Box"); }); @@ -235,7 +280,7 @@ $("#infoFile").text("..."); $("#infoPrinter").text("..."); $("#infoMaterial").html("..."); - $("#iconPrinter").attr('src','img/icons/blank.png'); + // $("#iconPrinter").attr('src','img/icons/blank.png'); } function loadGCodeInfoFromServer(uuid) { @@ -252,10 +297,10 @@ var printerId = header.printer.type; var printerTitle = header.printer.title; - $("#infoFile").text(header.name + " (" + filesize + ")"); - $("#infoPrinter").text(printerTitle); - $("#infoMaterial").html(header.filamentThickness + "mm @ " + header.temperature + "°C"); - $("#iconPrinter").attr('src','img/icons/printers/'+printerId+'.png'); + $("#infoFile").html("Filename: " + header.name + " (" + filesize + ")"); + $("#infoPrinter").html("Printer: " + printerTitle + ""); + $("#infoMaterial").html("Material: " + header.filamentThickness + "mm @ " + header.temperature + "°C"); + // $("#iconPrinter").attr('src','img/icons/printers/'+printerId+'.png'); }, function(failData) { console.log("_serverAPI.fetchHeader fail",failData); diff --git a/js/api/InfoAPI.js b/js/api/InfoAPI.js index fd299e2..8b17ce2 100644 --- a/js/api/InfoAPI.js +++ b/js/api/InfoAPI.js @@ -20,7 +20,7 @@ function InfoAPI() { var _self = this; this.init = function(wifiboxURL) { - console.log("InfoAPI:init"); + // console.log("InfoAPI:init"); _wifiboxURL = wifiboxURL+_apiPath; _wifiboxCGIBinURL = wifiboxURL+_apiCGIPath; diff --git a/js/main.js b/js/main.js index f5dd110..979044e 100644 --- a/js/main.js +++ b/js/main.js @@ -122,6 +122,11 @@ d3d.util = { }; +function hideBanner() { + $("#getyours").hide(); + localStorage.setItem("hideBanner",true); +} + (function (w) { // To get to url parameters we need the url // only pagecontainer events contain url's @@ -150,7 +155,7 @@ d3d.util = { if (localip) { url += "?localip=" + localip; } - location.href = url; + // location.href = url; } })(window); \ No newline at end of file diff --git a/less/styles.less b/less/styles.less index 81dbd6f..4389d9f 100644 --- a/less/styles.less +++ b/less/styles.less @@ -4,6 +4,29 @@ body.ui-mobile-viewport { /*font-family: 'Abel', sans-serif;*/ } +div.getyours { + color: black; + border: 1px solid black; + max-width: 300px; + float: right; + margin-top: 10px; + padding: 0px 10px 10px 10px; +} + +div.getyours span { + /*float: right;*/ + text-decoration: underline; + position: absolute; + left: 0px; +} + +div.getyours img { + /*text-align: right;*/ + max-width: 150px; + display: inline; + float: right; +} + #logo { text-align: center; display: block; diff --git a/www/index.html b/www/index.html index 1bc69e5..4923b5a 100644 --- a/www/index.html +++ b/www/index.html @@ -35,8 +35,11 @@
- +

No WiFi-Box yet?
Get your own here.

Close
+ + +

Let's connect to your Doodle3D WiFi-Box

This webpage helps you to find your Doodle3D WiFi-Box on your local network.

@@ -88,10 +91,30 @@

Let's 3D-print your model by sending it to your printer over WiFi. Please check the settings below and press Print.

- -
    - +
    + + +
    • + + +

      +

      New firmware for your Doodle3D WiFi-Box is available. Please update to the latest version .

      +
      • +
    + + + + +
      + +
    • +

      ...

      +

      ...

      +

      ...

      +
      • + +
    + + - Please select your Doodle3D WiFi-Box: -
      -
    • - - -

      -
      • -
    +
    -