diff --git a/src/octoprint/static/js/app/dataupdater.js b/src/octoprint/static/js/app/dataupdater.js index 061dbae5..ab9096af 100644 --- a/src/octoprint/static/js/app/dataupdater.js +++ b/src/octoprint/static/js/app/dataupdater.js @@ -140,9 +140,6 @@ function DataUpdater(allViewModels) { var data = e.data[prop]; - var gcodeUploadProgress = $("#gcode_upload_progress"); - var gcodeUploadProgressBar = $(".bar", gcodeUploadProgress); - var start = new Date().getTime(); switch (prop) { case "connected": { @@ -214,8 +211,6 @@ function DataUpdater(allViewModels) { break; } case "slicingProgress": { - gcodeUploadProgressBar.text(_.sprintf(gettext("Slicing ... (%(percentage)d%%)"), {percentage: Math.round(data["progress"])})); - _.each(self.allViewModels, function(viewModel) { if (viewModel.hasOwnProperty("onSlicingProgress")) { viewModel.onSlicingProgress(data["slicer"], data["model_path"], data["machinecode_path"], data["progress"]); @@ -226,48 +221,10 @@ function DataUpdater(allViewModels) { case "event": { var type = data["type"]; var payload = data["payload"]; - var html = ""; log.debug("Got event " + type + " with payload: " + JSON.stringify(payload)); - if (type == "SlicingStarted") { - gcodeUploadProgress.addClass("progress-striped").addClass("active"); - gcodeUploadProgressBar.css("width", "100%"); - if (payload.progressAvailable) { - gcodeUploadProgressBar.text(_.sprintf(gettext("Slicing ... (%(percentage)d%%)"), {percentage: 0})); - } else { - gcodeUploadProgressBar.text(gettext("Slicing ...")); - } - } else if (type == "SlicingDone") { - gcodeUploadProgress.removeClass("progress-striped").removeClass("active"); - gcodeUploadProgressBar.css("width", "0%"); - gcodeUploadProgressBar.text(""); - new PNotify({title: gettext("Slicing done"), text: _.sprintf(gettext("Sliced %(stl)s to %(gcode)s, took %(time).2f seconds"), payload), type: "success"}); - } else if (type == "SlicingCancelled") { - gcodeUploadProgress.removeClass("progress-striped").removeClass("active"); - gcodeUploadProgressBar.css("width", "0%"); - gcodeUploadProgressBar.text(""); - } else if (type == "SlicingFailed") { - gcodeUploadProgress.removeClass("progress-striped").removeClass("active"); - gcodeUploadProgressBar.css("width", "0%"); - gcodeUploadProgressBar.text(""); - - html = _.sprintf(gettext("Could not slice %(stl)s to %(gcode)s: %(reason)s"), payload); - new PNotify({title: gettext("Slicing failed"), text: html, type: "error", hide: false}); - } else if (type == "TransferStarted") { - gcodeUploadProgress.addClass("progress-striped").addClass("active"); - gcodeUploadProgressBar.css("width", "100%"); - gcodeUploadProgressBar.text(gettext("Streaming ...")); - } else if (type == "TransferDone") { - gcodeUploadProgress.removeClass("progress-striped").removeClass("active"); - gcodeUploadProgressBar.css("width", "0%"); - gcodeUploadProgressBar.text(""); - new PNotify({ - title: gettext("Streaming done"), - text: _.sprintf(gettext("Streamed %(local)s to %(remote)s on SD, took %(time).2f seconds"), payload), - type: "success" - }); - } else if (type == "PrintCancelled") { + if (type == "PrintCancelled") { if (payload.firmwareError) { new PNotify({ title: gettext("Unhandled communication error"), diff --git a/src/octoprint/static/js/app/viewmodels/files.js b/src/octoprint/static/js/app/viewmodels/files.js index 10107453..ef4ffe4b 100644 --- a/src/octoprint/static/js/app/viewmodels/files.js +++ b/src/octoprint/static/js/app/viewmodels/files.js @@ -58,6 +58,8 @@ $(function() { self.localTarget = undefined; self.sdTarget = undefined; + self.uploadProgressText = ko.observable(); + self._uploadInProgress = false; // initialize list helper @@ -449,10 +451,60 @@ $(function() { self.requestData(); }; + self.onEventSlicingStarted = function(payload) { + self.uploadProgress + .addClass("progress-striped") + .addClass("active"); + self.uploadProgressBar.css("width", "100%"); + if (payload.progressAvailable) { + self.uploadProgressText(_.sprintf(gettext("Slicing ... (%(percentage)d%%)"), {percentage: 0})); + } else { + self.uploadProgressText(gettext("Slicing ...")); + } + }; + + self.onSlicingProgress = function(slicer, modelPath, machinecodePath, progress) { + self.uploadProgressText(_.sprintf(gettext("Slicing ... (%(percentage)d%%)"), {percentage: Math.round(progress)})); + }; + + self.onEventSlicingCancelled = function(payload) { + self.uploadProgress + .removeClass("progress-striped") + .removeClass("active"); + self.uploadProgressBar + .css("width", "0%"); + self.uploadProgressText(""); + }; + self.onEventSlicingDone = function(payload) { + self.uploadProgress + .removeClass("progress-striped") + .removeClass("active"); + self.uploadProgressBar + .css("width", "0%"); + self.uploadProgressText(""); + + new PNotify({ + title: gettext("Slicing done"), + text: _.sprintf(gettext("Sliced %(stl)s to %(gcode)s, took %(time).2f seconds"), payload), + type: "success" + }); + self.requestData(); }; + self.onEventSlicingFailed = function(payload) { + self.uploadProgress + .removeClass("progress-striped") + .removeClass("active"); + self.uploadProgressBar + .css("width", "0%"); + self.uploadProgressText(""); + + var html = _.sprintf(gettext("Could not slice %(stl)s to %(gcode)s: %(reason)s"), payload); + new PNotify({title: gettext("Slicing failed"), text: html, type: "error", hide: false}); + }; + self.onEventMetadataAnalysisFinished = function(payload) { self.requestData(); }; @@ -461,7 +513,29 @@ $(function() { self.requestData(); }; + self.onEventTransferStarted = function(payload) { + self.uploadProgress + .addClass("progress-striped") + .addClass("active"); + self.uploadProgressBar + .css("width", "100%"); + self.uploadProgressText(gettext("Streaming ...")); + }; + self.onEventTransferDone = function(payload) { + self.uploadProgress + .removeClass("progress-striped") + .removeClass("active"); + self.uploadProgressBar + .css("width", "0"); + self.uploadProgressText(""); + + new PNotify({ + title: gettext("Streaming done"), + text: _.sprintf(gettext("Streamed %(local)s to %(remote)s on SD, took %(time).2f seconds"), payload), + type: "success" + }); + self.requestData(payload.remote, "sdcard"); }; @@ -531,8 +605,8 @@ $(function() { .done(function() { if (data.result.done) { self.uploadProgressBar - .css("width", "0%") - .text(""); + .css("width", "0%"); + self.uploadProgressText(""); self.uploadProgress .removeClass("progress-striped") .removeClass("active"); @@ -561,8 +635,8 @@ $(function() { hide: false }); self.uploadProgressBar - .css("width", "0%") - .text(""); + .css("width", "0%"); + self.uploadProgressText(""); self.uploadProgress .removeClass("progress-striped") .removeClass("active"); @@ -576,15 +650,14 @@ $(function() { var progress = parseInt(data.loaded / data.total * 100, 10); self.uploadProgressBar - .css("width", progress + "%") - .text(gettext("Uploading ...")); + .css("width", progress + "%"); + self.uploadProgressText(gettext("Uploading ...")); if (progress >= 100) { self.uploadProgress .addClass("progress-striped") .addClass("active"); - self.uploadProgressBar - .text(gettext("Saving ...")); + self.uploadProgressText(gettext("Saving ...")); } }; diff --git a/src/octoprint/static/js/app/viewmodels/printerstate.js b/src/octoprint/static/js/app/viewmodels/printerstate.js index ddbfc9ac..06d89b04 100644 --- a/src/octoprint/static/js/app/viewmodels/printerstate.js +++ b/src/octoprint/static/js/app/viewmodels/printerstate.js @@ -30,6 +30,7 @@ $(function() { self.filepos = ko.observable(undefined); self.printTime = ko.observable(undefined); self.printTimeLeft = ko.observable(undefined); + self.printTimeLeftOrigin = ko.observable(undefined); self.sd = ko.observable(undefined); self.timelapse = ko.observable(undefined); @@ -88,6 +89,12 @@ $(function() { return 0; return self.progress(); }); + self.progressBarString = ko.pureComputed(function() { + if (!self.progress()) { + return ""; + } + return _.sprintf("%d%%", self.progress()); + }); self.pauseString = ko.pureComputed(function() { if (self.isPaused()) return gettext("Continue"); @@ -191,6 +198,7 @@ $(function() { self.filepos(data.filepos); self.printTime(data.printTime); self.printTimeLeft(data.printTimeLeft); + self.printTimeLeftOrigin(data.printTimeLeftOrigin); }; self._processZData = function(data) { diff --git a/src/octoprint/templates/sidebar/files.jinja2 b/src/octoprint/templates/sidebar/files.jinja2 index e1441c76..772485a8 100644 --- a/src/octoprint/templates/sidebar/files.jinja2 +++ b/src/octoprint/templates/sidebar/files.jinja2 @@ -57,8 +57,11 @@ {% endif %} -
-
+
+ +
+ +
{{ _('Hint: You can also drag and drop files on this page to upload them.') }} diff --git a/src/octoprint/templates/sidebar/state.jinja2 b/src/octoprint/templates/sidebar/state.jinja2 index feff1535..f6168753 100644 --- a/src/octoprint/templates/sidebar/state.jinja2 +++ b/src/octoprint/templates/sidebar/state.jinja2 @@ -9,8 +9,11 @@ {{ _('Print Time Left') }}:
{{ _('Printed') }}:
-
-
+
+ +
+ +
-
-
+
+ +
+ +