forked from DGNum/gestioCOF
Revert "WS : quand la K-Fêt est ouverte ?"
This reverts commit ce9f717f06
.
This commit is contained in:
parent
ce9f717f06
commit
a4fdb99267
5 changed files with 122 additions and 167 deletions
|
@ -24,21 +24,3 @@ class KPsul(JsonWebsocketConsumer):
|
||||||
|
|
||||||
def disconnect(self, message, **kwargs):
|
def disconnect(self, message, **kwargs):
|
||||||
pass
|
pass
|
||||||
|
|
||||||
class Home(JsonWebsocketConsumer):
|
|
||||||
|
|
||||||
# Set to True if you want them, else leave out
|
|
||||||
strict_ordering = False
|
|
||||||
slight_ordering = False
|
|
||||||
|
|
||||||
def connection_groups(self, **kwargs):
|
|
||||||
return ['kfet.home']
|
|
||||||
|
|
||||||
def connect(self, message, **kwargs):
|
|
||||||
pass
|
|
||||||
|
|
||||||
def receive(self, content, **kwargs):
|
|
||||||
pass
|
|
||||||
|
|
||||||
def disconnect(self, message, **kwargs):
|
|
||||||
pass
|
|
||||||
|
|
|
@ -9,5 +9,4 @@ from kfet import consumers
|
||||||
|
|
||||||
channel_routing = [
|
channel_routing = [
|
||||||
route_class(consumers.KPsul, path=r"^/ws/k-fet/k-psul/$"),
|
route_class(consumers.KPsul, path=r"^/ws/k-fet/k-psul/$"),
|
||||||
route_class(consumers.Home, path=r"^/ws/k-fet/home/$"),
|
|
||||||
]
|
]
|
||||||
|
|
|
@ -149,12 +149,6 @@ textarea {
|
||||||
line-height:30px;
|
line-height:30px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.content-left .line-medium {
|
|
||||||
font-size:20px;
|
|
||||||
font-weight:bold;
|
|
||||||
text-align:center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.content-left .line.line-big {
|
.content-left .line.line-big {
|
||||||
font-family:Oswald;
|
font-family:Oswald;
|
||||||
font-size:60px;
|
font-size:60px;
|
||||||
|
@ -162,13 +156,6 @@ textarea {
|
||||||
text-align:center;
|
text-align:center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.content-left .line.line-large {
|
|
||||||
font-family:Oswald;
|
|
||||||
font-size:40px;
|
|
||||||
font-weight:bold;
|
|
||||||
text-align:center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.content-left .line.line-bigsub {
|
.content-left .line.line-bigsub {
|
||||||
font-size:25px;
|
font-size:25px;
|
||||||
font-weight:bold;
|
font-weight:bold;
|
||||||
|
@ -179,13 +166,6 @@ textarea {
|
||||||
font-size:45px;
|
font-size:45px;
|
||||||
text-align:center;
|
text-align:center;
|
||||||
}
|
}
|
||||||
/*
|
|
||||||
.content-left-top .line.to-colorize {
|
|
||||||
padding-left: 30px;
|
|
||||||
padding-right: 30px;
|
|
||||||
margin-left: -30px;
|
|
||||||
margin-right: -30px;
|
|
||||||
}*/
|
|
||||||
|
|
||||||
.content-right {
|
.content-right {
|
||||||
margin:0 15px;
|
margin:0 15px;
|
||||||
|
|
|
@ -5,32 +5,20 @@
|
||||||
{% block title %}Accueil{% endblock %}
|
{% block title %}Accueil{% endblock %}
|
||||||
{% block content-header-title %}Accueil{% endblock %}
|
{% block content-header-title %}Accueil{% endblock %}
|
||||||
|
|
||||||
|
|
||||||
{% block extra_head %}
|
|
||||||
<link rel="stylesheet" type="text/css" href="{% static 'kfet/css/home.css' %}">
|
|
||||||
<script type="text/javascript" src="{% static 'kfet/js/reconnecting-websocket.js' %}"></script>
|
|
||||||
{% endblock %}
|
|
||||||
|
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-sm-4 col-md-3 col-content-left">
|
<div class="col-sm-4 col-md-3 col-content-left">
|
||||||
<div class="content-left">
|
<div class="content-left">
|
||||||
<div class="content-left-top">
|
<div class="content-left-top">
|
||||||
<div class="line line-medium">La K-Fêt est <span id="is_open1">Peut-être</span></div>
|
<div class="line line-big">Trucs</div>
|
||||||
<div class="line line-large to-colorize" id="is_open2">???????</div>
|
<div class="line line-bigsub">à dire</div>
|
||||||
<div class="line line-medium">
|
|
||||||
Dernière activité il y a
|
|
||||||
<span id="last_op"></span>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
<!--
|
|
||||||
<div class="buttons">
|
<div class="buttons">
|
||||||
<a class="btn btn-primary btn-lg" href="#TODO">Choix 1</a>
|
<a class="btn btn-primary btn-lg" href="#TODO">Choix 1</a>
|
||||||
<a class="btn btn-primary btn-lg" href="#TODO">Choix 2</a>
|
<a class="btn btn-primary btn-lg" href="#TODO">Choix 2</a>
|
||||||
<a class="btn btn-primary btn-lg" href="#TODO">Choix 3</a>
|
<a class="btn btn-primary btn-lg" href="#TODO">Choix 3</a>
|
||||||
</div>
|
</div>
|
||||||
-->
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-sm-8 col-md-9 col-content-right">
|
<div class="col-sm-8 col-md-9 col-content-right">
|
||||||
|
@ -79,107 +67,124 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script>
|
|
||||||
jQuery(document).ready(function() {
|
|
||||||
// VARIABLES
|
|
||||||
// variables d'éléments du DOM
|
|
||||||
var last_op_span = $("#last_op");
|
|
||||||
// varibles globales
|
|
||||||
var last_op_date = new Date("{{ last_op }}");
|
|
||||||
var is_open1 = $("#is_open1");
|
|
||||||
var is_open2 = $("#is_open2");
|
|
||||||
var to_colorize = $(".to-colorize");
|
|
||||||
// INITIALIZATION
|
|
||||||
update_ouverture();
|
|
||||||
|
|
||||||
// EVENTS
|
|
||||||
// on met à jour toutes les 10 secondes
|
|
||||||
window.setInterval(function(){
|
|
||||||
update_ouverture();
|
|
||||||
}, 10000);
|
|
||||||
|
|
||||||
// FONCTIONS
|
|
||||||
function update_time_ouverture(nb_min, nb_hour) {
|
|
||||||
last_op_span.html(text_diff_time(nb_min, nb_hour));
|
|
||||||
}
|
|
||||||
function update_text_ouverture(nb_min, nb_hour) {
|
|
||||||
if (nb_hour == 0) {
|
|
||||||
if (nb_min <= 15) {
|
|
||||||
is_open1.html("");
|
|
||||||
is_open2.html("OUVERTE");
|
|
||||||
} else if (nb_min <= 30) {
|
|
||||||
is_open1.html("peut-être");
|
|
||||||
is_open2.html("OUVERTE");
|
|
||||||
} else {
|
|
||||||
is_open1.html("peut-être");
|
|
||||||
is_open2.html("FERMÉE");
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
is_open1.html("");
|
|
||||||
is_open2.html("FERMÉE");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
function update_color_ouverture(nb_min, nb_hour) {
|
|
||||||
var hue = 0;
|
|
||||||
var saturation = 70;
|
|
||||||
var value = 30;
|
|
||||||
if (nb_hour == 0) {
|
|
||||||
hue = 120 - nb_min * 2;
|
|
||||||
value += 30*(2/60)*Math.min(nb_min, 60-nb_min)
|
|
||||||
saturation += 30*(2/60)*Math.min(nb_min, 60-nb_min)
|
|
||||||
}
|
|
||||||
var hsvText = "hsl("+hue+","+saturation+"%,"+value+"%)";
|
|
||||||
to_colorize.css({"color": hsvText });
|
|
||||||
}
|
|
||||||
function update_ouverture() {
|
|
||||||
var date_now = Date.now();
|
|
||||||
var tmp = date_now - last_op_date;
|
|
||||||
|
|
||||||
tmp = Math.floor(tmp/1000); // Nombre de secondes entre les 2 dates
|
|
||||||
diff_sec = tmp % 60; // Extraction du nombre de secondes
|
|
||||||
|
|
||||||
tmp = Math.floor((tmp-diff_sec)/60); // Nombre de minutes (partie entière)
|
|
||||||
diff_min = tmp % 60; // Extraction du nombre de minutes
|
|
||||||
|
|
||||||
tmp = Math.floor((tmp-diff_min)/60); // Nombre d'heures (entières)
|
|
||||||
diff_hour = tmp % 24; // Extraction du nombre d'heures
|
|
||||||
|
|
||||||
update_time_ouverture(diff_min, diff_hour);
|
|
||||||
update_text_ouverture(diff_min, diff_hour);
|
|
||||||
update_color_ouverture(diff_min, diff_hour);
|
|
||||||
}
|
|
||||||
function text_diff_time(nb_min, nb_hour) {
|
|
||||||
if (nb_hour == 0) {
|
|
||||||
if (nb_min == 0) {
|
|
||||||
return "moins d'une minute";
|
|
||||||
} else if (nb_min == 1) {
|
|
||||||
return "une minute";
|
|
||||||
} else {
|
|
||||||
return nb_min + " minutes";
|
|
||||||
}
|
|
||||||
} else if (nb_hour == 1) {
|
|
||||||
return "une heure et " + nb_min + " minutes";
|
|
||||||
} else {
|
|
||||||
return nb_hour + " heures et " + nb_min + " minutes";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// SYNCHRONIZATION
|
|
||||||
websocket_msg_default = {'last_op': 0}
|
|
||||||
|
|
||||||
var websocket_protocol = window.location.protocol == 'https:' ? 'wss' : 'ws';
|
|
||||||
var location_host = window.location.host;
|
|
||||||
var location_url = window.location.pathname.startsWith('/gestion/') ? location_host + '/gestion' : location_host;
|
|
||||||
socket = new ReconnectingWebSocket(websocket_protocol+"://" + location_url + "/ws/k-fet/home/");
|
|
||||||
|
|
||||||
socket.onmessage = function(e) {
|
|
||||||
data = $.extend({}, websocket_msg_default, JSON.parse(e.data));
|
|
||||||
last_op_date = new Date(data['last_op']);
|
|
||||||
|
|
||||||
update_ouverture();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
|
{% block extra_head %}
|
||||||
|
<link rel="stylesheet" type="text/css" href="{% static 'kfet/css/home.css' %}">
|
||||||
|
<script src="{% static 'kfet/js/Chart.bundle.js' %}"></script>
|
||||||
|
<script>
|
||||||
|
jQuery(document).ready(function() {
|
||||||
|
var ctx1 = $("#myChart1");
|
||||||
|
var ctx2 = $("#myChart2");
|
||||||
|
var ctx3 = $("#myChart3");
|
||||||
|
var myChart = new Chart(ctx1, {
|
||||||
|
type: 'bar',
|
||||||
|
data: {
|
||||||
|
labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
|
||||||
|
datasets: [{
|
||||||
|
label: '# of Votes',
|
||||||
|
data: [12, 19, 3, 5, 2, 3],
|
||||||
|
backgroundColor: [
|
||||||
|
'rgba(255, 99, 132, 0.2)',
|
||||||
|
'rgba(54, 162, 235, 0.2)',
|
||||||
|
'rgba(255, 206, 86, 0.2)',
|
||||||
|
'rgba(75, 192, 192, 0.2)',
|
||||||
|
'rgba(153, 102, 255, 0.2)',
|
||||||
|
'rgba(255, 159, 64, 0.2)'
|
||||||
|
],
|
||||||
|
borderColor: [
|
||||||
|
'rgba(255,99,132,1)',
|
||||||
|
'rgba(54, 162, 235, 1)',
|
||||||
|
'rgba(255, 206, 86, 1)',
|
||||||
|
'rgba(75, 192, 192, 1)',
|
||||||
|
'rgba(153, 102, 255, 1)',
|
||||||
|
'rgba(255, 159, 64, 1)'
|
||||||
|
],
|
||||||
|
borderWidth: 1
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
scales: {
|
||||||
|
yAxes: [{
|
||||||
|
ticks: {
|
||||||
|
beginAtZero:true
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
var myChart = new Chart(ctx2, {
|
||||||
|
type: 'bar',
|
||||||
|
data: {
|
||||||
|
labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
|
||||||
|
datasets: [{
|
||||||
|
label: '# of Votes',
|
||||||
|
data: [12, 19, 3, 5, 2, 3],
|
||||||
|
backgroundColor: [
|
||||||
|
'rgba(255, 99, 132, 0.2)',
|
||||||
|
'rgba(54, 162, 235, 0.2)',
|
||||||
|
'rgba(255, 206, 86, 0.2)',
|
||||||
|
'rgba(75, 192, 192, 0.2)',
|
||||||
|
'rgba(153, 102, 255, 0.2)',
|
||||||
|
'rgba(255, 159, 64, 0.2)'
|
||||||
|
],
|
||||||
|
borderColor: [
|
||||||
|
'rgba(255,99,132,1)',
|
||||||
|
'rgba(54, 162, 235, 1)',
|
||||||
|
'rgba(255, 206, 86, 1)',
|
||||||
|
'rgba(75, 192, 192, 1)',
|
||||||
|
'rgba(153, 102, 255, 1)',
|
||||||
|
'rgba(255, 159, 64, 1)'
|
||||||
|
],
|
||||||
|
borderWidth: 1
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
scales: {
|
||||||
|
yAxes: [{
|
||||||
|
ticks: {
|
||||||
|
beginAtZero:true
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
var myChart = new Chart(ctx3, {
|
||||||
|
type: 'bar',
|
||||||
|
data: {
|
||||||
|
labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
|
||||||
|
datasets: [{
|
||||||
|
label: '# of Votes',
|
||||||
|
data: [12, 19, 3, 5, 2, 3],
|
||||||
|
backgroundColor: [
|
||||||
|
'rgba(255, 99, 132, 0.2)',
|
||||||
|
'rgba(54, 162, 235, 0.2)',
|
||||||
|
'rgba(255, 206, 86, 0.2)',
|
||||||
|
'rgba(75, 192, 192, 0.2)',
|
||||||
|
'rgba(153, 102, 255, 0.2)',
|
||||||
|
'rgba(255, 159, 64, 0.2)'
|
||||||
|
],
|
||||||
|
borderColor: [
|
||||||
|
'rgba(255,99,132,1)',
|
||||||
|
'rgba(54, 162, 235, 1)',
|
||||||
|
'rgba(255, 206, 86, 1)',
|
||||||
|
'rgba(75, 192, 192, 1)',
|
||||||
|
'rgba(153, 102, 255, 1)',
|
||||||
|
'rgba(255, 159, 64, 1)'
|
||||||
|
],
|
||||||
|
borderWidth: 1
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
scales: {
|
||||||
|
yAxes: [{
|
||||||
|
ticks: {
|
||||||
|
beginAtZero:true
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
{% endblock %}
|
||||||
|
|
|
@ -44,15 +44,10 @@ class Home(TemplateView):
|
||||||
|
|
||||||
def get_context_data(self, **kwargs):
|
def get_context_data(self, **kwargs):
|
||||||
context = super(TemplateView, self).get_context_data(**kwargs)
|
context = super(TemplateView, self).get_context_data(**kwargs)
|
||||||
# Carte
|
|
||||||
articles = Article.objects.all().filter(is_sold=True, hidden=False)
|
articles = Article.objects.all().filter(is_sold=True, hidden=False)
|
||||||
context['pressions'] = articles.filter(category__name='Pression')
|
context['pressions'] = articles.filter(category__name='Pression')
|
||||||
context['articles'] = (articles.exclude(category__name='Pression')
|
context['articles'] = (articles.exclude(category__name='Pression')
|
||||||
.order_by('category'))
|
.order_by('category'))
|
||||||
# La K-Fêt est ouverte ?
|
|
||||||
last_opgroup = OperationGroup.objects.all().order_by('-at').first()
|
|
||||||
context['last_op'] = last_opgroup.at.isoformat()
|
|
||||||
# context['dark'] =
|
|
||||||
return context
|
return context
|
||||||
|
|
||||||
@method_decorator(login_required)
|
@method_decorator(login_required)
|
||||||
|
@ -1113,12 +1108,6 @@ def kpsul_perform_operations(request):
|
||||||
'stock': article['stock']
|
'stock': article['stock']
|
||||||
})
|
})
|
||||||
consumers.KPsul.group_send('kfet.kpsul', websocket_data)
|
consumers.KPsul.group_send('kfet.kpsul', websocket_data)
|
||||||
|
|
||||||
# Websocket last operation
|
|
||||||
websocket_last_op = {}
|
|
||||||
websocket_last_op['last_op'] = operationgroup.at.isoformat()
|
|
||||||
consumers.Home.group_send('kfet.home', websocket_last_op)
|
|
||||||
|
|
||||||
return JsonResponse(data)
|
return JsonResponse(data)
|
||||||
|
|
||||||
@teamkfet_required
|
@teamkfet_required
|
||||||
|
|
Loading…
Reference in a new issue