Mirror/intercept
1
0
Fork 0
mirror of https://github.com/smittix/intercept.git synced 2026-04-24 06:40:00 -07:00
Code Issues Packages Projects Releases Wiki Activity

Add WeFax 24h broadcast timeline and improve start button feedback

Browse Source 
Flash the Start button itself with amber pulse when clicked without a
station selected, and show "Select Station" in the strip status text
right next to the button so the error is immediately visible.

Add a 24-hour timeline bar with broadcast window markers, red UTC time
cursor, and countdown boxes (HRS/MIN/SEC) that tick down to the next
broadcast. Broadcasts show as amber blocks on the timeline track with
imminent/active visual states matching the weather satellite pattern.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Smittix
2026-02-24 15:17:01 +00:00
parent 085a6177f9
commit 2da8dca167
3 changed files with 381 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

154
static/css/modes/wefax.css
View File

@@ -74,6 +74,13 @@
.wefax-strip-btn.start { color: #ffaa00; border-color: #ffaa0044; }
.wefax-strip-btn.start:hover { background: #ffaa0015; border-color: #ffaa00; }
.wefax-strip-btn.start.wefax-strip-btn-error {
border-color: #ffaa00;
color: #ffaa00;
box-shadow: 0 0 8px rgba(255, 170, 0, 0.3);
animation: wefax-pulse 0.6s ease-in-out 3;
}
.wefax-strip-btn.stop { color: #f44; border-color: #f4444444; }
.wefax-strip-btn.stop:hover { background: #f4441a; border-color: #f44; }
@@ -438,6 +445,153 @@
.wefax-gallery-action:hover { color: #fff; }
.wefax-gallery-action.delete:hover { color: #f44; }
/* --- Countdown Bar + Timeline --- */
.wefax-countdown-bar {
display: flex;
align-items: center;
gap: 16px;
padding: 10px 16px;
background: var(--bg-secondary, #141820);
border: 1px solid var(--border-color, #1e2a3a);
border-radius: 6px;
margin-bottom: 12px;
}
.wefax-countdown-next {
display: flex;
align-items: center;
gap: 12px;
flex-shrink: 0;
}
.wefax-countdown-boxes {
display: flex;
gap: 4px;
}
.wefax-countdown-box {
display: flex;
flex-direction: column;
align-items: center;
padding: 4px 8px;
background: var(--bg-primary, #0d1117);
border: 1px solid var(--border-color, #2a3040);
border-radius: 4px;
min-width: 40px;
}
.wefax-countdown-box.imminent {
border-color: #ffaa00;
box-shadow: 0 0 8px rgba(255, 170, 0, 0.2);
}
.wefax-countdown-box.active {
border-color: #ffaa00;
box-shadow: 0 0 8px rgba(255, 170, 0, 0.3);
animation: wefax-glow 1.5s ease-in-out infinite;
}
@keyframes wefax-glow {
0%, 100% { box-shadow: 0 0 8px rgba(255, 170, 0, 0.3); }
50% { box-shadow: 0 0 16px rgba(255, 170, 0, 0.5); }
}
.wefax-cd-value {
font-size: 16px;
font-weight: 700;
font-family: 'Roboto Condensed', 'Arial Narrow', sans-serif;
color: var(--text-primary, #e0e0e0);
line-height: 1;
}
.wefax-cd-unit {
font-size: 8px;
color: var(--text-dim, #666);
text-transform: uppercase;
letter-spacing: 0.5px;
margin-top: 2px;
}
.wefax-countdown-info {
display: flex;
flex-direction: column;
gap: 2px;
}
.wefax-countdown-content {
font-size: 12px;
font-weight: 600;
color: #ffaa00;
font-family: 'Roboto Condensed', 'Arial Narrow', sans-serif;
}
.wefax-countdown-detail {
font-size: 10px;
color: var(--text-dim, #666);
font-family: 'Roboto Condensed', 'Arial Narrow', sans-serif;
}
.wefax-timeline {
flex: 1;
position: relative;
height: 36px;
min-width: 200px;
}
.wefax-timeline-track {
position: absolute;
top: 4px;
left: 0;
right: 0;
height: 16px;
background: var(--bg-primary, #0d1117);
border: 1px solid var(--border-color, #2a3040);
border-radius: 3px;
overflow: hidden;
}
.wefax-timeline-broadcast {
position: absolute;
top: 0;
height: 100%;
background: rgba(255, 170, 0, 0.5);
border-radius: 2px;
cursor: default;
opacity: 0.8;
min-width: 2px;
}
.wefax-timeline-broadcast:hover {
opacity: 1;
}
.wefax-timeline-broadcast.active {
background: rgba(255, 170, 0, 0.85);
border: 1px solid #ffaa00;
}
.wefax-timeline-cursor {
position: absolute;
top: 2px;
width: 2px;
height: 20px;
background: #ff4444;
border-radius: 1px;
z-index: 2;
}
.wefax-timeline-labels {
position: absolute;
bottom: 0;
left: 0;
right: 0;
display: flex;
justify-content: space-between;
font-size: 8px;
color: var(--text-dim, #666);
font-family: 'Roboto Condensed', 'Arial Narrow', sans-serif;
}
/* --- Responsive --- */
@media (max-width: 768px) {
.wefax-main-row {