script.js

const STREAMING_PLATFORMS = [
  { name: "Spotify", link: "https://open.spotify.com/artist/6q9PvW3q4He4W8ViZFLtjT" },
  { name: "Youtube", link: "https://www.youtube.com/channel/UCSOKARALDelvhq8Oxg1URCw/featured" },
  { name: "Apple Music", link: "https://music.apple.com/us/artist/jacksonian/1681131702" },
  { name: "Amazon Music", link: "https://www.amazon.com/music/player/artists/B0C1S65ZL7/jacksonian" },
];

const VIDEO_PLAYLISTS = [
  { name: "Tennis Playlist", link: "https://www.youtube.com/playlist?list=PLKiPzHDmkJGM" },
  { name: "Lifting Playlist", link: "https://www.youtube.com/playlist?list=PLBI6Tkq8_ZEU" },
];

const OLD_TENNIS_VIDEOS = [
  { name: "7/31/23 – Singles R128, Set 1", link: "https://www.youtube.com/watch?v=SFmWbVKMc5A" },
  { name: "7/31/23 – Singles R128, Set 2", link: "https://www.youtube.com/watch?v=qEF6g-4M0ok" },
  { name: "1/18/23 – Casual Singles", link: "https://www.youtube.com/watch?v=PS-PEf6kgW4" },
  { name: "1/28/23 – Pickleball", link: "https://www.youtube.com/watch?v=NXcOaojsPIk" },
  { name: "1/16/23 – Casual Doubles", link: "https://www.youtube.com/watch?v=PJTQmBBEY4A" },
];

const WRITTEN_PIECES = [
  { name: "Community for Remote Teams", link: "https://medium.com/@jacksonion/community-for-remote-teams-ba44b727a49d" },
  { name: "Fake Accounts: The Persistent Virus of Today", link: "https://medium.com/@jacksonion/fake-accounts-the-persistent-virus-of-today-40947aac9ded" },
];

const SOCIAL_MEDIA = [
  { name: "Twitter", link: "https://twitter.com/jacksonBcookin" },
  { name: "LinkedIn", link: "https://www.linkedin.com/in/jackson-cook/" },
  { name: "Facebook", link: "https://www.facebook.com/jacksonian.music" },
];

const LINK_GROUPS = [
  { title: "Find my music", items: STREAMING_PLATFORMS },
  { title: "Video content", items: VIDEO_PLAYLISTS },
  { title: "Old Tennis Videos", items: OLD_TENNIS_VIDEOS },
  { title: "Written Pieces", items: WRITTEN_PIECES },
  { title: "Social Media", items: SOCIAL_MEDIA },
];

const SONG_LYRICS = [
  {
    title: "Ocarina Dude",
    image: "images/album_cover_ocarina_dude.jpg",
    lyrics: "~Jacksonian~\n\nYoung professional yuppie\nPet yo' puppy\nHit the gym everyday with my duffie\n\nI should feel lucky\nTo have money\nBut I don’t\nI am ungrateful fuck me\n\nAlways hungry\nCan’t feel comfy\nChasing dreams like cumulus so puffy\n\nHaters can’t snuff me\nPolice don’t cuff me\nPlay my ocarina so my music can drug me\n\nEvery day trying to improve\nThat is my signature move\nReadin’, skiiin’, trainin’, playin’, workin’ on communication\n\nWaitin’ for that day\nOn my bed I lay\nWhat I’m not doing my thoughts don’t say\n\nDistract me, attack me, you will never crack me\nI am a man with a plan outran the lands of painting tomato cans\n\nManufacturing the happenings avoiding my own saddening\nEverytime I start unravelling I keep on paddling\nIn my mind these thoughts keep rattling\nRattatattatattatatattling",
  },
  {
    title: "Rhythm of the Island",
    image: "images/album_cover_roti.jpg",
    lyrics: "~Jacksonian~\n\nHello from Hawaii\nAmongst the chickens!\n\nSun goes up\nSun goes down\nThat’s called the sunrise and sunset\n\nBall of fire\nNever tires (never tires)\nNever ending sunrise and sunset\n\nTide comes in\nTide goes out\nThat’s the motion of the ocean\n\nAlways emotional\nComes the pull\nThat’s the motion of the ocean\n\nMeet new friends\nLearn about\nThat’s the rhythm of the island\n\nFeelings come\nFeelings go\nThat’s the rhythm of the I (chicken)",
  },
  {
    title: "Friends of the Past",
    image: "images/album_cover_fotp.jpg",
    lyrics: "~Jacksonian~\n\nDrivin’ down to Tulsa,\nConnor and George in soe\nChasing our dreams,\ncarrying youthful glow\nMet Connor on the playground,\nboth of us two years old\nBound by destiny,\nto travels yet been told\nMet George in the hallway,\nyoung minds yet to mold\nCollege dorm-mates,\nluck of the dice rolled.\n\nCows to our left,\ncorn to our right\nRollin’ in the hatchback,\nwe ain’t got no plight\nWhat waits for us in Tulsa,\nwe have no foresight\nFor love…we continue to fight\n\nRiding across the country,\nyears to catch up on\nSharing bout past lovers,\ncrackin’ some cold ones\nSharing success\nSharing failures\nBeing truthful and honest\nSharing in prayer\nNot much has changed\nafter all these years\nBeautiful stars to see\nafter the clouds clear\n\nGeorge has a masters\nJackson is a rapper\nConnor still dresses dapper\nBut the question at hand\nHas yet to land\nIs Connor’s E  girl real?",
  },
  {
    title: "Mr. Chewflocka",
    image: "images/album_cover_chewflocka.jpg",
    lyrics: "~Jacksonian~\n\nMr. Chewflocka?\nGLRGLRGLRGLR\n\nGLRGLRGLRGLR\n\nGLRGLRGLRGLR\n\nMr. Chewflocka?\n\nGLRGLRGLRGLR\n\nMr. Chewflocka?\n\nGLRGLRGLRGLR",
  },
  {
    title: "Skeleton",
    image: "images/album_cover_skeleton.jpg",
    lyrics: "~Jacksonian~\n\nI am a skeleton\nThat is irrelevant\n\nInfrastructure\nCore\nGroundwork.\nIrrigation\nFoundation\nBones\n\nSkeleton provide support for everything you do\nBones muscle tissue\n\nThey call a skeleton head a skull\n\nCrankin’ my hog walkin’ my dog\nPee on a fire hydrant\nThat’s me, not my dog\nI pee on anything that moves and doesn’t\nCuz sometimes I gotta pee\n\nOsteopotic yeh Im a little neurotic\nBrittle stone quakes alone til the point were the joint breaks\nA mineral fate inundated by lactate from frustrate you cupcake\nRiddling as you’re fiddling tid tad twiddling\nwillowing as the tick tock ticketing ricketing ricketing ricketing. Fidgeting as the smoke starts billowing.\nAbandon your vessel or wrestle perpetual ancestral spectral pretzels\nNuzzled in each bezel\nlevel shoveling deeper and deeper til you’re befuddled forever uncuddled always troubled\n\nRespect your core",
  },
  {
    title: "Bitchin' Hour",
    image: "images/album_cover_bitchin_hour.jpg",
    lyrics: "Coming Soon ;)",
  },
  {
    title: "Lost",
    image: "images/album_cover_lost.jpg",
    lyrics: "Coming Soon ;}",
  },
];

function renderLinkGroups() {
  const container = document.getElementById("link-groups");
  for (const group of LINK_GROUPS) {
    const section = document.createElement("div");
    section.className = "link-group";

    const heading = document.createElement("h3");
    heading.textContent = group.title;
    section.appendChild(heading);

    const list = document.createElement("ul");
    for (const item of group.items) {
      const li = document.createElement("li");
      const a = document.createElement("a");
      a.href = item.link;
      a.textContent = item.name;
      a.target = "_blank";
      a.rel = "noopener noreferrer";
      li.appendChild(a);
      list.appendChild(li);
    }
    section.appendChild(list);
    container.appendChild(section);
  }
}

function renderAlbums() {
  const container = document.getElementById("albums");
  const modal = document.getElementById("lyrics-modal");
  const modalTitle = document.getElementById("modal-title");
  const modalLyrics = document.getElementById("modal-lyrics");

  for (const song of SONG_LYRICS) {
    const figure = document.createElement("figure");
    figure.className = "album";

    const button = document.createElement("button");
    button.type = "button";
    button.className = "album-trigger";

    const img = document.createElement("img");
    img.src = song.image;
    img.alt = `Album cover for ${song.title}`;
    img.className = "album-image";
    button.appendChild(img);

    button.addEventListener("click", () => {
      modalTitle.textContent = song.title;
      modalLyrics.textContent = song.lyrics;
      modal.showModal();
    });

    const caption = document.createElement("figcaption");
    caption.className = "album-caption";
    caption.textContent = song.title;

    figure.appendChild(button);
    figure.appendChild(caption);
    container.appendChild(figure);
  }

  document.getElementById("modal-close").addEventListener("click", () => modal.close());
  modal.addEventListener("click", (event) => {
    if (event.target === modal) modal.close();
  });
}

function initScrollReveal() {
  const targets = document.querySelectorAll(".reveal");
  const reduceMotion = window.matchMedia("(prefers-reduced-motion: reduce)").matches;

  if (reduceMotion || !("IntersectionObserver" in window)) {
    targets.forEach((el) => el.classList.add("in-view"));
    return;
  }

  const observer = new IntersectionObserver(
    (entries) => {
      for (const entry of entries) {
        if (entry.isIntersecting) {
          entry.target.classList.add("in-view");
          observer.unobserve(entry.target);
        }
      }
    },
    { threshold: 0.15 }
  );

  targets.forEach((el) => observer.observe(el));
}

renderLinkGroups();
renderAlbums();
initScrollReveal();