From 84e1cb80e19942629da5b11ab076e69b1c3e09f8 Mon Sep 17 00:00:00 2001
From: Jorys_Paulin <paulinjorys5@gmail.com>
Date: Sun, 3 Jun 2018 17:10:16 +0200
Subject: [PATCH] Removed Jquery from game list generation

---
 static/js/index.js | 38 +++++++++++++++-----------------------
 1 file changed, 15 insertions(+), 23 deletions(-)

diff --git a/static/js/index.js b/static/js/index.js
index a54e016..4196b34 100644
--- a/static/js/index.js
+++ b/static/js/index.js
@@ -506,32 +506,24 @@ function showApps(host) {
         // double clicking the button will cause multiple box arts to appear.
         // to mitigate this we ensure we don't add a duplicate.
         // This isn't perfect: there's lots of RTTs before the logic prevents anything
-        var outerDiv = $("<div>", {
-          class: 'game-container mdl-card mdl-shadow--4dp',
-          id: 'game-' + app.id,
-          role: 'link',
-          tabindex: 0,
-          title: app.title,
-          'aria-label': app.title
-        });
+        var gameCard = document.createElement('div')
+        gameCard.id = 'game-' + app.id
+        gameCard.className = 'game-container mdl-card mdl-shadow--4dp'
+        gameCard.setAttribute('role', 'link')
+        gameCard.tabIndex = 0
+        gameCard.title = app.title
 
-        $(outerDiv).append($("<div>", {
-          class: "game-title",
-          html: $("<span>", {
-            html: app.title
-          })
-        }));
-        $("#game-grid").append(outerDiv);
+        gameCard.innerHTML = `<div class="game-title">${app.title}</div>`
 
-        $('#game-' + app.id).on('click', function() {
-          startGame(host, app.id);
-        });
-        $('#game-' + app.id).keypress(function(e) {
-          if (e.keyCode == 13) {
+        gameCard.addEventListener('click', e => {
+          startGame(host, app.id)
+        })
+        gameCard.addEventListener('keydown', e => {
+          if(e.key == "Enter") {
             startGame(host, app.id);
           }
-        });
-
+        })
+        document.querySelector('#game-grid').appendChild(gameCard);
         // apply CSS stylization to indicate whether the app is active
         stylizeBoxArt(host, app.id);
       }
@@ -543,7 +535,7 @@ function showApps(host) {
         img.src = 'static/res/placeholder_error.svg'
       });
       img.onload = e => img.classList.add('fade-in');
-      $(outerDiv).append(img);
+      $(gameCard).append(img);
     });
   }, function(failedAppList) {
     $('#naclSpinner').hide();