{% extends "cms/home.html" %}
{% load cms_tags danceschool_tags sekizai_tags thumbnail i18n %}

{% block title %}
	{% blocktrans with month=event_set.0.month|readable_month year=event_set.0.year title=event_set.0.classDescription.title %}
	{{ month }} {{ year }} Class Series - {{ title }}
	{% endblocktrans %}
{% endblock %}

{% block meta_title %}
	{% blocktrans with month=event_set.0.month|readable_month year=event_set.0.year title=event_set.0.classDescription.title %}
	{{ month }} {{ year }} Class Series - {{ title }}
	{% endblocktrans %}
{% endblock %}

{% block meta_description %}
	{% blocktrans with month=event_set.0.month|readable_month year=event_set.0.year title=event_set.0.classDescription.title startDate=event_set.0.startTime|date:'l, F jS' location=event_set.0.location %}
	Learn more through our {{ month }} {{ year }} class, {{ title }}. Classes begin {{ startDate }} at {{ location }}.
	{% endblocktrans %}
{% endblock %}

{% block facebook_og_description %}
	{% blocktrans with month=event_set.0.month|readable_month year=event_set.0.year title=event_set.0.classDescription.title startDate=event_set.0.startTime|date:'l, F jS' location=event_set.0.location %}
	Learn more through our {{ month }} {{ year }} class, {{ title }}. Classes begin {{ startDate }} at {{ location }}.
	{% endblocktrans %}
{% endblock %}

{% block body_id %}classes{% endblock %}

{% block content %}
	<h1 class="my-4">
		{% blocktrans with month=event_set.0.month|readable_month year=event_set.0.year title=event_set.0.classDescription.title %}
		{{ month }} {{ year }}: {{ title }}
		{% endblocktrans %}
	</h1>

	{% for series in event_set %}
	<div class="row">
		<div class="col-md-4 order-2">
			<div class="row mb-4">
			{% for teacher in series.teachers %}
				{% if teacher.image %}
					<img src="{% thumbnail teacher.image 118x118 crop %}" title="{{teacher.firstName}} {{teacher.lastName}}" alt="{{teacher.firstName}} {{teacher.lastName}}" width="118px" class="float-right" style="margin: 5px;" /> 
				{% endif %}
			{% endfor %}
			</div>
			<div class="row">

			{% block register_link %}
				{% if not series.soldOut and not series.registrationClosed and not series.registrationPassed %}
					<a class="btn btn-primary btn-lg" href="{% url 'registration' %}">{% trans "Register for this class!" %}</a>
				{% elif series.soldOut %}
					<button class="btn btn-secondary btn-lg disabled">{% trans "Sold Out!" %}</button>
				{% elif series.registrationEnabled and not series.status == series.RegStatus.linkOnly %}
					<button class="btn btn-secondary btn-lg disabled">{% trans "Registration Closed" %}</button>
				{% endif %}
			{% endblock %}

			{% if 'core.change_series' in perms or 'core.view_registration_summary' in perms %}
				<div class="btn-group mt-4">
				{% if 'core.change_series' in perms %}
					<a class="btn btn-outline-secondary" href="{% url 'admin:core_series_change' series.id %}">{% trans "Edit Class Details" %}</a>
				{% endif %}
				{% if 'core.view_registration_summary' in perms %}
					<a class="btn btn-outline-secondary" href="{% url 'viewregistrations' series.id %}">{% trans "View Registrations" %}</a>
				{% endif %}
				</div>
			{% endif %}
			</div>
		</div>
		<div class="col-md-8 order-1">
			<h4>
				{% blocktrans with weekday=series.startTime|date:'l' startTime=series.startTime|date:'h:i A' location=series.location startDate=series.startTime|date:'F jS' %}
					{{ weekday }}s, {{ startTime }} at {{ location }}, Beginning {{ startDate }}
				{% endblocktrans %}
			</h4>

			{% if series.teachers %}
				<h4 class="instructor-names">{% trans "with" %} 
				{% for teacher in series.teachers %}
						{{ teacher.firstName }} {{ teacher.lastName }}{% if not forloop.last %} {% trans "and" %} {% endif %}
				{% endfor %}
				</h4>
			{% endif %}

			<p class='schedule'>
			<strong>{% trans "Class Schedule" %}:</strong><br />
			{% for class in series.eventoccurrence_set.all %}
				{{ class.startTime|date:'F j, h:i' }}&nbsp;-&nbsp;{{ class.endTime|date:'h:i A' }}<br />
			{% endfor %}
			</p>

			<p class='address'>
			<strong>{{ series.location.name }}{% if series.room.name %} - {{ series.room.name }}{% endif %}</strong><br />
			{{ series.location.address }}<br />
			{{ series.location.city }}, {{ series.location.state }} {{ series.location.zip }}<br />
			<a href="{% page_url 'directions' as directions_url %}{{ directions_url }}#{{ series.location.name|slugify }}">{% trans "More Info" %}</a>
			</p>

		    {% if series.pricingTier.id != default_pricingtier_id %}
		    <p class="pricinginfo">
		    	<strong>{% trans "Pricing" %}:</strong>&nbsp;
				<a class="pricingPopover" data-container="body" data-toggle="popover" data-placement="bottom" title="<strong>{{ series.pricingTier.name }}</strong>" data-html="true" data-content="<em>{% trans 'Pre-Registered' %}</em><br />{{ currencySymbol }}{{ series.pricingTier.onlinePrice|floatformat:2 }}<br /><br /><em>{% trans 'At the Door' %}</em><br />{{ currencySymbol }}{{ series.pricingTier.doorPrice|floatformat:2 }}<br />">{{ series.pricingTier.name }}</a>
			</p>
			{% endif %}
		</div>
	</div>	

	<hr />

	{% endfor %}

	<div class="row">
		<div class="col-12">
			<h3>{% trans "Class Description" %}</h3>
			<div class='classDescription'>
				<p>{% render_model event_set.0.classDescription "description" "" "" "safe" %}</p>
			</div>
		</div>
	</div>

	{% addtoblock "js" %}
		<script type="text/javascript">
		$( document ).ready(function() {
			$('.pricingPopover').popover();	
		});
		</script>
	{% endaddtoblock %}
	
{% endblock %}
