Mirrored_Repos/crafty-4
1
0
Fork 0
mirror of https://gitlab.com/crafty-controller/crafty-4.git synced 2024-08-30 18:23:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'dev' into bugfix/public-status-servers

Browse Source
This commit is contained in:
Zedifus 2023-09-02 13:47:34 +01:00
commit 8f5cb62c25
5 changed files with 266 additions and 243 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
CHANGELOG.md
View File

@ -3,7 +3,7 @@
### New features ### New features
TBD TBD
### Bug fixes ### Bug fixes
TBD - PWA: Removed the custom offline page in favour of browser default ([Merge Request](https://gitlab.com/crafty-controller/crafty-4/-/merge_requests/607))
### Tweaks ### Tweaks
TBD TBD
### Lang ### Lang

47
app/frontend/static/assets/js/shared/service-worker.js
View File

@ -1,6 +1,8 @@
// This is the "Offline page" service worker // This is the "Offline page" service worker
importScripts('https://storage.googleapis.com/workbox-cdn/releases/5.1.2/workbox-sw.js'); importScripts(
"https://storage.googleapis.com/workbox-cdn/releases/5.1.2/workbox-sw.js"
);
const CACHE = "crafty-controller"; const CACHE = "crafty-controller";
@ -13,34 +15,27 @@ self.addEventListener("message", (event) => {
} }
}); });
self.addEventListener('install', async (event) => {
event.waitUntil(
caches.open(CACHE)
.then((cache) => cache.add(offlineFallbackPage))
);
});
if (workbox.navigationPreload.isSupported()) { if (workbox.navigationPreload.isSupported()) {
workbox.navigationPreload.enable(); workbox.navigationPreload.enable();
} }
self.addEventListener('fetch', (event) => { // self.addEventListener('fetch', (event) => {
if (event.request.mode === 'navigate') { // if (event.request.mode === 'navigate') {
event.respondWith((async () => { // event.respondWith((async () => {
try { // try {
const preloadResp = await event.preloadResponse; // const preloadResp = await event.preloadResponse;
if (preloadResp) { // if (preloadResp) {
return preloadResp; // return preloadResp;
} // }
const networkResp = await fetch(event.request); // const networkResp = await fetch(event.request);
return networkResp; // return networkResp;
} catch (error) { // } catch (error) {
const cache = await caches.open(CACHE); // const cache = await caches.open(CACHE);
const cachedResp = await cache.match(offlineFallbackPage); // const cachedResp = await cache.match(offlineFallbackPage);
return cachedResp; // return cachedResp;
} // }
})()); // })());
} // }
}); // });

67
app/frontend/templates/panel/denied.html
View File

@ -1,33 +1,30 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<!-- Required meta tags --> <!-- Required meta tags -->
<meta charset="utf-8"> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<title>Crafty Controller</title> <title>Crafty Controller</title>
<!-- plugins:css --> <!-- plugins:css -->
<link rel="stylesheet" href="/static/assets/vendors/mdi/css/materialdesignicons.min.css"> <link rel="stylesheet" href="/static/assets/vendors/mdi/css/materialdesignicons.min.css" />
<link rel="stylesheet" href="/static/assets/vendors/flag-icon-css/css/flag-icon.min.css"> <link rel="stylesheet" href="/static/assets/vendors/flag-icon-css/css/flag-icon.min.css" />
<link rel="stylesheet" href="/static/assets/vendors/ti-icons/css/themify-icons.css"> <link rel="stylesheet" href="/static/assets/vendors/ti-icons/css/themify-icons.css" />
<link rel="stylesheet" href="/static/assets/vendors/typicons/typicons.css"> <link rel="stylesheet" href="/static/assets/vendors/typicons/typicons.css" />
<link rel="stylesheet" href="/static/assets/vendors/css/vendor.bundle.base.css"> <link rel="stylesheet" href="/static/assets/vendors/css/vendor.bundle.base.css" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="mobile-web-app-capable" content="yes" /> <meta name="mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="apple-mobile-web-app-title" content="Crafty"> <meta name="apple-mobile-web-app-title" content="Crafty" />
<link rel="apple-touch-icon" href="../static/assets/images/Crafty_4-0.png"> <link rel="apple-touch-icon" href="../static/assets/images/Crafty_4-0.png" />
<!-- endinject --> <!-- endinject -->
<!-- Plugin css for this page --> <!-- Plugin css for this page -->
<!-- End Plugin css for this page --> <!-- End Plugin css for this page -->
<!-- Layout styles --> <!-- Layout styles -->
<link rel="stylesheet" href="/static/assets/css/dark/style.css"> <link rel="stylesheet" href="/static/assets/css/dark/style.css" />
<!-- End Layout styles --> <!-- End Layout styles -->
<link rel="shortcut icon" type="image/svg+xml" href="/static/assets/images/logo_small.svg"> <link rel="shortcut icon" type="image/svg+xml" href="/static/assets/images/logo_small.svg" />
<link rel="alternate icon" href="/static/assets/images/favicon.png" /> <link rel="alternate icon" href="/static/assets/images/favicon.png" />
</head> </head>
<style> <style>
@ -44,30 +41,28 @@
<div class="content-wrapper d-flex align-items-center auth auth-bg-1 theme-one" > <div class="content-wrapper d-flex align-items-center auth auth-bg-1 theme-one" >
<div class="row w-100"> <div class="row w-100">
<div class="col-lg-4 mx-auto"> <div class="col-lg-4 mx-auto">
<div class="auto-form-wrapper"> <div class="auto-form-wrapper">
<div class="text-center"> <div class="text-center">
<img src="/static/assets/images/logo_long.svg"><br /><br /> <img alt="Crafty Logo" src="/static/assets/images/logo_long.svg" /><br /><br />
<div class="col-sm-12 grid-margin stretch-card"> <div class="col-sm-12 grid-margin stretch-card">
<div class="card card-statistics social-card google-card card-colored" > <div class="card card-statistics social-card google-card card-colored" >
<div class="card-body"> <div class="card-body">
<h4 class="platform-name mb-3 mt-4 font-weight-semibold user-name">{{ translate('accessDenied', <h4 class="platform-name mb-3 mt-4 font-weight-semibold user-name" >
'accessDenied', data['lang']) }}</h4> {{ translate('accessDenied', 'accessDenied', data['lang']) }}
<h5 class="headline font-weight-medium">{{ translate('accessDenied', 'noAccess', data['lang']) }} </h4>
<h5 class="headline font-weight-medium">
{{ translate('accessDenied', 'noAccess', data['lang']) }}
</h5> </h5>
<p class="mb-2 comment font-weight-light"> <p class="mb-2 comment font-weight-light">
{{ translate('accessDenied', 'contactAdmin', data['lang']) }}<br /><br /> {{ translate('accessDenied', 'contactAdmin',
<a class="d-inline font-weight-medium" href="https://discord.gg/9VJPhCE"> {{ data['lang']) }}<br /><br />
translate('accessDenied', 'contact', data['lang']) }}</a> <a class="d-inline font-weight-medium" href="https://discord.gg/9VJPhCE" > {{ translate('accessDenied', 'contact', data['lang']) }}</a>
</p> </p>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
@ -88,19 +83,21 @@
<!-- endinject --> <!-- endinject -->
<script> <script>
$(document).ready(function () { $(document).ready(function () {
let login_opacity_div = document.getElementById('login_opacity'); let login_opacity_div = document.getElementById("login_opacity");
let opacity = login_opacity_div.getAttribute('data-value'); let opacity = login_opacity_div.getAttribute("data-value");
document.getElementById('login-form-background').style.background = 'rgb(34, 36, 55, ' + (opacity / 100) + ')'; document.getElementById("login-form-background").style.background =
"rgb(34, 36, 55, " + opacity / 100 + ")";
//Register Service worker for mobile app //Register Service worker for mobile app
if ('serviceWorker' in navigator) { if ("serviceWorker" in navigator) {
navigator.serviceWorker.register('/static/assets/js/shared/service-worker.js', {scope: '/'}) navigator.serviceWorker
.register("/static/assets/js/shared/service-worker.js", {
scope: "/",
})
.then(function (registration) { .then(function (registration) {
console.error('Service Worker Registered'); console.log("Service Worker Registered");
}); });
} }
}); });
</script> </script>
</body> </body>
</html> </html>

2
app/frontend/templates/public/login.html
View File

@ -156,7 +156,7 @@
if ('serviceWorker' in navigator) { if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('/static/assets/js/shared/service-worker.js', {scope: '/'}) navigator.serviceWorker.register('/static/assets/js/shared/service-worker.js', {scope: '/'})
.then(function (registration) { .then(function (registration) {
console.error('Service Worker Registered'); console.log('Service Worker Registered');
}); });
} }
}); });

131
app/frontend/templates/public_base.html
View File

@ -1,45 +1,71 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="{{ data['lang_page'] }}" class="default"> <html lang="{{ data['lang_page'] }}" class="default">
<head> <head>
<!-- Required meta tags --> <!-- Required meta tags -->
<meta charset="utf-8"> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta
name="viewport"
content="width=device-width, initial-scale=1, shrink-to-fit=no"
/>
{% block meta %}{% end %} {% block meta %}{% end %}
<title>{% block title %}{{ _('Default') }}{% end %}</title> <title>{% block title %}{{ _('Default') }}{% end %}</title>
<!-- plugins:css --> <!-- plugins:css -->
<link rel="stylesheet" href="/static/assets/vendors/mdi/css/materialdesignicons.min.css"> <link
<link rel="stylesheet" href="/static/assets/vendors/flag-icon-css/css/flag-icon.min.css"> rel="stylesheet"
<link rel="stylesheet" href="/static/assets/vendors/ti-icons/css/themify-icons.css"> href="/static/assets/vendors/mdi/css/materialdesignicons.min.css"
<link rel="stylesheet" href="/static/assets/vendors/typicons/typicons.css"> />
<link rel="stylesheet" href="/static/assets/vendors/css/vendor.bundle.base.css"> <link
<link rel="stylesheet" href="/static/assets/vendors/fontawesome6/css/all.css"> rel="stylesheet"
<link rel="manifest" href="/static/assets/crafty.webmanifest"> href="/static/assets/vendors/flag-icon-css/css/flag-icon.min.css"
/>
<link
rel="stylesheet"
href="/static/assets/vendors/ti-icons/css/themify-icons.css"
/>
<link
rel="stylesheet"
href="/static/assets/vendors/typicons/typicons.css"
/>
<link
rel="stylesheet"
href="/static/assets/vendors/css/vendor.bundle.base.css"
/>
<link
rel="stylesheet"
href="/static/assets/vendors/fontawesome6/css/all.css"
/>
<link rel="manifest" href="/static/assets/crafty.webmanifest" />
<meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="mobile-web-app-capable" content="yes" /> <meta name="mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="apple-mobile-web-app-title" content="Crafty"> <meta name="apple-mobile-web-app-title" content="Crafty" />
<link rel="apple-touch-icon" href="../static/assets/images/Crafty_4-0.png"> <link
rel="apple-touch-icon"
href="../static/assets/images/Crafty_4-0.png"
/>
<!-- endinject --> <!-- endinject -->
<!-- Plugin css for this page --> <!-- Plugin css for this page -->
<!-- End Plugin css for this page --> <!-- End Plugin css for this page -->
<!-- Layout styles --> <!-- Layout styles -->
<link rel="stylesheet" href="/static/assets/css/dark/style.css"> <link rel="stylesheet" href="/static/assets/css/dark/style.css" />
<!-- End Layout styles --> <!-- End Layout styles -->
<link rel="shortcut icon" type="image/svg+xml" href="/static/assets/images/logo_small.svg"> <link
rel="shortcut icon"
type="image/svg+xml"
href="/static/assets/images/logo_small.svg"
/>
<link rel="alternate icon" href="/static/assets/images/favicon.png" /> <link rel="alternate icon" href="/static/assets/images/favicon.png" />
</head> </head>
<body> <body>
<div class="container-scroller"> <div class="container-scroller">
<div class="container-fluid page-body-wrapper full-page-wrapper"> <div class="container-fluid page-body-wrapper full-page-wrapper">
<div class="content-wrapper d-flex align-items-sm-center auth auth-bg-1 theme-one"> <div
class="content-wrapper d-flex align-items-sm-center auth auth-bg-1 theme-one"
>
<div class="mx-auto"> <div class="mx-auto">
<div class="auto-form-wrapper"> <div class="auto-form-wrapper">{% block content %} {% end %}</div>
{% block content %}
{% end %}
</div>
</div> </div>
</div> </div>
<!-- content-wrapper ends --> <!-- content-wrapper ends -->
@ -56,81 +82,86 @@
<script src="/static/assets/js/shared/misc.js"></script> <script src="/static/assets/js/shared/misc.js"></script>
<!-- endinject --> <!-- endinject -->
<script> <script>
// {% if request.protocol == 'https' %} // {% if request.protocol == 'https' %}
let usingWebSockets = true; let usingWebSockets = true;
let listenEvents = []; let listenEvents = [];
let pageQueryParams, page;
try { try {
pageQueryParams = 'page_query_params=' + encodeURIComponent(location.search) pageQueryParams =
page = 'page=' + encodeURIComponent(location.pathname) "page_query_params=" + encodeURIComponent(location.search);
var wsInternal = new WebSocket('wss://' + location.host + '/ws?' + page + '&' + pageQueryParams); page = "page=" + encodeURIComponent(location.pathname);
var wsInternal = new WebSocket(
"wss://" + location.host + "/ws?" + page + "&" + pageQueryParams
);
wsInternal.onopen = function () { wsInternal.onopen = function () {
console.log('opened WebSocket connection:', wsInternal) console.log("opened WebSocket connection:", wsInternal);
}; };
wsInternal.onmessage = function (rawMessage) { wsInternal.onmessage = function (rawMessage) {
var message = JSON.parse(rawMessage.data); var message = JSON.parse(rawMessage.data);
console.log('got message: ', message) console.log("got message: ", message);
listenEvents listenEvents
.filter(listenedEvent => listenedEvent.event == message.event) .filter((listenedEvent) => listenedEvent.event == message.event)
.forEach(listenedEvent => listenedEvent.callback(message.data)) .forEach((listenedEvent) => listenedEvent.callback(message.data));
}; };
wsInternal.onerror = function (errorEvent) { wsInternal.onerror = function (errorEvent) {
console.error('WebSocket Error', errorEvent); console.error("WebSocket Error", errorEvent);
}; };
wsInternal.onclose = function (closeEvent) { wsInternal.onclose = function (closeEvent) {
console.log('Closed WebSocket', closeEvent); console.log("Closed WebSocket", closeEvent);
}; };
webSocket = { webSocket = {
on: function (event, callback) { on: function (event, callback) {
console.log('registered ' + event + ' event'); console.log("registered " + event + " event");
listenEvents.push({ event: event, callback: callback }) listenEvents.push({ event: event, callback: callback });
}, },
emit: function (event, data) { emit: function (event, data) {
var message = { var message = {
event: event, event: event,
data: data data: data,
} };
wsInternal.send(JSON.stringify(message)); wsInternal.send(JSON.stringify(message));
} },
} };
} catch (error) { } catch (error) {
console.error('Error while making websocket helpers', error); console.error("Error while making websocket helpers", error);
usingWebSockets = false; usingWebSockets = false;
} }
// {% else %} // {% else %}
usingWebSockets = false; usingWebSockets = false;
warn('WebSockets are not supported in Crafty if not using the https protocol') warn(
"WebSockets are not supported in Crafty if not using the https protocol"
);
var webSocket; var webSocket;
// {% end%} // {% end%}
</script> </script>
{% block js %} {% block js %}
<!-- Custom js for this page --> <!-- Custom js for this page -->
<script> <script>
$(document).ready(function () { $(document).ready(function () {
let login_opacity_div = document.getElementById('login_opacity'); let login_opacity_div = document.getElementById("login_opacity");
let opacity = login_opacity_div.getAttribute('data-value'); let opacity = login_opacity_div.getAttribute("data-value");
document.getElementById('login-form-background').style.background = 'rgb(34, 36, 55, ' + (opacity / 100) + ')'; document.getElementById("login-form-background").style.background =
"rgb(34, 36, 55, " + opacity / 100 + ")";
//Register Service worker for mobile app //Register Service worker for mobile app
if ('serviceWorker' in navigator) { if ("serviceWorker" in navigator) {
navigator.serviceWorker.register('/static/assets/js/shared/service-worker.js', {scope: '/'}) navigator.serviceWorker
.register("/static/assets/js/shared/service-worker.js", {
scope: "/",
})
.then(function (registration) { .then(function (registration) {
console.error('Service Worker Registered'); console.log("Service Worker Registered");
}); });
} }
}); });
</script> </script>
<!-- End custom js for this page --> <!-- End custom js for this page -->
{% end %} {% end %}
</body> </body>
</html> </html>