Gestion chrono

eduapps_project/templates/basic_template.html

@@ -4,8 +4,8 @@
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">{% compress css %}
 <link href="{% static 'fontawesomefree/css/all.min.css' %}" rel="stylesheet" type="text/css">
-<!--  <link rel="stylesheet" href="{% static 'wireframe.css' %}">-->
+<link rel="stylesheet" type="text/x-scss" href="{% static 'wireframe.scss' %}" />
-<link rel="stylesheet" type="text/x-scss" href="{% static 'wireframe.scss' %}" />{% endcompress %}
+{% block 'extra_css' %}{% endblock %}{% endcompress %}
 <link rel="icon" href="{% static 'includes/' %}{{favicon}}">
 <title>Edu.apps</title>
 </head>

quiz_atomes/static/quiz_atomes/nav_padding.css

@@ -0,0 +1 @@
+body { padding-top: 70px; }

quiz_atomes/templates/quiz_atomes/quiz_atomes.html

@@ -1,11 +1,13 @@
-{% extends 'basic_template.html' %}{% block 'body' %}
+{% extends 'basic_template.html' %}{% block 'extra_css' %}{% load static %}
-  <nav class="navbar navbar-light">
+<link href="{% static '/quiz_atomes/nav_padding.css' %}" rel="stylesheet" type="text/css">
+{% endblock %}{% block 'body' %}
+  <nav class="navbar navbar-light fixed-top bg-light">
     <div class="container"> 
       <a class="navbar-brand text-primary" href="{% url "home" %}">
       	<i class="fa fa-home"></i>
       </a> 
-      <div class="navbar-brand text-primary">  
+      <div class="navbar-brand">  
-        <b>{{pseudo}}</b>
+	<time>00m 00s</time>
       </div>
       <a class="navbar-brand text-primary" href="{% url "settings" %}">
       	<i class="fa fa-gear"></i>
@@ -33,4 +35,37 @@
 	  </tbody>
 	</table>
 	</form>
-  </div>{% endblock %}
+  </div>{% endblock %}{% block 'extra_scripts' %}{% load static %}
+  <script>
+	var chrono = document.getElementsByTagName('time')[0];
+	var sec = 0;
+	var min = 0;
+	var t;
+
+	function tick(){
+	    sec++;
+	    if (sec >= 60) {
+		sec = 0;
+		min++;
+		if (min >= 60) {
+		    min = 0;
+		}
+	    }
+	}
+	function add() {
+	    tick();
+	    chrono.textContent = (min > 9 ? min : "0" + min)
+	       		 + "m " + (sec > 9 ? sec : "0" + sec) +"s";
+	    timer();
+	}
+	function timer() {
+	    t = setTimeout(add, 1000);
+	}
+
+	timer();
+
+	$(document).ready(function() {
+	    timer;
+	});
+  </script>
+  {% endblock %}

quiz_atomes/templates/quiz_atomes/scores.html

@@ -6,7 +6,8 @@
       </a> 
     </div>
   </nav>
-  <div class="d-flex justify-content-center align-items-center">
+  <div class="d-flex flex-column justify-content-center align-items-center">
+	<h3><b>Tableau des meilleurs scores</b></h3>
 	<table class="table table-striped w-auto table-responsive-lg">
 	  <thead>
 	    <tr>

quiz_atomes/templates/quiz_atomes/settings.html

@@ -5,9 +5,8 @@
       </a>
     </div>
   </nav>
-  <div class="d-flex justify-content-center align-items-center">
+  <div class="d-flex flex-column justify-content-center align-items-center">
-      <div class="py-2 d-flex flex-column align-items-center">
+	<h3><b>Paramètres du quiz</b></h3>
-        <h2><b>Paramètres du quiz</b></h2>
 	<form action="{% url "settings" %}" method="POST" name="settings">{% csrf_token %}
 	<table class="table w-auto table-responsive-lg">
 		<tr>
@@ -44,5 +43,4 @@
 		</tr>	
 	</table>
 	</form>
-      </div>
   </div>{% endblock %}

quiz_atomes/views.py

@@ -56,7 +56,7 @@ def quiz_atomes(request):
 def resultats(request):
     	
     points = 0
-    dt = round(time.time()-request.session['time'])*-1
+    dt = round(time.time()-request.session['time']-1)*-1
     
     for i in range(int(request.session['difficulte'])):
 	    if request.POST.get('input'+str(i+1)).casefold()==request.session['quiz'][i].casefold():