-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathteam.html
169 lines (144 loc) · 4.8 KB
/
team.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Russian Roulette</title>
<!-- <link rel="stylesheet" href="css/body.css" /> -->
<link rel="stylesheet" href="css/team.css" />
<link rel="icon" href="img/logo.ico" />
</head>
<body class="">
<header>
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/roll.html">Roll</a></li>
<li><a href="/team.html">Roll Team</a></li>
</ul>
</nav>
</header>
<div class="container">
<div class="components">
<div class="inFlex">
<!-- title -->
<div class="chip">
<div class="chip__icon">
<ion-icon name="color-palette"></ion-icon>
</div>
<h1 id="title">Russian roulette</h1>
<div class="chip__close">
<ion-icon name="close"></ion-icon>
</div>
</div>
<!-- arrays -->
<div class="form">
<input
id="class1"
type="text"
class="form__input text-col"
placeholder="List of members.... (name, name, name)"
/>
<input
id="class2"
type="text"
class="form__input text-col"
placeholder="List of members.... (name, name, name)"
/>
<div onclick="submit()" class="btn btn__primary">
<p>Submit Members to List</p>
</div>
</div>
<div class="chip">
<div class="chip__icon">
<ion-icon name="color-palette"></ion-icon>
</div>
<p id="listMembers">List of all members</p>
<div class="chip__close">
<ion-icon name="close"></ion-icon>
</div>
</div>
<div onclick="roulette()" class="btn btn__primary hide" id="btn_roll">
<p>Go roll</p>
</div>
<div class="chip hide" id="win_div">
<div class="chip__icon">
<ion-icon name="color-palette"></ion-icon>
</div>
<p id="win"></p>
<div class="chip__close">
<ion-icon name="close"></ion-icon>
</div>
</div>
</div>
<div class="flexOn">
<div onclick="location.reload()" class="btn btn__primary" id="reset">
<p>Reset</p>
</div>
</div>
</div>
</div>
<script>
let invalidText =
"Please enter the names in the free field and then validated.";
let list = document.querySelector("#listMembers");
let btn_roll = document.querySelector("#btn_roll");
let value = [],
class1 = [],
class2 = [],
end =[];
function submit() {
value.length = 0;
list.length = 0;
let val1 = document.getElementById("class1").value;
let val2 = document.getElementById("class2").value;
class1.push(val1.trim().split(","));
class2.push(val2.trim().split(","));
value = class1.concat(class2);
btn_roll.classList.remove("hide");
return (list.textContent = value.join(", "));
}
let switch__1 = document.querySelector("#switch-1");
let win = document.querySelector("#win");
// function roll(cl) {
// console.log(cl);
// return Math.floor(Math.random() * cl.length);
// }
function roulette() {
console.log(class1[0], class2[0])
// if (class1.length > 1 && class2.length > 1) {
roll.length = 0;
end.length = 0;
let roleNb = 0;
roleNb = Math.floor(Math.random() * class1[0].length);
end.push(class1[0][roleNb])
class1.splice(roleNb, 1);
roleNb = Math.floor(Math.random() * class1[0].length);
end.push(class1[0][roleNb])
class1.splice(roleNb, 1);
roleNb = Math.floor(Math.random() * class2[0].length);
end.push(class2[0][roleNb])
class2.splice(roleNb, 1);
roleNb = Math.floor(Math.random() * class2[0].length);
end.push(class2[0][roleNb])
class2.splice(roleNb, 1);
console.log(end)
document.querySelector("#win_div").classList.remove("hide");
win.textContent = `Team : ${end.join(', ')}`;
// value[0].splice(roll, 1);
// return (list.textContent = value[0].join(", "));
// } else {
// list.length = 0;
// return (list.textContent = invalidText);
// }
}
</script>
</body>
</html>
<!--
array1 class 1
array2 class 2
2 x 2
sort table of team
-->