"use strict";
var player_data = JSON.parse(
  document.getElementById("player_data").textContent,
);
var video_data = JSON.parse(document.getElementById("video_data").textContent);

var options = {
  liveui: true,
  playbackRates: [0.25, 0.5, 0.75, 1.0, 1.25, 1.5, 1.75, 2.0],
  controlBar: {
    children: [
      "playToggle",
      "volumePanel",
      "currentTimeDisplay",
      "timeDivider",
      "durationDisplay",
      "progressControl",
      "remainingTimeDisplay",
      "Spacer",
      "captionsButton",
      "audioTrackButton",
      "qualitySelector",
      "playbackRateMenuButton",
      "fullscreenToggle",
    ],
  },
  html5: {
    preloadTextTracks: false,
    vhs: {
      overrideNative: true,
    },
  },
};

if (player_data.aspect_ratio) {
  options.aspectRatio = player_data.aspect_ratio;
}

var embed_url = new URL(location);
embed_url.searchParams.delete("v");
var short_url = location.origin + "/" + video_data.id + embed_url.search;
embed_url = location.origin + "/embed/" + video_data.id + embed_url.search;

var save_player_pos_key = "save_player_pos";

videojs.Vhs.xhr.beforeRequest = function (options) {
  // set local if requested not videoplayback
  if (!options.uri.includes("videoplayback")) {
    if (!options.uri.includes("local=true")) options.uri += "?local=true";
  }
  return options;
};

var player = videojs("player", options);

player.on("error", function () {
  if (video_data.params.quality === "dash") return;

  var localNotDisabled =
    !player.currentSrc().includes("local=true") && !video_data.local_disabled;
  var reloadMakesSense =
    player.error().code === MediaError.MEDIA_ERR_NETWORK ||
    player.error().code === MediaError.MEDIA_ERR_SRC_NOT_SUPPORTED;

  if (localNotDisabled) {
    // add local=true to all current sources
    player.src(
      player.currentSources().map(function (source) {
        source.src += "&local=true";
        return source;
      }),
    );
  } else if (reloadMakesSense) {
    setTimeout(function () {
      console.warn("An error occurred in the player, reloading...");

      // After load() all parameters are reset. Save them
      var currentTime = player.currentTime();
      var playbackRate = player.playbackRate();
      var paused = player.paused();

      player.load();

      if (currentTime > 0.5) currentTime -= 0.5;

      player.currentTime(currentTime);
      player.playbackRate(playbackRate);
      if (!paused) player.play();
    }, 5000);
  }
});

if (video_data.params.quality === "dash") {
  player.reloadSourceOnError({
    errorInterval: 10,
  });
}

/**
 * Function for add time argument to url
 *
 * @param {String} url
 * @param {String} [base]
 * @returns {URL} urlWithTimeArg
 */
function addCurrentTimeToURL(url, base) {
  var urlUsed = new URL(url, base);
  urlUsed.searchParams.delete("start");
  var currentTime = Math.ceil(player.currentTime());
  if (currentTime > 0) urlUsed.searchParams.set("t", currentTime);
  else if (urlUsed.searchParams.has("t")) urlUsed.searchParams.delete("t");
  return urlUsed;
}

/**
 * Global variable to save the last timestamp (in full seconds) at which the external
 * links were updated by the 'timeupdate' callback below.
 *
 * It is initialized to 5s so that the video will always restart from the beginning
 * if the user hasn't really started watching before switching to the other website.
 */
var timeupdate_last_ts = 5;

/**
 * Callback that updates the timestamp on all external links
 */
player.on("timeupdate", function () {
  // Only update once every second
  let current_ts = Math.floor(player.currentTime());
  if (current_ts > timeupdate_last_ts) timeupdate_last_ts = current_ts;
  else return;

  // YouTube links

  let elem_yt_watch = document.getElementById("link-yt-watch");
  if (elem_yt_watch) {
    let base_url_yt_watch = elem_yt_watch.getAttribute("data-base-url");
    elem_yt_watch.href = addCurrentTimeToURL(base_url_yt_watch);
  }

  let elem_yt_embed = document.getElementById("link-yt-embed");
  if (elem_yt_embed) {
    let base_url_yt_embed = elem_yt_embed.getAttribute("data-base-url");
    elem_yt_embed.href = addCurrentTimeToURL(base_url_yt_embed);
  }

  // Invidious links

  let domain = window.location.origin;

  let elem_iv_embed = document.getElementById("link-iv-embed");
  if (elem_iv_embed) {
    let base_url_iv_embed = elem_iv_embed.getAttribute("data-base-url");
    elem_iv_embed.href = addCurrentTimeToURL(base_url_iv_embed, domain);
  }

  let elem_iv_other = document.getElementById("link-iv-other");
  if (elem_iv_other) {
    let base_url_iv_other = elem_iv_other.getAttribute("data-base-url");
    elem_iv_other.href = addCurrentTimeToURL(base_url_iv_other, domain);
  }
});

var shareOptions = {
  socials: ["fbFeed", "tw", "reddit", "email"],

  get url() {
    return addCurrentTimeToURL(short_url);
  },
  title: player_data.title,
  description: player_data.description,
  image: player_data.thumbnail,
  get embedCode() {
    // Single quotes inside here required. HTML inserted as is into value attribute of input
    return (
      "<iframe id='ivplayer' width='640' height='360' src='" +
      addCurrentTimeToURL(embed_url) +
      "' style='border:none;'></iframe>"
    );
  },
};

if (location.pathname.startsWith("/embed/")) {
  var overlay_content =
    '<h1><a rel="noopener" target="_blank" href="' +
    location.origin +
    "/watch?v=" +
    video_data.id +
    '">' +
    player_data.title +
    "</a></h1>";
  player.overlay({
    overlays: [
      {
        start: "loadstart",
        content: overlay_content,
        end: "playing",
        align: "top",
      },
      {
        start: "pause",
        content: overlay_content,
        end: "playing",
        align: "top",
      },
    ],
  });
}

// Detect mobile users and initialize mobileUi for better UX
// Detection code taken from https://stackoverflow.com/a/20293441

function isMobile() {
  try {
    document.createEvent("TouchEvent");
    return true;
  } catch (e) {
    return false;
  }
}

if (isMobile()) {
  player.mobileUi({
    touchControls: { seekSeconds: 5 * player.playbackRate() },
  });

  var buttons = ["playToggle", "volumePanel", "captionsButton"];

  if (!video_data.params.listen && video_data.params.quality === "dash")
    buttons.push("audioTrackButton");
  if (video_data.params.listen || video_data.params.quality !== "dash")
    buttons.push("qualitySelector");

  // Create new control bar object for operation buttons
  const ControlBar = videojs.getComponent("controlBar");
  let operations_bar = new ControlBar(player, {
    children: [],
    playbackRates: [0.25, 0.5, 0.75, 1.0, 1.25, 1.5, 1.75, 2.0],
  });
  buttons.slice(1).forEach(function (child) {
    operations_bar.addChild(child);
  });

  // Remove operation buttons from primary control bar
  var primary_control_bar = player.getChild("controlBar");
  buttons.forEach(function (child) {
    primary_control_bar.removeChild(child);
  });

  var operations_bar_element = operations_bar.el();
  operations_bar_element.classList.add("mobile-operations-bar");
  player.addChild(operations_bar);

  // Playback menu doesn't work when it's initialized outside of the primary control bar
  var playback_element =
    document.getElementsByClassName("vjs-playback-rate")[0];
  operations_bar_element.append(playback_element);

  // The share and http source selector element can't be fetched till the players ready.
  player.one("playing", function () {
    var share_element = document.getElementsByClassName("vjs-share-control")[0];
    operations_bar_element.append(share_element);

    if (!video_data.params.listen && video_data.params.quality === "dash") {
      var http_source_selector = document.getElementsByClassName(
        "vjs-http-source-selector vjs-menu-button",
      )[0];
      operations_bar_element.append(http_source_selector);
    }
  });
}

// Enable VR video support
if (!video_data.params.listen && video_data.vr && video_data.params.vr_mode) {
  player.crossOrigin("anonymous");
  switch (video_data.projection_type) {
    case "EQUIRECTANGULAR":
      player.vr({ projection: "equirectangular" });
    default: // Should only be 'MESH' but we'll use this as a fallback.
      player.vr({ projection: "EAC" });
  }
}

// Add markers
if (video_data.params.video_start > 0 || video_data.params.video_end > 0) {
  var markers = [{ time: video_data.params.video_start, text: "Start" }];

  if (video_data.params.video_end < 0) {
    markers.push({ time: video_data.length_seconds - 0.5, text: "End" });
  } else {
    markers.push({ time: video_data.params.video_end, text: "End" });
  }

  player.markers({
    onMarkerReached: function (marker) {
      if (marker.text === "End")
        player.loop() ? player.markers.prev("Start") : player.pause();
    },
    markers: markers,
  });

  player.currentTime(video_data.params.video_start);
}

player.volume(video_data.params.volume / 100);
player.playbackRate(video_data.params.speed);

/**
 * Method for getting the contents of a cookie
 *
 * @param {String} name Name of cookie
 * @returns {String|null} cookieValue
 */
function getCookieValue(name) {
  var cookiePrefix = name + "=";
  var matchedCookie = document.cookie.split(";").find(function (item) {
    return item.includes(cookiePrefix);
  });
  if (matchedCookie) return matchedCookie.replace(cookiePrefix, "");
  return null;
}

/**
 * Method for updating the 'PREFS' cookie (or creating it if missing)
 *
 * @param {number} newVolume New volume defined (null if unchanged)
 * @param {number} newSpeed New speed defined (null if unchanged)
 */
function updateCookie(newVolume, newSpeed) {
  var volumeValue = newVolume !== null ? newVolume : video_data.params.volume;
  var speedValue = newSpeed !== null ? newSpeed : video_data.params.speed;

  var cookieValue = getCookieValue("PREFS");
  var cookieData;

  if (cookieValue !== null) {
    var cookieJson = JSON.parse(decodeURIComponent(cookieValue));
    cookieJson.volume = volumeValue;
    cookieJson.speed = speedValue;
    cookieData = encodeURIComponent(JSON.stringify(cookieJson));
  } else {
    cookieData = encodeURIComponent(
      JSON.stringify({ volume: volumeValue, speed: speedValue }),
    );
  }

  // Set expiration in 2 year
  var date = new Date();
  date.setFullYear(date.getFullYear() + 2);

  var ipRegex = /^((\d+\.){3}\d+|[\dA-Fa-f]*:[\d:A-Fa-f]*:[\d:A-Fa-f]+)$/;
  var domainUsed = location.hostname;

  // Fix for a bug in FF where the leading dot in the FQDN is not ignored
  if (
    domainUsed.charAt(0) !== "." &&
    !ipRegex.test(domainUsed) &&
    domainUsed !== "localhost"
  )
    domainUsed = "." + location.hostname;

  var secure = location.protocol.startsWith("https") ? " Secure;" : "";

  document.cookie =
    "PREFS=" +
    cookieData +
    "; SameSite=Lax; path=/; domain=" +
    domainUsed +
    "; expires=" +
    date.toGMTString() +
    ";" +
    secure;

  video_data.params.volume = volumeValue;
  video_data.params.speed = speedValue;
}

player.on("ratechange", function () {
  updateCookie(null, player.playbackRate());
  if (isMobile()) {
    player.mobileUi({
      touchControls: { seekSeconds: 5 * player.playbackRate() },
    });
  }
});

player.on("volumechange", function () {
  updateCookie(Math.ceil(player.volume() * 100), null);
});

player.on("waiting", function () {
  if (
    player.playbackRate() > 1 &&
    player.liveTracker.isLive() &&
    player.liveTracker.atLiveEdge()
  ) {
    console.info("Player has caught up to source, resetting playbackRate");
    player.playbackRate(1);
  }
});

if (
  video_data.premiere_timestamp &&
  Math.round(new Date() / 1000) < video_data.premiere_timestamp
) {
  player.getChild("bigPlayButton").hide();
}

if (video_data.params.save_player_pos) {
  const url = new URL(location);
  const hasTimeParam = url.searchParams.has("t");
  const rememberedTime = get_video_time();
  let lastUpdated = 0;

  if (!hasTimeParam) {
    if (rememberedTime >= video_data.length_seconds - 20)
      set_seconds_after_start(0);
    else set_seconds_after_start(rememberedTime);
  }

  player.on("timeupdate", function () {
    const raw = player.currentTime();
    const time = Math.floor(raw);

    if (lastUpdated !== time && raw <= video_data.length_seconds - 15) {
      save_video_time(time);
      lastUpdated = time;
    }
  });
} else remove_all_video_times();

if (video_data.params.autoplay) {
  var bpb = player.getChild("bigPlayButton");
  bpb.hide();

  player.ready(function () {
    new Promise(function (resolve, reject) {
      setTimeout(function () {
        resolve(1);
      }, 1);
    }).then(function (result) {
      var promise = player.play();

      if (promise !== undefined) {
        promise
          .then(function () {})
          .catch(function (error) {
            bpb.show();
          });
      }
    });
  });
}

if (!video_data.params.listen && video_data.params.quality === "dash") {
  player.httpSourceSelector();

  if (video_data.params.quality_dash !== "auto") {
    player.ready(function () {
      player.on("loadedmetadata", function () {
        const qualityLevels = Array.from(player.qualityLevels()).sort(
          function (a, b) {
            return a.height - b.height;
          },
        );
        let targetQualityLevel;
        switch (video_data.params.quality_dash) {
          case "best":
            targetQualityLevel = qualityLevels.length - 1;
            break;
          case "worst":
            targetQualityLevel = 0;
            break;
          default:
            const targetHeight = parseInt(video_data.params.quality_dash);
            for (let i = 0; i < qualityLevels.length; i++) {
              if (qualityLevels[i].height <= targetHeight)
                targetQualityLevel = i;
              else break;
            }
        }
        qualityLevels.forEach(function (level, index) {
          level.enabled = index === targetQualityLevel;
        });
      });
    });
  }
}

player.vttThumbnails({
  src: "/api/v1/storyboards/" + video_data.id + "?height=90",
  showTimestamp: true,
});

// Enable annotations
if (!video_data.params.listen && video_data.params.annotations) {
  addEventListener("load", function (e) {
    addEventListener("__ar_annotation_click", function (e) {
      const url = e.detail.url,
        target = e.detail.target,
        seconds = e.detail.seconds;
      var path = new URL(url);

      if (path.href.startsWith("https://www.youtube.com/watch?") && seconds) {
        path.search += "&t=" + seconds;
      }

      path = path.pathname + path.search;

      if (target === "current") {
        location.href = path;
      } else if (target === "new") {
        open(path, "_blank");
      }
    });

    helpers.xhr(
      "GET",
      "/api/v1/annotations/" + video_data.id,
      {
        responseType: "text",
        timeout: 60000,
      },
      {
        on200: function (response) {
          var video_container = document.getElementById("player");
          videojs.registerPlugin(
            "youtubeAnnotationsPlugin",
            youtubeAnnotationsPlugin,
          );
          if (player.paused()) {
            player.one("play", function (event) {
              player.youtubeAnnotationsPlugin({
                annotationXml: response,
                videoContainer: video_container,
              });
            });
          } else {
            player.youtubeAnnotationsPlugin({
              annotationXml: response,
              videoContainer: video_container,
            });
          }
        },
      },
    );
  });
}

function change_volume(delta) {
  const curVolume = player.volume();
  let newVolume = curVolume + delta;
  newVolume = helpers.clamp(newVolume, 0, 1);
  player.volume(newVolume);
}

function toggle_muted() {
  player.muted(!player.muted());
}

function skip_seconds(delta) {
  const duration = player.duration();
  const curTime = player.currentTime();
  let newTime = curTime + delta;
  newTime = helpers.clamp(newTime, 0, duration);
  player.currentTime(newTime);
}

function set_seconds_after_start(delta) {
  const start = video_data.params.video_start;
  player.currentTime(start + delta);
}

function save_video_time(seconds) {
  const all_video_times = get_all_video_times();
  all_video_times[video_data.id] = seconds;
  helpers.storage.set(save_player_pos_key, all_video_times);
}

function get_video_time() {
  return get_all_video_times()[video_data.id] || 0;
}

function get_all_video_times() {
  return helpers.storage.get(save_player_pos_key) || {};
}

function remove_all_video_times() {
  helpers.storage.remove(save_player_pos_key);
}

function set_time_percent(percent) {
  const duration = player.duration();
  const newTime = duration * (percent / 100);
  player.currentTime(newTime);
}

function play() {
  player.play();
}
function pause() {
  player.pause();
}
function stop() {
  player.pause();
  player.currentTime(0);
}
function toggle_play() {
  player.paused() ? play() : pause();
}

const toggle_captions = (function () {
  let toggledTrack = null;

  function bindChange(onOrOff) {
    player.textTracks()[onOrOff]("change", function (e) {
      toggledTrack = null;
    });
  }

  // Wrapper function to ignore our own emitted events and only listen
  // to events emitted by Video.js on click on the captions menu items.
  function setMode(track, mode) {
    bindChange("off");
    track.mode = mode;
    setTimeout(function () {
      bindChange("on");
    }, 0);
  }

  bindChange("on");
  return function () {
    if (toggledTrack !== null) {
      if (toggledTrack.mode !== "showing") {
        setMode(toggledTrack, "showing");
      } else {
        setMode(toggledTrack, "disabled");
      }
      toggledTrack = null;
      return;
    }

    // Used as a fallback if no captions are currently active.
    // TODO: Make this more intelligent by e.g. relying on browser language.
    let fallbackCaptionsTrack = null;

    const tracks = player.textTracks();
    for (let i = 0; i < tracks.length; i++) {
      const track = tracks[i];
      if (track.kind !== "captions") continue;

      if (fallbackCaptionsTrack === null) {
        fallbackCaptionsTrack = track;
      }
      if (track.mode === "showing") {
        setMode(track, "disabled");
        toggledTrack = track;
        return;
      }
    }

    // Fallback if no captions are currently active.
    if (fallbackCaptionsTrack !== null) {
      setMode(fallbackCaptionsTrack, "showing");
      toggledTrack = fallbackCaptionsTrack;
    }
  };
})();

function toggle_fullscreen() {
  player.isFullscreen() ? player.exitFullscreen() : player.requestFullscreen();
}

function increase_playback_rate(steps) {
  const maxIndex = options.playbackRates.length - 1;
  const curIndex = options.playbackRates.indexOf(player.playbackRate());
  let newIndex = curIndex + steps;
  newIndex = helpers.clamp(newIndex, 0, maxIndex);
  player.playbackRate(options.playbackRates[newIndex]);
}

addEventListener(
  "keydown",
  function (e) {
    if (e.target.tagName.toLowerCase() === "input") {
      // Ignore input when focus is on certain elements, e.g. form fields.
      return;
    }
    // See https://github.com/ctd1500/videojs-hotkeys/blob/bb4a158b2e214ccab87c2e7b95f42bc45c6bfd87/videojs.hotkeys.js#L310-L313
    const isPlayerFocused =
      false ||
      e.target === document.querySelector(".video-js") ||
      e.target === document.querySelector(".vjs-tech") ||
      e.target === document.querySelector(".iframeblocker") ||
      e.target === document.querySelector(".vjs-control-bar");
    let action = null;

    const code = e.keyCode;
    const decoratedKey =
      e.key +
      (e.altKey ? "+alt" : "") +
      (e.ctrlKey ? "+ctrl" : "") +
      (e.metaKey ? "+meta" : "");
    switch (decoratedKey) {
      case " ":
      case "k":
      case "MediaPlayPause":
        action = toggle_play;
        break;

      case "MediaPlay":
        action = play;
        break;
      case "MediaPause":
        action = pause;
        break;
      case "MediaStop":
        action = stop;
        break;

      case "ArrowUp":
        if (isPlayerFocused) action = change_volume.bind(this, 0.1);
        break;
      case "ArrowDown":
        if (isPlayerFocused) action = change_volume.bind(this, -0.1);
        break;

      case "m":
        action = toggle_muted;
        break;

      case "ArrowRight":
      case "MediaFastForward":
        action = skip_seconds.bind(this, 5 * player.playbackRate());
        break;
      case "ArrowLeft":
      case "MediaTrackPrevious":
        action = skip_seconds.bind(this, -5 * player.playbackRate());
        break;
      case "l":
        action = skip_seconds.bind(this, 10 * player.playbackRate());
        break;
      case "j":
        action = skip_seconds.bind(this, -10 * player.playbackRate());
        break;

      case "0":
      case "1":
      case "2":
      case "3":
      case "4":
      case "5":
      case "6":
      case "7":
      case "8":
      case "9":
        // Ignore numpad numbers
        if (code > 57) break;

        const percent = (code - 48) * 10;
        action = set_time_percent.bind(this, percent);
        break;

      case "c":
        action = toggle_captions;
        break;
      case "f":
        action = toggle_fullscreen;
        break;

      case "N":
      case "MediaTrackNext":
        action = next_video;
        break;
      case "P":
      case "MediaTrackPrevious":
        // TODO: Add support to play back previous video.
        break;

      // TODO: More precise step. Now FPS is taken equal to 29.97
      // Common FPS: https://forum.videohelp.com/threads/81868#post323588
      // Possible solution is new HTMLVideoElement.requestVideoFrameCallback() https://wicg.github.io/video-rvfc/
      case ",":
        action = function () {
          pause();
          skip_seconds(-1 / 29.97);
        };
        break;
      case ".":
        action = function () {
          pause();
          skip_seconds(1 / 29.97);
        };
        break;

      case ">":
        action = increase_playback_rate.bind(this, 1);
        break;
      case "<":
        action = increase_playback_rate.bind(this, -1);
        break;

      default:
        console.info("Unhandled key down event: %s:", decoratedKey, e);
        break;
    }

    if (action) {
      e.preventDefault();
      action();
    }
  },
  false,
);

// Add support for controlling the player volume by scrolling over it. Adapted from
// https://github.com/ctd1500/videojs-hotkeys/blob/bb4a158b2e214ccab87c2e7b95f42bc45c6bfd87/videojs.hotkeys.js#L292-L328
(function () {
  const pEl = document.getElementById("player");

  var volumeHover = false;
  var volumeSelector =
    pEl.querySelector(".vjs-volume-menu-button") ||
    pEl.querySelector(".vjs-volume-panel");
  if (volumeSelector !== null) {
    volumeSelector.onmouseover = function () {
      volumeHover = true;
    };
    volumeSelector.onmouseout = function () {
      volumeHover = false;
    };
  }

  function mouseScroll(event) {
    // When controls are disabled, hotkeys will be disabled as well
    if (!player.controls() || !volumeHover) return;

    event.preventDefault();
    var wheelMove = event.wheelDelta || -event.detail;
    var volumeSign = Math.sign(wheelMove);

    change_volume(volumeSign * 0.05); // decrease/increase by 5%
  }

  player.on("mousewheel", mouseScroll);
  player.on("DOMMouseScroll", mouseScroll);
})();

// Since videojs-share can sometimes be blocked, we defer it until last
if (player.share) player.share(shareOptions);

// show the preferred caption by default
if (player_data.preferred_caption_found) {
  player.ready(function () {
    if (!video_data.params.listen && video_data.params.quality === "dash") {
      // play.textTracks()[0] on DASH mode is showing some debug messages
      player.textTracks()[1].mode = "showing";
    } else {
      player.textTracks()[0].mode = "showing";
    }
  });
}

// Safari audio double duration fix
if (navigator.vendor === "Apple Computer, Inc." && video_data.params.listen) {
  player.on("loadedmetadata", function () {
    player.on("timeupdate", function () {
      if (
        player.remainingTime() < player.duration() / 2 &&
        player.remainingTime() >= 2
      ) {
        player.currentTime(player.duration() - 1);
      }
    });
  });
}

// Safari screen timeout on looped video playback fix
if (
  navigator.vendor === "Apple Computer, Inc." &&
  !video_data.params.listen &&
  video_data.params.video_loop
) {
  player.loop(false);
  player.ready(function () {
    player.on("ended", function () {
      player.currentTime(0);
      player.play();
    });
  });
}

// Watch on Invidious link
if (location.pathname.startsWith("/embed/")) {
  const Button = videojs.getComponent("Button");
  let watch_on_invidious_button = new Button(player);

  // Create hyperlink for current instance
  var redirect_element = document.createElement("a");
  redirect_element.setAttribute(
    "href",
    location.pathname.replace("/embed/", "/watch?v="),
  );
  redirect_element.appendChild(document.createTextNode("Invidious"));

  watch_on_invidious_button.el().appendChild(redirect_element);
  watch_on_invidious_button.addClass("watch-on-invidious");

  var cb = player.getChild("ControlBar");
  cb.addChild(watch_on_invidious_button);
}

addEventListener("DOMContentLoaded", function () {
  // Save time during redirection on another instance
  const changeInstanceLink = document.querySelector(
    "#watch-on-another-invidious-instance > a",
  );
  if (changeInstanceLink)
    changeInstanceLink.addEventListener("click", function () {
      changeInstanceLink.href = addCurrentTimeToURL(changeInstanceLink.href);
    });
});