{# ------------------------------------------------------- #}
{# INDIVIDUAL VIEW FOR EACH storycontributor #}
{# This page can use any data from http:localhost:2000/cms/#/form/storycontributor/ #}
{# Webhook uses the SWIG.js (like Djagno/Twig) templating system. Their documentation is here: #}
{# http://paularmstrong.github.io/swig/docs/tags/ #}
{# Learn about calling data into Webhook pages here: #}
{# http://www.webhook.com/docs/template-rules-and-filters/ #}
{# ------------------------------------------------------- #}
{# Confused what extends and blocks do? Watch a primer: #}
{# http://www.webhook.com/docs/template-inheritance-blocks/ #}
{% extends "templates/partials/base.html" %}
{# This sets our page <title>. It will append this storycontributor's name to the site title defined in base.html #}
{% block title %}{% parent %} - {{ item.name }}{% endblock %}
{% block content %}
  <p><a href="{{ url('storycontributor') }}">View a list of all storycontributor</a></p>
  <h1>{{ item.name }}</h1>
  <ul>
      <li>
        <strong>Name: </strong>
        {{ item.name }}
      </li>
      <li>
        <strong>Create Date: </strong>
        {# Format the date. You can use PHP's date function to format as needed. http://php.net/manual/en/function.date.php #}
        {{ item.create_date|date('F d Y') }}
      </li>
      <li>
        <strong>Last Updated: </strong>
        {# Format the date. You can use PHP's date function to format as needed. http://php.net/manual/en/function.date.php #}
        {{ item.last_updated|date('F d Y') }}
      </li>
      <li>
        <strong>Publish Date: </strong>
        {# Format the date. You can use PHP's date function to format as needed. http://php.net/manual/en/function.date.php #}
        {{ item.publish_date|date('F d Y') }}
      </li>
      <li>
        <strong>First Name: </strong>
        {{ item.first_name }}
      </li>
      <li>
        <strong>Last Name: </strong>
        {{ item.last_name }}
      </li>
      <li>
        <strong>Title: </strong>
        {{ item.title }}
      </li>
      <li>
        <strong>Company: </strong>
        {{ item.company }}
      </li>
      <li>
        <strong>Bio - Short: </strong>
        {{ item.bio__short }}
      </li>
      <li>
        <strong>Bio - Full: </strong>
        {{ item.bio__full|safe }}
      </li>
      <li>
        <strong>Avatar: </strong>
        {# You can pull out a lot more information from the image property. Info here: #}
        {# http://www.webhook.com/docs/widget-template-reference/#image #}
        <img src="{{ item.avatar|imageSize(200) }}" />
      </li>
      <li>
        <strong>Website: </strong>
        {{ item.website }}
      </li>
      <li>
        <strong>Twitter: </strong>
        {{ item.twitter }}
      </li>
      <li>
        <strong>LinkedIn: </strong>
        {{ item.linkedin }}
      </li>
      <li>
        <strong>Preview URL: </strong>
        {{ item.preview_url }}
      </li>
      <li>
        <strong>Slug: </strong>
        {{ item.slug }}
      </li>
      <li>
        <strong>Story (Contributor - Primary): </strong>
        {# Relations require some special code. More info about relations here: #}
        {# http://www.webhook.com/docs/template-rules-and-filters/#getitem #}
        {% for relation in item.story_contributor__primary %}
          {# You can ouput more than just the name. Feel free to output more fields from the CMS. #}
          <a href="{{ url(relation) }}">{{ relation.name }}</a>{% if not loop.last %},{% endif %}
        {% endfor %}
      </li>
      <li>
        <strong>Story (Contributor - Additional): </strong>
        {# Relations require some special code. More info about relations here: #}
        {# http://www.webhook.com/docs/template-rules-and-filters/#getitem #}
        {% for relation in item.story_contributor__additional %}
          {# You can ouput more than just the name. Feel free to output more fields from the CMS. #}
          <a href="{{ url(relation) }}">{{ relation.name }}</a>{% if not loop.last %},{% endif %}
        {% endfor %}
      </li>
  </ul>
{% endblock %}
