added visual flashing bar.

This commit is contained in:
Teja 2015-09-02 12:04:21 +02:00
parent 28bf9364f6
commit 1c018ec277
3 changed files with 29 additions and 128 deletions

View file

@ -1806,6 +1806,10 @@ input.search-query,
display: inline-block;
}
.progress {
border-radius: 0;
}
.progress .bar {
color: #999;
text-align: left;
@ -1817,14 +1821,18 @@ input.search-query,
}
.progress-striped .bar {
background-color: #DD0000;
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
-webkit-background-size: 40px 40px;
-moz-background-size: 40px 40px;
-o-background-size: 40px 40px;
background-size: 40px 40px;
}
background-color: #DD0000;
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.25)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.25)), color-stop(0.75, rgba(255, 255, 255, 0.25)), color-stop(0.75, transparent), to(transparent));
background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.25) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.25) 50%, rgba(255, 255, 255, 0.25) 75%, transparent 75%, transparent);
background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.25) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.25) 50%, rgba(255, 255, 255, 0.25) 75%, transparent 75%, transparent);
background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.25) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.25) 50%, rgba(255, 255, 255, 0.25) 75%, transparent 75%, transparent);
background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.25) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.25) 50%, rgba(255, 255, 255, 0.25) 75%, transparent 75%, transparent);
-webkit-background-size: 40px 40px;
-moz-background-size: 40px 40px;
-o-background-size: 40px 40px;
background-size: 40px 40px;
}
#flashing_progress {
}

View file

@ -19,120 +19,6 @@ $(function() {
self.printerProfiles.currentProfile.subscribe(function() {
self.selectedPrinter(self.printerProfiles.currentProfile());
});
//<<<<<<< HEAD
// self.printerOptions(printerOptions);
// });
//
// self.printerProfiles.currentProfile.subscribe(function() {
// self.selectedPrinter(self.printerProfiles.currentProfile());
// });
//
// self.portOptions = ko.observableArray(undefined);
// self.baudrateOptions = ko.observableArray(undefined);
// self.printerOptions = ko.observableArray(undefined);
// self.selectedPort = ko.observable(undefined);
// self.selectedBaudrate = ko.observable(undefined);
// self.selectedPrinter = ko.observable(undefined);
// self.saveSettings = ko.observable(undefined);
// self.autoconnect = ko.observable(undefined);
//
// self.isErrorOrClosed = ko.observable(undefined);
// self.isConnecting = ko.observable(undefined);
// self.isOperational = ko.observable(undefined);
// self.isLocked = ko.observable(undefined);
// self.isPrinting = ko.observable(undefined);
// self.isPaused = ko.observable(undefined);
// self.isError = ko.observable(undefined);
// self.isReady = ko.observable(undefined);
// self.isLoading = ko.observable(undefined);
//
// self.buttonText = ko.computed(function() {
// if (self.isErrorOrClosed())
// return gettext("Connect");
// else
// return gettext("Disconnect");
// });
//
// self.previousIsOperational = undefined;
//
// self.requestData = function() {
// $.ajax({
// url: API_BASEURL + "connection",
// method: "GET",
// dataType: "json",
// success: function(response) {
// self.fromResponse(response);
// }
// })
// };
//
// self.fromResponse = function(response) {
// var ports = response.options.ports;
// var baudrates = response.options.baudrates;
// var portPreference = response.options.portPreference;
// var baudratePreference = response.options.baudratePreference;
// var printerPreference = response.options.printerProfilePreference;
// var printerProfiles = response.options.printerProfiles;
//
// self.portOptions(ports);
// self.baudrateOptions(baudrates);
//
// if (!self.selectedPort() && ports && ports.indexOf(portPreference) >= 0)
// self.selectedPort(portPreference);
// if (!self.selectedBaudrate() && baudrates && baudrates.indexOf(baudratePreference) >= 0)
// self.selectedBaudrate(baudratePreference);
// if (!self.selectedPrinter() && printerProfiles && printerProfiles.indexOf(printerPreference) >= 0)
// self.selectedPrinter(printerPreference);
//
// self.saveSettings(false);
// };
//
// self.fromHistoryData = function(data) {
// self._processStateData(data.state);
// };
//
// self.fromCurrentData = function(data) {
// self._processStateData(data.state);
// };
//
// self._processStateData = function(data) {
// self.previousIsOperational = self.isOperational();
// self.isErrorOrClosed(data.flags.closedOrError);
// self.isOperational(data.flags.operational);
// self.isLocked(data.flags.locked);
// self.isConnecting(data.text === "Connecting" || data.text === "Opening serial port");
// self.isPaused(data.flags.paused);
// self.isPrinting(data.flags.printing);
// self.isError(data.flags.error);
// self.isReady(data.flags.ready);
// self.isLoading(data.flags.loading);
//
// var connectionTab = $("#connection");
// if (self.previousIsOperational != self.isOperational()) {
// if (self.isOperational() && connectionTab.hasClass("in")) {
// // connection just got established, close connection tab for now
//// connectionTab.collapse("hide");
// } else if (!connectionTab.hasClass("in")) {
// // connection just dropped, make sure connection tab is open
//// connectionTab.collapse("show");
// }
// }
// };
//
// self.connect = function() {
// if (self.isErrorOrClosed()) {
// var data = {
// "command": "connect",
// "port": self.selectedPort(),
// "baudrate": self.selectedBaudrate(),
// "printerProfile": self.selectedPrinter(),
// "autoconnect": self.settings.serial_autoconnect()
// };
//
// if (self.saveSettings())
// data["save"] = true;
//=======
//>>>>>>> upstream/maintenance
self.portOptions = ko.observableArray(undefined);
self.baudrateOptions = ko.observableArray(undefined);
@ -150,6 +36,7 @@ $(function() {
self.isError = ko.observable(undefined);
self.isReady = ko.observable(undefined);
self.isLoading = ko.observable(undefined);
self.isFlashing = ko.observable(undefined);
self.buttonText = ko.computed(function() {
if (self.isErrorOrClosed())
@ -210,6 +97,7 @@ $(function() {
self.isError(data.flags.error);
self.isReady(data.flags.ready);
self.isLoading(data.flags.loading);
self.isFlashing(data.flags.flashing);
var connectionTab = $("#connection_wrapper");
if (self.previousIsOperational != self.isOperational()) {

View file

@ -70,8 +70,12 @@
</div>
</div>
<div data-bind="visible: isFlashing ">
Mr Beam is flashing the Arduino with a new firmware.
Please do NOT power off the System during flashing!
Firmware update in progress
<div id="flashing_progress" class="progress progress-striped active" style="width: 100%;">
<div class="bar" style="width: 100%;"></div>
</div>
<span class="icon-exclamation-sign"></span>
Do not power off the Machine during the flashing process.
</div>
<div data-bind="visible: !isLocked() && !isFlashing ">
{{ _('Position') }}: <strong data-bind="text: laserPos"></strong>
@ -123,7 +127,8 @@
</div>
</div>
<div class="accordion-body in" id="connection_wrapper" data-bind="visible: (isErrorOrClosed()) && loginState.isUser()">
<div class="accordion-body in" id="connection_wrapper"
data-bind="visible: !isFlashing && isErrorOrClosed() && loginState.isUser()">
<div class="accordion-inner">
<label for="connection_ports" data-bind="css: {disabled: !isErrorOrClosed()}, enable: isErrorOrClosed() && loginState.isUser()">{{ _('Serial Port') }}</label>
<select id="connection_ports" data-bind="options: portOptions, optionsCaption: 'AUTO', value: selectedPort, css: {disabled: !isErrorOrClosed()}, enable: isErrorOrClosed() && loginState.isUser()"></select>