nidus-sync/html/template/sync/layout/authenticated.html

111 lines
3.7 KiB
HTML
Raw Normal View History

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>{{ template "title" . }} - Nidus Sync</title>
<link href="{{ bundlePathCSS }}" rel="stylesheet" />
<!-- Fontawesome Icons -->
<link rel="stylesheet" href="/static/vendor/css/bootstrap-icons.min.css" />
<link rel="icon" href="/static/ico/favicon-sync.ico" type="image/x-icon" />
<script src="/static/js/events.js"></script>
<script src="{{ bundlePathJS }}" defer></script>
{{ block "extraheader" . }}{{ end }}
2026-02-16 16:49:09 +00:00
<script>
const USER = {{ .User.AsJSON|json }};
SSEManager.subscribe("*", function (e) {
if (e.type != "heartbeat") {
updateUserState();
}
});
document.addEventListener("alpine:init", () => {
Alpine.store("user", USER);
})
function restoreLocalStorage() {
const expanded = localStorage.getItem("sidebar.expanded");
if (expanded == "false") {
document.getElementById("sidebar").classList.add("collapsed");
document.getElementById("content").classList.add("expanded");
} else {
document.getElementById("sidebar").classList.remove("collapsed");
document.getElementById("content").classList.remove("expanded");
localStorage.setItem("sidebar.expanded", "true");
}
}
function setTooltipsForSidebar() {
const sidebarTooltips = document.querySelectorAll(
'#sidebar [data-bs-toggle="tooltip"]',
);
const isExpanded = document
.getElementById("content")
.classList.contains("expanded");
sidebarTooltips.forEach((t) => {
const tooltip = bootstrap.Tooltip.getOrCreateInstance(t);
if (isExpanded) {
tooltip.enable();
} else {
tooltip.disable();
}
});
}
async function updateUserState() {
const response = await fetch("/api/user/self");
const data = await response.json();
// Update properties instead of replacing the whole store which leverages Alpine's reactivity
const store_user = Alpine.store("user");
Object.keys(data).forEach(key => {
store_user[key] = data[key];
});
}
2026-02-16 16:49:09 +00:00
document.addEventListener("DOMContentLoaded", function () {
var popoverTriggerList = [].slice.call(
document.querySelectorAll('[data-bs-toggle="popover"]'),
);
var popoverList = popoverTriggerList.map(function (popoverTriggerEl) {
return new bootstrap.Popover(popoverTriggerEl);
});
console.log("Initialized ", popoverTriggerList.length, " popovers");
var tooltipTriggerList = [].slice.call(
document.querySelectorAll('[data-bs-toggle="tooltip"]'),
);
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
let t = new bootstrap.Tooltip(tooltipTriggerEl);
return t;
});
console.log("Initialized ", tooltipTriggerList.length, " tooltips");
restoreLocalStorage();
setTooltipsForSidebar();
2026-02-16 16:49:09 +00:00
});
</script> {{ if not .Config.IsProductionEnvironment }}
<script src="/.flogo/injector.js"></script>
{{ end }}
</head>
<body>
{{ template "sync/component/icons.html" }}
<div class="d-flex">
{{ if .User }}
{{ template "sync/component/sidebar.html" . }}
{{ end }}
</div>
2026-02-07 18:26:47 +00:00
<div id="content">
{{ template "content" . }}
</div>
<div id="flogo"></div>
<script src="/static/vendor/js/bootstrap.bundle.min.js"></script>
<script>
document.getElementById("sidebarToggle").addEventListener("click", () => {
const sidebar = document.getElementById("sidebar");
sidebar.classList.toggle("collapsed");
document.getElementById("content").classList.toggle("expanded");
setTooltipsForSidebar();
localStorage.setItem(
"sidebar.expanded",
(!sidebar.classList.contains("collapsed")).toString(),
);
});
</script>
</body>
</html>