luci-app-internet-detector: Fixes for dark style

This commit is contained in:
gSpot
2023-03-27 01:20:03 +03:00
parent 312294aeef
commit 642265b96d
4 changed files with 69 additions and 19 deletions

View File

@@ -25,9 +25,9 @@ Internet-detector is an application for checking the availability of the Interne
/etc/init.d/internet-detector start
/etc/init.d/internet-detector enable
wget --no-check-certificate -O /tmp/luci-app-internet-detector_0.6-0_all.ipk https://github.com/gSpotx2f/packages-openwrt/raw/master/current/luci-app-internet-detector_0.6-0_all.ipk
opkg install /tmp/luci-app-internet-detector_0.6-0_all.ipk
rm /tmp/luci-app-internet-detector_0.6-0_all.ipk
wget --no-check-certificate -O /tmp/luci-app-internet-detector_0.6-1_all.ipk https://github.com/gSpotx2f/packages-openwrt/raw/master/current/luci-app-internet-detector_0.6-1_all.ipk
opkg install /tmp/luci-app-internet-detector_0.6-1_all.ipk
rm /tmp/luci-app-internet-detector_0.6-1_all.ipk
/etc/init.d/rpcd restart
Email notification:
@@ -36,9 +36,9 @@ Email notification:
i18n-ru:
wget --no-check-certificate -O /tmp/luci-i18n-internet-detector-ru_0.6-0_all.ipk https://github.com/gSpotx2f/packages-openwrt/raw/master/current/luci-i18n-internet-detector-ru_0.6-0_all.ipk
opkg install /tmp/luci-i18n-internet-detector-ru_0.6-0_all.ipk
rm /tmp/luci-i18n-internet-detector-ru_0.6-0_all.ipk
wget --no-check-certificate -O /tmp/luci-i18n-internet-detector-ru_0.6-1_all.ipk https://github.com/gSpotx2f/packages-openwrt/raw/master/current/luci-i18n-internet-detector-ru_0.6-1_all.ipk
opkg install /tmp/luci-i18n-internet-detector-ru_0.6-1_all.ipk
rm /tmp/luci-i18n-internet-detector-ru_0.6-1_all.ipk
**[OpenWrt 19.07](https://github.com/gSpotx2f/luci-app-internet-detector/tree/19.07)**

View File

@@ -4,7 +4,7 @@
include $(TOPDIR)/rules.mk
PKG_VERSION:=0.6-0
PKG_VERSION:=0.6-1
LUCI_TITLE:=LuCI support for internet-detector
LUCI_DEPENDS:=+internet-detector
LUCI_PKGARCH:=all

View File

@@ -9,6 +9,33 @@
'require view';
'require tools.widgets as widgets'
document.head.append(E('style', {'type': 'text/css'},
`
:root {
--app-id-font-color: #fff;
--app-id-connected-color: #2ea256;
--app-id-disconnected-color: #ff4e54;
--app-id-undefined-color: #8a8a8a;
}
:root[data-darkmode="true"] {
--app-id-connected-color: #005F20;
--app-id-disconnected-color: #a93734;
--app-id-undefined-color: #4d4d4d;
}
.id-connected {
background-color: var(--app-id-connected-color) !important;
color: var(--app-id-font-color) !important;
}
.id-disconnected {
background-color: var(--app-id-disconnected-color) !important;
color: var(--app-id-font-color) !important;
}
.id-undefined {
background-color: var(--app-id-undefined-color) !important;
color: var(--app-id-font-color) !important;
}
`));
const btnStyleEnabled = 'btn cbi-button-save';
const btnStyleDisabled = 'btn cbi-button-reset';
const btnStyleApply = 'btn cbi-button-apply';
@@ -151,21 +178,18 @@ return view.extend({
setInternetStatus: function() {
if(this.inetStatus === 0) {
this.inetStatusLabel.style.background = '#2ea256';
this.inetStatusLabel.textContent = _('Connected') + (this.publicIp ? ' | %s: %s'.format(_('Public IP'), _(this.publicIp)) : '');
this.inetStatusLabel.style.color = '#fff';
this.inetStatusLabel.className = "label id-connected";
this.unsetInetStatusSpinner();
}
else if(this.inetStatus === 1) {
this.inetStatusLabel.textContent = _('Disconnected');
this.inetStatusLabel.style.background = '#ff4e54';
this.inetStatusLabel.style.color = '#fff';
this.inetStatusLabel.className = "label id-disconnected";
this.unsetInetStatusSpinner();
}
else {
this.inetStatusLabel.textContent = _('Undefined');
this.inetStatusLabel.style.background = '#8a8a8a';
this.inetStatusLabel.style.color = '#fff';
this.inetStatusLabel.className = "label id-undefined";
if(this.currentAppMode !== '0' && this.appStatus !== 'stoped') {
this.setInetStatusSpinner();
@@ -216,6 +240,7 @@ return view.extend({
uiPoll: function() {
let curInetStatus = null;
this.uiPollCounter = ++this.uiPollCounter;
if((this.uiPollState === 0 && this.uiPollCounter % this.uiCheckIntervalUp) ||
(this.uiPollState === 1 && this.uiPollCounter % this.uiCheckIntervalDown)) {
return;

View File

@@ -3,6 +3,33 @@
'require fs';
'require uci';
document.head.append(E('style', {'type': 'text/css'},
`
:root {
--app-id-font-color: #fff;
--app-id-connected-color: #2ea256;
--app-id-disconnected-color: #ff4e54;
--app-id-undefined-color: #8a8a8a;
}
:root[data-darkmode="true"] {
--app-id-connected-color: #005F20;
--app-id-disconnected-color: #a93734;
--app-id-undefined-color: #4d4d4d;
}
.id-connected {
background-color: var(--app-id-connected-color) !important;
color: var(--app-id-font-color) !important;
}
.id-disconnected {
background-color: var(--app-id-disconnected-color) !important;
color: var(--app-id-font-color) !important;
}
.id-undefined {
background-color: var(--app-id-undefined-color) !important;
color: var(--app-id-font-color) !important;
}
`));
return baseclass.extend({
title : _('Internet'),
appName : 'internet-detector',
@@ -43,6 +70,7 @@ return baseclass.extend({
if(!('internetDetectorState' in window)) {
window.internetDetectorState = 2;
};
if(window.currentAppMode === '1' && (
(window.internetDetectorState === 0 && window.internetDetectorCounter % window.uiCheckIntervalUp) ||
(window.internetDetectorState === 1 && window.internetDetectorCounter % window.uiCheckIntervalDown)
@@ -71,18 +99,15 @@ return baseclass.extend({
if(window.internetDetectorState === 0) {
internetStatus.textContent = _('Connected') + (this.publicIp ? ' | %s: %s'.format(_('Public IP'), _(this.publicIp)) : '');
internetStatus.style.background = '#2ea256';
internetStatus.style.color = '#fff';
internetStatus.className = "label id-connected";
}
else if(window.internetDetectorState === 1) {
internetStatus.textContent = _('Disconnected');
internetStatus.style.background = '#ff4e54';
internetStatus.style.color = '#fff';
internetStatus.className = "label id-disconnected";
}
else {
internetStatus.textContent = _('Undefined');
internetStatus.style.background = '#8a8a8a';
internetStatus.style.color = '#fff';
internetStatus.className = "label id-undefined";
};
return E('div', {