Merge branch 'webcamMove' into devel
commit
46173bc35e
|
@ -181,6 +181,16 @@ table {
|
||||||
&.timelapse_files_action {
|
&.timelapse_files_action {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
width: 45px;
|
width: 45px;
|
||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: #000;
|
||||||
|
|
||||||
|
&.disabled {
|
||||||
|
color: #ccc;
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -274,9 +284,9 @@ ul.dropdown-menu li a {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/** Controls */
|
/** Control tab */
|
||||||
|
|
||||||
#controls {
|
#control {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
||||||
.jog-panel {
|
.jog-panel {
|
||||||
|
|
|
@ -376,7 +376,7 @@ function TemperatureViewModel(settingsViewModel) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function ControlsViewModel() {
|
function ControlViewModel() {
|
||||||
var self = this;
|
var self = this;
|
||||||
|
|
||||||
self.isErrorOrClosed = ko.observable(undefined);
|
self.isErrorOrClosed = ko.observable(undefined);
|
||||||
|
@ -788,7 +788,7 @@ function GcodeFilesViewModel() {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function WebcamViewModel() {
|
function TimelapseViewModel() {
|
||||||
var self = this;
|
var self = this;
|
||||||
|
|
||||||
self.timelapseType = ko.observable(undefined);
|
self.timelapseType = ko.observable(undefined);
|
||||||
|
@ -847,7 +847,6 @@ function WebcamViewModel() {
|
||||||
dataType: "json",
|
dataType: "json",
|
||||||
success: self.fromResponse
|
success: self.fromResponse
|
||||||
});
|
});
|
||||||
$("#webcam_image").attr("src", CONFIG_WEBCAM_STREAM + "?" + new Date().getTime());
|
|
||||||
}
|
}
|
||||||
|
|
||||||
self.fromResponse = function(response) {
|
self.fromResponse = function(response) {
|
||||||
|
@ -1131,24 +1130,25 @@ function NavigationViewModel(appearanceViewModel, settingsViewModel) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function DataUpdater(connectionViewModel, printerStateViewModel, temperatureViewModel, controlsViewModel, speedViewModel, terminalViewModel, gcodeFilesViewModel, webcamViewModel, gcodeViewModel) {
|
function DataUpdater(connectionViewModel, printerStateViewModel, temperatureViewModel, controlViewModel, speedViewModel, terminalViewModel, gcodeFilesViewModel, timelapseViewModel, gcodeViewModel) {
|
||||||
var self = this;
|
var self = this;
|
||||||
|
|
||||||
self.connectionViewModel = connectionViewModel;
|
self.connectionViewModel = connectionViewModel;
|
||||||
self.printerStateViewModel = printerStateViewModel;
|
self.printerStateViewModel = printerStateViewModel;
|
||||||
self.temperatureViewModel = temperatureViewModel;
|
self.temperatureViewModel = temperatureViewModel;
|
||||||
self.controlsViewModel = controlsViewModel;
|
self.controlViewModel = controlViewModel;
|
||||||
self.terminalViewModel = terminalViewModel;
|
self.terminalViewModel = terminalViewModel;
|
||||||
self.speedViewModel = speedViewModel;
|
self.speedViewModel = speedViewModel;
|
||||||
self.gcodeFilesViewModel = gcodeFilesViewModel;
|
self.gcodeFilesViewModel = gcodeFilesViewModel;
|
||||||
self.webcamViewModel = webcamViewModel;
|
self.timelapseViewModel = timelapseViewModel;
|
||||||
self.gcodeViewModel = gcodeViewModel;
|
self.gcodeViewModel = gcodeViewModel;
|
||||||
|
|
||||||
self._socket = io.connect();
|
self._socket = io.connect();
|
||||||
self._socket.on("connect", function() {
|
self._socket.on("connect", function() {
|
||||||
if ($("#offline_overlay").is(":visible")) {
|
if ($("#offline_overlay").is(":visible")) {
|
||||||
$("#offline_overlay").hide();
|
$("#offline_overlay").hide();
|
||||||
self.webcamViewModel.requestData();
|
self.timelapseViewModel.requestData();
|
||||||
|
$("#webcam_image").attr("src", CONFIG_WEBCAM_STREAM + "?" + new Date().getTime());
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
self._socket.on("disconnect", function() {
|
self._socket.on("disconnect", function() {
|
||||||
|
@ -1170,9 +1170,9 @@ function DataUpdater(connectionViewModel, printerStateViewModel, temperatureView
|
||||||
self.connectionViewModel.fromHistoryData(data);
|
self.connectionViewModel.fromHistoryData(data);
|
||||||
self.printerStateViewModel.fromHistoryData(data);
|
self.printerStateViewModel.fromHistoryData(data);
|
||||||
self.temperatureViewModel.fromHistoryData(data);
|
self.temperatureViewModel.fromHistoryData(data);
|
||||||
self.controlsViewModel.fromHistoryData(data);
|
self.controlViewModel.fromHistoryData(data);
|
||||||
self.terminalViewModel.fromHistoryData(data);
|
self.terminalViewModel.fromHistoryData(data);
|
||||||
self.webcamViewModel.fromHistoryData(data);
|
self.timelapseViewModel.fromHistoryData(data);
|
||||||
self.gcodeViewModel.fromHistoryData(data);
|
self.gcodeViewModel.fromHistoryData(data);
|
||||||
self.gcodeFilesViewModel.fromCurrentData(data);
|
self.gcodeFilesViewModel.fromCurrentData(data);
|
||||||
})
|
})
|
||||||
|
@ -1180,9 +1180,9 @@ function DataUpdater(connectionViewModel, printerStateViewModel, temperatureView
|
||||||
self.connectionViewModel.fromCurrentData(data);
|
self.connectionViewModel.fromCurrentData(data);
|
||||||
self.printerStateViewModel.fromCurrentData(data);
|
self.printerStateViewModel.fromCurrentData(data);
|
||||||
self.temperatureViewModel.fromCurrentData(data);
|
self.temperatureViewModel.fromCurrentData(data);
|
||||||
self.controlsViewModel.fromCurrentData(data);
|
self.controlViewModel.fromCurrentData(data);
|
||||||
self.terminalViewModel.fromCurrentData(data);
|
self.terminalViewModel.fromCurrentData(data);
|
||||||
self.webcamViewModel.fromCurrentData(data);
|
self.timelapseViewModel.fromCurrentData(data);
|
||||||
self.gcodeViewModel.fromCurrentData(data);
|
self.gcodeViewModel.fromCurrentData(data);
|
||||||
self.gcodeFilesViewModel.fromCurrentData(data);
|
self.gcodeFilesViewModel.fromCurrentData(data);
|
||||||
})
|
})
|
||||||
|
@ -1449,11 +1449,11 @@ $(function() {
|
||||||
var settingsViewModel = new SettingsViewModel();
|
var settingsViewModel = new SettingsViewModel();
|
||||||
var appearanceViewModel = new AppearanceViewModel(settingsViewModel);
|
var appearanceViewModel = new AppearanceViewModel(settingsViewModel);
|
||||||
var temperatureViewModel = new TemperatureViewModel(settingsViewModel);
|
var temperatureViewModel = new TemperatureViewModel(settingsViewModel);
|
||||||
var controlsViewModel = new ControlsViewModel();
|
var controlViewModel = new ControlViewModel();
|
||||||
var speedViewModel = new SpeedViewModel();
|
var speedViewModel = new SpeedViewModel();
|
||||||
var terminalViewModel = new TerminalViewModel();
|
var terminalViewModel = new TerminalViewModel();
|
||||||
var gcodeFilesViewModel = new GcodeFilesViewModel();
|
var gcodeFilesViewModel = new GcodeFilesViewModel();
|
||||||
var webcamViewModel = new WebcamViewModel();
|
var timelapseViewModel = new TimelapseViewModel();
|
||||||
var gcodeViewModel = new GcodeViewModel();
|
var gcodeViewModel = new GcodeViewModel();
|
||||||
var navigationViewModel = new NavigationViewModel(appearanceViewModel, settingsViewModel);
|
var navigationViewModel = new NavigationViewModel(appearanceViewModel, settingsViewModel);
|
||||||
|
|
||||||
|
@ -1461,11 +1461,11 @@ $(function() {
|
||||||
connectionViewModel,
|
connectionViewModel,
|
||||||
printerStateViewModel,
|
printerStateViewModel,
|
||||||
temperatureViewModel,
|
temperatureViewModel,
|
||||||
controlsViewModel,
|
controlViewModel,
|
||||||
speedViewModel,
|
speedViewModel,
|
||||||
terminalViewModel,
|
terminalViewModel,
|
||||||
gcodeFilesViewModel,
|
gcodeFilesViewModel,
|
||||||
webcamViewModel,
|
timelapseViewModel,
|
||||||
gcodeViewModel
|
gcodeViewModel
|
||||||
);
|
);
|
||||||
|
|
||||||
|
@ -1606,23 +1606,6 @@ $(function() {
|
||||||
//~~ Offline overlay
|
//~~ Offline overlay
|
||||||
$("#offline_overlay_reconnect").click(function() {dataUpdater.reconnect()});
|
$("#offline_overlay_reconnect").click(function() {dataUpdater.reconnect()});
|
||||||
|
|
||||||
//~~ Alert
|
|
||||||
|
|
||||||
/*
|
|
||||||
function displayAlert(text, timeout, type) {
|
|
||||||
var placeholder = $("#alert_placeholder");
|
|
||||||
|
|
||||||
var alertType = "";
|
|
||||||
if (type == "success" || type == "error" || type == "info") {
|
|
||||||
alertType = " alert-" + type;
|
|
||||||
}
|
|
||||||
|
|
||||||
placeholder.append($("<div id='activeAlert' class='alert " + alertType + " fade in' data-alert='alert'><p>" + text + "</p></div>"));
|
|
||||||
placeholder.fadeIn();
|
|
||||||
$("#activeAlert").delay(timeout).fadeOut("slow", function() {$(this).remove(); $("#alert_placeholder").hide();});
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
|
|
||||||
//~~ knockout.js bindings
|
//~~ knockout.js bindings
|
||||||
|
|
||||||
ko.bindingHandlers.popover = {
|
ko.bindingHandlers.popover = {
|
||||||
|
@ -1647,7 +1630,7 @@ $(function() {
|
||||||
ko.applyBindings(gcodeFilesViewModel, document.getElementById("files"));
|
ko.applyBindings(gcodeFilesViewModel, document.getElementById("files"));
|
||||||
ko.applyBindings(gcodeFilesViewModel, document.getElementById("files-heading"));
|
ko.applyBindings(gcodeFilesViewModel, document.getElementById("files-heading"));
|
||||||
ko.applyBindings(temperatureViewModel, document.getElementById("temp"));
|
ko.applyBindings(temperatureViewModel, document.getElementById("temp"));
|
||||||
ko.applyBindings(controlsViewModel, document.getElementById("controls"));
|
ko.applyBindings(controlViewModel, document.getElementById("control"));
|
||||||
ko.applyBindings(terminalViewModel, document.getElementById("term"));
|
ko.applyBindings(terminalViewModel, document.getElementById("term"));
|
||||||
ko.applyBindings(speedViewModel, document.getElementById("speed"));
|
ko.applyBindings(speedViewModel, document.getElementById("speed"));
|
||||||
ko.applyBindings(gcodeViewModel, document.getElementById("gcode"));
|
ko.applyBindings(gcodeViewModel, document.getElementById("gcode"));
|
||||||
|
@ -1655,9 +1638,9 @@ $(function() {
|
||||||
ko.applyBindings(navigationViewModel, document.getElementById("navbar"));
|
ko.applyBindings(navigationViewModel, document.getElementById("navbar"));
|
||||||
ko.applyBindings(appearanceViewModel, document.getElementsByTagName("head")[0]);
|
ko.applyBindings(appearanceViewModel, document.getElementsByTagName("head")[0]);
|
||||||
|
|
||||||
var webcamElement = document.getElementById("webcam");
|
var timelapseElement = document.getElementById("timelapse");
|
||||||
if (webcamElement) {
|
if (timelapseElement) {
|
||||||
ko.applyBindings(webcamViewModel, document.getElementById("webcam"));
|
ko.applyBindings(timelapseViewModel, document.getElementById("timelapse"));
|
||||||
}
|
}
|
||||||
var gCodeVisualizerElement = document.getElementById("gcode");
|
var gCodeVisualizerElement = document.getElementById("gcode");
|
||||||
if(gCodeVisualizerElement){
|
if(gCodeVisualizerElement){
|
||||||
|
@ -1666,9 +1649,9 @@ $(function() {
|
||||||
//~~ startup commands
|
//~~ startup commands
|
||||||
|
|
||||||
connectionViewModel.requestData();
|
connectionViewModel.requestData();
|
||||||
controlsViewModel.requestData();
|
controlViewModel.requestData();
|
||||||
gcodeFilesViewModel.requestData();
|
gcodeFilesViewModel.requestData();
|
||||||
webcamViewModel.requestData();
|
timelapseViewModel.requestData();
|
||||||
settingsViewModel.requestData();
|
settingsViewModel.requestData();
|
||||||
|
|
||||||
//~~ UI stuff
|
//~~ UI stuff
|
||||||
|
|
|
@ -161,14 +161,14 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="tabbable span8">
|
<div class="span8 tabbable">
|
||||||
<ul class="nav nav-tabs" id="tabs">
|
<ul class="nav nav-tabs" id="tabs">
|
||||||
<li class="active"><a href="#temp" data-toggle="tab">Temperature</a></li>
|
<li class="active"><a href="#temp" data-toggle="tab">Temperature</a></li>
|
||||||
<li><a href="#controls" data-toggle="tab">Controls</a></li>
|
<li><a href="#control" data-toggle="tab">Control</a></li>
|
||||||
{% if enableGCodeVisualizer %}<li><a href="#gcode" data-toggle="tab">GCode Viewer</a></li>{% endif %}
|
{% if enableGCodeVisualizer %}<li><a href="#gcode" data-toggle="tab">GCode Viewer</a></li>{% endif %}
|
||||||
<!--<li><a href="#speed" data-toggle="tab">Speed</a></li>-->
|
<!--<li><a href="#speed" data-toggle="tab">Speed</a></li>-->
|
||||||
<li><a href="#term" data-toggle="tab">Terminal</a></li>
|
<li><a href="#term" data-toggle="tab">Terminal</a></li>
|
||||||
{% if webcamStream %}<li><a href="#webcam" data-toggle="tab">Webcam</a></li>{% endif %}
|
{% if enableTimelapse %}<li><a href="#timelapse" data-toggle="tab">Timelapse</a></li>{% endif %}
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<div class="tab-content">
|
<div class="tab-content">
|
||||||
|
@ -239,7 +239,13 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="tab-pane" id="controls">
|
<div class="tab-pane" id="control">
|
||||||
|
{% if webcamStream %}
|
||||||
|
<div id="webcam_container">
|
||||||
|
<img id="webcam_image" src="{{ webcamStream }}">
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
<div class="jog-panel">
|
<div class="jog-panel">
|
||||||
<!-- XY jogging control panel -->
|
<!-- XY jogging control panel -->
|
||||||
<div class="jog-panel">
|
<div class="jog-panel">
|
||||||
|
@ -456,13 +462,8 @@
|
||||||
<button class="btn" type="button" id="terminal-send">Send</button>
|
<button class="btn" type="button" id="terminal-send">Send</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{% if webcamStream %}
|
|
||||||
<div class="tab-pane" id="webcam">
|
|
||||||
<div id="webcam_container">
|
|
||||||
<img id="webcam_image" src="{{ webcamStream }}">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{% if enableTimelapse %}
|
{% if enableTimelapse %}
|
||||||
|
<div class="tab-pane" id="timelapse">
|
||||||
<h1>Timelapse Configuration</h1>
|
<h1>Timelapse Configuration</h1>
|
||||||
|
|
||||||
<label for="webcam_timelapse_mode">Timelapse Mode</label>
|
<label for="webcam_timelapse_mode">Timelapse Mode</label>
|
||||||
|
@ -516,7 +517,6 @@
|
||||||
<li data-bind="css: {disabled: listHelper.currentPage() === listHelper.lastPage()}"><a href="#" data-bind="click: listHelper.nextPage">»</a></li>
|
<li data-bind="css: {disabled: listHelper.currentPage() === listHelper.lastPage()}"><a href="#" data-bind="click: listHelper.nextPage">»</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in New Issue