/* ==========================================================================
   Ertunç Özbay — Workshop & Portfolio Script (Plain JS, No Dependencies)
   Handles:
   1. Accessible mobile navigation menu toggle (with Escape key support)
   2. Static blog category filtering on the Blog page
   ========================================================================== */

(function () {
  "use strict";

  // 1. Mobile Navigation Toggle
  var navToggle = document.querySelector("[data-nav-toggle]");
  var siteNav = document.querySelector("[data-site-nav]");

  if (navToggle && siteNav) {
    navToggle.addEventListener("click", function () {
      var isExpanded = navToggle.getAttribute("aria-expanded") === "true";
      var nextState = !isExpanded;
      navToggle.setAttribute("aria-expanded", String(nextState));
      siteNav.classList.toggle("is-open", nextState);
      var labelSpan = navToggle.querySelector("[data-nav-label]");
      if (labelSpan) {
        labelSpan.textContent = nextState ? "Close" : "Menu";
      }
    });

    // Close mobile menu when pressing Escape
    document.addEventListener("keydown", function (event) {
      if (event.key === "Escape" && siteNav.classList.contains("is-open")) {
        navToggle.setAttribute("aria-expanded", "false");
        siteNav.classList.remove("is-open");
        var labelSpan = navToggle.querySelector("[data-nav-label]");
        if (labelSpan) {
          labelSpan.textContent = "Menu";
        }
        navToggle.focus();
      }
    });
  }

  // 2. Blog Category Filter (Progressive Enhancement)
  var filterButtons = document.querySelectorAll("[data-blog-filter]");
  var blogCards = document.querySelectorAll("[data-blog-category]");
  var filterStatus = document.getElementById("blog-filter-status");

  if (filterButtons.length > 0 && blogCards.length > 0) {
    filterButtons.forEach(function (button) {
      button.addEventListener("click", function () {
        var selectedCategory = button.getAttribute("data-blog-filter");

        filterButtons.forEach(function (btn) {
          btn.setAttribute("aria-pressed", btn === button ? "true" : "false");
        });

        var visibleCount = 0;
        blogCards.forEach(function (card) {
          var categories = (card.getAttribute("data-blog-category") || "").split(",");
          var match = selectedCategory === "all" || categories.indexOf(selectedCategory) !== -1;
          card.hidden = !match;
          if (match) {
            visibleCount += 1;
          }
        });

        if (filterStatus) {
          filterStatus.textContent =
            "Showing " + visibleCount + (visibleCount === 1 ? " entry" : " entries") +
            (selectedCategory === "all" ? "." : " in selected category.");
        }
      });
    });
  }
})();