1 files changed, 24 insertions, 21 deletions

diff --git a/src/components/moments/trimmer.tsx b/src/components/moments/trimmer.tsx
index c9e8a6c5..c99eaa6f 100644
--- a/src/components/moments/trimmer.tsx
+++ b/src/components/moments/trimmer.tsx
@@ -11,24 +11,26 @@ export const TrimmerPlayer: React.FC<{
   handleLoad: Function;
   onChangedEndpoints: Function;
 }> = ({source, videoStyles, hideTrimmer, handleLoad, onChangedEndpoints}) => {
+  // Stores the reference to player for seeking
   const playerRef = useRef<Video>();
-
+  // Stores where the video is playing (seekTime)
   const [seekTime, setSeekTime] = useState<number>(0);
   const [paused, setPaused] = useState<boolean>(false);
+  // Stores where the tracker is
+  const [trackerTime, setTrackerTime] = useState<number>(0);
+  // Stores start/end of desired trimmed video
+  const [end, setEnd] = useState<number>(60);
+  const [start, setStart] = useState<number>(0);
+
   useEffect(() => {
     playerRef.current?.seek(seekTime);
   }, [seekTime]);
-
-  const [trackerTime, setTrackerTime] = useState<number>(0);
   useEffect(() => {
     if (!paused && (trackerTime >= end || trackerTime < start)) {
       setTrackerTime(start);
       playerRef.current?.seek(start);
     }
   }, [trackerTime]);
-
-  const [end, setEnd] = useState<number>(60);
-  const [start, setStart] = useState<number>(0);
   useEffect(() => {
     setSeekTime(start);
     setTrackerTime(start);
@@ -37,22 +39,24 @@ export const TrimmerPlayer: React.FC<{
     setSeekTime(end);
     setTrackerTime(start);
   }, [end]);
-
+  // Callback so parent knows where the trimming endpts are
   useEffect(() => onChangedEndpoints({end, start}), [end, start]);
 
   return (
     <>
       <Video
+        // link to descr and use of props of video player ->
+        // https://github.com/react-native-video/react-native-video
         ref={(ref) => {
           playerRef.current = ref || undefined;
         }}
-        source={{uri: source}} // Looks for .mp4 file (background.mp4) in the given expansion version.
-        rate={1.0} // 0 is paused, 1 is normal.
-        volume={1.0} // 0 is muted, 1 is normal.
-        muted={false} // Mutes the audio entirely.
-        paused={paused} // Pauses playback entirely.
+        source={{uri: source}}
+        rate={1.0}
+        volume={1.0}
+        muted={false}
+        paused={paused}
         resizeMode={'contain'}
-        repeat={true} // Repeat forever.
+        repeat={true}
         onLoad={(payload) => {
           console.log(payload, source);
           setEnd(payload.duration);
@@ -63,14 +67,14 @@ export const TrimmerPlayer: React.FC<{
             setTrackerTime(e.currentTime);
           }
         }} // Callback every ~250ms with currentTime
-        //onEnd={() => console.log('end')} // Callback when playback finishes
-        //onError={this.videoError} // Callback when video cannot be loaded
         style={videoStyles}
         onTouchEnd={() => {
           setPaused((state) => !state);
         }}
       />
       <Trimmer
+        // link to descr and use of props for trimmer ->
+        // https://github.com/shahen94/react-native-video-processing
         source={source}
         height={hideTrimmer ? 0 : 75}
         width={hideTrimmer ? 0 : SCREEN_WIDTH}
@@ -78,12 +82,11 @@ export const TrimmerPlayer: React.FC<{
         onTrackerMove={(e: {currentTime: number}) => {
           setPaused(true);
           setSeekTime(e.currentTime);
-        }} // iOS only
-        currentTime={trackerTime} // added .25 bc tracker is inaccurate
-        themeColor={'white'} // iOS only
-        // showTrackerHandle={true}
-        thumbWidth={10} // iOS only
-        trackerColor={'white'} // iOS only
+        }}
+        currentTime={trackerTime}
+        themeColor={'white'}
+        thumbWidth={10}
+        trackerColor={'white'}
         onChange={(e: {endTime: number; startTime: number}) => {
           setPaused(true);
           setEnd(e.endTime);