include ../mixins/post
include ../mixins/header
include ../mixins/head
include ../utils
doctype html
html
  +head("home")
  script(defer).
    async function subscribe(sub) {
      await doThing(sub, 'subscribe');
    }

    async function unsubscribe(sub) {
      await doThing(sub, 'unsubscribe');
    }

    function getCookie(name) {
      const value = `; ${document.cookie}`;
      const parts = value.split(`; ${name}=`);
      if (parts.length === 2) return parts.pop().split(";").shift();
    }

    async function doThing(sub, thing) {
      const jwtToken = getCookie("auth_token");
      const response = await fetch(`/${thing}`, {
        method: 'POST',
        headers: {
          'Authorization': `Bearer ${jwtToken}`,
          'Content-Type': 'application/json',
        },
        body: JSON.stringify({ subreddit: sub }),
      });

      let thinger = document.getElementById('thinger');
      if (thing == 'subscribe') {
        thinger.innerText = 'unsubscribe';
      } else  {
        thinger.innerText = 'subscribe';
      }

      if (!response.ok) {
        console.error(`Failed to do ${thing}`);
      }
    }

    function toggleDetails(details_id) {
      var detailsElement = document.getElementById(details_id);
      if (detailsElement) {
        detailsElement.open = !detailsElement.open;
      }
    }

  body
    main#content
      +header(user)
      div.hero
        div.sub-title
          h1 
            if isMulti
              a(href=`/`) readit
            else
              a(href=`/r/${subreddit}`)
                | r/#{subreddit}
          if !isMulti
            div#button-container
              if isSubbed
               button(onclick=`unsubscribe('${subreddit}')`)#thinger unsubscribe
              else
               button(onclick=`subscribe('${subreddit}')`)#thinger subscribe
        if about && !isMulti
          p #{about.public_description}
        else 
          p 
            | consider donating to 
            a(href="https://donate.stripe.com/dR62bTaZH1295Da4gg") oppiliappan
            |, author of readit
        details
          summary.sorting sorting by #{query.sort + (query.t?' '+query.t:'')}
          div.sort-opts
            a(href=`/r/${subreddit}?sort=hot`) hot
            a(href=`/r/${subreddit}?sort=new`) new
            a(href=`/r/${subreddit}?sort=rising`) rising
            a(href=`/r/${subreddit}?sort=top`) top
            a(href=`/r/${subreddit}?sort=top&t=day`) top day
            a(href=`/r/${subreddit}?sort=top&t=week`) top week
            a(href=`/r/${subreddit}?sort=top&t=month`) top month
            a(href=`/r/${subreddit}?sort=top&t=year`) top year
            a(href=`/r/${subreddit}?sort=top&t=all`) top all

      if posts
        each child in posts.posts
          +post(child.data)
        
        if posts.after
          div.footer
            div.footer-item
              - var newQuery = {...query, after: posts.after}
              a(href=`/r/${subreddit}?${encodeQueryParams(newQuery)}`) next ⟶