Adding html template for skill tree and update base.html

This commit is contained in:
Gregory Trullemans 2022-01-12 14:42:07 +01:00
parent 96f52f1cd4
commit 706343cc6a
2 changed files with 110 additions and 0 deletions

View File

@ -46,6 +46,8 @@
<!-- Chart JS -->
<script src="{% static "js/plugins/moment_2.29.1.min.js" %}"></script>
<script src="{% static "js/plugins/chartjs_2.9.4.min.js" %}"></script>
{% block header %}{% endblock %}
</head>
<body class="sidebar-mini {% if request.session.template == 1 %}white-content{% endif %}">

View File

@ -0,0 +1,108 @@
{% extends "base.html" %}
{% block content %}
<div class="card mb-0">
<div class="card-header">
<h3 class="mb-0">{{ skill.short_label }}</h3>
<h4 class="card-title"> {{ skill.notation }}</h4>
</div>
<div class="card-body pb-0 mb-0">
<div class="row mr-1 ml-1 pb-0 mb-0">
<div class="col-md-6">
<!-- <h4 class="mb-1">Détails</h4> -->
<div class="row">
<div class="col-3 text-center">
<p>Notation : <a href="#">{{ skill.notation }}</a></p>
</div>
<div class="col-3 text-center">
<p>Difficulty : <a href="/skill/difficulty/exact/{{ skill.difficulty }}">{{ skill.difficulty }}</a></p>
</div>
<div class="col-3 text-center">
<p>Level : <a href="{% url 'skill_listing_by_key' 'level' 'exact' skill.level %}">{{ skill.level }}</a></p>
</div>
<div class="col-3 text-center">
<p>Rank : <a href="{% url 'skill_listing_by_key' 'rank' 'exact' skill.rank %}">{{ skill.level }}</a></p>
<!-- Age girl : <a href="/skill/difficulty/exact/{{ skill.difficulty }}">{{ skill.age_girl_masterised }}</a><br /> -->
<!-- Age boy : <a href="{% url 'skill_listing_by_key' 'level' 'exact' skill.level %}">{{ skill.age_boy_masterised }}</a> -->
</div>
</div>
<br />
<div class="row">
<div class="col-12">
<table class="table table-striped table-condensed" data-sort="table" id="skill_age_table">
<thead>
<th></th>
<th>With help</th>
<th>Without help</th>
<th>Chained</th>
<th>Masterised</th>
</thead>
<tbody>
<tr>
<td>Girl</td>
<td><a href="#">{{ skill.get_age_girl_with_help_display }}</a></td>
<td><a href="#">{{ skill.get_age_girl_without_help_display }}</a></td>
<td><a href="#">{{ skill.get_age_girl_chained_display }}</a></td>
<td><a href="#">{{ skill.get_age_girl_masterised_display }}</a></td>
</tr>
<tr>
<td>Boy</td>
<td><a href="#">{{ skill.get_age_boy_with_help_display }}</a></td>
<td><a href="#">{{ skill.get_age_boy_without_help_display }}</a></td>
<td><a href="#">{{ skill.get_age_boy_chained_display }}</a></td>
<td><a href="#">{{ skill.get_age_boy_masterised_display }}</a></td>
</tr>
</tbody>
</table>
<!-- Age girl : <a href="/skill/difficulty/exact/{{ skill.difficulty }}">{{ skill.age_girl }}</a><br /> -->
<!-- Age boy : <a href="{% url 'skill_listing_by_key' 'level' 'exact' skill.level %}">{{ skill.age_boy }}</a> -->
</div>
</div>
<br />
{% if skill.prerequisites.all or skill.educatives.all %}
<div class="row">
<div class="col-6">
<h4>Prerequisites</h4>
<ul>
{% if skill.prerequisites.all %}
{% for prerequisites in skill.prerequisites.all %}
<li><a href="{% url 'skill_details' prerequisites.id %}">{{ prerequisites.short_label }}</a></li>
{% endfor %}
{% else %}
<p class="text-muted">No prerequisites defined.</p>
{% endif %}
</ul>
</div>
<div class="col-6">
<h4>Educatives</h4>
<ul>
{% if skill.educatives.all %}
{% for educatives in skill.educatives.all %}
<li><a href="{% url 'skill_details' educatives.id %}">{{ educatives.short_label }}</a></li>
{% endfor %}
{% else %}
<p class="text-muted">No educative defined.</p>
{% endif %}
</ul>
</div>
</div>
{% endif %}
</div>
<div class="col-md-6 alert {% if request.session.template == 0 %}skill-info{% else %}alert-secondary{% endif %} mr-0">
<p>From <a href="#">{{ skill.departure }}</a>, {% if skill.rotation %} <a href="#">{{ skill.rotation }}</a> quart of <a href="#">{{ skill.get_rotation_type_display }}</a> rotation {% endif %}{% if skill.twist %} with <a href="#">{{ skill.twist }} half-twist</a> {% endif %} in a <a href="#">{{ skill.get_position_display }}</a> position, landing to <a href="#">{{ skill.landing }}</a></p>
<br />
{% if skill.informations %}
{{ skill.to_markdown | safe }}
{% else %}
<p class="text-muted">No more informations provided for this skill.</p>
{% endif %}
</div>
</div>
</div>
</div>
{% endblock %}
{% block footerscript %}
{% endblock %}