-
+
+
+ Zoom:
+
+
+
+
+
+ Klik na valove = skoči + predvaja · Space = play/pause
+
+
+
+
@@ -1212,13 +1226,71 @@
document.addEventListener("mouseup", onPointerUp);
document.addEventListener("touchend", onPointerUp);
- // Click anywhere on trim bar = seek video
+ // Click anywhere on trim bar = seek + predvajaj OD TJE (ne od trim start)
trimBar.addEventListener("click", (e) => {
if (e.target === handleL || e.target === handleR || handleL.contains(e.target) || handleR.contains(e.target)) return;
const t = timeFromPx(e.clientX);
- if (video) video.currentTime = t;
+ if (video) {
+ video.currentTime = t;
+ video.play().catch(() => {});
+ }
});
+ // ─── ZOOM logic ───
+ let currentZoom = 1;
+ const trimScroll = document.getElementById("trim-scroll");
+
+ function applyZoom(zoom) {
+ currentZoom = zoom;
+ trimBar.style.width = (100 * zoom) + "%";
+ trimBar.style.minWidth = (100 * zoom) + "%";
+ // Aktiven gumb
+ document.querySelectorAll(".zoom-btn").forEach(b => {
+ if (parseInt(b.dataset.zoom) === zoom) {
+ b.style.background = "var(--accent)";
+ b.style.color = "#fff";
+ } else {
+ b.style.background = "";
+ b.style.color = "";
+ }
+ });
+ // Auto-scroll na sredino trim region
+ setTimeout(() => {
+ if (trimScroll) {
+ const barWidth = trimBar.getBoundingClientRect().width;
+ const centerPct = ((trimStart + trimEnd) / 2) / videoDuration;
+ const scrollTarget = barWidth * centerPct - trimScroll.clientWidth / 2;
+ trimScroll.scrollLeft = Math.max(0, scrollTarget);
+ }
+ renderTrim();
+ }, 50);
+ }
+
+ document.querySelectorAll(".zoom-btn").forEach(btn => {
+ btn.addEventListener("click", () => {
+ applyZoom(parseInt(btn.dataset.zoom));
+ });
+ });
+
+ // Space tipka = play/pause od trenutne pozicije (brez resetiranja na trim start)
+ const spaceHandler = (e) => {
+ if (e.code === "Space" && e.target.tagName !== "INPUT" && e.target.tagName !== "TEXTAREA") {
+ e.preventDefault();
+ if (video) {
+ if (video.paused) {
+ video.play().catch(() => {});
+ } else {
+ video.pause();
+ }
+ }
+ }
+ };
+ document.addEventListener("keydown", spaceHandler);
+ // Cleanup ob zaprtju modala
+ overlay._cleanup = () => {
+ document.removeEventListener("keydown", spaceHandler);
+ };
+
// Update playhead during playback + re-render če videoDuration manjkalo
if (video) {
video.addEventListener("timeupdate", renderPlayhead);
@@ -1325,6 +1397,8 @@
requestAnimationFrame(() => {
renderTrim();
renderPlayhead();
+ // Nastavi 1x kot aktiven gumb
+ applyZoom(1);
console.log("[EditModal] after renderTrim", {
leftStyle: handleL.style.left,
rightStyle: handleR.style.left,
@@ -1433,6 +1507,10 @@
function closeModal() {
const overlay = document.querySelector(".modal-overlay");
if (overlay) {
+ // Cleanup event listeners (npr. Space tipka)
+ if (typeof overlay._cleanup === "function") {
+ try { overlay._cleanup(); } catch (e) {}
+ }
// Stop video before removing (prevents memory leak)
const video = overlay.querySelector("video");
if (video) {