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.
281 lines
13 KiB
281 lines
13 KiB
<!-- По соглашению "Консорциума Всемирной Паутины" - указываем браузеру формат документа -->
|
|
<!--[https://ru.wikipedia.org/wiki/Консорциум_Всемирной_паутины] -->
|
|
<!DOCTYPE html>
|
|
<!-- Указываем основной язык документа -->
|
|
<html lang="ru" style="background: #fff;">
|
|
<!--
|
|
`............................................`
|
|
sMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMs
|
|
sMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMs
|
|
sMMMMMssssssssssssssssssssssssssssssssssMMMMMs
|
|
sMMMMM MMMMMs
|
|
sMMMMM MMMMMs
|
|
sMMMMM :yyyyy. MMMMMs
|
|
sMMMMM /MMMMMo MMMMMs
|
|
sMMMMM /MMMMMo MMMMMs
|
|
sMMMMM /MMMMMo MMMMMs
|
|
sMMMMM +MMMMMo MMMMMs
|
|
sMMMMM +MMMMMo MMMMMs
|
|
sMMMMM +MMMMMo MMMMMs
|
|
sMMMMM +MMMMMo MMMMMs
|
|
sMMMMM oMMMMMo MMMMMs
|
|
sMMMMM oMMMMMo .....` MMMMMs
|
|
sMMMMM oMMMMMo hMMMM: MMMMMs
|
|
sMMMMM sMMMMMo hMMMM: MMMMMs
|
|
sMMMMM `:::::: -::::` MMMMMs
|
|
sMMMMM MMMMMs
|
|
sMMMMMyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyMMMMMs
|
|
sMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMs
|
|
sMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMs
|
|
``````````````````````````````````````````````
|
|
-->
|
|
<head>
|
|
<!-- Говорим браузеру в какой кодировке открывать страницу -->
|
|
<meta charset="utf-8" />
|
|
<!-- Делаем удобочитаемым текст на устройствах с маленьким экраном -->
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
|
|
<!-- Устанавливаем заголовок документа -->
|
|
<title>{{ face.title }} - {{ NAME }}</title>
|
|
<!-- Подключаем иконку рядом с заголовком документа -->
|
|
<link rel="shortcut icon" href="/static/img/favicon.ico" type="image/x-icon">
|
|
<!-- Подключаем основное оформление LMS системы -->
|
|
<link href="/static/css/app.css" rel="stylesheet" type="text/css">
|
|
|
|
<!-- Подключаем необходимые библиотеки,
|
|
файлы JavaScript[https://ru.wikipedia.org/wiki/JavaScript]
|
|
и/или CSS[https://ru.wikipedia.org/wiki/CSS] -->
|
|
{% block content.head %}
|
|
{{ content.head|safe }}
|
|
{% endblock %}
|
|
<!-- Для опытных пользователей -->
|
|
<!--
|
|
Мы могли бы подключить библиотеки функцией JS прямо из консоли разработчика.
|
|
К примеру подключение библиотеки JQuery:
|
|
(function(d,s){s=d.createElement('script');s.src='https://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.js';(d.head||d.documentElement).appendChild(s)})(document);
|
|
Такая возможность может быть использована злоумышлинниками для вредоностного воздействия на ваш сервер/сайт
|
|
Вы можете защититься от подобного воздействия путем добавления HTTP заголовка "Content-Security-Policy"
|
|
|
|
Описание заголовка: [https://www.w3.org/Security/wiki/Content_Security_Policy]
|
|
|
|
Пожалуйста, учитесь читать исходную документацию и понимать основы технологий, которые вы используете.
|
|
[{{ DOMAIN }}courses/1]
|
|
-->
|
|
<!-- Не бойтесь экспериментировать, будьте неутомимыми исследователями, любите то, что вы делаете -->
|
|
<!-- Барышников Николай Романович / Технический директор компании "{{ NAME }}" [{{ DOMAIN }}ID2-75686/]-->
|
|
</head>
|
|
<body style="margin: 0;background: #fff;">
|
|
<!-- Приступим к экспериментам -->
|
|
<h1 style="margin: 0;padding: 10px 10px 20px;">
|
|
Мастерская "{{ face.title }}"
|
|
<div style="float: right;position: absolute;right: 20px;top: 0;">
|
|
<span style="font-size: 15px;">Ключ мастерской: <span style="
|
|
color: cornflowerblue;
|
|
border-bottom: 1px dotted cornflowerblue;">{{ face.key }}</span></span><br>
|
|
<span style="font-weight: normal;
|
|
cursor: pointer;
|
|
color: cornflowerblue;
|
|
border-bottom: 1px dotted cornflowerblue;
|
|
float: right;font-size: 12px;" onclick="$('[name=workshop_more]').fadeIn()">подробнее</span>
|
|
</div>
|
|
</h1>
|
|
|
|
<div style="font-size: 15px;
|
|
font-weight: normal;
|
|
text-align: left;
|
|
position: absolute;
|
|
background: #ffc;
|
|
float: right;
|
|
right: 10px;
|
|
margin-top: -30px;
|
|
border-radius: 3px;
|
|
padding: 10px 20px;
|
|
border: 1px solid #ccc;display: none;" name="workshop_more">
|
|
<p style="margin-top: 0;
|
|
text-align: left;
|
|
font-weight: bold;
|
|
border-bottom: 1px dotted #ccc;
|
|
padding-bottom: 10px;">
|
|
Подробная информация
|
|
<span style="font-weight: normal;
|
|
cursor: pointer;
|
|
color: cornflowerblue;
|
|
border-bottom: 1px dotted cornflowerblue;
|
|
float: right;font-size: 12px;" onclick="$('[name=workshop_more]').fadeOut()">закрыть</span>
|
|
</p>
|
|
<b>Доступ:</b> {{ face.access }}<br>
|
|
<b>Открытие комнаты:</b> {{ face.date }}<br>
|
|
<b>Просмотров:</b> {{ face.views }}<Br>
|
|
<b>Студентов* посетило:</b> {{ face.students }}<br>
|
|
<b>Студенты* <span style="color: green;">on-line</span>:</b>
|
|
{{ face.online }}
|
|
<ul style="list-style: none; background: #f1f1f1;padding: 0;">
|
|
{% for student in face.now_users %}
|
|
<li style="padding: 10px; margin-bottom: 5px; height: 40px;">
|
|
<img src="{{ student.ava }}" style=" margin-right: 10px;
|
|
max-width: 30px;
|
|
height: auto;
|
|
border-radius: 20px; float: left;margin-top: 5px;">
|
|
<span style="font-weight: bold;position: relative;">
|
|
{% if student.name %}{{ student.name }}{% else %}{{ student.interactive_key }}{% endif %} <span style="color: green;">online</span>
|
|
</span><Br>
|
|
<span>{% if student.is_staff %}<img src="/static/img/mini_logo.png" style="height: 10px;"
|
|
title="Команда «{{ NAME }}»"
|
|
alt="Команда «{{ NAME }}»">{% endif %}
|
|
{{ student.role }}
|
|
</span>
|
|
<a href="{{ student.profile }}" target="_blank" style="
|
|
color: cornflowerblue;
|
|
border-bottom: 1px dotted cornflowerblue;
|
|
float: right;font-size: 12px;margin-top: -20px;">Посмотреть профиль</a>
|
|
</li>
|
|
{% endfor %}
|
|
</ul>
|
|
<br>
|
|
<p><span style="font-size: 12px;font-weight: normal;">* - Пользователи, прошедшие процесс регистрации</span></p>
|
|
|
|
</div>
|
|
<div style=" float: left;
|
|
width: 20%;
|
|
padding: 10px;
|
|
background: #f1f1f1;
|
|
max-height: 400px;
|
|
border: 1px solid #ccc;
|
|
border-radius: 3px;
|
|
overflow-x: hidden;
|
|
overflow-y: auto">
|
|
<p style="font-weight: bold; padding-bottom: 5px;margin: 0 0 10px;border-bottom: 1px dotted #ccc;">
|
|
События мастерской:
|
|
<span name="workshop_log_count" style="background: red; border-radius: 10px; color: #fff;font-weight: bold; padding: 0 5px; float:right;" title="Количество событий">0</span>
|
|
</p>
|
|
<ul name="workshop_log" style="list-style: none; padding: 0;">
|
|
|
|
</ul>
|
|
</div>
|
|
<div style="float:left; width: 80%; padding-bottom: 150px;">
|
|
{% if content.body %}
|
|
<div style="border-bottom: 1px solid #f1f1f1;padding-bottom: 10px;margin-top: 0;">
|
|
<p style="font-weight: bold;
|
|
background: #f1f1f1;
|
|
padding: 10px;margin-top: 0;">
|
|
Интерактивные элементы:
|
|
</p>
|
|
<div name="description_content" style="padding: 0 20px;">
|
|
{{ content.body|safe }}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
{% if content.description %}
|
|
<div style="border-bottom: 1px solid #f1f1f1;padding-bottom: 10px;margin-top: 0;">
|
|
<p style="font-weight: bold;
|
|
background: #f1f1f1;
|
|
padding: 10px;margin-top: 0;">
|
|
Описание задачи:
|
|
</p>
|
|
<div name="description_content" style="padding: 0 20px;">
|
|
{{ content.description|safe }}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
{% if content.resolve %}
|
|
<div name="resolve" style="border-bottom: 1px solid #f1f1f1;padding-bottom: 10px;display: none;margin-top: 10px;">
|
|
<p style="font-weight: bold;
|
|
background: #f1f1f1;
|
|
padding: 10px;
|
|
margin-top: 0;">
|
|
Пример решения:
|
|
<span style="font-weight: normal;
|
|
cursor: pointer;
|
|
color: cornflowerblue;
|
|
border-bottom: 1px dotted cornflowerblue;
|
|
float: right;"
|
|
onclick="$('[name=resolve]').fadeOut('slow');">
|
|
закрыть
|
|
</span>
|
|
</p>
|
|
<div style="padding: 0 20px;">
|
|
{{ content.resolve|safe }}
|
|
</div>
|
|
</div>
|
|
<p style="text-align: center;
|
|
width: 100%;
|
|
position: fixed;
|
|
bottom: 83px;
|
|
background: #f1f1f1;
|
|
padding: 10px;
|
|
margin: 0;
|
|
color: #ccc;
|
|
cursor: pointer;"
|
|
onclick="$('[name=resolve]').fadeIn('slow');">
|
|
<span>Посмотреть решение</span>
|
|
</p>
|
|
{% endif %}
|
|
{% if content.content %}
|
|
<div style="border-bottom: 1px solid #f1f1f1;padding-bottom: 10px;margin-top: 10px;">
|
|
<p style="font-weight: bold;
|
|
background: #f1f1f1;
|
|
padding: 10px;
|
|
margin-top: 0;">
|
|
Описание методов:
|
|
</p>
|
|
<div style="padding: 0 20px;" name="workshop_content">
|
|
{{ content.content|safe }}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
{% if content.variables %}
|
|
<div style="border-bottom: 1px solid #f1f1f1;padding-bottom: 10px;margin-top: 10px;">
|
|
<p style="font-weight: bold;
|
|
background: #f1f1f1;
|
|
padding: 10px;
|
|
margin-top: 0;">
|
|
Описание переменных:
|
|
</p>
|
|
<div style="padding: 0 20px;" name="workshop_variables">
|
|
{{ content.variables|safe }}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
{% if content.tools %}
|
|
<div style="border-bottom: 1px solid #f1f1f1;padding-bottom: 10px;margin-top: 10px;">
|
|
<p style="font-weight: bold;
|
|
background: #f1f1f1;
|
|
padding: 10px;
|
|
margin-top: 0;">
|
|
Используемые инструменты:
|
|
</p>
|
|
<div style="padding: 0 20px;" name="workshop_tools">
|
|
<ul style="padding: 0; list-style: none;">
|
|
{% for tool in content.tools %}
|
|
{% if tool.url %}
|
|
<a href="{{ tool.url }}" style="font-weight: normal;
|
|
cursor: pointer;
|
|
color: cornflowerblue;
|
|
border-bottom: 1px dotted cornflowerblue;" target="_blank">
|
|
{% endif %}
|
|
<li>
|
|
<img src="{{ tool.icon }}" alt="{{ tool.name }}" style="max-width: 20px;float:left;margin-right: 5px;"> {{ tool.name }}
|
|
{% if tool.description %}<span style=" color: #999; margin-left: 10px;
|
|
font-size: 13px;">{{ tool.description }}</span>{% endif %}
|
|
</li>
|
|
{% if tool.url %}
|
|
</a>
|
|
{% endif %}
|
|
{% endfor %}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
<p style="text-align: center;
|
|
position: fixed;
|
|
bottom: 0;
|
|
width: 100%;
|
|
border-top: 1px dotted #ccc;
|
|
padding-top: 20px;
|
|
background: #ffc;
|
|
margin: 10px 0 0;
|
|
padding-bottom: 20px;">
|
|
<a href="/" target="_blank"><img src="/static/img/logo.png"></a>
|
|
</p>
|
|
</body>
|
|
</html>
|
|
|