Function updateTimeline

src/lib/createAndHandleSegments.ts:118–180

(e: any, player: any, segments: Segment[])

let isMouseDown = false;

export function updateTimeline(e: any, player: any, segments: Segment[]) {
  let preview_position = 0;

  if (e.type === 'timeupdate') {
    if (!isMouseDown) {
      progessTimeline(segments, player);
    }

    if (!isMouseOver) {
      preview_position = previewViaBuffer(player);
    }
  }
  if (e.type === 'click') {
    changeCurrentTimeOnClick(e, player);
    isMouseDown = false;
  }

  if (e.type === 'mouseover') {
    isMouseOver = true;

    preview_position = previewViaMouseOverOrMove(e) as number;
  }
  if (e.type === 'mousemove') {
    isMouseOver = true;

    preview_position = previewViaMouseOverOrMove(e) as number;

    setCurrentLabel(e, preview_position, segments, player);

    if (isMouseDown) {
      changeCurrentTimeOnClick(e, player);
      progessTimeline(segments, player);
    }
  }
  if (e.type === 'mousedown') {
    isMouseDown = true;
  }
  if (e.type === 'mouseup') {
    isMouseDown = false;
    preview_position = previewViaBuffer(player);
  }

  if (e.type === 'mouseout') {
    isMouseOver = false;
    preview_position = previewViaBuffer(player);
  }
  const previewEles = document.querySelectorAll(
    '.timeline-segments-preview',
  ) as NodeListOf<HTMLDivElement>;

  if (preview_position !== 0) {
    segments?.forEach((each, index) => {
      if (each?.end > preview_position * player?.duration()) {
        if (previewEles[index]) {
          previewEles[index].style.right =
            `${((each?.end - preview_position * player?.duration()) / (each?.end - each?.start)) * 100}%`;
        }
      } else if (previewEles[index]) {