extends site.pug

block head
  link(rel="stylesheet", href="/css/dashboard.css")
  style
    | #content { margin-left: 256px; }

block page
  #sidebar
    h1 Profile
    form#dashboard-profile(action=`/users/${user.name}/edit`, method="post")
      textarea(placeholder="bio (max 1024 chars)", maxlength="1024", name="bio", rows=5)= user.bio
      input(type="url", name="website", placeholder="website", value=user.website)
      button(type="submit") Edit
    h1(style="margin-top:1em;") Mood history
    ul#dashboard-mood-history
      for mood of moodHistory
        li
          strong= mood.mood
          |
          | #{mood.date}

block content
  p
    a(href="#feed") Feed
    |  / 
    a(href="#invite-codes") Invite codes
  form#dashboard-update-form(action="/update/mood", method="post", onsubmit="disable(this);")
    select(name="mood", required)
      //- Maybe put the index of the mood in the value of the option element
      //- so that indexOf (slow) wont have to be used everytime mood is updated
      for mood of moodsSorted
        option= mood
    textarea(name="desc", placeholder="mood description (max 512 chars)", rows="5", maxlength="512")
    button(type="submit") Update

  h1#feed(style="margin-top:0.5em;") Feed
  include _feed.pug
  +feed(recentUpdates)

  h1#invite-codes(style="margin-top:1em;") Invite codes
  p Invite your friends to the mipilin beta! You can create up to five invite codes every month, and they all expire within a week.
  p
    | Your current invite codes (
    strong= codesUsed
    | /5):
  if codes.length > 0
    table
      tbody
        tr
          th Token
          th Expires
        for code of codes
          tr
            td= code.token
            td= code.expires
  else
    .subtle You have no currently active invite codes.
  br
  form(action="/codes/create", method="post")
    button(type="submit", disabled=codesUsed>=5) Generate
  script(nonce=nonce).
    function disable(form) {
      const btn = form.querySelector("button");
      btn.setAttribute("disabled", true);

      setTimeout(() => {
        btn.removeAttribute("disabled");
      }, 3000)
    }