Skip to content

Commit e3fb689

Browse files
committed
n players can join the game!
1 parent 952249e commit e3fb689

2 files changed

Lines changed: 29 additions & 67 deletions

File tree

index.html

Lines changed: 1 addition & 66 deletions
Original file line numberDiff line numberDiff line change
@@ -9,72 +9,7 @@
99
<script src="./bootstrap.min.js"></script>
1010
</head>
1111
<body>
12-
<div id="players">
13-
<div class="col-xs-3 col-sm-3 col-md-3" id="p1">
14-
<div class="thumbnail">
15-
<img alt="Icon of Player 1">
16-
<div class="caption">
17-
<h3>Player 1</h3>
18-
<div class="input-group">
19-
<span class="input-group-addon" id="basic-addon1">@</span>
20-
<input type="text"
21-
class="form-control"
22-
placeholder="GitHub ID"
23-
aria-describedby="basic-addon1"
24-
onchange="game.players[0].updateName(this.value)">
25-
</div>
26-
</div>
27-
</div>
28-
</div>
29-
<div class="col-xs-3 col-sm-3 col-md-3" id="p2">
30-
<div class="thumbnail">
31-
<img alt="Icon of Player 2">
32-
<div class="caption">
33-
<h3>Player 2</h3>
34-
<div class="input-group">
35-
<span class="input-group-addon" id="basic-addon1">@</span>
36-
<input type="text"
37-
class="form-control"
38-
placeholder="GitHub ID"
39-
aria-describedby="basic-addon1"
40-
onchange="game.players[1].updateName(this.value)">
41-
</div>
42-
</div>
43-
</div>
44-
</div>
45-
<div class="col-xs-3 col-sm-3 col-md-3" id="p3">
46-
<div class="thumbnail">
47-
<img alt="Icon of Player 3">
48-
<div class="caption">
49-
<h3>Player 3</h3>
50-
<div class="input-group">
51-
<span class="input-group-addon" id="basic-addon1">@</span>
52-
<input type="text"
53-
class="form-control"
54-
placeholder="GitHub ID"
55-
aria-describedby="basic-addon1"
56-
onchange="game.players[2].updateName(this.value)">
57-
</div>
58-
</div>
59-
</div>
60-
</div>
61-
<div class="col-xs-3 col-sm-3 col-md-3" id="p4">
62-
<div class="thumbnail">
63-
<img alt="Icon of Player 4">
64-
<div class="caption">
65-
<h3>Player 4</h3>
66-
<div class="input-group">
67-
<span class="input-group-addon" id="basic-addon1">@</span>
68-
<input type="text"
69-
class="form-control"
70-
placeholder="GitHub ID"
71-
aria-describedby="basic-addon1"
72-
onchange="game.players[3].updateName(this.value)">
73-
</div>
74-
</div>
75-
</div>
76-
</div>
77-
</div>
12+
<div id="players"></div>
7813

7914
<div style="clear: both;"></div>
8015

main.js

Lines changed: 28 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -90,10 +90,37 @@ class Player {
9090

9191
class Game {
9292
constructor() {
93-
this.players = [0, 1, 2, 3].map(i => new Player(i, this));
93+
this.players = [];
94+
for (var i = 0; i < navigator.getGamepads().length; i++) {
95+
if (navigator.getGamepads()[i]) {
96+
this.addPlayer(i);
97+
}
98+
}
9499
this.enter();
95100
}
96101

102+
addPlayer(index) {
103+
$('#players').append(`
104+
<div class="col-xs-3 col-sm-3 col-md-3" id="p${index + 1}">
105+
<div class="thumbnail">
106+
<img alt="Icon of Player ${index + 1}">
107+
<div class="caption">
108+
<h3>Player ${index + 1}</h3>
109+
<div class="input-group">
110+
<span class="input-group-addon" id="basic-addon1">@</span>
111+
<input type="text"
112+
class="form-control"
113+
placeholder="GitHub ID"
114+
aria-describedby="basic-addon1"
115+
onchange="game.players[${index}].updateName(this.value)">
116+
</div>
117+
</div>
118+
</div>
119+
</div>
120+
`);
121+
this.players.push(new Player(index, this));
122+
}
123+
97124
enter() {
98125
this.waiting = false;
99126
this.entering = true;

0 commit comments

Comments
 (0)