{% extends "index.html" %}
{% block title %}Panel prowadzącego{% endblock %}

{% block content %}
<div class="container header__container">
    <div class="row">
        <div class="col s12">
            <div class="card color--primary white-text">
                <span class="card-title">Panel prowadzącego</span>
            </div>
        </div>
    </div>
</div>
<div class="container body__container">
    <div class="row">
        <div class="col s12">
            <div class="card color--primary white-text">
                <div class="card-content">
                    <span class="card-title card-title__body">Pytania studentów</span>
                    <ul id="questions-list">
                        <li class="row">
                            <span class="col s7" style="display:flex; align-items:center; text-align: left">
                                Pytanie odnośnie zadania domowego 12.11.2018
                            </span>
                            <span class="counter col s2">
                                <i class="btn-thumb-up material-icons">thumb_up</i><span>12</span>
                            </span>
                            <a class="col s3 btn--answer waves-effect waves-light btn-large red">ODPOWIEDZ</a>
                        </li>
                        <li class="row">
                            <span class="col s7" style="display:flex; align-items:center; text-align: left">
                                Zagadnienia dotyczące egzaminu
                            </span>
                            <span class="counter col s2">
                                <i class="btn-thumb-up material-icons">thumb_up</i><span>45</span>
                            </span>
                            <a class="col s3 btn--answer waves-effect waves-light btn-large red">ODPOWIEDZ</a>
                        </li>
                        <li class="row" style="margin-bottom: 0">
                            <span class="col s7" style="display:flex; align-items:center; text-align: left">
                                Czy 12 listopada odbędą się zajęcia?
                            </span>
                            <span class="counter col s2">
                                <i class="btn-thumb-up material-icons">thumb_up</i><span>157</span>
                            </span>
                            <a class="col s3 btn--answer waves-effect waves-light btn-large red">ODPOWIEDZ</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="container footer__container">
    <div class="row">
        <div class="col s12">
            <div class="card color--primary white-text">
                <div class="card-content footer__container--content footer__container__lecturer--content">
                    <div class="col s4 question--mark">Oznacz, jako szczególnie ważne pytanie</div>
                    <!-- <div class="col s3 question--respond">Odpowiedz na pytanie</div> -->

                    <!-- TUTAJ MOZNA ZAKOMENTOWAĆ UKRYTĄ OPCJĘ NIEMIECKĄ -->
                    <div class="col s4 question--add">Odpowiedz i dodaj do wykładu</div>
                    <!-- KONIEC KOMENTOWANIA UKRYTEJ OPCJI NIEMIECKIEJ -->
                    
                    <div class="col s4 question--remove">Usuń pytanie</div>
                </div>
            </div>
        </div>
    </div>
</div>

{% endblock %}

{%block script%}
<script>
    $(document).ready(() => {
        $('.modal').modal();
    });

    $('.question--mark').on('click', () => {
        alertify.notify('Pytanie oznaczone, jako szczególnie ważne.', 'success', 3);
    });
    $('.question--respond').on('click', () => {
        alertify.notify('Odpowiedź została udzielona.', 'success', 3);
    });
    $('.question--add').on('click', () => {
        alertify.notify('Odpowiedź została udzielona. Pytanie zostało dodane do wykładu.', 'success', 3);
    });
    $('.question--remove').on('click', () => {
        alertify.notify('Pytanie zostało usunięte', 'error', 3);
    });
</script>
{%endblock%}