const API_URL = "https://api.lanyard.rest/v1/users/886971572668219392";

async function fetchDiscordData() {
  try {
    const response = await fetch(API_URL);
    const { data } = await response.json();

    // Set the main avatar
    const avatarUrl = `https://cdn.discordapp.com/avatars/${data.discord_user.id}/${data.discord_user.avatar}.png?size=2048`;
    document.getElementById("profile-img").src = avatarUrl;

    // Set the avatar inside profile card
    const profileImgCard = document.getElementById("profile-img-card");
    profileImgCard.src = avatarUrl;

    // Set the status class
    const profileContainer = document.getElementById("profile-container");
    profileContainer.classList.add(data.discord_status);

    let statusText = "Unknown";
    if (data.discord_status === "online") {
      statusText = "Online";
    } else if (data.discord_status === "dnd") {
      statusText = "In mode Do Not Disturb";
    } else if (data.discord_status === "idle") {
      statusText = "Idle";
    } else if (data.discord_status === "offline") {
      statusText = "Offline";
    } else if (data.listening_to_spotify) {
      statusText = `${data.discord_status} and Listening to Spotify`;
    }

    let statusActive;
    if (data.active_on_discord_web) {
      statusActive = "on Discord Web";
    } else if (data.active_on_discord_mobile) {
      statusActive = "on Discord Mobile";
    } else if (data.active_on_discord_desktop) {
      statusActive = "on Discord Desktop";
    } else {
      statusActive = "Unknown";
    }

    // Filter out custom activities
    const activities = data.activities.filter(activity => activity.id !== "custom");

    let playingType;
    if (activities.length > 0) {
      const activityType = activities[0].type;
      
      if (activityType === 0) {
        playingType = "PLAYING A GAME";
      } else if (activityType === 1) {
        playingType = "STREAMING TO";
      } else if (activityType === 2) {
        playingType = "LISTENING TO";
      } else if (activityType === 3) {
        playingType = "WATCHING";
      } else if (activityType === 4) {
        playingType = "COMPETING ON";
      }
    }

    let playingPlatform;
    if (activities.length > 0 && activities[0].platform) {
      playingPlatform = `PLAYING ON ${activities[0].platform.toUpperCase()}`;
    } else {
      playingPlatform = `${playingType}`;
    }

    // Set the decoration inside profile card
    const decorationAsset = data.discord_user.avatar_decoration_data?.asset;
    const decorationUrl = decorationAsset
      ? `https://cdn.discordapp.com/avatar-decoration-presets/${decorationAsset}.png?size=240&passthrough=true`
      : "";
    const profileDecorationCard = document.getElementById("profile-decoration-card");
    profileDecorationCard.src = decorationUrl;

    // Set global name and username
    document.querySelector(".global-name").textContent = data.discord_user.global_name || data.discord_user.username || "Unknown";
    document.querySelector(".username").textContent = `@${data.discord_user.username || data.discord_user.global_name || "Unknown"}`;
    const globalName = data.discord_user.global_name || data.discord_user.username || "Unknown";
    const visitDiscord = document.getElementById('visit-discord');
    visitDiscord.onclick = () => window.open("https://discord.com/users/886971572668219392", '_blank');
    
    // Set activity details
    const activityTimeElement = document.querySelector(".activity-time");
    const activityPlatformElement = document.querySelector(".activity-playing");

    if (activities.length > 0 && activities[0].assets?.large_image && !/^\d/.test(activities[0].assets.large_image)) {
      const activityImage = document.getElementById("activity-image");
      let largeImageUrl;

      if (activities[0].assets.large_image.startsWith("mp:")) {
        largeImageUrl = activities[0].assets.large_image.replace(/^mp:external\/.*\/https\//, 'https://');
      } else if (activities[0].assets.large_image.startsWith("spotify:")) {
        largeImageUrl = activities[0].assets.large_image.replace(/^spotify:\/.*\/https\//, '');
      } else if (activities[0].assets.large_image.startsWith("mp:attachments")) {
        largeImageUrl = activities[0].assets.large_image.replace(/^mp:attachments/, 'https://media.discordapp.net/attachments');
      } else {
        largeImageUrl = activities[0].assets.large_image;
      }

      activityImage.src = largeImageUrl;
      activityImage.alt = `${activities[0].name} Image`;
      activityImage.style.display = "block"; // Ensure the image is visible
    } else {
      const activityImage = document.getElementById("activity-image");
      activityImage.src = ""; // Clear the src attribute
      activityImage.alt = ""; // Clear the alt attribute
      activityImage.style.display = "none"; // Hide the image
    }

    if (activities.length > 0) {
      const activity = activities[0];
      const activityName = activity.name || "No activity";
      const maxLength = activity.assets?.large_image ? 15 : 20;
      document.querySelector(".activity-name").textContent = activityName.length > maxLength ? activityName.slice(0, maxLength) + "..." : activityName;
      activityPlatformElement.textContent = playingPlatform;
      
      const startTimestamp = activity.timestamps?.start;
      if (startTimestamp) {
        const now = Date.now();
        const elapsedMilliseconds = now - startTimestamp;
        const elapsedHours = Math.floor(elapsedMilliseconds / (1000 * 60 * 60));
        const elapsedMinutes = Math.floor((elapsedMilliseconds % (1000 * 60 * 60)) / (1000 * 60));
        const elapsedSeconds = Math.floor((elapsedMilliseconds % (1000 * 60)) / 1000);
        const elapsedTime = `for ${elapsedHours > 0 ? `${elapsedHours}h ` : ""}${
          elapsedMinutes > 0 ? `${elapsedMinutes}m ` : ""
        }${elapsedSeconds}s`.trim();
        activityTimeElement.textContent = elapsedTime;
        activityTimeElement.style.display = "block";
      } else {
        activityTimeElement.textContent = `currently ${globalName} is ${statusText} ${statusActive === "Unknown" ? "" : statusActive}`;
        activityTimeElement.style.display = "block";
      }
    } else {
      activityPlatformElement.style.display = "none";
      document.querySelector(".activity-name").textContent = "No activity";
      activityTimeElement.textContent = `currently ${globalName} is ${statusText} ${statusActive === "Unknown" ? "" : statusActive}`;
      // activityTimeElement.style.display = "none";
    }
  } catch (error) {
    console.error("Failed to fetch data from API:", error);
  }
}

fetchDiscordData();