749 lines
27 KiB
HTML
749 lines
27 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ru">
|
|
<head>
|
|
<script>
|
|
(function () {
|
|
try {
|
|
var t = (localStorage.getItem("theme") || "").trim().toLowerCase();
|
|
document.documentElement.setAttribute("data-theme", t === "light" ? "light" : "dark");
|
|
} catch (e) {}
|
|
})();
|
|
</script>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
|
<title>Дублер выбора рецепта</title>
|
|
<link rel="stylesheet" href="/static/css/inter-fonts.css">
|
|
<link href="/static/css/wesp-recipes-skeleton.css" rel="stylesheet">
|
|
<link href="/static/css/wesp-kiosk-skeleton.css" rel="stylesheet">
|
|
<script type="module" src="/static/js/modules/kiosk/kiosk-skeleton.js"></script>
|
|
<style>
|
|
:root {
|
|
--primary: #2563eb;
|
|
--primary-hover: #1d4ed8;
|
|
--primary-light: #3b82f6;
|
|
--success: #10b981;
|
|
--danger: #ef4444;
|
|
--warning: #f59e0b;
|
|
--gray-50: #f9fafb;
|
|
--gray-100: #f3f4f6;
|
|
--gray-200: #e5e7eb;
|
|
--gray-600: #4b5563;
|
|
--gray-900: #111827;
|
|
--white: #ffffff;
|
|
--border: var(--gray-200);
|
|
--dup-pad-x: clamp(12px, 3.5vw, 24px);
|
|
--dup-pad-y: clamp(12px, 2.5vmin, 20px);
|
|
}
|
|
|
|
html {
|
|
font-size: clamp(14px, 2vmin, 18px);
|
|
}
|
|
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
body {
|
|
font-family: 'Inter', system-ui, sans-serif;
|
|
min-height: 100vh;
|
|
background: var(--gray-50);
|
|
color: var(--gray-900);
|
|
line-height: 1.5;
|
|
padding-bottom: 56px;
|
|
}
|
|
|
|
/* Карточки в духе db_check */
|
|
.card {
|
|
background: var(--white);
|
|
border-radius: 8px;
|
|
border: 1px solid var(--border);
|
|
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
|
|
}
|
|
|
|
.dup-page {
|
|
display: flex;
|
|
flex-direction: column;
|
|
min-height: 100vh;
|
|
max-width: min(960px, 100%);
|
|
margin: 0 auto;
|
|
padding: var(--dup-pad-y) var(--dup-pad-x);
|
|
width: 100%;
|
|
}
|
|
|
|
.dup-header {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: flex-start;
|
|
justify-content: space-between;
|
|
gap: 12px;
|
|
margin-bottom: clamp(8px, 2vmin, 16px);
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.dup-header-main {
|
|
flex: 1;
|
|
min-width: 0;
|
|
}
|
|
|
|
.recipe-info-section {
|
|
padding: clamp(10px, 2.5vmin, 16px) clamp(12px, 3vw, 20px);
|
|
text-align: left;
|
|
}
|
|
|
|
.recipe-info-section h3 {
|
|
font-size: clamp(1rem, 2.8vmin, 1.35rem);
|
|
font-weight: 600;
|
|
color: var(--gray-900);
|
|
margin-bottom: 4px;
|
|
}
|
|
|
|
.recipe-info-section p {
|
|
font-size: clamp(0.8rem, 2vmin, 0.95rem);
|
|
color: var(--gray-600);
|
|
margin: 0;
|
|
}
|
|
|
|
.connection-status {
|
|
flex-shrink: 0;
|
|
padding: 6px 12px;
|
|
border-radius: 9999px;
|
|
font-size: clamp(0.75rem, 1.8vmin, 0.875rem);
|
|
font-weight: 500;
|
|
align-self: center;
|
|
background: var(--gray-200);
|
|
color: var(--gray-900);
|
|
}
|
|
|
|
.connection-status.connected {
|
|
background: var(--success);
|
|
color: var(--white);
|
|
}
|
|
|
|
.connection-status.disconnected {
|
|
background: var(--danger);
|
|
color: var(--white);
|
|
}
|
|
|
|
.dup-main {
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: clamp(8px, 2vmin, 14px);
|
|
min-height: 0;
|
|
}
|
|
|
|
.next-component-info {
|
|
padding: clamp(10px, 2.5vmin, 16px) clamp(12px, 3vw, 18px);
|
|
text-align: center;
|
|
border-left: 4px solid var(--primary);
|
|
}
|
|
|
|
.next-component-info h4 {
|
|
font-size: clamp(0.8rem, 2vmin, 0.95rem);
|
|
font-weight: 600;
|
|
color: var(--gray-600);
|
|
margin-bottom: 6px;
|
|
}
|
|
|
|
.next-component-name {
|
|
font-size: clamp(1rem, 3.2vmin, 1.35rem);
|
|
font-weight: 700;
|
|
color: var(--primary);
|
|
}
|
|
|
|
.last-component-badge {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
background: #fff7ed;
|
|
color: #9a3412;
|
|
border: 1px solid #fdba74;
|
|
border-radius: 9999px;
|
|
padding: 6px 12px;
|
|
font-size: clamp(0.75rem, 1.8vmin, 0.875rem);
|
|
font-weight: 600;
|
|
margin: 8px auto 0 auto;
|
|
}
|
|
|
|
.weight-section {
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
min-height: clamp(200px, 38vh, 520px);
|
|
padding: clamp(12px, 3vmin, 24px);
|
|
}
|
|
|
|
.weight-section.center-weight {
|
|
justify-content: center;
|
|
min-height: clamp(240px, 42vh, 560px);
|
|
}
|
|
|
|
.weight-section.center-weight .weight-content {
|
|
justify-content: center;
|
|
}
|
|
|
|
.weight-content {
|
|
text-align: center;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 100%;
|
|
flex: 1 1 auto;
|
|
min-height: clamp(12rem, 32vh, 24rem);
|
|
overflow: visible;
|
|
}
|
|
|
|
.component-name {
|
|
font-size: clamp(1.35rem, 5.5vmin, 3.25rem);
|
|
font-weight: 700;
|
|
color: var(--gray-900);
|
|
margin-bottom: clamp(4px, 1.5vmin, 12px);
|
|
line-height: 1.15;
|
|
max-width: 100%;
|
|
word-wrap: break-word;
|
|
}
|
|
|
|
.weight-display {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: baseline;
|
|
width: 100%;
|
|
margin: clamp(8px, 2vmin, 20px) 0;
|
|
flex: 0 0 auto;
|
|
min-height: min-content;
|
|
}
|
|
|
|
.weight-section.center-weight .weight-display {
|
|
flex: 0 0 auto;
|
|
}
|
|
|
|
.remaining-weight {
|
|
font-size: clamp(2.75rem, 14vmin, 9rem);
|
|
font-weight: 700;
|
|
color: var(--primary);
|
|
margin: 0;
|
|
line-height: 1;
|
|
letter-spacing: -0.02em;
|
|
flex-shrink: 0;
|
|
min-width: 0;
|
|
}
|
|
|
|
.remaining-weight.negative {
|
|
color: var(--danger);
|
|
}
|
|
|
|
.weight-unit {
|
|
font-size: clamp(1.25rem, 5vmin, 3rem);
|
|
font-weight: 500;
|
|
margin-left: 0.15em;
|
|
}
|
|
|
|
.weight-info {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 12px;
|
|
margin: 0;
|
|
font-size: clamp(0.9rem, 2.2vmin, 1.15rem);
|
|
width: 100%;
|
|
max-width: 28rem;
|
|
}
|
|
|
|
.weight-info > div {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
padding: 8px 0;
|
|
}
|
|
|
|
.weight-info span:first-child {
|
|
color: var(--gray-600);
|
|
font-weight: 500;
|
|
}
|
|
|
|
.weight-info span:last-child {
|
|
color: var(--gray-900);
|
|
font-weight: 600;
|
|
}
|
|
|
|
.btn {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: clamp(10px, 2vmin, 14px) clamp(14px, 3vmin, 22px);
|
|
border: none;
|
|
border-radius: 8px;
|
|
font-size: clamp(0.95rem, 2.6vmin, 1.2rem);
|
|
font-weight: 600;
|
|
cursor: pointer;
|
|
text-decoration: none;
|
|
transition: background 0.2s, transform 0.15s, box-shadow 0.2s;
|
|
min-height: clamp(48px, 8vmin, 72px);
|
|
}
|
|
|
|
.btn:hover {
|
|
transform: translateY(-1px);
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
|
|
}
|
|
|
|
.btn-primary {
|
|
background: var(--primary);
|
|
color: var(--white);
|
|
}
|
|
|
|
.btn-primary:hover {
|
|
background: var(--primary-hover);
|
|
}
|
|
|
|
.btn-secondary {
|
|
background: var(--gray-600);
|
|
color: var(--white);
|
|
}
|
|
|
|
.prev-btn {
|
|
background: var(--gray-600);
|
|
color: var(--white);
|
|
}
|
|
|
|
.prev-btn:hover {
|
|
background: #374151;
|
|
}
|
|
|
|
.next-btn {
|
|
background: var(--primary);
|
|
color: var(--white);
|
|
}
|
|
|
|
.next-btn:hover {
|
|
background: var(--primary-hover);
|
|
}
|
|
|
|
.dup-footer {
|
|
flex-shrink: 0;
|
|
margin-top: clamp(10px, 2.5vmin, 18px);
|
|
padding-top: 4px;
|
|
}
|
|
|
|
.nav-buttons-overlay {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
gap: clamp(8px, 2vmin, 14px);
|
|
width: 100%;
|
|
}
|
|
|
|
.nav-btn {
|
|
width: 100%;
|
|
min-width: 0;
|
|
}
|
|
|
|
/* Тумблер темы — слева снизу, чтобы не перекрывать «Следующий» справа */
|
|
#wespThemeToggleWrap {
|
|
top: auto !important;
|
|
left: 16px !important;
|
|
right: auto !important;
|
|
bottom: 16px !important;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
#wespThemeToggleWrap {
|
|
left: 12px !important;
|
|
bottom: 12px !important;
|
|
}
|
|
}
|
|
|
|
html[data-theme="light"] body {
|
|
background: #f9fafb !important;
|
|
color: #111827 !important;
|
|
}
|
|
|
|
html[data-theme="light"] .recipe-info-section,
|
|
html[data-theme="light"] .weight-section,
|
|
html[data-theme="light"] .next-component-info {
|
|
background: #ffffff !important;
|
|
color: #111827 !important;
|
|
border-color: #e5e7eb !important;
|
|
}
|
|
|
|
html[data-theme="light"] .recipe-info-section h3,
|
|
html[data-theme="light"] .component-name {
|
|
color: #111827 !important;
|
|
}
|
|
|
|
html[data-theme="light"] .recipe-info-section p,
|
|
html[data-theme="light"] .next-component-info h4 {
|
|
color: #4b5563 !important;
|
|
}
|
|
|
|
html[data-theme="light"] .remaining-weight {
|
|
color: #111827 !important;
|
|
}
|
|
|
|
html[data-theme="light"] .remaining-weight.negative {
|
|
color: #dc2626 !important;
|
|
}
|
|
|
|
html[data-theme="light"] .next-component-info {
|
|
border-left-color: #2563eb !important;
|
|
}
|
|
|
|
html[data-theme="dark"] .recipe-info-section,
|
|
html[data-theme="dark"] .weight-section,
|
|
html[data-theme="dark"] .next-component-info {
|
|
background: #242424 !important;
|
|
color: #f0f0f0 !important;
|
|
border-color: #3a3a3a !important;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35) !important;
|
|
}
|
|
|
|
html[data-theme="dark"] .recipe-info-section h3,
|
|
html[data-theme="dark"] .component-name {
|
|
color: #f5f5f5 !important;
|
|
}
|
|
|
|
html[data-theme="dark"] .recipe-info-section p,
|
|
html[data-theme="dark"] .next-component-info h4 {
|
|
color: #bdbdbd !important;
|
|
}
|
|
|
|
html[data-theme="dark"] .remaining-weight {
|
|
color: #f5f5f5 !important;
|
|
}
|
|
|
|
html[data-theme="dark"] .remaining-weight.negative {
|
|
color: #fca5a5 !important;
|
|
}
|
|
|
|
html[data-theme="dark"] .nav-btn {
|
|
color: #fff !important;
|
|
}
|
|
|
|
html[data-theme="dark"] .last-component-badge {
|
|
background: #3f2e1a !important;
|
|
color: #fdba74 !important;
|
|
border-color: #92400e !important;
|
|
}
|
|
|
|
html[data-theme="dark"] .connection-status:not(.connected):not(.disconnected) {
|
|
background: #3a3a3a !important;
|
|
color: #e5e7eb !important;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="dup-page">
|
|
<header class="dup-header">
|
|
<div class="dup-header-main">
|
|
<div class="recipe-info-section card" id="recipeInfo" style="display: none;">
|
|
<h3>Рецепт: <span id="recipeName"></span></h3>
|
|
<p>Компонент <span id="currentIndex">0</span> из <span id="totalComponents">0</span></p>
|
|
</div>
|
|
</div>
|
|
<div class="connection-status" id="connectionStatus">Подключение...</div>
|
|
</header>
|
|
|
|
<main class="dup-main">
|
|
<div class="next-component-info card" id="nextComponentInfo" style="display: none;">
|
|
<h4>Следующий компонент:</h4>
|
|
<div class="next-component-name" id="nextComponentName">-</div>
|
|
<div id="lastComponentBadge" class="last-component-badge" style="display: none;">Последний компонент</div>
|
|
</div>
|
|
|
|
<div class="weight-section card">
|
|
<div class="weight-content">
|
|
<div class="component-name" id="componentName">Ожидание компонента...</div>
|
|
|
|
<div class="weight-display">
|
|
<div class="remaining-weight" id="remainingWeight">0<span class="weight-unit">кг</span></div>
|
|
</div>
|
|
|
|
<div class="weight-info">
|
|
<div style="display: none;"><span>Загружено:</span> <span id="currentLoaded">0.0</span> кг</div>
|
|
<div style="display: none;"><span>Всего:</span> <span id="totalComponent">0.0</span> кг</div>
|
|
<div style="display: none;"><span>Общий в миксере:</span> <span id="totalMixtureWeight">0.0</span> кг</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<footer class="dup-footer">
|
|
<div class="nav-buttons-overlay" id="navButtonsOverlay" style="display: none;">
|
|
<button type="button" class="nav-btn prev-btn btn" id="prevBtnOverlay">Предыдущий</button>
|
|
<button type="button" class="nav-btn next-btn btn" id="nextBtnOverlay">Следующий</button>
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
|
|
<script>
|
|
let kioskPaired = false;
|
|
let kioskStarted = false;
|
|
let duplicateInitialLoadDone = false;
|
|
let updateInterval = null;
|
|
let connectionRetries = 0;
|
|
const maxRetries = 5;
|
|
const POLL_MS = 50;
|
|
|
|
function roundToStep5(value) {
|
|
return Math.round(value / 5) * 5;
|
|
}
|
|
|
|
let unloadingSound = null;
|
|
let unloadingSoundPlaying = false;
|
|
let unloadingSoundReason = null;
|
|
let unloadingSoundNeedsGesture = false;
|
|
|
|
function startUnloadingSoundLoop(reason) {
|
|
unloadingSoundReason = reason || unloadingSoundReason || 'weight';
|
|
if (unloadingSoundPlaying) return;
|
|
if (!unloadingSound) {
|
|
unloadingSound = new Audio('/sounds/unloading.mp3');
|
|
unloadingSound.loop = true;
|
|
}
|
|
unloadingSound.play()
|
|
.then(() => {
|
|
unloadingSoundPlaying = true;
|
|
unloadingSoundNeedsGesture = false;
|
|
})
|
|
.catch(e => {
|
|
unloadingSoundNeedsGesture = true;
|
|
console.warn('ДУБЛЕР: Unloading sound play failed:', e);
|
|
});
|
|
}
|
|
|
|
function stopUnloadingSoundLoop() {
|
|
if (!unloadingSound) return;
|
|
unloadingSound.pause();
|
|
unloadingSound.currentTime = 0;
|
|
unloadingSoundPlaying = false;
|
|
unloadingSoundReason = null;
|
|
}
|
|
|
|
document.addEventListener('click', () => {
|
|
if (unloadingSoundNeedsGesture && unloadingSoundReason === 'weight') {
|
|
startUnloadingSoundLoop('weight');
|
|
}
|
|
}, { passive: true });
|
|
|
|
function updateConnectionStatus(connected) {
|
|
const status = document.getElementById('connectionStatus');
|
|
if (connected) {
|
|
status.textContent = 'Подключено';
|
|
status.className = 'connection-status connected';
|
|
connectionRetries = 0;
|
|
} else {
|
|
status.textContent = 'Соединение потеряно';
|
|
status.className = 'connection-status disconnected';
|
|
}
|
|
}
|
|
|
|
function updateWeightDisplay() {
|
|
if (!kioskPaired) return;
|
|
fetch('/api/weight_display_data')
|
|
.then(response => {
|
|
if (!response.ok) {
|
|
throw new Error(`HTTP ${response.status}`);
|
|
}
|
|
return response.json();
|
|
})
|
|
.then(data => {
|
|
console.log('ДУБЛЕР: Получены данные:', data);
|
|
updateConnectionStatus(true);
|
|
|
|
if (!duplicateInitialLoadDone && window.WespKioskSkeleton) {
|
|
window.WespKioskSkeleton.clearDuplicatePanelSkeleton(
|
|
document.getElementById('recipeInfo'),
|
|
document.querySelector('.weight-section')
|
|
);
|
|
duplicateInitialLoadDone = true;
|
|
}
|
|
|
|
document.getElementById('componentName').textContent = data.component_name;
|
|
|
|
const nextComponentInfo = document.getElementById('nextComponentInfo');
|
|
const nextComponentName = document.getElementById('nextComponentName');
|
|
const lastBadge = document.getElementById('lastComponentBadge');
|
|
const hasNext = !!(data && data.next_component_name && data.status === 'active');
|
|
const isLast = !!(data && data.status === 'active' && typeof data.current_index === 'number' && typeof data.total_components === 'number' && data.total_components > 0 && (data.current_index === data.total_components - 1));
|
|
|
|
if (hasNext) {
|
|
nextComponentName.textContent = data.next_component_name;
|
|
nextComponentInfo.style.display = 'block';
|
|
if (lastBadge) lastBadge.style.display = 'none';
|
|
} else if (isLast) {
|
|
nextComponentName.textContent = '-';
|
|
nextComponentInfo.style.display = 'block';
|
|
if (lastBadge) lastBadge.style.display = 'inline-flex';
|
|
} else {
|
|
nextComponentInfo.style.display = 'none';
|
|
if (lastBadge) lastBadge.style.display = 'none';
|
|
}
|
|
|
|
const weightSectionEl = document.querySelector('.weight-section');
|
|
if (data.status === 'no_recipe') {
|
|
stopUnloadingSoundLoop();
|
|
const remainingEl = document.getElementById('remainingWeight');
|
|
remainingEl.innerHTML = `${data.total_mixture != null ? data.total_mixture : '0'}<span class="weight-unit"> кг</span>`;
|
|
remainingEl.className = 'remaining-weight';
|
|
|
|
document.getElementById('currentLoaded').textContent = '---';
|
|
document.getElementById('totalComponent').textContent = '---';
|
|
document.getElementById('totalMixtureWeight').textContent = Math.round(data.total_mixture);
|
|
if (weightSectionEl) weightSectionEl.classList.add('center-weight');
|
|
} else {
|
|
const remainingEl = document.getElementById('remainingWeight');
|
|
const rw = data.remaining_weight != null ? data.remaining_weight : 0;
|
|
remainingEl.innerHTML = `${rw}<span class="weight-unit"> кг</span>`;
|
|
remainingEl.className = Number(rw) < 0 ? 'remaining-weight negative' : 'remaining-weight';
|
|
|
|
document.getElementById('currentLoaded').textContent = roundToStep5(data.current_loaded);
|
|
document.getElementById('totalComponent').textContent = roundToStep5(data.total_component);
|
|
document.getElementById('totalMixtureWeight').textContent = roundToStep5(data.total_mixture);
|
|
if (weightSectionEl) weightSectionEl.classList.remove('center-weight');
|
|
|
|
const isMixingNow = !!(data && (data.is_mixing_mode || data.mixing_timer_active));
|
|
if (isMixingNow) {
|
|
stopUnloadingSoundLoop();
|
|
} else {
|
|
const totalComponent = parseFloat(data.total_component) || 0;
|
|
const currentLoaded = parseFloat(data.current_loaded) || 0;
|
|
if (data.status === 'active' && totalComponent > 0) {
|
|
const threshold = totalComponent * 0.95;
|
|
if (currentLoaded >= threshold) {
|
|
startUnloadingSoundLoop('weight');
|
|
} else if (unloadingSoundReason === 'weight') {
|
|
stopUnloadingSoundLoop();
|
|
}
|
|
} else {
|
|
stopUnloadingSoundLoop();
|
|
}
|
|
}
|
|
}
|
|
|
|
const navButtons = document.getElementById('navButtonsOverlay');
|
|
navButtons.style.display = data.show_nav_buttons ? 'grid' : 'none';
|
|
|
|
if (data.status === 'active') {
|
|
document.getElementById('recipeName').textContent = data.recipe_name || '—';
|
|
document.getElementById('currentIndex').textContent = String((data.current_index != null ? data.current_index : 0) + 1);
|
|
document.getElementById('totalComponents').textContent = String(data.total_components != null ? data.total_components : 0);
|
|
document.getElementById('recipeInfo').style.display = 'block';
|
|
} else {
|
|
document.getElementById('recipeInfo').style.display = 'none';
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error('ДУБЛЕР: Ошибка получения данных:', error);
|
|
connectionRetries++;
|
|
stopUnloadingSoundLoop();
|
|
|
|
if (connectionRetries >= maxRetries) {
|
|
updateConnectionStatus(false);
|
|
document.getElementById('componentName').textContent = 'Соединение потеряно';
|
|
document.getElementById('remainingWeight').innerHTML = '---<span class="weight-unit"></span>';
|
|
document.getElementById('currentLoaded').textContent = '---';
|
|
document.getElementById('totalComponent').textContent = '---';
|
|
document.getElementById('totalMixtureWeight').textContent = '---';
|
|
document.getElementById('navButtonsOverlay').style.display = 'none';
|
|
document.getElementById('recipeInfo').style.display = 'none';
|
|
document.getElementById('nextComponentInfo').style.display = 'none';
|
|
}
|
|
});
|
|
}
|
|
|
|
function startUpdates() {
|
|
if (!kioskPaired || kioskStarted) return;
|
|
kioskStarted = true;
|
|
if (!duplicateInitialLoadDone && window.WespKioskSkeleton) {
|
|
window.WespKioskSkeleton.mountDuplicatePanelSkeleton(
|
|
document.getElementById('recipeInfo'),
|
|
document.querySelector('.weight-section')
|
|
);
|
|
}
|
|
updateWeightDisplay();
|
|
updateInterval = setInterval(updateWeightDisplay, POLL_MS);
|
|
}
|
|
|
|
function flashNavButton(btn) {
|
|
if (!btn) return;
|
|
var color = btn.classList.contains('prev-btn') ? '#374151' : '#1d4ed8';
|
|
btn.style.backgroundColor = color;
|
|
setTimeout(function () {
|
|
btn.style.removeProperty('background-color');
|
|
}, 150);
|
|
}
|
|
|
|
document.getElementById('prevBtnOverlay').addEventListener('click', function() {
|
|
if (!kioskPaired) return;
|
|
fetch('/api/send_navigation_command', {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify({ command: 'prev' })
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if (data.status === 'success') {
|
|
console.log('ДУБЛЕР: Команда "предыдущий" отправлена на основную страницу');
|
|
flashNavButton(document.getElementById('prevBtnOverlay'));
|
|
}
|
|
})
|
|
.catch(error => console.error('ДУБЛЕР: Ошибка отправки команды:', error));
|
|
});
|
|
|
|
document.getElementById('nextBtnOverlay').addEventListener('click', function() {
|
|
if (!kioskPaired) return;
|
|
fetch('/api/send_navigation_command', {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify({ command: 'next' })
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if (data.status === 'success') {
|
|
console.log('ДУБЛЕР: Команда "следующий" отправлена на основную страницу');
|
|
flashNavButton(document.getElementById('nextBtnOverlay'));
|
|
}
|
|
})
|
|
.catch(error => console.error('ДУБЛЕР: Ошибка отправки команды:', error));
|
|
});
|
|
|
|
window.addEventListener('beforeunload', function() {
|
|
if (updateInterval) {
|
|
clearInterval(updateInterval);
|
|
}
|
|
});
|
|
</script>
|
|
<script src="/static/js/kiosk-theme.js"></script>
|
|
<script src="/static/js/kiosk-pairing.js"></script>
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
window.WespKioskTheme.setup({ withToggle: true });
|
|
window.WespKioskPairing.setup({
|
|
onPaired: function () {
|
|
kioskPaired = true;
|
|
startUpdates();
|
|
},
|
|
onUnpaired: function () {
|
|
kioskPaired = false;
|
|
kioskStarted = false;
|
|
if (updateInterval) {
|
|
clearInterval(updateInterval);
|
|
updateInterval = null;
|
|
}
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
<script src="/static/js/kiosk-dialog.js"></script>
|
|
<link href="/static/css/wesp-update-banner.css" rel="stylesheet">
|
|
<script src="/static/js/wesp-update-notifier.js"></script>
|
|
<script>
|
|
document.addEventListener("DOMContentLoaded", function () {
|
|
if (window.WespUpdateNotifier) {
|
|
WespUpdateNotifier.init({ dialog: window.WespKioskDialog || window.WespDialog });
|
|
}
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|