ManuelW/octoprint-customControl
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

added button styling functionality, removed "output" in the menu

Browse Source
This commit is contained in:
electr0sheep
2018-02-21 23:12:43 -07:00
parent b684644bbe
commit 09ff8e9953
4 changed files with 69 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
octoprint_customControl/__init__.py
View File

@ -8,7 +8,6 @@ from octoprint.settings import settings
import octoprint.plugin
class CustomControlPlugin(octoprint.plugin.SettingsPlugin,
octoprint.plugin.TemplatePlugin,
octoprint.plugin.AssetPlugin):

40
octoprint_customControl/static/js/customControl.js
View File

@ -231,6 +231,7 @@
}
control.name = ko.observable(control.name || "");
control.style = ko.observable(control.style || "");
control.width = ko.observable(control.hasOwnProperty("width") ? control.width : "2");
control.offset = ko.observable(control.hasOwnProperty("offset") ? control.offset : "");
@ -310,6 +311,18 @@
});
}
}
self.editElementStyle = function (invokedOn, contextParent, selectedMenu, style) {
var element = self.searchElement(self.controlsFromServer, contextParent.attr('id'));
if (element == undefined) {
self._showPopup({
title: gettext("Something went wrong while creating the new Element"),
type: "error"
});
return;
}
element.style("btn " + style);
}
self.deleteElement = function (invokedOn, contextParent, selectedMenu) {
var element = self.searchElement(self.controlsFromServer, contextParent.attr('id'));
if (element == undefined) {
@ -521,6 +534,30 @@
self.deleteElement(invokedOn, contextParent, selectedMenu);
break;
}
case "editStyleNormal": {
self.editElementStyle(invokedOn, contextParent, selectedMenu, "");
break;
}
case "editStylePrimary": {
self.editElementStyle(invokedOn, contextParent, selectedMenu, "btn-primary");
break;
}
case "editStyleDanger": {
self.editElementStyle(invokedOn, contextParent, selectedMenu, "btn-danger");
break;
}
case "editStyleWarning": {
self.editElementStyle(invokedOn, contextParent, selectedMenu, "btn-warning");
break;
}
case "editStyleSuccess": {
self.editElementStyle(invokedOn, contextParent, selectedMenu, "btn-success");
break;
}
case "editStyleInfo": {
self.editElementStyle(invokedOn, contextParent, selectedMenu, "btn-info");
break;
}
default: {
if (selectedMenu.attr('cmd').startsWith("create")) {
switch (selectedMenu.attr('cmd')) {
@ -553,9 +590,6 @@
}
}
self.editStyle = function (type) {
}
self.recursiveDeleteProperties = function (list) {
_.each(list, function (element, index, ll) {
if (!element.parent || (element.parent.hasOwnProperty("layout") && element.parent.layout() != "horizontal_grid")) {

3
octoprint_customControl/static/js/customControlDialog.js
View File

@ -59,6 +59,7 @@
self.reset = function (data) {
var element = {
name: undefined,
style: "",
collapsed: false,
commands: "",
confirm: "",
@ -105,6 +106,7 @@
}
case "command": {
el.name = obj.name;
el.style = "btn";
if (obj.commands.indexOf('\n') == -1)
el.command = obj.commands;
else
@ -165,6 +167,7 @@
case "script":
{
el.name = obj.name;
el.style = "btn";
el.script = obj.script;
if (self.useConfirm()) {

25
octoprint_customControl/templates/customControl_hookedsettings.jinja2
View File

@ -19,13 +19,23 @@
<a href="#">Style</a>
<ul class="dropdown-menu">
<li>
<a href="#" cmd="editStyle">Normal</a>
<a href="#" cmd="editStyleNormal">Normal</a>
</li>
<li class="btn-primary">
<a href="#" cmd="editStyle">Primary</a>
<a href="#" cmd="editStylePrimary">Primary</a>
</li>
<li class="btn-danger">
<a href="#" cmd="editStyle">Danger</a>
<a href="#" cmd="editStyleDanger">Danger</a>
</li>
<li class="btn-warning">
<a href="#" cmd="editStyleWarning">Warning</a>
</li>
<li class="btn-success">
<a href="#" cmd="editStyleSuccess">Success</a>
</li>
<li class="btn-info">
<a href="#" cmd="editStyleInfo">Info</a>
<li>
</li>
</ul>
</li>
@ -37,7 +47,7 @@
<li><a href="#" cmd="createContainer">{{ _('Container') }}</a></li>
<li><a href="#" cmd="createCommand">{{ _('Command') }}</a></li>
<li><a href="#" cmd="createScript">{{ _('Script Command') }}</a></li>
<li><a href="#" cmd="createOutput">{{ _('Output') }}</a></li>
<!--<li><a href="#" cmd="createOutput">{{ _('Output') }}</a></li>-->
</ul>
</li>
<li class="divider"></li>
@ -76,8 +86,10 @@
</script>
<script type="text/html" id="settingsCustomControls_controlTemplate">
<form class="form-inline custom_control" style="min-height:15px; border:1px dotted #000000" data-bind="contextMenu: { menuSelector: '#commandContextMenu', menuSelected: $root.controlContextMenu }, css: { 'sortable': $parent.layout() != 'horizontal_grid' }, attr: { 'id': id }">
<div data-bind="text: console.log($data)"></div>
<!-- ko template: { name: 'settingsCustomControls_controlTemplate_input', data: $data, if: $data.hasOwnProperty('input') } --><!-- /ko -->
<!-- ko template: { name: 'settingsCustomControls_controlTemplate_command', data: $data, if: $data.hasOwnProperty('command') || $data.hasOwnProperty('commands') || $data.hasOwnProperty('script') || $data.hasOwnProperty('javascript') } --><!-- /ko -->
<!-- ko template: { name: 'settingsCustomControls_controlTemplate_command', data: $data, if: !$data.hasOwnProperty('style') && ($data.hasOwnProperty('command') || $data.hasOwnProperty('commands') || $data.hasOwnProperty('script') || $data.hasOwnProperty('javascript')) } --><!-- /ko -->
<!-- ko template: { name: 'settingsCustomControls_controlTemplate_command_styled', data: $data, if: $data.hasOwnProperty('style') && ($data.hasOwnProperty('command') || $data.hasOwnProperty('commands') || $data.hasOwnProperty('script') || $data.hasOwnProperty('javascript')) } --><!-- /ko -->
<!-- ko template: { name: 'settingsCustomControls_controlTemplate_output', data: $data, if: $data.hasOwnProperty('value') } --><!-- /ko -->
</form>
</script>
@ -98,4 +110,7 @@
<script type="text/html" id="settingsCustomControls_controlTemplate_command">
<button class="btn" data-bind="text: name" onclick="event.preventDefault()"></button>
</script>
<script type="text/html" id="settingsCustomControls_controlTemplate_command_styled">
<button data-bind="text: name, attr: { 'class': style }" onclick="event.preventDefault()"></button>
</script>
<!-- End of templates for custom controls -->