Enhance several visual things and count belote better

README.md

@@ -24,6 +24,10 @@ L'ensemble de ce dépôt est sous licence GPL v3.
  * Le dossier `templates` contient les template jinja2 pour le rendu web
  * Le dossier `static` contient les scripts, images et feuilles de style
 
+Si aucun utilisateur n'existe dans la base de donnée, un premier utilisateur
+de login `admin` et de mot de passe `admin` est créé. 
+A vous de changer le mot de passe avant mise en ligne !
+
 ## Licence
 
 This program is free software: you can redistribute it and/or modify

belote.py

@@ -78,8 +78,8 @@ def home():
 
 @app.route('/login', methods=['GET', 'POST'])
 def login():
-    if fll.current_user:
+    if fll.current_user.is_authenticated:
-        flask.redirect(URL_DEFAULT)
+        return flask.redirect(URL_DEFAULT)
     if flask.request.method=="POST":
         username = flask.request.form['username']
         password = flask.request.form['password']
@@ -94,7 +94,7 @@ def login():
                 return flask.redirect(URL_DEFAULT)
         else:
             app.logger.warning('Login fail for user {} from {}'.format(user, flask.request.remote_addr))
-            flask.flash('Invalid username/password combination')
+            flask.flash('Nom d\'utilisateur ou mot de passe incorrect')
     return flask.render_template('login.html', user=None)
 
 @app.route('/logout')
@@ -417,5 +417,5 @@ def delete_game(user=None, game=None):
 
 
 if __name__ == '__main__':
-    socketio.run(app, debug=True, host='127.0.0.1', port=8080 )
+    socketio.run(app, debug=True, host='0.0.0.0', port=8080 )
 

belote_ws.py

@@ -147,7 +147,7 @@ class CustomNamespaceJoin(fio.Namespace):
             if self.game().isadmin(current_user):
                 if 'username' is not None:
                     if self.game().leave(username):
-                        fio.emit('leave', {'username':username})
+                        fio.emit('leave', {'username':username}, broadcast=True)
 
     def on_fixplayers(self, data):
         if self.game().isadmin(current_user):

db.py

@@ -302,9 +302,9 @@ class Game(db.Model):
                 # Chute
                 if self.get_player(self.preneur).nr %2 ==0 and self.points_0 < self.points_1:
                     self.points_0 = belote_0
-                    self.points_1 = 162
+                    self.points_1 = 162 + belote_1
                 if self.get_player(self.preneur).nr %2 ==1 and self.points_1 < self.points_0:
-                    self.points_0 = 162
+                    self.points_0 = 162 + belote_0
                     self.points_1 = belote_1
 
             # Retirer la carte du jeu !

static/belote-script.js

@@ -5,6 +5,10 @@ var go = function(url) {
     document.location.href=url;
 }
 
+var hidealert = function(id){
+    $('#'+id).hide();
+}
+
 $(document).ready(function() {
 /*==============================
 listeners à activer à ready 

static/belote.css

@@ -305,6 +305,8 @@ position: absolute;
 	width: 90px;
 	overflow: hidden;
 	text-decoration: underscore;
+        border-color: black;
+        border-style: solid none solid none;
 }
 .carte {
 	height: 77px;
@@ -386,3 +388,24 @@ fieldset.fieldset {
     padding:30px;
     margin:20px;
 }
+
+.alert{
+    width:80%;
+    margin: 10px auto 10px auto;
+    padding:10px;
+    background: #FF9E77;
+    -moz-border-radius: 10px;
+    -webkit-border-radius: 10px;
+    -khtml-border-radius: 10px;
+    border-radius: 10px;
+    display:block;
+    border: 1px solid #DF531C;
+}
+
+.alert > .close{
+    background: #EC784A;
+    border: none;
+}
+
+table.tablelogin td{
+    padding: 10px 0px 10px 0px;

static/game_script.js

@@ -112,8 +112,8 @@ var set_cartes = function(){
         $('#jeu-3').html('');
     }else{
         for(i=first_player;i<first_player+4;i++){
-            j = i-first_player
+            j = i-first_player;
-            k = i%4
+            k = (i+6-jeu['nr'])%4;
             if (jeu['played'].length > j && jeu['played'][j]!= ''){
                 $('#jeu-'+ k).html(`<img src="/static/cards/${jeu['played'][j]}.png" width=100% />`);
             }else{
@@ -133,18 +133,25 @@ var set_derpli = function(){
 
 var set_players = function(){
     for(i=0;i<4;i++){
-        $('#joueur-'+i).html(`${jeu['playersinfo'][jeu['players'][i]]}`);
+        name = jeu['playersinfo'][jeu['players'][i]];
+        if(jeu['players'][i]==jeu['admin']){
+            name = name + '&nbsp;*';
+        }
+        k = (i+6-jeu['nr'])%4;
+        $('#joueur-'+k).html(name);
     }
 }
 
 var set_current_player = function(){
     for(i=0;i<4;i++){
         $('#joueur-'+i).css('font-weight', 'normal');
-        $('#joueur-'+i).css('text-decoration', 'none');
+        $('#joueur-'+i).css('border-width', '0px');
+        $('#joueur-'+i).css('background', 'none');
     }
-    i = (jeu['turn']+jeu['first_player']+8)%4;
+    i = (jeu['turn']+jeu['first_player']-jeu['nr']+18)%4;
     $('#joueur-'+i).css('font-weight', 'bold');
-    $('#joueur-'+i).css('text-decoration', 'underline overline');
+    $('#joueur-'+i).css('border-width', '1px 0px 1px 0px');
+        $('#joueur-'+i).css('background', '#55B78D');
     if((jeu['turn']+jeu['first_player']+8)%4 == jeu['nr']){
         $('#a-vous').css('visibility', 'visible');
     }else{

templates/admin_game_add.html

@@ -10,8 +10,8 @@
 
       <fieldset class="fieldset"><legend style="font-size:25px;">Nom du jeu</legend>
           {% for message in get_flashed_messages() %}
-            <div class="alert alert-warning">
+              <div class="alert" id="alert{{loop.index}}">
-                <button type="button" class="close" data-dismiss="alert">&times;</button>
+              <button type="button" class="close" onclick="javascript:hidealert('alert{{loop.index}}')">&times;</button>
                 {{ message }}
             </div>
           {% endfor %}

templates/admin_user_edit.html

@@ -11,8 +11,8 @@
 
       <fieldset class="fieldset"><legend style="font-size:25px;">Utilisateur</legend>
           {% for message in get_flashed_messages() %}
-            <div class="alert alert-warning">
+              <div class="alert" id="alert{{loop.index}}">
-                <button type="button" class="close" data-dismiss="alert">&times;</button>
+              <button type="button" class="close" onclick="javascript:hidealert('alert{{loop.index}}')">&times;</button>
                 {{ message }}
             </div>
           {% endfor %}

templates/game_join.html

@@ -12,7 +12,7 @@
 <div id="zone-de-contenu">
         <div style="width:100%;margin:20px;"> </div>
         
-      <fieldset class="fieldset"><legend style="font-size:25px;">Liste des joueurs</legend>
+      <fieldset class="fieldset" id="listpart"><legend style="font-size:25px;">Liste des joueurs</legend>
         <ul id="players">
         {% for p in game.get_players() %}
         {% if p['username'] == admin %}
@@ -117,6 +117,15 @@ socket.on('leave', function(data){
     {% if user.login == admin %}
         $('#gostart').hide();
         $('#add_player').show();
+    {% else %}
+    if (username == {{ user.login }}){
+        console.log("Vous avez été banni");
+        $('#listpart').prepend(`
+          <div class="alert" id="alert0">
+          <button type="button" class="close" onclick="javascript:hidealert('alert0')">&times;</button>
+        </div>
+            `);
+    }
     {% endif %}
 });
 

templates/index.html

@@ -8,7 +8,11 @@
 <div id="zone-de-contenu">
     <fieldset class="fieldset"><legend style="font-size:25px;">Bienvenue</legend>
         <p> Bienvenue sur le jeu de belote !</p>
+        {% if not user == None %}
+        <p> Rendez-vous sur <a href="/games">la page des jeux</a></p>
+        {% else %}
         <p> Vous devez vous identifier pour jouer, rendez vous sur <a href="/login">la page de login</a></p>
+        {% endif %}
     </fieldset>
 </div>
 {% endblock %}

templates/login.html

@@ -10,13 +10,13 @@
         <div style="width:100%;margin:20px;"> </div>
       <fieldset class="fieldset"><legend style="font-size:25px;">Identifiez-vous</legend>
           {% for message in get_flashed_messages() %}
-            <div class="alert alert-warning">
+              <div class="alert" id="alert{{loop.index}}">
-                <button type="button" class="close" data-dismiss="alert">&times;</button>
+              <button type="button" class="close" onclick="javascript:hidealert('alert{{loop.index}}')">&times;</button>
                 {{ message }}
             </div>
           {% endfor %}
 
-          <table width=100%>
+          <table width=100% class="tablelogin">
               <tr><td>Nom d'utilisateur : </td><td> <input type="text" name="username" placeholder="Votre nom d'utilisateur" /></td></tr>
               <tr><td> Mot de passe : </td><td> <input type="password" name="password"  placeholder="Votre mot de passe"/></td></tr>
               <tr><td>&nbsp;</td> <td><input id="submit" type="submit" value="&nbsp;Entrer&nbsp;"></td></tr>

templates/password.html

@@ -10,9 +10,9 @@
 
       <fieldset class="fieldset"><legend style="font-size:25px;">Nom du jeu</legend>
       {% for message in get_flashed_messages() %}
-        <div class="alert alert-warning">
+          <div class="alert" id="alert{{loop.index}}">
-            <button type="button" class="close" data-dismiss="alert">&times;</button>
+          <button type="button" class="close" onclick="javascript:hidealert('alert{{loop.index}}')">&times;</button>
-            {{ message }}
+        {{ message }}
         </div>
       {% endfor %}
         <form action="" method="POST" accept-charset="utf-8">