{{ define "title" }}{{ .Title }}{{ end }}
{{ define "header" }} {{ end }}
{{ define "top" }}{{ end }}
{{ define "content" }}
<div style="margin: 0 auto; width: 400px;">
  <h3>Add Board</h3>
  <form id="new-post" action="/{{ .Key }}/addboard" method="post" enctype="application/x-www-form-urlencoded">
    <label>Name:</label><br>
    <input type="text" name="name" placeholder="g" required><br>
    <label>Prefered Name:</label><br>
    <input type="text" name="prefname" placeholder="Technology" required><input type="submit" value="Add"><br>
    <label>Summary:</label><br>
    <textarea name="summary" rows="8" cols="50"></textarea><br>
    <label>Restricted:</label><br>
    <select name="restricted">
      <option value="True">True</option>
      <option value="False">False</option>          
    </select>
  </form>
  
  <h3>Post News</h3>
  <form id="news" action="/{{ .Key }}/postnews" method="post" enctype="application/x-www-form-urlencoded">
    <label>Title:</label><br>
    <input type="text" name="title" placeholder="{{.Actor}} was created!" required><input type="submit" value="Post"><br>
    <label>Content:</label><br>
    <textarea name="summary" rows="8" cols="50"></textarea><br>
  </form>

  <ul style="display: inline-block; padding: 0;">
    <li style="display: inline-block;"><a href="#following">Subscribed</a></li>
    <!-- <li style="display: inline-block;"><a href="javascript:show('followers')">Followers</a></li> -->
    <li style="display: inline-block;"><a href="#reported">Reported</a></li>            
  </ul>
</div>    

<div id="following" class="popup-box" style="margin-bottom: 25px; padding: 12px;">
  <h4 style="margin: 0; margin-bottom: 5px;">Subscribed</h4>
  <form id="follow-form" action="/{{ .Key }}/follow" method="post" enctype="application/x-www-form-urlencoded">
    <input id="follow" name="follow" style="margin-bottom: 12px;" placeholder="http://localhost:3000/g"></input><input type="submit" value="Subscribe"><br>
    <input type="hidden" name="actor" value="{{ .Actor }}">        
  </form>
  <ul style="display: inline-block; padding: 0; margin: 0; list-style-type: none;">  
    {{ $actor := .Actor }}
    {{ $key := .Key }}
    {{ range .Following }}
    <li><a href="/{{ $key }}/follow?follow={{ . }}&actor={{ $actor }}">[Unfollow]</a><a href="{{ . }}">{{ . }}</a></li>
    {{ end }}
  </ul>
</div>

<div id="followers" class="popup-box" style="margin-bottom: 25px; padding: 12px; display:none;">
  <h4 style="margin: 0; margin-bottom: 5px;">Followers</h4>
  <ul style="display: inline-block; padding: 0; margin: 0; list-style-type: none;">    
    {{ range .Followers }}
    <li><a href="http://localhost:3000/g">{{ . }}</a></li>
    {{ end }}        
  </ul>      
</div>

<div id="reported" class="popup-box" style="margin-bottom: 25px; padding: 12px;">
  <h4 style="margin: 0; margin-bottom: 5px;">Reported</h4>
  <ul style="display: inline-block; padding: 0; margin: 0; list-style-type: none;">      
  </ul>            
</div>
{{ end }}
{{ define "bottom" }}{{ end }}

{{ define "script" }}
{{ end }}