kaizenkodo/CoBiE
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Adjust detail view timeline layout and auto-update

Browse Source
This commit is contained in:
Kiyomichi Kosaka 2025-06-20 08:41:44 +02:00
parent 615a14b5a8
commit f6f1502f1a
2 changed files with 27 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
script.js
View File

@ -177,6 +177,7 @@ function updateCurrentTime() {
} else {
updateTimeBreakdown(cobiets);
}
updateDetailCurrentTime();
}
function updateTimeBreakdown(cobiets) {
@ -701,15 +702,11 @@ function showEonstripDetail(index, startCob) {
timeline.appendChild(block);
}
let markerCob = manualMode ? manualCobiets : toCobiets(new Date());
const rel = (markerCob - startCob) / COBIE_UNITS.eonstrip;
if (rel >= 0 && rel <= 1) {
const line = document.createElement('div');
line.className = 'current-time-line';
line.style.top = (rel * 100) + '%';
line.textContent = formatCobieTimestamp(markerCob);
line.id = 'detailCurrentTime';
timeline.appendChild(line);
}
updateDetailCurrentTime();
if (Array.isArray(window.SPECIAL_EVENTS)) {
const events = [];
@ -777,7 +774,7 @@ function showEonstripDetail(index, startCob) {
elem.className = 'event-line';
}
elem.style.top = (displayStart * 100) + '%';
elem.style.left = left + '%';
elem.style.left = `calc(var(--scale-width) + ${left}%)`;
elem.style.width = `calc(${width}% - 2px)`;
if (elem.classList.contains('small-event') || elem.className === 'event-line') {
@ -815,6 +812,21 @@ function showEonstripDetail(index, startCob) {
}
}
function updateDetailCurrentTime() {
if (currentDetailCob === null) return;
const line = document.getElementById('detailCurrentTime');
if (!line) return;
const nowCob = manualMode ? manualCobiets : toCobiets(new Date());
const rel = (nowCob - currentDetailCob) / COBIE_UNITS.eonstrip;
if (rel >= 0 && rel <= 1) {
line.style.display = 'block';
line.style.top = (rel * 100) + '%';
line.textContent = formatCobieTimestamp(nowCob);
} else {
line.style.display = 'none';
}
}
function detailPrev() {
if (currentDetailCob === null) return;
showEonstripDetail(currentDetailCob - COBIE_UNITS.eonstrip);

7
style.css
View File

@ -400,6 +400,7 @@
.detail-timeline {
position: relative;
--scale-width: 24px;
height: 400px;
border-left: 3px solid #00ffff;
margin-right: 40px;
@ -425,8 +426,8 @@
.current-time-line {
position: absolute;
left: 0;
width: calc(100% + 40px);
left: var(--scale-width);
width: calc(100% + 40px - var(--scale-width));
border-top: 2px solid #ff00ff;
color: #ff00ff;
font-size: 0.9em;
@ -439,7 +440,7 @@
.event-box, .event-line {
position: absolute;
left: -1px;
left: var(--scale-width);
background: rgba(255,0,255,0.4);
border: 1px solid rgba(0,255,255,0.7);
border-radius: 4px;