MAINHACK

Viewing / Editing File: portfolio.js

/* Rikon Rahman portfolio — theme toggle, scroll reveal, mobile nav, footer year */
(function () {
  "use strict";

// ---- Inject sun/moon icons + switch semantics into native Button widgets ----
  var SUN = '<svg class="rr-icon-sun" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="4"></circle><path d="M12 2v2M12 20v2M4.93 4.93l1.41 1.41M17.66 17.66l1.41 1.41M2 12h2M20 12h2M4.93 19.07l1.41-1.41M17.66 6.34l1.41-1.41"></path></svg>';
  var MOON = '<svg class="rr-icon-moon" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path></svg>';
  function initToggleButtons() {
    document.querySelectorAll(".rr-theme-toggle").forEach(function (btn) {
      if (btn.hasAttribute("data-rr-init")) return;
      btn.setAttribute("data-rr-init", "");
      btn.setAttribute("role", "switch");
      btn.setAttribute("title", "Toggle theme");
      btn.innerHTML = SUN + MOON;
    });
  }

// ---- Theme toggle ----
  function currentTheme() {
    return document.documentElement.dataset.theme === "dark" ? "dark" : "light";
  }
  function applyTheme(theme) {
    document.documentElement.dataset.theme = theme;
    try { localStorage.setItem("theme", theme); } catch (e) {}
    document.querySelectorAll(".rr-theme-toggle").forEach(function (btn) {
      var dark = theme === "dark";
      btn.setAttribute("aria-checked", dark ? "true" : "false");
      btn.setAttribute("aria-label", dark ? "Switch to light mode" : "Switch to dark mode");
    });
  }
  document.addEventListener("click", function (e) {
    var btn = e.target.closest(".rr-theme-toggle");
    if (!btn) return;
    e.preventDefault();
    applyTheme(currentTheme() === "dark" ? "light" : "dark");
  });
  initToggleButtons();
  applyTheme(currentTheme());
  // Re-inject after Elementor lazy/editor renders
  if (document.readyState === "loading") {
    document.addEventListener("DOMContentLoaded", function () { initToggleButtons(); applyTheme(currentTheme()); });
  }

// ---- Scroll reveal ----
  function initReveal() {
    var els = document.querySelectorAll("[data-reveal]");
    if (!els.length) return;
    var reduce = window.matchMedia("(prefers-reduced-motion: reduce)").matches;
    if (reduce || !("IntersectionObserver" in window)) {
      els.forEach(function (el) { el.classList.add("is-visible"); });
      return;
    }
    var io = new IntersectionObserver(function (entries) {
      entries.forEach(function (entry) {
        if (entry.isIntersecting) {
          var el = entry.target;
          var delay = parseInt(el.getAttribute("data-reveal-delay") || "0", 10);
          setTimeout(function () { el.classList.add("is-visible"); }, delay);
          io.unobserve(el);
        }
      });
    }, { rootMargin: "0px 0px -10% 0px", threshold: 0.08 });
    els.forEach(function (el) { io.observe(el); });
  }

// ---- Mobile nav toggle ----
  function initMobileNav() {
    document.addEventListener("click", function (e) {
      var t = e.target.closest(".rr-nav-toggle");
      if (!t) return;
      var nav = document.querySelector(".rr-mobile-nav");
      if (!nav) return;
      var open = nav.hasAttribute("hidden");
      if (open) { nav.removeAttribute("hidden"); } else { nav.setAttribute("hidden", ""); }
      t.setAttribute("aria-expanded", open ? "true" : "false");
    });
  }

// ---- Footer year ----
  function initYear() {
    document.querySelectorAll("[data-year]").forEach(function (el) {
      el.textContent = new Date().getFullYear();
    });
  }

if (document.readyState === "loading") {
    document.addEventListener("DOMContentLoaded", function () { initReveal(); initMobileNav(); initYear(); });
  } else {
    initReveal(); initMobileNav(); initYear();
  }
})();

Cancel / Back

[ MAINHACK ]

Viewing / Editing File: portfolio.js

Server Info

System Features

User Info