From efaa5c430604482f5d3a217ec0c01f3801266eb9 Mon Sep 17 00:00:00 2001 From: hbrain Date: Fri, 5 Jun 2026 00:43:58 +0200 Subject: [PATCH] Styling, animation while generating description... --- _footer_admin.php | 30 +++++++++++++++++++++++++----- admin.php | 2 +- style.css | 2 +- 3 files changed, 27 insertions(+), 7 deletions(-) diff --git a/_footer_admin.php b/_footer_admin.php index 933e44f..790879d 100644 --- a/_footer_admin.php +++ b/_footer_admin.php @@ -22,6 +22,29 @@ }); } + function setDescribeButtonsDisabled(disabled){ + document.querySelectorAll('.describe-button').forEach(function(btn){ + if (!btn.dataset.originalText) btn.dataset.originalText = btn.textContent; + btn.classList.toggle('disabled', disabled); + btn.setAttribute('aria-disabled', disabled ? 'true' : 'false'); + btn.textContent = disabled ? 'Generating...' : (btn.dataset.originalText || 'Describe'); + }); + } + + function showDescribeBusy(){ + setDescribeButtonsDisabled(true); + if (typeof window.showThumbBusy === 'function') { + window.showThumbBusy('Generating description…'); + } + } + + function hideDescribeBusy(){ + if (typeof window.hideThumbBusy === 'function') { + window.hideThumbBusy(); + } + setDescribeButtonsDisabled(false); + } + function showModal(job, articleId, description, teaser, quoteDa, rawJson){ var existing = document.getElementById('mvlog-gemini-modal'); if (existing) existing.remove(); @@ -104,9 +127,7 @@ var job = el.dataset.job || ''; var articleId = el.dataset.id || ''; if (!job && !articleId) return; - el.classList.add('disabled'); - var oldText = el.textContent; - el.textContent = 'Generating...'; + showDescribeBusy(); fetch('lib/generate_data_sync.php', { method: 'POST', credentials: 'same-origin', @@ -137,8 +158,7 @@ }).catch(function(err){ showToast('Request failed: ' + err, false); }).finally(function(){ - el.classList.remove('disabled'); - el.textContent = oldText; + hideDescribeBusy(); }); }); diff --git a/admin.php b/admin.php index 889a98e..31bb58d 100644 --- a/admin.php +++ b/admin.php @@ -1291,7 +1291,7 @@ $keywordValue = $rawKeyword; $filterPreview = !empty($_GET['f_preview']); $filterRender = !empty($_GET['f_render']); $filterShown = !empty($_GET['f_shown']); -$statusFilterActive = $filterPreview || $filterRender || $filterShown; +$statusFilterActive = $filterPreview || $filterRender || $filterShown || $filterPermalink; $searchEmpty = ($rawKeyword === '' && !$statusFilterActive); if ($rawKeyword !== '' && preg_match('/^\s*(date|location|place)\s*=\s*(.+)\s*$/i', $rawKeyword, $m)) { $keywordType = strtolower((string)$m[1]); diff --git a/style.css b/style.css index dc37c74..a0c5a9d 100644 --- a/style.css +++ b/style.css @@ -1,4 +1,4 @@ -@font-face{font-family:BebasNeue;src:url('assets/fonts/BebasNeue-Regular.ttf')}@font-face{font-family:IBMPlexCaption;src:url('assets/fonts/IBMPlexSans-SemiBold.ttf')}@font-face{font-family:NotoStamp;src:url('assets/fonts/NotoSans-Bold.ttf')}:root{font-family:IBMPlexCaption,system-ui,sans-serif;color:#F3F4F6;background:#111315}html,body{overflow-x:hidden}body{margin:0;background:#111315 url(assets/img/background.jpg) center center/cover fixed no-repeat;min-height:100vh}body::before{content:'';position:fixed;inset:0;background:rgba(17,19,21,.78);z-index:-1}header{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(27,30,34,.92);backdrop-filter:blur(6px);color:#F3F4F6;padding:1.15rem max(1rem,calc((100vw - 1100px)/2 + 1rem));box-sizing:border-box;text-align:center;box-shadow:0 2px 16px #0008}header h1{font-family:NotoStamp,system-ui,sans-serif;font-size:.95rem;letter-spacing:.06em;margin:0}.site-header{background:linear-gradient(180deg,rgba(27,30,34,.88),rgba(27,30,34,.62));border-bottom:1px solid rgba(59,167,160,.35)}.brand-wrap{position:relative;display:inline-flex;align-items:center;justify-content:center}.brand{position:relative;display:inline-block;padding:.1rem 1.5rem .3rem;text-decoration:none;color:#F3F4F6}.brand::after{content:"";position:absolute;left:50%;transform:translateX(-50%);bottom:0;width:12.5rem;height:2px;background:#3BA7A0;opacity:.6;z-index:0}.brand h1,.brand p{position:relative;z-index:2}.brand h1{margin:0;transform:translateY(.1rem)}.brand p{font-family:NotoStamp,system-ui,sans-serif;margin:.46rem 0 0;color:#A0A4AB;font-size:.55rem;letter-spacing:.22em;text-transform:uppercase;transform:translateY(.1rem)}.header-logo{position:absolute;left:50%;top:calc(100% - 1.46rem);transform:translate(-50%,-46%) translateX(-7.65rem);display:block;width:6.9rem;height:6.9rem;overflow:visible;z-index:1;opacity:.7}.header-logo img{width:100%;height:100%;object-fit:contain;display:block}.push-toggle{box-sizing:border-box;appearance:none;-webkit-appearance:none;position:absolute;right:calc(max(1rem,calc((100vw - 1100px)/2 + 1rem)) + 2.35rem);top:.8rem;display:grid;place-items:center;width:1.9rem;height:1.9rem;background:#3BA7A0;border:1px solid #3BA7A0;border-radius:.4rem;color:#111315;padding:0}.push-toggle svg{width:1rem;height:1rem;fill:currentColor}.push-toggle:hover{background:#4fb9b2;border-color:#4fb9b2;color:#111315}.push-toggle.active{background:#C46A3A;border-color:#C46A3A;color:#fff;cursor:default;opacity:.9}.push-toggle:disabled{cursor:default}.rss-link{box-sizing:border-box;position:absolute;right:max(1rem,calc((100vw - 1100px)/2 + 1rem));top:.8rem;display:grid;place-items:center;width:1.9rem;height:1.9rem;background:#C46A3A;border:1px solid #C46A3A;border-radius:.4rem;text-decoration:none;color:#fff}.rss-link svg{width:1rem;height:1rem;fill:currentColor}.rss-link:hover{background:#d97b48;border-color:#d97b48;color:#fff}.site-header.admin-header{padding-bottom:1rem;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem}.brand .admin-word{font-size:.5em}.site-header.admin-header .brand-wrap{grid-column:2}.site-header.admin-header .brand{grid-column:auto}.admin-left{grid-column:1;justify-self:start;display:flex;align-items:center;gap:.7rem}.admin-right{grid-column:3;justify-self:stretch;width:100%;display:flex;align-items:flex-end;justify-content:flex-end;gap:.6rem}.job-status{display:flex;align-items:center;gap:.35rem;max-width:360px;overflow:hidden;white-space:nowrap;color:#A0A4AB;font-size:.72rem;margin-right:auto;padding-bottom:.3rem}.job-status strong{color:#F3F4F6;font-weight:600}.job-dot{width:.45rem;height:.45rem;border-radius:50%;background:#C46A3A;box-shadow:0 0 0 .14rem rgba(196,106,58,.18)}.job-age{color:#A0A4AB;opacity:.85;font-size:.72rem}.logout-link{background:#111315;border:1px solid #3BA7A0;border-radius:.4rem;padding:.35rem .7rem;text-decoration:none;color:#F3F4F6;font-size:.82rem}.logout-link:hover{background:#3BA7A0;color:#111315}a{color:#3BA7A0}.button,button{background:#C46A3A;color:#111315;border:0;border-radius:.5rem;padding:.7rem 1rem;text-decoration:none;cursor:pointer}.button.disabled{background:#3a3d42;color:#A0A4AB;cursor:not-allowed;opacity:.75}button.danger{background:#8B1E1E;color:#F3F4F6}button.danger:hover{background:#B32626}nav a{margin-left:1rem;color:#F3F4F6}/* Header buttons */ +@font-face{font-family:BebasNeue;src:url('assets/fonts/BebasNeue-Regular.ttf')}@font-face{font-family:IBMPlexCaption;src:url('assets/fonts/IBMPlexSans-SemiBold.ttf')}@font-face{font-family:NotoStamp;src:url('assets/fonts/NotoSans-Bold.ttf')}:root{font-family:IBMPlexCaption,system-ui,sans-serif;color:#F3F4F6;background:#111315}html,body{overflow-x:hidden}body{margin:0;background:#111315 url(assets/img/background.jpg) center center/cover fixed no-repeat;min-height:100vh}body::before{content:'';position:fixed;inset:0;background:rgba(17,19,21,.78);z-index:-1}header{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(27,30,34,.92);backdrop-filter:blur(6px);color:#F3F4F6;padding:1.15rem max(1rem,calc((100vw - 1100px)/2 + 1rem));box-sizing:border-box;text-align:center;box-shadow:0 2px 16px #0008}header h1{font-family:NotoStamp,system-ui,sans-serif;font-size:.95rem;letter-spacing:.06em;margin:0}.site-header{background:linear-gradient(180deg,rgba(27,30,34,.88),rgba(27,30,34,.62));border-bottom:1px solid rgba(59,167,160,.35)}.brand-wrap{position:relative;display:inline-flex;align-items:center;justify-content:center}.brand{position:relative;display:inline-block;padding:.1rem 1.5rem .3rem;text-decoration:none;color:#F3F4F6}.brand::after{content:"";position:absolute;left:50%;transform:translateX(-50%);bottom:0;width:12.5rem;height:2px;background:#3BA7A0;opacity:.6;z-index:0}.brand h1,.brand p{position:relative;z-index:2}.brand h1{margin:0;transform:translateY(.1rem)}.brand p{font-family:NotoStamp,system-ui,sans-serif;margin:.46rem 0 0;color:#A0A4AB;font-size:.55rem;letter-spacing:.22em;text-transform:uppercase;transform:translateY(.1rem)}.header-logo{position:absolute;left:50%;top:calc(100% - 1.46rem);transform:translate(-50%,-46%) translateX(-7.65rem);display:block;width:6.9rem;height:6.9rem;overflow:visible;z-index:1;opacity:.7}.header-logo img{width:100%;height:100%;object-fit:contain;display:block}.push-toggle{box-sizing:border-box;appearance:none;-webkit-appearance:none;position:absolute;right:calc(max(1rem,calc((100vw - 1100px)/2 + 1rem)) + 2.35rem);top:.8rem;display:grid;place-items:center;width:1.9rem;height:1.9rem;background:#3BA7A0;border:1px solid #3BA7A0;border-radius:.4rem;color:#111315;padding:0}.push-toggle svg{width:1rem;height:1rem;fill:currentColor}.push-toggle:hover{background:#4fb9b2;border-color:#4fb9b2;color:#111315}.push-toggle.active{background:#C46A3A;border-color:#C46A3A;color:#fff;cursor:default;opacity:.9}.push-toggle:disabled{cursor:default}.rss-link{box-sizing:border-box;position:absolute;right:max(1rem,calc((100vw - 1100px)/2 + 1rem));top:.8rem;display:grid;place-items:center;width:1.9rem;height:1.9rem;background:#C46A3A;border:1px solid #C46A3A;border-radius:.4rem;text-decoration:none;color:#fff}.rss-link svg{width:1rem;height:1rem;fill:currentColor}.rss-link:hover{background:#d97b48;border-color:#d97b48;color:#fff}.site-header.admin-header{padding-bottom:1rem;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem}.brand .admin-word{font-size:.5em}.site-header.admin-header .brand-wrap{grid-column:2}.site-header.admin-header .brand{grid-column:auto}.admin-left{grid-column:1;justify-self:start;display:flex;align-items:center;gap:.7rem}.admin-right{grid-column:3;justify-self:stretch;width:100%;display:flex;align-items:flex-end;justify-content:flex-end;gap:.6rem}.job-status{display:flex;align-items:center;gap:.35rem;max-width:360px;overflow:hidden;white-space:nowrap;color:#A0A4AB;font-size:.72rem;margin-right:auto;padding-bottom:.3rem;font-family:system-ui,sans-serif;font-weight:400;line-height:1.4;letter-spacing:normal;text-transform:none}.job-status strong{color:#F3F4F6;font-weight:600}.job-dot{width:.45rem;height:.45rem;border-radius:50%;background:#C46A3A;box-shadow:0 0 0 .14rem rgba(196,106,58,.18)}.job-age{color:#A0A4AB;opacity:.85;font-size:.72rem}.logout-link{background:#111315;border:1px solid #3BA7A0;border-radius:.4rem;padding:.35rem .7rem;text-decoration:none;color:#F3F4F6;font-size:.82rem}.logout-link:hover{background:#3BA7A0;color:#111315}a{color:#3BA7A0}.button,button{background:#C46A3A;color:#111315;border:0;border-radius:.5rem;padding:.7rem 1rem;text-decoration:none;cursor:pointer}.button.disabled{background:#3a3d42;color:#A0A4AB;cursor:not-allowed;opacity:.75}button.danger{background:#8B1E1E;color:#F3F4F6}button.danger:hover{background:#B32626}nav a{margin-left:1rem;color:#F3F4F6}/* Header buttons */ .header-actions { position: absolute; right: max(1rem,calc((100vw - 1100px)/2 + 1rem));