{% extends "base.html" %}
{% load i18n comments%}

{% block extra_head %}
<style type="text/css" media="screen and (min-width: 701px)">
 #teaser{background-image:url("{{random_photo.url}}")}</style>
<!--[if lt IE 9]><style type="text/css" media="screen">#teaser{background-image:url("{{random_photo.url}}")}</style><![endif]-->
{% endblock %}

{% block maincontent %}
 <section id="teaser" class="grid_8">
  <div id="teaser_text"><h2>{{title}}</h2>{{content}}</div>
 </section>
 <aside id="next_event" class="grid_4 red_box" itemscope itemtype="http://schema.org/Event">
 {% if current_event %}
  <h2>{% trans "Current Event" %}</h2>
  <h3>{{ current_event.name}}</h3>
  <p><img src="{{ STATIC_URL }}icons/date.png" /> {% trans "since" %} <time datetime="{{current_event.start|date:'c'}}">{{current_event.start|timesince}}</time></p>
  <ul class="list">
   <li class="event"><strong>{% trans "Start" %}:</strong> {{current_event.start|date:'DATETIME_FORMAT'}}</li>
   <li class="location"><strong>{% trans "Location" %}:</strong> {{ current_event.location }}</li>
  </ul>
  <div style="text-align:right"><a class="button" href="{{current_event.get_absolute_url}}">{% trans "More Details" %} <img src="{{ STATIC_URL }}icons/date_go.png" alt="&raquo;" width="16" height="16"/></a></div>
 {% else %}
  <h2>{% trans "Next Event" %}</h2>
  <h3>{{ next_event.name}}</h3>
  <p><img src="{{ STATIC_URL }}icons/date.png" alt="" width="16" height="16"/> {% trans "in" %} <time datetime="{{next_event.start|date:'c'}}">{{next_event.start|timeuntil}}</time></p>
  <ul class="list">
   <li class="event"><strong>{% trans "Start" %}:</strong> {{next_event.start|date:'DATETIME_FORMAT' }}</li>
   <li class="location"><strong>{% trans "Location" %}:</strong> {{ next_event.location }}</li>
  </ul>
  <div style="text-align:right"><a class="button" href="{{next_event.get_absolute_url}}">{% trans "More Details" %} <img src="{{ STATIC_URL }}icons/date_go.png" alt="&raquo;" width="16" height="16"/></a></div>
 {% endif %}
 <h3 class="clearfix">{% trans "Upcoming events" %} <a href="{% url 'events-ical' %}"><img src="{{STATIC_URL}}img/ical_feed.gif" alt="iCal Feed" title="iCal Feed" width="16" height="16"/></a></h3>
  <ul class="list">
   {% for event in upcoming_events %}
   <li class="event">{{event.start|date:'d. M:'}} <a href="{{ event.get_absolute_url}}">{{event.name}}</a></li>
   {% endfor %}
  </ul>
 </aside>
 <br class="clear" />

 <section class="grid_8">
 {% for article in recent_article_list %}{% get_comment_count for article as comment_count %}
  <article class="article">
   <header>
    <h2><a href="{{article.get_absolute_url}}">{{article.headline}}</a></h2>
    <ul class="info">
     <li><img src="{{STATIC_URL}}icons/date.png" width="16" height="16" alt="{% trans 'Created on' %}" title="{% trans 'Created on' %}"/>  <time date="{{article.date_created|date:'c'}}">{{ article.date_created|date }}</time></li>
     <li><img src="{{STATIC_URL}}icons/user_red.png" width="16" height="16" alt="{% trans 'Author' %}" title="{% trans 'Author' %}"/> {{ article.author }}</li>
     <li><img src="{{STATIC_URL}}icons/comments.png" alt="{% trans 'comments' %}:" title="{% trans 'comments' %}"/> <a href="{{article.get_absolute_url}}#comments" >{{comment_count}} {% trans "comments" %}</a></li>
    </ul>
   </header>
   <a href="{{article.get_absolute_url}}"><img src="{{article.posting_image.url}}" alt="{{article.category}}:" class="posting_image"/></a>
   {{article.content|truncatewords_html:50}}
   <footer class="more_link"><a href="{{article.get_absolute_url}}" class="button">{% trans "Read More"%} <img src="{{STATIC_URL}}icons/page_go.png" alt="&raquo;" width="16" height="16"/></a></footer>
  </article>
{% endfor %}
</section>

<aside class="grid_4">
 <section>
 <h2>{% trans "Recent Comments" %} <a href="{% url 'feed-latest-comments' %}"><img src="{{ STATIC_URL }}img/rss_feed.gif" alt="RSS Feed" title="RSS Feed" width="16" height="16"/></a></h2>
 <ul class="comment_list">
  {% for comment in recent_comment_list %}
  {% url 'membership-details' comment.user.username as user_link%}
  <li>
  {% blocktrans with comment.user as author and comment.submit_date|timesince as since and comment.submit_date|date:'c' as submit_date and comment.content_object as object and comment.get_absolute_url as comment_link%}
  From <a href="{{user_link}}">{{author}}</a> in
  <a href="{{comment_link}}">&ldquo;{{object}}&rdquo;</a>
  since <time datetime="{{submit_date}}">{{since}}</time>
  {% endblocktrans %}
  </li>
  {% endfor %}
 </ul>
 </section>

<section>
 <h2>{% trans 'Kasu in the social network' %}</h2>
 <p style="text-align: center">
  <a href="https://www.facebook.com/Kasu.at"><img src="{{STATIC_URL}}img/facebook.png" alt="Facebook" title="{% trans 'Visit us on' %} Facebook" /></a>
  <a href="https://twitter.com/KasuAustria"><img src="{{STATIC_URL}}img/twitter.png" alt="Twitter" title="{% trans 'Visit us on' %} Twitter" /></a>
  <a href="https://plus.google.com/u/0/114092233962732014973/"><img src="{{STATIC_URL}}img/google_plus.png" alt="Google+" title="{% trans 'Visit us on' %} Google+" /></a>
 </p>
</section>


</aside>
{% endblock %}

{% if perms.content.add_article %}{% block addidional_buttonbar %}
 <a href="{% url 'add-article' %}" class="button"><img src="{{ STATIC_URL }}icons/note_add.png" alt="" width="16" height="16"/>{% trans "Add Article" %}</a>
{% endblock %}{% endif %}