vcp-elearning/tkupek_elearning/elearning/templates/elearning.html

104 lines
No EOL
4.3 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
{% load staticfiles %}
<link rel="stylesheet" href="{% static 'css/style.css' %}">
<link href="{% static 'images/favicon.ico' %}" rel="shortcut icon">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>{{ settings.title }}</title>
<!-- jQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
</head>
<body>
<div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" id="completed-modal">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title" id="myModalLabel">{{ settings.popup_completed_title }}</h4>
</div>
<div class="modal-body">
{{ settings.popup_completed_message|safe }}
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">OK</button>
</div>
</div>
</div>
</div>
<div id="popup-leave-message" class="hide">{{ settings.popup_leave_message|safe }}</div>
<div class="container">
{% if settings.logo %}
<img src="{{ settings.logo }}" class="mainLogo">
{% endif %}
<h1>{{ settings.title }}</h1>
<p>{{ settings.message_welcome_user|safe }}</p>
<div class="progress">
<div id="progressbar" class="progress-bar progress-bar-striped" role="progressbar" style="width: {{ progress }}%">
{{ progress }}%
</div>
</div>
<hr/>
<div class="margin50" ></div>
{% for question, options in questions_options.items %}
<div class="container question" name="question" id="question_{{ question.id }}">
<h2>{{ question.id }}: {{ question.title }}</h2>
<p>{{ question.text|safe }}</p>
<ul class="list-group ">
{% for option in options %}
<li name="checkbox_div_{{ question.id }}" class="list-group-item">
<label>
<input name="checkbox_{{ question.id }}" type="checkbox" value="{{ option.id }}">
{{ option.text }}
</label>
</li>
{% endfor %}
</ul>
<p id="enable-{{ question.id }}" data-value="{{ question.enable }}" data-questionId= "{{ question.id }}" class="message_already_answered hide">
{{ settings.message_already_answered }}
</p>
<div class="container">
<button class="btn btn-default show" type="button" id="showSolution_{{ question.id }}" onmouseup="get_answer({{ question.id }})">{{ settings.text_solution }}</button>
<button class="btn btn-default hide" type="button" id="next_{{ question.id }}" onmouseup="scrollToNextQuestion({{ question.id }})">{{ settings.text_next }}</button>
</div>
<div class="margin10 well well-sm hide" id="explanation_{{ question.id }}">
<h3>{{ settings.text_answer }}</h3>
<p>{{ question.explanation|safe }}</p>
</div>
<div class="margin75"></div>
</div>
{% endfor %}
<div class="margin50" ></div>
<hr/>
{{ settings.footer }}
</div>
<script type="text/javascript" src="{% static 'js/elearning.js' %}"></script>
</body>
</html>