From c54f4c68cb5d31100b3ef273010075d76d0eddbc Mon Sep 17 00:00:00 2001
From: Mikael Finstad <finstaden@gmail.com>
Date: Sun, 23 Feb 2020 18:21:56 +0800
Subject: [PATCH] only show keyframes when enough zoomed in

---
 src/renderer.jsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/renderer.jsx b/src/renderer.jsx
index 29187b11..488c443e 100644
--- a/src/renderer.jsx
+++ b/src/renderer.jsx
@@ -1234,6 +1234,8 @@ const App = memo(() => {
   const otherFormatsMap = fromPairs(Object.entries(allOutFormats)
     .filter(([f]) => ![...commonFormats, detectedFileFormat].includes(f)));
 
+  const shouldShowKeyframes = neighbouringFrames.length >= 2 && (neighbouringFrames[neighbouringFrames.length - 1].time - neighbouringFrames[0].time) / durationSafe > (0.1 / zoom);
+
   function getSegColors(seg) {
     if (!seg) return {};
     const { color } = seg;
@@ -1781,7 +1783,7 @@ const App = memo(() => {
                   />
                 ))}
 
-                {mainVideoStream && neighbouringFrames.filter(f => f.keyframe).map((f) => (
+                {mainVideoStream && shouldShowKeyframes && neighbouringFrames.filter(f => f.keyframe).map((f) => (
                   <div key={f.time} style={{ position: 'absolute', top: 0, bottom: 0, left: `${(f.time / duration) * 100}%`, marginLeft: -1, width: 1, background: 'rgba(0,0,0,1)' }} />
                 ))}
               </div>