{% extends base_template %}

{% block show %}

    <div class="row">
        <div class="col-md-12">
            <div class="row">
                <div class="col-md-12">
                    <div class="box box-primary">
                        <div class="box-header">
                            <h4 class="box-title">
                                {{ "admin.cours.cours"|trans }}
                            </h4>
                        </div>
                        <div class="box-body">
                            <div class="sonata-ba-collapsed-fields">
                                <div class="col-md-7">
                                    <div class="panel panel-default widget">
                                        <div class="panel-heading">
                                            <span class="glyphicon glyphicon-tag"></span>
                                            <h3 class="panel-title"> &nbsp; {{ "admin.cours.detail"|trans }}</h3>
                                        </div>
                                        <div class="panel-body">

                                            <div class="col-md-12">
                                                <div class="inner">
                                                    <h3>{{ "admin.cours.titre"|trans }} : {{ cours.subjet }} </h3>
                                                    <h4>{{ "admin.matiere.matiere"|trans }} : {{ cours.matiere }}</h4>
                                                    <h4>{{ "admin.cours.enseignant"|trans }} : {{ enseignant }}</h4>
                                                </div>
                                            </div>
                                            <div class="col-md-12">
                                                <div class="inner">
                                                    <h4>{{ "admin.cours.description"|trans }} :</h4>
                                                    {{ cours.description|raw }}
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-5">
                                    <div class="panel panel-default widget">
                                        <div class="panel-heading">
                                            <span class="glyphicon glyphicon-tag"></span>
                                            <h3 class="panel-title"> &nbsp;&nbsp; {{ "admin.cours.vid"|trans }}</h3>
                                            {% if cours.video %}
                                                <a style="padding: 0 10px" title="{{ cours.video }}" class="btn " href="{{ vich_uploader_asset(cours, 'videoFile') }}" >
                                                    <i class="fa fa-download"></i> {{ 'vich_uploader.link.download'|trans }}
                                                </a>
                                            {% else %}
                                                <a style="padding: 0 10px" href="#" title="">
                                                    <i class="fa fa-times"></i> {{ "admin.cours.aucundoc"|trans }}
                                                </a>
                                            {% endif %}
                                        </div>
                                        <div class="panel-body">
                                            {% if cours.video %}
                                                <div style="text-align: center;width: 100%">
                                                    <video style=" width: 100%" controls
                                                           src="{{ vich_uploader_asset(cours, 'videoFile') }}">
                                                        Ici la description alternative
                                                    </video>
                                                </div>
                                            {% endif %}
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-12">
                                    <div class="panel panel-default widget">
                                        <div class="panel-heading">
                                            <span class="glyphicon glyphicon-tag"></span>
                                            <h3 class="panel-title">{{ "admin.cours.doc"|trans }}</h3>
                                            {% if cours.doc %}
                                                <a style="padding: 0 10px"  class="btn " href="{{ vich_uploader_asset(cours, 'docFile') }}" title="{{ cours.doc }}">
                                                    <i class="fa fa-download"></i> {{ 'vich_uploader.link.download'|trans }}
                                                </a>
                                            {% else %}
                                                <a style="padding: 0 10px" href="#" title="">
                                                    <i class="fa fa-times"></i> {{ "admin.cours.aucundoc"|trans }}
                                                </a>
                                            {% endif %}
                                        </div>
                                        <div class="panel-body">
                                            {% if (cours.doc)  %}
                                                {% if ( cours.doc|split('.')|last == "pdf")  %}

                                                    <div style="text-align: center;width: 100%">
                                                        <embed src="/uploads/files/doc/{{ cours.doc}}" style="width: 100%;min-height: 500px;" type='application/pdf'>
                                                    </div>

                                                {% else  %}
                                                    <div style="text-align: center;width: 100%">
                                                        <iframe src='https://view.officeapps.live.com/op/embed.aspx?src={{ app.request.getSchemeAndHttpHost() }}/uploads/files/doc/{{ cours.doc}}' width='100%' height='650px' frameborder='0'></iframe>
                                                    </div>
                                                {% endif %}
                                            {% endif %}
                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

{% endblock %}
{% block stylesheets %}
    {{ parent() }}
    <style>
        .widget .panel-body {
            padding: 0;
        }

        .widget .list-group {
            margin-bottom: 0;
        }

        .widget .panel-title {
            display: inline
        }

        .widget .label-info {
            float: right;
        }

        .widget li.list-group-item {
            border-radius: 0;
            border: 0;
            border-top: 1px solid #ddd;
        }

        .widget li.list-group-item:hover {
            background-color: rgba(86, 61, 124, .1);
        }

        .widget .mic-info {
            color: #666666;
            font-size: 11px;
        }

        .widget .action {
            margin-top: 5px;
        }

        .widget .comment-text {
            font-size: 12px;
        }

        .widget .btn-block {
            border-top-left-radius: 0;
            border-top-right-radius: 0;
        }

        .panel-body {
            padding-inline: 20px;
            overflow-y: unset;
            height: auto;
        }

        textarea {
            padding: 10px;
        }
    </style>
{% endblock %}
{% block javascripts %}
    {{ parent() }}
{% endblock %}