<template>
  <main>
    <Section>
      <template v-slot:header>
        <h1>About me</h1>
      </template>

      <div class="section-content">
        <div class="introduction">
          <p>
            Hello, my name is Evert <q>Diamond</q> Prants. I am a
            {{ evertAge }}-year-old self-taught Web Developer and Systems
            Administrator from Estonia. I am generally a very curious person and
            thus I am interested in a very large variety of subjects, including,
            but not limited to, space exploration, electronics, computers,
            networks, programming, aviation, ships, cars and other scientific
            fields. I like to tell everyone that I use Arch Linux - sorry not
            sorry.
          </p>
          <p>
            I can pretty much code in any language and use any library with the
            help of documentation and instructional materials, so the
            <q>Programming</q> list is not very comprehensive.
          </p>
        </div>

        <div class="gridbox">
          <IconLinkList :list="linksList" title="Links" />
          <IconLinkList :list="socialLinks" title="Socials" />
        </div>

        <LanguageList />
      </div>
    </Section>

    <footer>
      <p>
        There are no cookies. There is no data collection.
        <a href="https://git.icynet.eu/evert/lunasqu.ee-nuxt" target="_blank"
          >Source code</a
        >
      </p>
      <p>
        <img
          src="/images/mail.gif"
          style="user-select: none; margin: auto; display: block; border: 0"
          alt="evert at sign luna squ dot ee"
        />
      </p>
      <p>&copy; 2018 - {{ currentYear }} Evert Prants</p>
    </footer>
  </main>
</template>

<script setup lang="ts">
const linksList = [
  {
    name: 'Blog (inactive)',
    icon: 'icon-rss-box',
    href: '/blog',
  },
  {
    name: 'Web apps',
    icon: 'icon-controller-classic',
    href: 'https://lunasqu.ee/apps',
  },
  {
    name: 'GnuPG Public Key',
    icon: 'icon-key-variant',
    href: 'https://lunasqu.ee/public/keys/pgp/Evert%20Prants.pub',
    blank: true,
  },
  {
    name: 'Icy Network',
    icon: 'icon-icynet',
    href: 'https://icynet.eu/',
    blank: true,
  },
];

const socialLinks = [
  {
    href: 'https://git.icynet.eu/evert',
    icon: 'icon-gitea',
    name: 'Gitea (personal git)',
  },
  {
    href: 'https://social.lunasqu.ee/diamond',
    icon: 'icon-pleroma',
    name: 'Pleroma (Mastodon)',
  },
  {
    href: 'https://reddit.com/user/LunaSquee',
    icon: 'icon-reddit-alien',
    name: 'Reddit',
  },
  {
    href: 'https://github.com/LunaSquee',
    icon: 'icon-github-circled',
    name: 'GitHub (mostly archives)',
  },
];

const currentYear = computed(() => new Date().getFullYear());
const evertAge = computed(() => {
  const today = new Date();
  const birthDate = new Date('2000-04-18');
  let age = today.getFullYear() - birthDate.getFullYear();
  const m = today.getMonth() - birthDate.getMonth();
  if (m < 0 || (m === 0 && today.getDate() < birthDate.getDate())) {
    age--;
  }
  return age;
});
</script>
