elpatron/octo-funnel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 3 Activity

Navbar: Farbkennung am Button (tsf-enabled/tsf-disabled) mit Live-Umschalten

Browse Source
This commit is contained in:
Markus F.J. Busche
2025-09-21 13:14:55 +02:00
parent f225acc752
commit 73c5da01f9
2 changed files with 20 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
octoprint_tailscale_funnel/octoprint_tailscale_funnel/static/css/tailscale_funnel.css
View File

@@ -39,3 +39,14 @@
border-color: #faebcc; border-color: #faebcc;
color: #8a6d3b; color: #8a6d3b;
} }
/* Navbar Button Farbkennung */
#navbar_plugin_tailscale_funnel > a.tsf-enabled {
background-color: #5cb85c;
color: #fff;
}
#navbar_plugin_tailscale_funnel > a.tsf-disabled {
background-color: #777;
color: #fff;
}

9
octoprint_tailscale_funnel/octoprint_tailscale_funnel/static/js/tailscale_funnel_navbar.js
View File

@@ -6,6 +6,7 @@ $(function() {
var $openLi = $("#tsf_nav_open_li"); var $openLi = $("#tsf_nav_open_li");
var $open = $("#tsf_nav_open"); var $open = $("#tsf_nav_open");
var $toggleText = $("#tsf_nav_toggle_text"); var $toggleText = $("#tsf_nav_toggle_text");
var $btn = $("#navbar_plugin_tailscale_funnel > a");
if ($status.length === 0) return; if ($status.length === 0) return;
$status.text("Checking..."); $status.text("Checking...");
$.ajax({ $.ajax({
@@ -18,6 +19,7 @@ $(function() {
var url = resp.data && resp.data.public_url ? resp.data.public_url : ""; var url = resp.data && resp.data.public_url ? resp.data.public_url : "";
$status.text(enabled ? "Enabled" : "Disabled"); $status.text(enabled ? "Enabled" : "Disabled");
$toggleText.text(enabled ? "Disable" : "Enable"); $toggleText.text(enabled ? "Disable" : "Enable");
$btn.toggleClass('tsf-enabled', enabled).toggleClass('tsf-disabled', !enabled);
lastEnabled = enabled; lastEnabled = enabled;
if (enabled && url) { if (enabled && url) {
$open.attr("href", url); $open.attr("href", url);
@@ -29,12 +31,14 @@ $(function() {
} else { } else {
$status.text("Error"); $status.text("Error");
$toggleText.text("Enable"); $toggleText.text("Enable");
$btn.removeClass('tsf-enabled tsf-disabled');
$openLi.addClass("hidden"); $openLi.addClass("hidden");
} }
}, },
error: function() { error: function() {
$status.text("Error"); $status.text("Error");
$toggleText.text("Enable"); $toggleText.text("Enable");
$btn.removeClass('tsf-enabled tsf-disabled');
$openLi.addClass("hidden"); $openLi.addClass("hidden");
} }
}); });
@@ -58,6 +62,7 @@ $(function() {
var action = enable ? 'enable' : 'disable'; var action = enable ? 'enable' : 'disable';
var $status = $("#tsf_nav_status"); var $status = $("#tsf_nav_status");
var $toggleText = $("#tsf_nav_toggle_text"); var $toggleText = $("#tsf_nav_toggle_text");
var $btn = $("#navbar_plugin_tailscale_funnel > a");
$status.text(enable ? 'Enabling...' : 'Disabling...'); $status.text(enable ? 'Enabling...' : 'Disabling...');
$.ajax({ $.ajax({
url: PLUGIN_BASEURL + 'tailscale_funnel/' + action, url: PLUGIN_BASEURL + 'tailscale_funnel/' + action,
@@ -68,6 +73,7 @@ $(function() {
if (enable) { if (enable) {
$status.text('Enabled'); $status.text('Enabled');
$toggleText.text('Disable'); $toggleText.text('Disable');
$btn.addClass('tsf-enabled').removeClass('tsf-disabled');
var url = resp.data && resp.data.public_url ? resp.data.public_url : ''; var url = resp.data && resp.data.public_url ? resp.data.public_url : '';
if (url) { if (url) {
$("#tsf_nav_open").attr('href', url); $("#tsf_nav_open").attr('href', url);
@@ -77,6 +83,7 @@ $(function() {
} else { } else {
$status.text('Disabled'); $status.text('Disabled');
$toggleText.text('Enable'); $toggleText.text('Enable');
$btn.addClass('tsf-disabled').removeClass('tsf-enabled');
$("#tsf_nav_open").attr('href', '#'); $("#tsf_nav_open").attr('href', '#');
$("#tsf_nav_open_li").addClass('hidden'); $("#tsf_nav_open_li").addClass('hidden');
lastEnabled = false; lastEnabled = false;
@@ -85,10 +92,12 @@ $(function() {
setTimeout(refreshNavbarStatus, 250); setTimeout(refreshNavbarStatus, 250);
} else { } else {
$status.text('Error'); $status.text('Error');
$btn.removeClass('tsf-enabled tsf-disabled');
} }
}, },
error: function() { error: function() {
$status.text('Error'); $status.text('Error');
$btn.removeClass('tsf-enabled tsf-disabled');
} }
}); });
}); });