Trainer table with pictures

Creates a trainer table with pictures

src/main/webapp/js/requests.js

@@ -3,6 +3,8 @@ let pokemonTypes = {};
 let tableParentId = 'table';
 let detailsParentId = 'details';
 
+let trainers = {};
+
 function getRowId(resource) {
     return `${resource.id}_row`
 }
@@ -60,4 +62,37 @@ function createPokemonTypesTable() {
             </tbody>
         </table>
     `
+}
+function trainerToRow(trainer){
+    return `
+    <tr id="${getRowId(trainer)}" onclick="updateDetails('${trainer?.id?.trim()}')">
+        <th scope="row">${trainer.id}</th>
+        <td>${trainer.name}</td>
+        <td>${trainer.created}</td>
+        <td>${trainer.lastUpDate}</td>
+        <td><img src="${trainer.profileUrl}" alt="FUCK" width="200" height="200" ></td>
+    </tr>
+    `
+}
+function createTrainerTable(){
+    const tableParent = document.getElementById(tableParentId);
+    tableParent.innerHTML = `
+        <table class="table table-striped table-hover">
+            <thead>
+                <tr>
+                    <th scope="col">ID</th>
+                    <th scope="col">Name</th>
+                    <th scope="col">Created</th>
+                    <th scope="col">Last Update</th>
+                    <th scope="col">Picture</th>
+                </tr>
+            </thead>
+            <tbody>
+                ${
+        trainers.data.map(resource => `${trainerToRow(resource)}`).join("\n")
+        || "no data"
+    }
+            </tbody>
+        </table>
+    `
 }
\ No newline at end of file