{% extends "templates/base.html" %}
{% block title %}{{ 'Courses' }}{% endblock %}
{% from "www/courses/macros/card.html" import course_card, topic_card %}
{% block head_include %}
<meta name="description" content="Courses" />
<meta name="keywords" content="Courses {{course.title}}" />
<style>
</style>
{% endblock %}

{% block content %}
<section class="top-section container" style="padding: 1rem 0rem;">
	<div class='container pb-5'>
		<nav aria-label="breadcrumb">
			<ol class="breadcrumb">
				<li class="breadcrumb-item" aria-current="page"><a href="/courses">Courses</a></li>
			</ol>
		</nav>
		<div class="badge badge-info enrollment-badge hide">Enrolled</div>
		<div>
			<!-- {% if not course_enrolled and frappe.session.user != "Guest" %}
				<button class="btn btn-dark btn-enroll float-right" data-course="{{ course.name }}">Enroll</button>
			{% endif %} -->
			<h1>{{ course.title }}</h1>
		</div>
		<ul class="nav nav-tabs mt-4" id="myTab" role="tablist">
			<li class="nav-item">
				<a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home"
					aria-selected="true">Course Details</a>
			</li>
			{% if discussions %}
			<li class="nav-item">
				<a class="nav-link" id="discussions-tab" data-toggle="tab" href="#discussions" role="tab" aria-controls="discussions"
					aria-selected="false">Discussions</a>
			</li>
			{% endif %}
		</ul>	
	</div>
	<div class="tab-content">
		<div class="tab-pane fade py-4 show active" role="tabpanel" id="home">
			<div>{{ frappe.utils.md_to_html(course.description) }}</div>
			<div class='container'>
				<div class="list-group">
					{% for topic in course.topics %}
					<div class="list-group-item">
						<h5><a href="/courses/{{course.name}}/{{topic.name}}">{{topic.title}}</a></h5>
						<div>{{topic.preview | markdown }}</div>
					</div>
					{% endfor %}
				</div>
			</div>
		</div>
		<div class="tab-pane fade py-4" role="tabpanel" id="discussions">
			<div>
				{% if batches %}
				<div class="">
					<select id="batches-dropdown" class="m-5">
						{% for batch in batches %}
						<option value="{{batch}}">{{ batch }}</option>
						{% endfor %}
					</select>
				</div>
				{% endif %}
				<div class="border p-5">
					<div class="form-group">
						<textarea class="form-control message-text" rows="3" placeholder="Enter your message here."></textarea>
						<button class="btn btn-primary mt-5 send-message" data-author="{{ author | urlencode}}" data-batch="{{ current_batch | urlencode }}">Send</button>
					</div>
				</div>
				{% if discussions %}
				<div class="discussions">
					{% for message in discussions %}
					<div class="list-group-item">
						<h6>{{ message.author }}</h6>
						{{ message.message }}
						<div class="small text-muted text-right">{{ message.creation }}</div>
					</div>
				{% endfor %}
				</div>
				{% endif %}
			</div>
		</div>
	</div>
</section>
{% endblock %}