You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
340 lines
21 KiB
340 lines
21 KiB
{% extends 'base_index.html' %}
|
|
{% load course_filter %}
|
|
{% block title %}Курс {{ course.head.title }}{% endblock %}
|
|
{% block content %}
|
|
|
|
<div class="col">
|
|
<div class="course_progress_bar" style=" width: 100%;
|
|
background: #ffc;
|
|
position: fixed;
|
|
z-index: 2000;left: 0;"></div>
|
|
<!-- main header -->
|
|
<div style="background:url({{ course.head.big_img }}) top right; background-size:cover">
|
|
<div class="visible-sm visible-xs" style="background-color: rgba(0, 0, 0, 0.5);">
|
|
<div class="wrapper-lg">
|
|
<div class="row m-t">
|
|
<div class="col-sm-7">
|
|
<div class="clear m-b">
|
|
<div class="panel-heading no-border" style="background: {{ course.head.level.background }};color:{{ course.head.level.color }};">
|
|
<span class="text-lt ">{{ course.head.level.title }} уровень</span>
|
|
</div>
|
|
<div class="m-b m-t-sm">
|
|
<span class="h1 text-u-c" style="font-weight: bold;color: #fff; ">
|
|
{{ course.head.title }}
|
|
</span>
|
|
</div>
|
|
{% if course.head.skills %}
|
|
<div style="color: #fff;margin-bottom: 5px;">
|
|
<b style="margin-right: 5px;">Приобретаемые навыки:</b>
|
|
{% for skill in course.head.skills %}
|
|
<span class="label font-normal text-white" style="background: {{ skill.color }}">{% if skill.mini_icon %}<img src="{{ skill.mini_icon.url }}" style="margin-top: -1px;width: 10px;
|
|
height: 10px;
|
|
margin-right: 5px;">{% endif %}{{ skill }}</span>
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
<div style="color: #fff;">
|
|
{{ course.head.lessons }} урока(-ов)
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-5" style="text-align: center;">
|
|
{% if course.head.progress != 0 %}
|
|
<div class="chart" data-percent="{{ course.head.progress }}" data-scale-color="#fff"
|
|
style="text-align: center;color: #fff;">
|
|
<span id="canvas_length">{{ course.head.progress }}%</span>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="hidden-sm hidden-xs wrapper-lg">
|
|
<div class="row m-t">
|
|
<div class="col-sm-7">
|
|
<div class="clear m-b">
|
|
<div class="panel-heading no-border" style="background: {{ course.head.level.background }};color:{{ course.head.level.color }};">
|
|
<span class="text-lt ">{{ course.head.level.title }} уровень</span>
|
|
</div>
|
|
<div class="m-b m-t-sm">
|
|
<span class="h1 text-u-c" style="font-weight: bold;color: #fff; ">
|
|
{{ course.head.title }}
|
|
</span>
|
|
</div>
|
|
{% if course.head.skills %}
|
|
<div style="color: #fff;margin-bottom: 5px;">
|
|
<b style="margin-right: 5px;">Приобретаемые навыки:</b>
|
|
{% for skill in course.head.skills %}
|
|
<span class="label font-normal text-white" style="background: {{ skill.color }}">{% if skill.mini_icon %}<img src="{{ skill.mini_icon.url }}" style="margin-top: -1px;width: 10px;
|
|
height: 10px;
|
|
margin-right: 5px;">{% endif %}{{ skill }}</span>
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
<div style="color: #fff;">
|
|
{{ course.head.lessons }} урока(-ов)
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-5" style="text-align: center;">
|
|
{% if course.head.progress != 0 %}
|
|
<div class="chart" data-percent="{{ course.head.progress }}" data-scale-color="#fff"
|
|
style="text-align: center;color: #fff;">
|
|
<span id="canvas_length">{{ course.head.progress }}%</span>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="wrapper-md">
|
|
<div class="row">
|
|
|
|
<ul class="timeline">
|
|
<p style="float: right;margin-right: 10px;text-align: center;">
|
|
<i class="glyphicon glyphicon-ok"></i> Просмотрено
|
|
<i class="glyphicon glyphicon-time"></i> Доступно
|
|
<i class="glyphicon glyphicon-remove"></i> Не доступно
|
|
</p>
|
|
<li class="tl-header">
|
|
<div class="btn btn-success disabled">Старт</div>
|
|
</li>
|
|
<script>
|
|
window.e = 100/{{ course.length }};
|
|
</script>
|
|
{% for i in course.themes %}
|
|
|
|
{% if i.head.status.flag == 'A' %}
|
|
<script>
|
|
window.current = {{ i.head.mid }}
|
|
</script>
|
|
{% endif %}
|
|
|
|
<script>
|
|
$('.course_progress_bar').append('<div class="label label-progress label-{% if i.head.type.flag == 'Ex' %}warning{% else %}{{ i.head.status.color }}{% endif %}" onclick="$(\'html,body\').stop().animate({ scrollTop: $(\'[name=theme{{ i.head.mid }}]\').offset().top }, 1000);" data-toggle="tooltip" data-placement="bottom" title="{{ i.head.title|safe }}" style="cursor:pointer;height: 5px;width:'+window.e+'%;float:left;padding: 0;margin: 0;border-radius: 0;border-left: 1px solid #fff;"> </div>');
|
|
</script>
|
|
|
|
<li class="tl-item tl-left">
|
|
<div class="tl-wrap b-{{ i.head.status.color }}">
|
|
{% if i.head.lessons_length > 0 %}
|
|
{% if i.head.button %}
|
|
<a href="{{ i.head.button.link }}{{ i.head.button.id }}" by_type="{{ i.head.button.by_type }}" self_id="{{ i.head.button.id }}" course_id="{{ i.head.button.course }}">
|
|
{% else %}
|
|
<a href="#">
|
|
{% endif %}
|
|
{% else %}
|
|
{% for h in i.homework %}
|
|
<a href="{{ h.button.link }}{{ h.button.id }}" by_type="{{ h.button.by_type }}" self_id="{{ h.button.id }}" course_id="{{ h.button.course }}"
|
|
style="border-bottom: 1px dotted #999; padding-bottom: 5px;">
|
|
{% endfor %}
|
|
{% endif %}
|
|
|
|
<span class="tl-date" style="font-weight: bold;">
|
|
Тема {{ i.head.sort }}<br>
|
|
<img src="{{ i.head.icon }}" style="margin-top: 5px;max-height: 48px;max-width: 48px;border-radius: 10px;">
|
|
</span>
|
|
</a>
|
|
|
|
<div class="tl-content panel padder b-a col-lg-11" style="width: 100%;">
|
|
<span class="arrow left pull-up hidden-left visible-lg visible-md visible-sm"></span>
|
|
<span class="arrow right pull-up visible-left visible-lg visible-md visible-sm"></span>
|
|
|
|
<div class="text-lt m-b-sm" style="font-weight: bold; font-size: 16px;margin-bottom: 5px;float: left;width: 100%;padding: 0 3% 0 2%;">
|
|
<span style="float: left; margin: 5px 7px 0 0;">
|
|
{% if i.head.lessons_length > 0 %}
|
|
{% if i.head.button %}
|
|
<a name="theme{{ i.head.mid }}" href="{{ i.head.button.link }}{{ i.head.button.id }}"
|
|
by_type="{{ i.head.button.by_type }}"
|
|
self_id="{{ i.head.button.id }}"
|
|
course_id="{{ i.head.button.course }}">
|
|
{% else %}
|
|
<a style="cursor: default;border-bottom: 0;">
|
|
{% endif %}
|
|
{% else %}
|
|
<!-- Ссылка на ДЗ -->
|
|
{% for h in i.homework %}
|
|
<a href="{{ h.button.link }}{{ h.button.id }}"
|
|
by_type="{{ h.button.by_type }}"
|
|
self_id="{{ h.button.id }}"
|
|
course_id="{{ h.button.course }}"
|
|
style="border-bottom: 1px dotted #999; padding-bottom: 5px;">
|
|
{% endfor %}
|
|
{% endif %}
|
|
{{ i.head.title|safe }}
|
|
</a>
|
|
|
|
{% if i.head.status.flag != 'N' %}
|
|
<span class="label font-normal text-white bg-{{ i.head.status.color }}" style="margin-left: 10px;">
|
|
{{ i.head.status.title }}<i class="{{ i.head.status.icon }}" style="margin-right: 5px; margin-left: 10px;"></i>
|
|
</span>
|
|
{% endif %}
|
|
|
|
</span>
|
|
|
|
{% if i.head.lessons_length > 1 %}
|
|
<div class="label label-info" style="float: right; margin: 5px 0 0 0;">Уроков: {{ i.head.lessons_length }}</div>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<div class="panel-body p-b-none pull-in b-t b-light" style="margin-left: 2px;padding-bottom: 20px !important;clear: both;">
|
|
{% if i.head.skills %}
|
|
<div style="margin-bottom: 10px;background-color: #ffc;padding: 10px;margin-right: 20px;border-radius: 5px;">
|
|
<b style="margin-right: 5px;">Приобретаемые навыки:</b>
|
|
{% for n in i.head.skills %}
|
|
<span class="label font-normal text-default" style="background: {{ n.color }}">{% if n.mini_icon %}<img src="{{ n.mini_icon.url }}" style="margin-top: -1px;width: 10px;
|
|
height: 10px;
|
|
margin-right: 5px;">{% endif %}{{ n }}</span>
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% if i.head.lessons_length > 1 %}
|
|
<ul style="padding: 0 0 0 15px;">
|
|
{% for lesson in i.lessons %}
|
|
<li style=" padding-bottom: 3px;">
|
|
<a href="{{ lesson.button.link }}{{ lesson.button.id }}" by_type="{{ lesson.button.by_type }}"
|
|
self_id="{{ lesson.button.id }}" course_id="{{ lesson.button.course }}"
|
|
style="border-bottom: 1px dotted #333;color: #333;">
|
|
{{ lesson.title|safe }}
|
|
<span class="label font-normal text-white bg-{{ lesson.status.color }}"><i class="{{ lesson.status.icon }}"></i></span>
|
|
</a>
|
|
</li>
|
|
{% endfor %}
|
|
</ul>
|
|
{% else %}
|
|
{% if i.head.lessons_length == 1 %}
|
|
{% for les in i.lessons %}
|
|
{% if les.status.flag != 'N' %}
|
|
<blockquote class="m-t m-b-none col-lg-8" style="clear: both;width: 100%;margin-bottom: 20px !important;margin-top:10px;">
|
|
<p>
|
|
<b>Статус урока: </b>
|
|
<span class="tags l-h-2x">
|
|
<span class="label font-normal text-white bg-{{ les.status.color }}" style="margin-left: 10px;{{ les.status.styles }}">{{ les.status.title|safe }}<i class="{{ les.status.icon }}" style="margin-left: 10px;"></i></span>
|
|
</span>
|
|
</p>
|
|
</blockquote>
|
|
{% endif %}
|
|
{% endfor %}
|
|
|
|
{% if i.head.description %}
|
|
<p><b>Описание:</b></p>
|
|
<div style="clear: both; padding-left: 10px;">
|
|
<a href="{{ i.head.button.link }}{{ i.head.button.id }}" by_type="{{ i.head.button.by_type }}" self_id="{{ i.head.button.id }}" course_id="{{ i.head.button.course }}">
|
|
<div>{{ i.head.description|safe }}</div>
|
|
</a>
|
|
</div>
|
|
{% endif %}
|
|
{% else %}
|
|
{% if i.head.description %}
|
|
<p><b>Описание:</b></p>
|
|
<div style="clear: both; padding-left: 10px;">
|
|
<a href="{{ i.head.button.link }}{{ i.head.button.id }}" by_type="{{ i.head.button.by_type }}" self_id="{{ i.head.button.id }}" course_id="{{ i.head.button.course }}">
|
|
<div>{{ i.head.description|safe }}</div>
|
|
</a>
|
|
</div>
|
|
{% endif %}
|
|
{% endif %}
|
|
|
|
{% endif %}
|
|
|
|
{% if i.homeworks_length != 0 %}
|
|
|
|
{% for h in i.homework %}
|
|
{% if i.head.lessons_length == 0 %}
|
|
<blockquote class="m-t m-b-none col-lg-8">
|
|
<p><a href="{{ h.button.link }}{{ h.button.id }}" by_type="{{ h.button.by_type }}" self_id="{{ h.button.id }}" course_id="{{ h.button.course }}"
|
|
style="border-bottom: 0; padding-bottom: 5px;">
|
|
{{ h.description|safe }}
|
|
</a>
|
|
<span class="tags l-h-2x">
|
|
<span class="label font-normal text-white bg-{{ h.status.color }}" style="margin-left: 10px;{{ h.status.styles }}">{{ h.status.title|safe }}<i class="{{ h.status.icon }}" style="margin-left: 10px;"></i></span>
|
|
{% if h.status.flag == 'T' or h.status.flag == 'A' %}
|
|
{% if h.delay.status %}
|
|
<br><i class="glyphicon glyphicon-info-sign" style="color: red"></i> Могут быть незначительные задержки с проверкой{% if h.delay.description %}: <b>"{{ h.delay.description|safe }}"</b>{% endif %}
|
|
{% endif %}
|
|
{% endif %}
|
|
</span>
|
|
</p>
|
|
</blockquote>
|
|
{% else %}
|
|
<blockquote class="m-t m-b-none col-lg-8">
|
|
<p><a href="{{ h.button.link }}{{ h.button.id }}" by_type="{{ h.button.by_type }}" self_id="{{ h.button.id }}" course_id="{{ h.button.course }}"
|
|
style="border-bottom: 1px dotted #999; padding-bottom: 5px;">
|
|
<span class="icon icon-graduation "></span> <b style="margin-left: 5px;">Домашнее задание:</b>
|
|
</a>
|
|
<span class="tags l-h-2x">
|
|
<span class="label font-normal text-white bg-{{ h.status.color }}" style="margin-left: 10px;{{ h.status.styles }}">{{ h.status.title|safe }}<i class="{{ h.status.icon }}" style="margin-left: 10px;"></i></span>
|
|
{% if h.status.flag == 'T' or h.status.flag == 'A' %}
|
|
{% if h.delay.status %}
|
|
<br><i class="glyphicon glyphicon-info-sign" style="color: red"></i> Могут быть незначительные задержки с проверкой{% if h.delay.description %}: <b>"{{ h.delay.description|safe }}"</b>{% endif %}
|
|
{% endif %}
|
|
{% endif %}
|
|
</span>
|
|
</p>
|
|
</blockquote>
|
|
{% endif %}
|
|
{% endfor %}
|
|
{% endif %}
|
|
|
|
{% if i.head.status.flag != 'N' %}
|
|
{% if i.head.button %}
|
|
<div style="clear: both; width: 100%; margin-top: 10px;">
|
|
{% if flow or flow == None %}
|
|
<a type="button" href="{{ i.head.button.link }}{{ i.head.button.id }}">
|
|
<button class="btn pull-right btn-lg m-b-xs m-r-xs m-t-lg course_button"
|
|
style="background: {{ i.head.button.background }}; color: {{ i.head.button.color }}"
|
|
by_type="{{ i.head.button.by_type }}"
|
|
self_id="{{ i.head.button.id }}"
|
|
course_id="{{ i.head.button.course }}">
|
|
{{ i.head.button.title }}
|
|
</button>
|
|
</a>
|
|
{% endif %}
|
|
</div>
|
|
{% endif %}
|
|
{% endif %}
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
{% endfor %}
|
|
<li class="tl-header">
|
|
<div class="btn btn-success disabled">Финиш</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<!-- / main header -->
|
|
|
|
</div>
|
|
<!-- / main -->
|
|
<!-- right col -->
|
|
{% include 'right_site.html' %}
|
|
|
|
{% endblock %}
|
|
{% block js %}
|
|
<script>
|
|
$('html,body').stop().animate({ scrollTop: $('[name=theme'+{% if request.GET.no_current %}{{ request.GET.no_current }}{% else %}window.current{% endif %}+']').offset().top }, 1000);
|
|
</script>
|
|
<script>
|
|
var flow = "{{ flow }}";
|
|
$(function() {
|
|
$('.chart').easyPieChart({
|
|
rotate: 0,
|
|
lineWidth: 60,
|
|
trackColor: 'rgba(255,255,255,0)',
|
|
barColor: 'rgba(35,183,229,0.7)',
|
|
size: 120,
|
|
lineCap: 'butt',
|
|
animate: 1000,
|
|
scaleLength: 0
|
|
});
|
|
$('[data-toggle="tooltip"]').tooltip()
|
|
|
|
if(flow == 'False'){
|
|
$('#flowAccess').modal('show');
|
|
}
|
|
});
|
|
</script>
|
|
{% endblock %}
|
|
|