const langArr = [
  {
    lang: "ru",
    title: "Русский",
    titleMobile: "RU",
    active: true,
  },
  {
    lang: "en",
    title: "English",
    titleMobile: "EN",
    active: false,
  },
];

const key = "KRYSTALVPN";

window.onload = function () {
  let position = null;

  try {
    position = JSON.parse(localStorage.getItem(key));
  } catch (error) {
    console.log("localStorage is not supported");
  }

  if (position != null) {
    setOriented(position);
  }

  set_current_year();
};

window.addEventListener("resize", () => {
  let position = null;

  try {
    position = JSON.parse(localStorage.getItem(key));
  } catch (error) {
    console.log("localStorage is not supported");
  }

  if (mobileCheck() && window.innerWidth <= 1023) {
    setOriented(position);
  }
  else {
    setOriented("Portrait");
  }
});

function do_download() {
  window.open("https://play.google.com/store/apps/details?id=com.krystal.vpn");
}

function openLang(platform) {
  const dropdownMenu =
    platform === "desktop"
      ? document.querySelector(".dropdown-menu")
      : document.querySelector(".dropdown-menu.mobile");

  if (platform === "mobile") {
    const mobArrow = document.querySelector(".chevron.mobile");

    if (mobArrow != null) {
      mobArrow.classList.toggle("rotated");
    }
  }

  if (dropdownMenu != null) {
    dropdownMenu.classList.toggle("show");
  }
}

function switchLang(lang, platform) {
  const dd = document.querySelector("#langSwitcher");
  const ddMobile = document.querySelector("#langSwitcherMobile");

  if (dd != null) {
    const title = langArr.filter((elem) => elem.lang === lang)[0].title;
    dd.innerHTML = title;

    const activeLang = langArr.filter((elem) => elem.lang !== lang)[0].lang;
    const activeLangNode = document.querySelector(
      `[data-lang=${CSS.escape(activeLang)}]`
    );

    if (activeLangNode != null) {
      activeLangNode.classList.remove("active");
    }

    const langNode = document.querySelector(`[data-lang=${CSS.escape(lang)}]`);
    const googlePlayImg = document.querySelector("[data-gp=ggl]");

    if (langNode != null) {
      langNode.classList.add("active");
    }

    if (googlePlayImg != null) {
      if (activeLang === "en") {
        googlePlayImg.src = "assets/google_play_ru.svg";
      }
      
      if (activeLang === "ru") {
        googlePlayImg.src = "assets/google_play.svg";
      }
    }

    for (const key in langDict) {
      const langNode = document.querySelector(`[data-lang=${CSS.escape(key)}]`);
      const langNodeMobile = document.querySelector(
        `[data-lang-mobile=${CSS.escape(key)}]`
      );

      if (langNode != null) {
        const translate = langDict[key][lang];

        if (translate != null) {
          langNode.innerHTML = translate;
        }
      }

      if (langNodeMobile != null) {
        const translate = langDict[key][lang];

        if (translate != null) {
          langNodeMobile.innerHTML = translate;
        }
      }

      if (googlePlayImg != null) {
        if (activeLang === "en") {
          googlePlayImg.src = "assets/google_play_ru.svg";
        }
        
        if (activeLang === "ru") {
          googlePlayImg.src = "assets/google_play.svg";
        }
      }
    }
  }

  if (ddMobile != null) {
    const title = langArr.filter((elem) => elem.lang === lang)[0].titleMobile;
    ddMobile.innerHTML = title;

    const activeLang = langArr.filter((elem) => elem.lang !== lang)[0].lang;
    const activeLangNodeMobile = document.querySelector(
      `[data-lang-mobile=${CSS.escape(activeLang)}]`
    );

    if (activeLangNodeMobile != null) {
      activeLangNodeMobile.classList.remove("active");
    }

    const langNodeMobile = document.querySelector(
      `[data-lang-mobile=${CSS.escape(lang)}]`
    );
    const googlePlayImg = document.querySelector("[data-gp=ggl]");

    if (langNodeMobile != null) {
      langNodeMobile.classList.add("active");
    }

    if (googlePlayImg != null) {
      if (activeLang === "en") {
        googlePlayImg.src = "assets/google_play_ru.svg";
      }
      
      if (activeLang === "ru") {
        googlePlayImg.src = "assets/google_play.svg";
      }
    }

    for (const key in langDict) {
      const langNodeMobile = document.querySelector(
        `[data-lang-mobile=${CSS.escape(key)}]`
      );

      if (langNodeMobile != null) {
        const translate = langDict[key][lang];

        if (translate != null) {
          langNodeMobile.innerHTML = translate;
        }
      }
    }
  }

  const dropdownMenu = document.querySelector(".dropdown-menu");
  const dropdownMenuMobile = document.querySelector(".dropdown-menu.mobile");

  if (dropdownMenu != null) {
    if (dropdownMenu.classList.contains("show")) {
      dropdownMenu.classList.remove("show");
    }
  }

  if (dropdownMenuMobile != null) {
    if (dropdownMenuMobile.classList.contains("show")) {
      dropdownMenuMobile.classList.remove("show");
    }

    if (mobileCheck()) {
      switchMobileMenu();
    }
  }

  if (platform === "mobile") {
    const mobArrow = document.querySelector(".chevron.mobile");

    if (mobArrow != null) {
      mobArrow.classList.toggle("rotated");
    }
  }
}

function set_current_year() {
  const year = new Date().getFullYear();
  const yearNode = document.querySelector(".year");

  if (yearNode != null) {
    yearNode.innerHTML = year;
  }
}

function do_support() {
  window.location.href = "mailto:[email protected]";
}

function switchMobileMenu() {
  const openedMenu = document.querySelector("#opened-menu");

  if (openedMenu != null) {
    openedMenu.classList.toggle("show");
  }
}

let portrait = window.matchMedia("(orientation: portrait)");

portrait.addEventListener("change", function (e) {
  if (e.matches) {
    try {
      localStorage.setItem(key, JSON.stringify("Portrait"));
    } catch (error) {
      console.log("localStorage is not supported");
    }

    setOriented("Portrait");
  } else {
    try {
      localStorage.setItem(key, JSON.stringify("Landscape"));
    } catch (error) {
      console.log("localStorage is not supported");
    }

    setOriented("Landscape");
  }
});

function setOriented(position) {
  if (position === "Landscape" && mobileCheck()) {
    const main = document.querySelector(".main");
    const header = document.querySelector("header");
    const mobileСrossWrapper = document.querySelector(".mobile-cross-wrapper");
    const cardBcgOne = document.querySelector(".card.bcg-one");
    const notationOne = document.querySelector(".notation-one");

    if (main != null) {
      main.classList.add("oriented");
    }

    if (header != null) {
      header.classList.add("oriented");
    }

    if (mobileСrossWrapper != null) {
      mobileСrossWrapper.classList.add("oriented");
    }

    if (cardBcgOne != null) {
      cardBcgOne.classList.add("oriented");
    }

    if (notationOne != null) {
      notationOne.classList.add("oriented");
    }
  }
  else {
    const main = document.querySelector(".main");
    const header = document.querySelector("header");
    const mobileСrossWrapper = document.querySelector(".mobile-cross-wrapper");
    const cardBcgOne = document.querySelector(".card.bcg-one");
    const notationOne = document.querySelector(".notation-one");

    if (main != null) {
      main.classList.remove("oriented");
    }

    if (header != null) {
      header.classList.remove("oriented");
    }

    if (mobileСrossWrapper != null) {
      mobileСrossWrapper.classList.remove("oriented");
    }

    if (cardBcgOne != null) {
      cardBcgOne.classList.remove("oriented");
    }

    if (notationOne != null) {
      notationOne.classList.remove("oriented");
    }
  }
}

function mobileCheck() {
  let check = false;
  (function(a){
    if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4)))
    check = true;
  })(navigator.userAgent||navigator.vendor||window.opera);

  var sizeCheck =  (window.innerWidth <= 800) && (window.innerHeight <= 600);

  return check || sizeCheck;
}