+
{dayEvents.map(s => (
<_EventBlock
key={s.id}
@@ -1077,12 +1180,49 @@ function _EpgRow({ recorder, schedules, dayStart, dayEnd, pph, now, projects, on
pph={pph}
now={now}
projects={projects}
- onClick={onEventClick} />
+ onClick={onEventClick}
+ onContextMenu={onEventContextMenu}
+ onResize={onEventResize} />
))}
);
}
+// ── Right-click menu for an EPG event block ─────────────────────────────────
+// Same pattern as AssetContextMenu (screens-library.jsx): viewport-clamped,
+// dismissed on outside click. Per-status action filtering mirrors the
+// buttons rendered in the List view so the two surfaces stay consistent.
+function _ScheduleContextMenu({ schedule, x, y, onClose, onEdit, onCancel, onDelete, onCopyId }) {
+ const ref = React.useRef(null);
+ const [pos, setPos] = React.useState({ left: x, top: y });
+ React.useLayoutEffect(() => {
+ if (!ref.current) return;
+ const r = ref.current.getBoundingClientRect();
+ const margin = 8;
+ let nx = x, ny = y;
+ if (x + r.width + margin > window.innerWidth) nx = window.innerWidth - r.width - margin;
+ if (y + r.height + margin > window.innerHeight) ny = window.innerHeight - r.height - margin;
+ setPos({ left: Math.max(margin, nx), top: Math.max(margin, ny) });
+ }, [x, y]);
+
+ const canEdit = schedule.status === 'pending' || schedule.status === 'failed';
+ const canCancel = schedule.status === 'pending' || schedule.status === 'running';
+ const canDelete = schedule.status !== 'running';
+
+ return (
+
e.stopPropagation()}
+ onContextMenu={(e) => { e.preventDefault(); e.stopPropagation(); }}>
+
{schedule.name}
+ {canEdit &&
}
+ {canCancel &&
}
+
+ {canDelete &&
}
+ {canDelete &&
}
+
+ );
+}
+
function _NowLine({ now, dayStart, pph }) {
if (!_sameDay(now, dayStart)) return null;
const min = _minutesIntoDay(now, dayStart);
@@ -1121,6 +1261,7 @@ function Schedule({ navigate }) {
const [showNew, setShowNew] = React.useState(false);
const [newDefaults, setNewDefaults] = React.useState(null);
const [editing, setEditing] = React.useState(null);
+ const [ctxMenu, setCtxMenu] = React.useState(null); // { schedule, x, y }
const [view, setView] = React.useState('today'); // 'today' | 'week' | 'list'
const [day, setDay] = React.useState(() => _dayStart(new Date()));
const [listFilter, setListFilter] = React.useState('upcoming');
@@ -1206,6 +1347,39 @@ function Schedule({ navigate }) {
window.ZAMPP_API.fetch('/schedules/' + s.id, { method: 'DELETE' }).then(load).catch(e => alert('Delete failed: ' + e.message));
};
+ // Drag-resize commit: optimistically patch the in-memory schedule so the
+ // block stays put after the user lets go, then PUT the new times. The
+ // refetch reconciles in case the server adjusted anything (or rejected).
+ const handleResize = (s, newStart, newEnd) => {
+ setSchedules(prev => prev ? prev.map(x => x.id === s.id ? { ...x, start_at: newStart, end_at: newEnd } : x) : prev);
+ window.ZAMPP_API.fetch('/schedules/' + s.id, {
+ method: 'PUT',
+ body: JSON.stringify({ start_at: newStart, end_at: newEnd }),
+ })
+ .then(load)
+ .catch(e => { alert('Resize failed: ' + e.message); load(); });
+ };
+
+ const openCtx = (s, ev) => setCtxMenu({ schedule: s, x: ev.clientX, y: ev.clientY });
+ // Dismiss the context menu on any outside click — capture phase so a
+ // click on a menu item still fires before the menu unmounts.
+ React.useEffect(() => {
+ if (!ctxMenu) return;
+ const close = () => setCtxMenu(null);
+ window.addEventListener('click', close);
+ window.addEventListener('contextmenu', close);
+ window.addEventListener('scroll', close, true);
+ return () => {
+ window.removeEventListener('click', close);
+ window.removeEventListener('contextmenu', close);
+ window.removeEventListener('scroll', close, true);
+ };
+ }, [ctxMenu]);
+
+ const copyId = (id) => {
+ if (navigator.clipboard) navigator.clipboard.writeText(id).catch(() => {});
+ };
+
// Days for Week view: the 7-day window starting at the Sunday of `day`.
const weekDays = React.useMemo(() => {
const sun = _addDays(dayStart, -dayStart.getDay());
@@ -1276,6 +1450,8 @@ function Schedule({ navigate }) {
now={now}
projects={projects}
onEventClick={(s) => setEditing(s)}
+ onEventContextMenu={openCtx}
+ onEventResize={handleResize}
onEmptyClick={openNewAt} />
))}