[chronojump-server] Added update player functionality

[Max Ros i Morejon <maxros src gnome org>]

commit cad4fa7be15fb3d8e33f51f25b7d8e508a51b3c3
Author: Max Ros i Morejon <mros33 gmail com>
Date:   Sat Mar 2 19:12:36 2019 +0100

    Added update player functionality

 .../organizations/api/serializers.py               |   2 +-
 .../chronojump_networks/organizations/api/views.py |  14 +++
 .../players/add_edit_player_form.html              |   2 +-
 .../organizations/players/players_list.html        | 112 +++++++++++++++++----
 4 files changed, 110 insertions(+), 20 deletions(-)
---
diff --git a/chronojumpserver-django/chronojump_networks/organizations/api/serializers.py 
b/chronojumpserver-django/chronojump_networks/organizations/api/serializers.py
index d11ce78..a999c26 100644
--- a/chronojumpserver-django/chronojump_networks/organizations/api/serializers.py
+++ b/chronojumpserver-django/chronojump_networks/organizations/api/serializers.py
@@ -8,7 +8,7 @@ class PlayerSerializer(serializers.ModelSerializer):
     player_tasks = PlayerTaskSerializer(many=True)
     class Meta:
         model = Player
-        fields = [ 'id', 'name', 'number', 'height', 'weight', 'image', 'player_tasks']
+        fields = [ 'id', 'name', 'number', 'height', 'weight', 'image', 'player_tasks', 'rfid']
 
 
 class GymSerializer(serializers.ModelSerializer):
diff --git a/chronojumpserver-django/chronojump_networks/organizations/api/views.py 
b/chronojumpserver-django/chronojump_networks/organizations/api/views.py
index dc71db9..43be9b4 100644
--- a/chronojumpserver-django/chronojump_networks/organizations/api/views.py
+++ b/chronojumpserver-django/chronojump_networks/organizations/api/views.py
@@ -130,6 +130,20 @@ class PlayerListView(ListCreateAPIView):
         s = PlayerSerializer(o)
         return Response(s.data)
     
+    def put(self, request, *args, **kwars):
+        print("update player view")
+        data = dict(request.data)
+        o = Player.objects.get(id=int(data['id'][0]))
+        o.name = str(data['name'][0])
+        #o.image = str(data['image'][0])
+        o.number = int(data['number'][0])
+        o.height = float(data['height'][0])
+        o.weight = float(data['weight'][0])
+        o.rfid = str(data['rfid'][0])
+        o.organization_id = int(self.kwargs['organization_id'])
+        o.save()
+        return JsonResponse({}, status=200, safe=False)
+    
     def delete(self, request, *args, **kwargs):
         print("delete player")        
         data = dict(request.data)
diff --git 
a/chronojumpserver-django/chronojump_networks/templates/organizations/players/add_edit_player_form.html 
b/chronojumpserver-django/chronojump_networks/templates/organizations/players/add_edit_player_form.html
index 58acc20..124ec6b 100644
--- a/chronojumpserver-django/chronojump_networks/templates/organizations/players/add_edit_player_form.html
+++ b/chronojumpserver-django/chronojump_networks/templates/organizations/players/add_edit_player_form.html
@@ -5,7 +5,7 @@
        <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
                <div class="modal-content">
       <div class="modal-header">
-        <h5 class="modal-title" id="taskModalTitle">{% trans 'Add new player' %}</h5>
+        <h5 class="modal-title" id="playerModalTitle">{% trans 'Add new player' %}</h5>
         <button type="button" class="close" data-dismiss="modal" aria-label="Close">
           <span aria-hidden="true">&times;</span>
         </button>
diff --git a/chronojumpserver-django/chronojump_networks/templates/organizations/players/players_list.html 
b/chronojumpserver-django/chronojump_networks/templates/organizations/players/players_list.html
index 334b100..a247c9f 100644
--- a/chronojumpserver-django/chronojump_networks/templates/organizations/players/players_list.html
+++ b/chronojumpserver-django/chronojump_networks/templates/organizations/players/players_list.html
@@ -32,10 +32,6 @@
 <!-- Include Modal Task Form -->
 {% include 'organizations/players/add_edit_player_form.html' %}
 
-
-
-
-
 {% endblock %}
 
 {% block javascript %}
@@ -96,10 +92,9 @@
           title: "{% trans 'Number' %}"
         },
         {
-          data: "name",
+          "data": "name",
                        title: "{% trans 'Player name' %}",
         },
-
         {
           "data": "height",
           title: "{% trans 'Height' %}"
@@ -107,6 +102,21 @@
         {
           "data": "weight",
           title: "{% trans 'Weight' %}"
+        },
+        {
+          "type": "html",
+          orderable: false,
+          render: function(value, type, row) {
+            var html = "";
+            // Edit Player Button
+            html += '<button type="button" class="editPlayerBtn btn btn-outline-info btn-sm" ';
+            html += 'data-player-id="' + row.id + '" ';
+            html += 'data-player-name="' + row.name + '" ';
+            html += 'data-toggle="tooltip" data-placement="right" ';
+            html += 'title="' + "{% trans 'Edit player ' %}" + row.name + '">';
+            html += '<i class="material-icons" style="margin-top:3px;font-size:16px;">edit</i></button>';
+            return html;
+          }
         }
       ],
       "dom": "<'row'<'col-sm-6'B><'col-sm-6'f>>rtip",
@@ -115,7 +125,12 @@
           text: "{% trans 'Add players' %}",
           className: "btn btn-primary",
                  action: function( e, dt, node, config ) {
-            $('#addPlayerModalForm').modal('show');
+                 newPlayerInitialOperations();
+                 // Set the title for new player task
+              var title = "{% trans 'Add new player '%}";
+              $('#playerModalTitle').text(title);
+              $('#btnAddModifyPlayer').text("{% trans 'Add player' %}");
+              $('#addPlayerModalForm').modal('show');
 
           }
         },
@@ -182,6 +197,31 @@
       // Enanble checkboxes
       $('.removePlayerBtn').removeClass('disabled').addClass('disabled');
       enableCheckboxSelection('selectPlayerCheckbox', 'removePlayerBtn');
+      
+      $('.editPlayerBtn').on('click', function(){
+        var player = table_players.row($(this).parents('tr')).data();
+
+        // Set the title for new player task
+        var title = "{% trans 'Edit player '%}" + player.name;
+        $('#playerModalTitle').text(title);
+
+        var player = table_players.row($(this).parents('tr')).data();
+        deserializePlayer(player);
+        $('#btnAddModifyPlayer').text("{% trans 'Update player' %}");
+        $('#addPlayerModalForm').modal('show');
+      });
+    }
+    
+    /* initials operations for task */
+    function newPlayerInitialOperations() {
+      // Set the player attributes
+      $('#personId').val('');
+      $('#fullname').val('');
+      $('#height').val('');
+      $('#weight').val('');
+      $('#number').val('');
+      $('#input_rfid').val('');
+      //$('image').val('');
     }
     
     $('#btn_read_rfid').click(function() {
@@ -193,24 +233,27 @@
                 console.log('success');
                 $('#input_rfid').val(data.rfid);
             }, 
-            error: function(request, status, error) {
-                console.log('error');
-                alert(request.msg);
+            error: function(request, status, error) { 
+                alert(request.responseText);
             }
-
         })
     })
     
     $('#btnAddModifyPlayer').on('click', function(e) {
-        console.log("botó addmodifyplayer 0");
         e.preventDefault();
-        $('#personId').val('');  
-        if($('#input_rfid').val()=="") alert("{% trans 'Rfid is missing' %}");
-        else if($('#height').val()=="" || $('#weight').val()=="" || $('#fullname').val()=="") alert("{% 
trans 'All fields must be filled' %}");
+        if($('#input_rfid').val()=="" || $('#height').val()=="" || $('#weight').val()=="" || 
$('#fullname').val()=="") alert("{% trans 'All fields must be filled' %}");
         else {
             var player = serializePlayer();
             console.log(player.id);
-            putPlayer(player);
+            if(player.id) {
+                console.log("update");
+                //update player
+                updatePlayer(player);
+            } else {
+                console.log("create");
+                //create player
+                putPlayer(player);
+            }
         }
     })
     
@@ -236,9 +279,22 @@
         return player;
     }
     
+    // Dump values from player into Modal Form
+    function deserializePlayer(player) {
+
+      $('#personId').val(player.id);
+      $('#fullname').val(player.name);
+      $('#height').val(player.height);
+      $('#weight').val(player.weight);
+      $('#number').val(player.number);
+      $('#input_rfid').val(player.rfid);
+      //$('image').val('');
+      
+    }
+    
     function putPlayer(player) {
     // TODO: Add validation
-        console.log("botó addmodifyplayer 1");
+        console.log("botó add player");
         $.ajax({
             'url': "{% url 'api_organizations:players_list' organization_id=user.organization.id %}",
             'method': 'POST',
@@ -249,9 +305,29 @@
                 $('#addPlayerModalForm').modal('hide');
             },
             error: function(request, status, error) { 
-                var parts = request.responseText.split('\n')
+                var parts = request.responseText.split('\n');
+                alert(parts[1]); 
+            }
+        })
+    }
+    
+    function updatePlayer(player) {
+      /* TODO: Add validation */
+        console.log("botó update player");
+        $.ajax({
+            'url': "{% url 'api_organizations:players_list' organization_id=user.organization.id %}",
+            'method': 'PUT',
+            'data': player,
+            success: function(data) {
+                alert("The player has been updated");
+                table_players.ajax.reload(enablePlayersTableFunctionality, false);
+                $('#addPlayerModalForm').modal('hide');
+            },
+            error: function(request, status, error) { 
+                var parts = request.responseText.split('\n');
                 alert(parts[1]); 
             }
+
         })
     }