Files
python-tdd/src/templates/core/base.html

179 lines
7.5 KiB
HTML
Raw Normal View History

{% load compress %}
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="author" content="Disco DeDisco">
<meta name="robots" content="noindex, nofollow">
<title>Earthman RPG | {% block title_text %}{% endblock title_text %}</title>
{% compress css %}
<link type="text/x-scss" rel="stylesheet" href="{% static 'scss/core.scss' %}">
{% endcompress %}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css">
</head>
<body class="{{ user_palette }} {{ page_class|default:'' }}">
<div class="container">
{% include "core/_partials/_navbar.html" %}
<div class="row">
<div class="col-lg-6">
<h2 >{% block header_text %}{% endblock header_text %}</h2>
{% block extra_header %}
{% endblock extra_header %}
</div>
</div>
{% if messages %}
<div class="row">
<div class="col-md-12">
{% for message in messages %}
{% if message.level_tag == 'success' %}
<div class="alert alert-success">{{ message }}</div>
{% else %}
<div class="alert alert-warning">{{ message }}</div>
{% endif %}
{% endfor %}
</div>
</div>
{% endif %}
{% block content %}
{% endblock content %}
</div>
{% include "core/_partials/_footer.html" %}
{% if user.is_authenticated %}
<button id="id_kit_btn" data-kit-url="{% url 'kit_bag' %}" aria-label="Open Kit Bag">
<i class="fa-solid fa-briefcase"></i>
</button>
{% endif %}
<dialog id="id_kit_bag_dialog"></dialog>
<div id="id_guard_portal">
<span class="guard-message"></span>
<div class="guard-actions">
<button class="btn btn-confirm guard-yes" type="button">OK</button>
<button class="btn btn-cancel guard-no" type="button">NVM</button>
</div>
</div>
{% block scripts %}
{% endblock scripts %}
<script>
(function () {
var portal = null;
var _cb = null;
var _onDismiss = null;
function show(anchor, message, callback, onDismiss, options) {
if (!portal) return;
options = options || {};
_cb = callback;
_onDismiss = onDismiss || null;
portal.querySelector('.guard-message').innerHTML = message;
portal.classList.add('active');
var rect = anchor.getBoundingClientRect();
var pw = portal.offsetWidth;
var rawLeft = rect.left + rect.width / 2;
var cleft = Math.max(pw / 2 + 8, Math.min(rawLeft, window.innerWidth - pw / 2 - 8));
portal.style.left = Math.round(cleft) + 'px';
var cardCenterY = rect.top + rect.height / 2;
// Default: upper half → below (avoids viewport top edge for navbar/fixed buttons).
// invertY: upper half → above (for modal grids where tooltip should fly away from centre).
var showBelow = (cardCenterY < window.innerHeight / 2);
if (options.invertY) showBelow = !showBelow;
if (showBelow) {
portal.style.top = Math.round(rect.bottom) + 'px';
portal.style.transform = 'translate(-50%, 0.5rem)';
} else {
portal.style.top = Math.round(rect.top) + 'px';
portal.style.transform = 'translate(-50%, calc(-100% - 0.5rem))';
}
}
function dismiss() {
if (!portal) return;
var od = _onDismiss;
portal.classList.remove('active');
_cb = null;
_onDismiss = null;
if (od) od();
}
function doConfirm() {
var cb = _cb;
portal.classList.remove('active');
_cb = null;
_onDismiss = null;
if (cb) cb();
}
document.addEventListener('DOMContentLoaded', function () {
portal = document.getElementById('id_guard_portal');
if (!portal) return;
portal.querySelector('.guard-yes').addEventListener('click', doConfirm);
portal.querySelector('.guard-no').addEventListener('click', dismiss);
document.addEventListener('keydown', function (e) {
if (e.key === 'Escape') dismiss();
});
// Outside-click to dismiss — capture phase + stopPropagation
// prevents the click from cascading to backdrop listeners (e.g. closeFan)
document.addEventListener('click', function (e) {
if (!portal.classList.contains('active')) return;
if (portal.contains(e.target)) return;
// If clicking a card, let the event through so the card's
// own handler immediately opens the guard on the new target.
// For any other outside click, stop propagation to prevent
// the backdrop from also closing the fan.
if (!e.target.closest('.card')) e.stopPropagation();
dismiss();
}, true);
// Intercept [data-confirm] buttons (capture phase, before form submits)
document.addEventListener('click', function (e) {
var btn = e.target.closest('[data-confirm]');
if (!btn) return;
e.preventDefault();
e.stopImmediatePropagation();
var form = btn.closest('form');
show(btn, btn.dataset.confirm, function () {
if (form) form.submit();
else if (btn.dataset.href) window.location.href = btn.dataset.href;
});
}, true);
});
window.showGuard = show;
}());
</script>
<script src="{% static "vendor/htmx.min.js" %}"></script>
<script src="{% static "apps/applets/applets.js" %}"></script>
<script src="{% static "apps/dashboard/game-kit.js" %}"></script>
<script>
document.cookie = 'user_tz=' + Intl.DateTimeFormat().resolvedOptions().timeZone + '; path=/; SameSite=Lax';
document.body.addEventListener('htmx:configRequest', function(evt) {
evt.detail.headers['X-CSRFToken'] = getCookie('csrftoken');
});
function getCookie(name) {
let val = null;
if (document.cookie) {
for (let c of document.cookie.split(';')) {
c = c.trim();
if (c.startsWith(name + '=')) {
val = decodeURIComponent(c.substring(name.length + 1));
break;
}
}
}
return val;
}
</script>
</body>
</html>