inputs screen logic

This commit is contained in:
Vitor Henrique
2021-03-09 23:41:54 -06:00
parent 2433c5e451
commit 6042a3d59e
7 changed files with 139 additions and 100 deletions

View File

@@ -8,9 +8,10 @@ $(function () {
return {
index_id: index_id,
label: "",
input_type: "",
input_type: "regular_gpio",
action_type: "output_control",
gpio: {
pin_name: "regular_gpio",
pin_name: "",
pull_resistor: "input_pull_up",
linked_action: "output_control",
edge_detection: "fall",
@@ -25,9 +26,9 @@ $(function () {
output_set_value: "low",
},
temperature_sensor: {
type: "DS18B20",
type: "si7021",
address: "",
unit: "C",
unit: "celsius",
}
}
};
@@ -106,6 +107,7 @@ $(function () {
self.index_id = ko.observable();
self.label = ko.observable();
self.input_type = ko.observable();
self.action_type = ko.observable();
// gpio output
self.gpio_pin = ko.observable();
self.pull_resistor = ko.observable();
@@ -115,7 +117,7 @@ $(function () {
self.controlled_output = ko.observable();
self.controlled_output_set_value = ko.observable();
// printer action on linked action
self.printed_action = ko.observable();
self.printer_action = ko.observable();
self.filament_sensor_enabled = ko.observable();
self.filament_sensor_timeout = ko.observable();
// temperature sensor
@@ -154,6 +156,7 @@ $(function () {
self.index_id(data.index_id);
self.label(data.label);
self.input_type(data.input_type);
self.action_type(data.action_type);
// gpio output
self.gpio_pin(data.gpio.pin_name);
self.pull_resistor(data.gpio.pull_resistor);
@@ -163,7 +166,7 @@ $(function () {
self.controlled_output(data.linked_output_action.output_index_id);
self.controlled_output_set_value(data.linked_output_action.output_set_value);
// printer action on linked action
self.printed_action(data.linked_printer_action.action);
self.printer_action(data.linked_printer_action.action);
self.filament_sensor_enabled(data.linked_printer_action.filament_sensor_enabled);
self.filament_sensor_timeout(data.linked_printer_action.filament_sensor_timeout);
// temperature sensor
@@ -178,6 +181,7 @@ $(function () {
index_id: self.index_id(),
label: self.label(),
input_type: self.input_type(),
action_type: self.action_type(),
gpio: {
pin_name: self.gpio_pin(),
pull_resistor: self.pull_resistor(),
@@ -185,7 +189,7 @@ $(function () {
edge_detection: self.edge_detection(),
},
linked_printer_action: {
action: self.printed_action(),
action: self.printer_action(),
filament_sensor_enabled: self.filament_sensor_enabled(),
filament_sensor_timeout: self.filament_sensor_timeout(),
},

View File

@@ -0,0 +1,110 @@
<form class="form-horizontal">
<div class="control-group">
<label class="control-label">{{ _('Action Type') }}</label>
<div class="controls">
<input type="radio" name="action_type_radio" value="output_control" data-bind="checked: inputEditor.action_type"> {{ _('Output Control') }}
</div>
<div class="controls">
<input type="radio" name="action_type_radio" value="printer_control" data-bind="checked: inputEditor.action_type"> {{ _('Printer') }}
</div>
</div>
<!-- ko if: (inputEditor.action_type() == "printer_control") -->
<div class="control-group">
<div class="controls">
<span class="help-inline">
<span class="label label-info">Info:</span> PRINTER actions when a condition is met, that can be a
filament sensor, button, etc. Actions can
be Pause \ Resume \ Cancel a printer_control job, change the filament or disable Temperature Control.
You can
use the "change filament" action and set up the input GPIO according to your sensor, for example, if your
filament
sensor connects to ground when detects the end of the filament, you should choose PULL UP resistors and
detect
the event on the falling edge.
</span>
</div>
</div>
<!-- /ko -->
<!-- ko if: (inputEditor.action_type() == "output_control") -->
<div class="control-group">
<div class="controls">
<span class="help-inline">
<span class="label label-info">Info:</span> Action will control GPIO outputs when a condition is met,
for example detect a press of a button.
You can use this to control any previous configured OUTPUTS, basically being able to control your
lights / fan
/ printer using mechanical buttons buttons instead of the Octoprint interface. You can only control
REGULAR outputs.
</span>
</div>
</div>
<div class="control-group">
<label class="control-label"> Controlled IO</label>
<div class="controls">
<select >
</select>
<span class="help-inline">When the event happen, you want control which OUTPUT?</span>
</div>
</div>
<!-- ko_comment if: ($root.isRegularOutput($data.controlled_io())) -->
<div class="control-group">
<label class="control-label">Set Controlled IO Value</label>
<div class="controls">
<select data-bind="value: inputEditor.controlled_io_set_value">
<option value="low">Low</option>
<option value="high">High</option>
<option value="toggle">Toggle</option>
</select>
<span class="help-inline">When the event happen, you want to turn the controlled IO HIGH or LOW?</span>
</div>
</div>
<!-- /ko_comment -->
<!-- /ko -->
<!-- ko if: (inputEditor.action_type() == "printer_control") -->
<div class="control-group">
<label class="control-label">{{ _('Printer Action') }}</label>
<div class="controls">
<select data-bind="value: inputEditor.printer_action">
<option value="filament">Filament Change</option>
<option value="resume">Printer Resume</option>
<option value="pause">Printer Pause</option>
<option value="cancel">Printer Cancel</option>
<option value="start">Start Print</option>
<option value="toggle">Printer Toggle (Connect / Pause / Resume)</option>
<option value="toggle_job">Job Toggle (Connect / Start / Cancel)</option>
<option value="stop_temp_hum_control">Stop Temperature Control</option>
</select>
<span class="help-inline"> You can use filament change on your filament detectors and add buttons to resume and pause the print job.</span>
</div>
</div>
<!-- ko if: (inputEditor.printer_action() == "filament") -->
<div class="control-group">
<div class="controls">
<label class="checkbox">
<input type="checkbox" data-bind="checked: inputEditor.filament_sensor_enabled"> {{ _('Enable') }}
</label>
<span class="help-inline">Enable and disable filament sensors</span>
</div>
</div>
<div class="control-group">
<label class="control-label">{{ _('Filament detection timeout') }}</label>
<div class="controls">
<input type="text" class="input-block-level" data-bind="value: inputEditor.filament_sensor_timeout">
<span class="help-inline">Time in seconds that filament sensor will be inactive after sensing end of filament. This is to avoid sending multiple
commands to the printer.
</span>
</div>
</div>
<!-- /ko -->
<!-- /ko -->
</form>

View File

@@ -19,37 +19,25 @@
<div class="control-group">
<label class="control-label">{{ _('Input Type') }}</label>
<div class="controls">
<input type="radio" value="regular_gpio" data-bind="checked: inputEditor.input_type"> {{ _('GPIO Input') }}
<input type="radio" name="input_type_radio" value="regular_gpio" data-bind="checked: inputEditor.input_type"> {{ _('GPIO Input') }}
</div>
<div class="controls">
<input type="radio" value="temperature_sensor" data-bind="checked: inputEditor.input_type"> {{ _('Temperature Sensor') }}
<input type="radio" name="input_type_radio" value="temperature_sensor" data-bind="checked: inputEditor.input_type"> {{ _('Temp Sensor') }}
</div>
<div class="control-group">
<div class="controls">
<!-- kocomment if: (inputEditor.input_type() == "regular_gpio") -->
<!-- ko if: (inputEditor.input_type() == "regular_gpio") -->
<span class="help-inline">
<span class="label label-info">Info:</span> GPIO will input status of the pin (HIGH or LOW) to trigger actions on configured outputs or printer events</span>
<!-- /kocomment -->
<!-- kocomment if: (inputEditor.input_type() == "temperature_sensor") -->
<!-- /ko -->
<!-- ko if: (inputEditor.input_type() == "temperature_sensor") -->
<span class="help-inline">
<span class="label label-info">Info:</span> Temperature Sensors will input temperature and humidity data.
</span>
<!-- /kocomment -->
<!-- /ko -->
</div>
</div>
</div>
<!-- kocomment if: (inputEditor.input_type() == "regular_gpio") -->
<div class="control-group">
<label class="control-label">{{ _('Action Type') }}</label>
<div class="controls">
<input type="radio" value="output_control" data-bind="checked: inputEditor.action_type"> {{ _('Output Control') }}
</div>
<div class="controls">
<input type="radio" value="printer_control" data-bind="checked: inputEditor.action_type"> {{ _('Printer') }}
</div>
</div>
<!-- /kocomment -->
</form>

View File

@@ -11,16 +11,19 @@
<li class="active"><a href="#settings_inputs_edit_dialog_general"
data-toggle="tab">{{ _('General') }}</a></li>
<!-- ko if: (inputEditor.input_type() == "regular_gpio") -->
<li><a href="#settings_inputs_edit_dialog_io" data-toggle="tab">{{ _('IO Settings') }}</a></li>
<!-- /ko -->
<li><a href="#settings_inputs_edit_dialog_printer_action"
data-toggle="tab">{{ _('Printer Action') }}</a></li>
<li><a href="#settings_inputs_edit_dialog_output_action" data-toggle="tab">{{ _('Output Action') }}</a>
</li>
<!-- ko if: (inputEditor.input_type() == "regular_gpio") -->
<li><a href="#settings_inputs_edit_dialog_action"
data-toggle="tab">{{ _('Action') }}</a></li>
<!-- /ko -->
<!-- ko if: (inputEditor.input_type() == "temperature_sensor") -->
<li><a href="#settings_inputs_edit_dialog_temperature_sensor"
data-toggle="tab">{{ _('Temperature Sensor') }}</a></li>
data-toggle="tab">{{ _('Sensor') }}</a></li>
<!-- /ko -->
</ul>
<div class="tab-content">
@@ -32,19 +35,13 @@
{% include "input_editor/io_output.jinja2" %}
</div>
<div id="settings_inputs_edit_dialog_printer_action" class="tab-pane">
{% include "input_editor/printer_action.jinja2" %}
<div id="settings_inputs_edit_dialog_action" class="tab-pane">
{% include "input_editor/action.jinja2" %}
</div>
<div id="settings_inputs_edit_dialog_output_action" class="tab-pane">
{% include "input_editor/output_action.jinja2" %}
</div>
<!-- ko if: (inputEditor.input_type() == "temperature_sensor") -->
<div id="settings_inputs_edit_dialog_temperature_sensor" class="tab-pane">
{% include "input_editor/temperature_sensor.jinja2" %}
</div>
<!-- /ko -->
</div>

View File

@@ -1,39 +0,0 @@
<form class="form-horizontal">
<div class="control-group">
<div class="controls">
<span class="help-inline">
<span class="label label-info">Info:</span> Action will control GPIO outputs when a condition is met,
for example detect a press of a button.
You can use this to control any previous configured OUTPUTS, basically being able to control your
lights / fan
/ printer using mechanical buttons buttons instead of the Octoprint interface. You can only control
REGULAR outputs.
</span>
</div>
</div>
<div class="control-group">
<label class="control-label"> Controlled IO</label>
<div class="controls">
<select >
</select>
<span class="help-inline">When the event happen, you want control which OUTPUT?</span>
</div>
</div>
<!-- ko_comment if: ($root.isRegularOutput($data.controlled_io())) -->
<div class="control-group">
<label class="control-label">Set Controlled IO Value</label>
<div class="controls">
<select data-bind="value: inputEditor.controlled_io_set_value">
<option value="low">Low</option>
<option value="high">High</option>
<option value="toggle">Toggle</option>
</select>
<span class="help-inline">When the event happen, you want to turn the controlled IO HIGH or LOW?</span>
</div>
</div>
<!-- /ko_comment -->
</form>

View File

@@ -1,20 +0,0 @@
<form class="form-horizontal">
<div class="control-group">
<div class="controls">
<span class="help-inline">
<span class="label label-info">Info:</span> PRINTER actions when a condition is met, that can be a
filament sensor, button, etc. Actions can
be Pause \ Resume \ Cancel a printer_control job, change the filament or disable Temperature Control.
You can
use the "change filament" action and set up the input GPIO according to your sensor, for example, if your
filament
sensor connects to ground when detects the end of the filament, you should choose PULL UP resistors and
detect
the event on the falling edge.
</span>
</div>
</div>
</form>

View File

@@ -5,7 +5,6 @@
<label class="control-label" for="settings-enclosure-dhtModel">{{ _('Sensor Type') }}</label>
<div class="controls">
<select data-bind="value: inputEditor.temperature_sensor_type">
<option value="">Select Sensor</option>
<option value="11">DHT11</option>
<option value="22">DHT22</option>
<option value="2302">AM2302</option>
@@ -75,7 +74,7 @@
<div class="control-group">
<label class="control-label">{{ _('Temperature Unit') }}</label>
<div class="controls">
<select data-bind="value: temperature_sensor_type">
<select data-bind="value: inputEditor.temperature_sensor_unit">
<option value="celsius">Celsius</option>
<option value="fahrenheit">Fahrenheit</option>
<option value="romer">Rømer</option>