-
Notifications
You must be signed in to change notification settings - Fork 2
/
bingocard4meeting.html
136 lines (122 loc) · 3.01 KB
/
bingocard4meeting.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
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>Bingo card for meeting</title>
<style>
table, th, td {
border: 1px solid black;
border-collapse: collapse;
text-align: center;
}
</style>
</head>
<body>
<script>
// Some choices to choose from
var possible_choices = [
"Forgot to unmute",
"Please mute",
"Pushed the wrong button",
"A comment and a question",
"Cat walks by",
"Dog barking",
"Connection dropped",
"Kid cameo",
"Bad lighting",
"Sea Shanty",
"Phone ringing",
"Can you see my screen?",
"Meeting runs over time",
"Accidental face filter",
"Cat shuts down laptop",
"Awkward silence",
"Sorry, you go first",
"Reused the same pun",
"Typing over someone else's notes",
"Opened the wrong link",
"Let's move the discussion to Slack",
"Synergy",
"Do you want to PR it?",
"Do you want to open an issue?",
"JIRA",
"Circle back",
"Sirens sound",
"Broken mic",
"Echo",
"Video froze",
"We will wait a few more mins",
"AFK when called on"];
function generateCardItems() {
// Shuffle choices, then take first N.
// Only need 24 because middle is free space.
let idx = new Array();
let cardItems = [];
for (let i = 0; i < possible_choices.length; i++) {
idx[i] = i;
}
// https://medium.com/@nitinpatel_20236/how-to-shuffle-correctly-shuffle-an-array-in-javascript-15ea3f84bfb
for (let i = idx.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * i);
const temp = idx[i];
idx[i] = idx[j];
idx[j] = temp;
}
for (let i = 0; i < 24; i++) {
const n = idx[i];
cardItems.push(possible_choices[n]);
}
return cardItems;
}
function generateCardTable() {
let cardItems = generateCardItems();
return `<table>
<tr>
<td height="100" width="100">${cardItems[0]}</td>
<td width="100">${cardItems[1]}</td>
<td width="100">${cardItems[2]}</td>
<td width="100">${cardItems[3]}</td>
<td width="100">${cardItems[4]}</td>
</tr>
<tr>
<td height="100">${cardItems[5]}</td>
<td>${cardItems[6]}</td>
<td>${cardItems[7]}</td>
<td>${cardItems[8]}</td>
<td>${cardItems[9]}</td>
</tr>
<tr>
<td height="100">${cardItems[10]}</td>
<td>${cardItems[11]}</td>
<td><b>FREE</b></td>
<td>${cardItems[12]}</td>
<td>${cardItems[13]}</td>
</tr>
<tr>
<td height="100">${cardItems[14]}</td>
<td>${cardItems[15]}</td>
<td>${cardItems[16]}</td>
<td>${cardItems[17]}</td>
<td>${cardItems[18]}</td>
</tr>
<tr>
<td height="100">${cardItems[19]}</td>
<td>${cardItems[20]}</td>
<td>${cardItems[21]}</td>
<td>${cardItems[22]}</td>
<td>${cardItems[23]}</td>
</tr>
</table>`;
}
</script>
<h1>Get your bingo card for a meeting</h1>
<!-- User instructions -->
<p>Click the button below to generate your bingo card and then print it out.</p>
<!-- A button to randomly generate a card -->
<button type="button"
onclick="document.getElementById('result').innerHTML = generateCardTable();">
Generate bingo card</button>
<!-- Render generated card for user to print, FREE space in middle -->
<p id="result"></p>
</body>
</html>