forked from Joshimuz/mcbingo
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
144 lines (132 loc) · 10.1 KB
/
index.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
<!DOCTYPE html>
<html>
<head>
<title>Minecraft Bingo</title>
<link rel="stylesheet" href="bingo.css" type="text/css" />
<script src="https://code.jquery.com/jquery-latest.js"></script>
<script src="generator_v1.js"></script>
<script src="generator_v2.js"></script>
<script src="generator_v3.js"></script>
<script src="goals_v1.js"></script>
<script src="goals_v2.js"></script>
<script src="goals_v3.js"></script>
<script src="goals_v4.js"></script>
<script src="bingo.js"></script>
<link rel="icon" type="image/png" href="icon.png" />
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-102332269-1', 'auto');
ga('send', 'pageview');
</script>
</head>
<body>
<section id="nav_section">
<h1>Minecraft Bingo</h1>
</section>
<section id="bingo-section">
<table id="bingo">
<tr>
<td id="slot1" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
<td id="slot2" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
<td id="slot3" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
<td id="slot4" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
<td id="slot5" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
</tr>
<tr>
<td id="slot6" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
<td id="slot7" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
<td id="slot8" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
<td id="slot9" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
<td id="slot10" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
</tr>
<tr>
<td id="slot11" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
<td id="slot12" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
<td id="slot13" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
<td id="slot14" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
<td id="slot15" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
</tr>
<tr>
<td id="slot16" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
<td id="slot17" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
<td id="slot18" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
<td id="slot19" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
<td id="slot20" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
</tr>
<tr>
<td id="slot21" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
<td id="slot22" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
<td id="slot23" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
<td id="slot24" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
<td id="slot25" data-tooltipimg="" data-tooltiptext=""><img class="tooltipQ" src="question_mark.png"></td>
</tr>
</table>
<div id="hidden-table">
<div id="hidden-table-seed">
Bingo Seed:<br>
<input class="seed_for_copying" id="seed_for_copying_hidden" type="text" value="12345" readonly="readonly"><br />
<button onclick='copySeedToClipboard("seed_for_copying_hidden");'>Copy Seed to Clipboard</button>
</div>
<p>Use this seed to create a new world in Minecraft. Remember to adjust game settings like difficulty, if necessary.</p>
<p>If you've been linked this page for a race, you are not allowed to change the seed/goals. See the full rules below.</p>
<button class="show-table-button" onclick='toggleHidden();event.preventDefault();'>Show Table</button>
<p>The table is currently hidden, you may show it when the Bingo starts (unless otherwise agreed upon by the players).</p>
</div>
<button onclick='newSeed(true);event.preventDefault();' class="new-seed-button">Generate New Seed</button>
<div class="options" >
<button class="options-button" id="options-toggle-button">Options...</button>
<div id="options-dropdown-main" class="options-dropdown">
<button class="options-button" onclick='toggleHidden();' ><span id="ishidden"></p></span></button>
<button class="options-button" onclick='toggleStreamerMode();'>Streamer Mode</button>
<div class="difficulty">
<input type="range" id="difficultyRange" value="3" max="5" min="1" class="difficulty-slider" oninput="changeDifficulty(this.value);" onchange="changeDifficulty(this.value);"/>
<p class="difficulty-text"></p>
</div>
</div>
</div>
<div id="streamer_mode">
Seed: <input class="seed_for_copying" type="text" value="12345" readonly="readonly" /> (<span class="stream-difficulty-text"></span>, <span class="versionText"></span>)<br>
</div>
</section>
<a class="stream-exit-text" href="#" onclick='toggleStreamerMode();event.preventDefault();'>Exit Streamer Mode</a>
<a class="stream-exit-text" href="#" onclick='popoutBingoCard();'>Popout Bingo Card</a>
<section id="rules-section">
<p id="version_notice">You are not using the latest stable version. This may be intended, for example if you want to look at a linked Sheet, however if you want to generate a new Bingo Sheet <a href="#version_selection">consider changing version</a>.</p>
<p id="version_notice_unstable">You are using an in-development version, which may change at any time causing the same link to produce different goals. This is good if you want to make use of the latest updates to goals and for looking at a Sheet someone else just linked to you, otherwise <a href="#version_selection">consider changing to a stable version</a>.</p>
<h2>Rules and How to Race</h2>
<h3>Rules</h3>
<p>To complete the Bingo, you must complete all five goals in a line horizontally, vertically or diagonally.</p>
<ul>
<li>Goals referring to items that you are able to carry in your inventory (without any action specified), require you to have those items in your inventory at the moment you complete the Bingo. For example if a goal says "Golden Apple", you must have the "Golden Apple" in your inventory at the end. Completing the Bingo by dying (e.g. "Kill yourself with an Ender Pearl" as last goal) has no bearing on this, because the Bingo is considered completed before the items are dropped.</li>
<li>If the goal describes an action, for example "Tame a Wolf", then the goal is completed once you completed the actual action, in this case "taming", so it doesn't matter what happens to the Dog afterwards.</li>
<li>For goals that ask you to place something in the Minecraft World, for example "Build a glass cube and fill the inner with lava", you must make sure that the build does not get destroyed for the duration of the Bingo. However, you don't have to show it at the end, so if it wasn't witnessed being destroyed in the meantime it counts as intact.</li>
</ul>
<p><em>Note:</em> The goals are usually designed for the latest version of Minecraft (Java Edition).</p>
<p><em>Tip:</em> You can click on the squares (or hover and use 1-4) to change their colour, which may be useful for planning or to mark off completed goals.</p>
<p><em>Tip:</em> Hover over a "?" to get more information about that goal.</p>
<h3>How to Race</h3>
<p>To do a race, get together with some people and try to finish the Bingo as quickly as possible.</p>
<p>If you're the one setting up the race, generate a Bingo Sheet and then link it to the other players, so that everyone has the same goals. You can hide the table in the Options menu before generating the seed, so that you and everyone else will see the sheet only when the race starts.</p>
<p>If you got linked this sheet for a race, you are not allowed to change it in any way.</p>
<ul>
<li>Use <input class="seed_for_copying" id="seed_for_copying_howto" type="text" value="" size="6" readonly="readonly" /><button onclick='copySeedToClipboard("seed_for_copying_howto");'>Copy</button> as Seed when creating the new world for the race in Minecraft (this is the same random seed used to generate this sheet). Make sure that all the racers are using the same ingame difficulty setting.</li>
<li>You may pre-load the world, but not start playing until the race starts.</li>
<li>Third-party applications or mods (for example Optifine, MCEdit or online Seed Maps) are not allowed.</li>
<li>Stream the race!</li>
</ul>
<p><em>Note:</em> These rules are the recommended rules to play this Bingo. If everyone in the race agrees, then of course a modified set of rules can be used.</p>
<a href="https://github.com/Joshimuz/mcbingo"><img src="github-img.png" width='200px'></a>
<h2>Version</h2>
<p>To ensure that each created Bingo Sheet always stays the same (even if goals are added or modified in the future) a version identifier is encoded into the URL. If you got linked this page for a race you should not change the version since this will most likely result in different goals.</p>
<p>In-development versions may change at any time, use at your own risk.</p>
<p>Selected Version: <select id="version_selection"></select></p>
</section>
<div id="tooltip">
<img src="" id="tooltipimg" />
<span id="tooltiptext"></span>
</div>
</body>
</html>