Don't allow multiple parallel webcam tests
Disable button when a test is already active. Also have spinner defined centrally and only made visible on active test. Should hopefully give better feedback to impatient users ;) Solves #1897
This commit is contained in:
parent
0161d915d6
commit
c69ef1598a
4 changed files with 36 additions and 11 deletions
|
|
@ -224,37 +224,48 @@ $(function() {
|
|||
self.terminalFilters.remove(filter);
|
||||
};
|
||||
|
||||
self.testWebcamStreamUrlBusy = ko.observable(false);
|
||||
self.testWebcamStreamUrl = function() {
|
||||
if (!self.webcam_streamUrl()) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (self.testWebcamStreamUrlBusy()) {
|
||||
return;
|
||||
}
|
||||
|
||||
var text = gettext("If you see your webcam stream below, the entered stream URL is ok.");
|
||||
var image = $('<img src="' + self.webcam_streamUrl() + '">');
|
||||
var message = $("<p></p>")
|
||||
.append(text)
|
||||
.append(image);
|
||||
|
||||
self.testWebcamStreamUrlBusy(true);
|
||||
showMessageDialog({
|
||||
title: gettext("Stream test"),
|
||||
message: message
|
||||
message: message,
|
||||
onclose: function() {
|
||||
self.testWebcamStreamUrlBusy(false);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
self.testWebcamSnapshotUrlBusy = ko.observable(false);
|
||||
self.testWebcamSnapshotUrl = function(viewModel, event) {
|
||||
if (!self.webcam_snapshotUrl()) {
|
||||
return;
|
||||
}
|
||||
|
||||
var target = $(event.target);
|
||||
target.prepend('<i class="icon-spinner icon-spin"></i> ');
|
||||
if (self.testWebcamSnapshotUrlBusy()) {
|
||||
return;
|
||||
}
|
||||
|
||||
var errorText = gettext("Could not retrieve snapshot URL, please double check the URL");
|
||||
var errorTitle = gettext("Snapshot test failed");
|
||||
|
||||
self.testWebcamSnapshotUrlBusy(true);
|
||||
OctoPrint.util.testUrl(self.webcam_snapshotUrl(), {method: "GET", response: "bytes"})
|
||||
.done(function(response) {
|
||||
$("i.icon-spinner", target).remove();
|
||||
|
||||
if (!response.result) {
|
||||
showMessageDialog({
|
||||
title: errorTitle,
|
||||
|
|
@ -274,23 +285,34 @@ $(function() {
|
|||
var text = gettext("If you see your webcam snapshot picture below, the entered snapshot URL is ok.");
|
||||
showMessageDialog({
|
||||
title: gettext("Snapshot test"),
|
||||
message: $('<p>' + text + '</p><p><img src="data:' + mimeType + ';base64,' + content + '" /></p>')
|
||||
message: $('<p>' + text + '</p><p><img src="data:' + mimeType + ';base64,' + content + '" /></p>'),
|
||||
onclose: function() {
|
||||
self.testWebcamSnapshotUrlBusy(false);
|
||||
}
|
||||
});
|
||||
})
|
||||
.fail(function() {
|
||||
$("i.icon-spinner", target).remove();
|
||||
showMessageDialog({
|
||||
title: errorTitle,
|
||||
message: errorText
|
||||
message: errorText,
|
||||
onclose: function() {
|
||||
self.testWebcamSnapshotUrlBusy(false);
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
self.testWebcamFfmpegPathBusy = ko.observable(false);
|
||||
self.testWebcamFfmpegPath = function() {
|
||||
if (!self.webcam_ffmpegPath()) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (self.testWebcamFfmpegPathBusy()) {
|
||||
return;
|
||||
}
|
||||
|
||||
self.testWebcamFfmpegPathBusy(true);
|
||||
OctoPrint.util.testExecutable(self.webcam_ffmpegPath())
|
||||
.done(function(response) {
|
||||
if (!response.result) {
|
||||
|
|
@ -306,6 +328,9 @@ $(function() {
|
|||
}
|
||||
self.webcam_ffmpegPathOk(response.result);
|
||||
self.webcam_ffmpegPathBroken(!response.result);
|
||||
})
|
||||
.always(function() {
|
||||
self.testWebcamFfmpegPathBusy(false);
|
||||
});
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<div class="controls">
|
||||
<div class="input-append">
|
||||
<input type="text" class="input-block-level" data-bind="value: webcam_ffmpegPath, valueUpdate: 'afterkeydown'" id="settings-webcamFfmpegPath">
|
||||
<button class="btn" type="button" data-bind="click: testWebcamFfmpegPath, enable: webcam_ffmpegPath(), css: {disabled: !webcam_ffmpegPath()}">{{ _('Test') }}</button>
|
||||
<button class="btn" type="button" data-bind="click: testWebcamFfmpegPath, enable: webcam_ffmpegPath() && !testWebcamFfmpegPathBusy(), css: {disabled: !webcam_ffmpegPath() || testWebcamFfmpegPathBusy()}"><i class="icon-spinner icon-spin" data-bind="visible: testWebcamFfmpegPathBusy"></i> {{ _('Test') }}</button>
|
||||
</div>
|
||||
<span class="help-block" data-bind="visible: webcam_ffmpegPathBroken() || webcam_ffmpegPathOk(), text: webcam_ffmpegPathText"></span>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<div class="controls">
|
||||
<div class="input-append">
|
||||
<input type="text" class="input-block-level" data-bind="value: webcam_snapshotUrl, valueUpdate: 'afterkeydown'" id="settings-webcamSnapshotUrl">
|
||||
<button class="btn" type="button" data-bind="click: testWebcamSnapshotUrl, enable: webcam_snapshotUrl(), css: {disabled: !webcam_snapshotUrl()}">{{ _('Test') }}</button>
|
||||
<button class="btn" type="button" data-bind="click: testWebcamSnapshotUrl, enable: webcam_snapshotUrl() && !testWebcamSnapshotUrlBusy(), css: {disabled: !webcam_snapshotUrl() || testWebcamSnapshotUrlBusy()}"><i class="icon-spinner icon-spin" data-bind="visible: testWebcamSnapshotUrlBusy"></i> {{ _('Test') }}</button>
|
||||
</div>
|
||||
<span class="help-inline">{% trans %}Fully qualified URL, needs to be reachable by OctoPrint's server{% endtrans %}</span>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<div class="controls">
|
||||
<div class="input-append">
|
||||
<input type="text" class="input-block-level" data-bind="value: webcam_streamUrl, valueUpdate: 'afterkeydown'" id="settings-webcamStreamUrl">
|
||||
<button class="btn" type="button" data-bind="click: testWebcamStreamUrl, enable: webcam_streamUrl(), css: {disabled: !webcam_streamUrl()}">{{ _('Test') }}</button>
|
||||
<button class="btn" type="button" data-bind="click: testWebcamStreamUrl, enable: webcam_streamUrl() && !testWebcamStreamUrlBusy(), css: {disabled: !webcam_streamUrl() || testWebcamStreamUrlBusy()}"><i class="icon-spinner icon-spin" data-bind="visible: testWebcamStreamUrlBusy"></i> {{ _('Test') }}</button>
|
||||
</div>
|
||||
<span class="help-inline">{% trans %}Needs to be reachable from the browser displaying the OctoPrint UI, used to embed the webcam stream into the page.{% endtrans %}</span>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue