diff --git a/index.html b/index.html index 62790f2..d3aaa16 100644 --- a/index.html +++ b/index.html @@ -1,25 +1,22 @@ - - - - - + + + + Super Wars - - + + - +
-
-
-
-
-
-
+
+
+
- - - - + + + diff --git a/src/app.js b/src/app.js index cc43cc2..da659b1 100644 --- a/src/app.js +++ b/src/app.js @@ -20,39 +20,68 @@ const PLAYERS = [ "Vader", "Slingo" ]; + const initPlayers = (players) => { + let detailedPlayers = [] + // Create players using for loop + // Type your code here -// initialize players with image and strength -const initPlayers = (players) => { - let detailedPlayers = []; - // Create players using for loop - // Type your code here + for (let i = 0; i < players.length; i++) { + let obj = { + name: players[i], + strength: getRandomStrength(), + image: "images/super-" + (i + 1) + ".png", + } + if (i % 2 == 0) { + obj.type = "hero" + } else { + obj.type = "villain" + } - return detailedPlayers; + detailedPlayers.push(obj) + } + + return detailedPlayers } // getting random strength const getRandomStrength = () => { - // Return a random integer (0,100] - // Note: You can use Math.random() and Math.ceil() + // Return a random integer (0,100] + // Note: You can use Math.random() and Math.ceil() + + var i = parseInt(Math.random() * 100) + 1 + return i } const buildPlayers = (players, type) => { - let fragment = ''; + let fragment = "" + let fragment1 = "" + for (let i of players) { + fragment = ` +
+ +
${i.name}
+
${i.strength}
+
` - // Loop through players and accumulate HTML template - // depending of type of player(hero|villain) - // Type your code here + if (i.type == type) { + fragment1 += fragment + } + } + // Loop through players and accumulate HTML template + // depending of type of player(hero|villain) + // Type your code here - return fragment; + return fragment1 } // Display players in HTML const viewPlayers = (players) => { - - document.getElementById('heroes').innerHTML = buildPlayers(players, 'hero'); - document.getElementById('villains').innerHTML = buildPlayers(players, 'villain'); - + document.getElementById("heroes").innerHTML = buildPlayers(players, "hero") + document.getElementById("villains").innerHTML = buildPlayers( + players, + "villain" + ) } window.onload = () => { - viewPlayers(initPlayers(PLAYERS)); -} \ No newline at end of file + viewPlayers(initPlayers(PLAYERS)) +}