-
Notifications
You must be signed in to change notification settings - Fork 0
/
ROLLDICE_INDEX.html
134 lines (119 loc) · 3.56 KB
/
ROLLDICE_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
<!DOCTYPE html>
<html>
<head>
<title>Gerador de Dados Online</title>
<!-- Here starts the code for the 6 dice faces -->
<style>
div.dice3{
float: left;
width:50px;
background:#F5F5F5;
border:rgb(0, 0, 0) 1px solid;
padding:50px;
font-size:50px;
text-align:center;
margin:10px;
}
</style>
<script>
function rollDice3(){
var die3 = document.getElementById("die3");
var status3 = document.getElementById("status3");
var d3 = Math.floor(Math.random() * 6) + 1;
var diceTotal3 = d3;
die3.innerHTML = d3;
status3.innerHTML = "Seu resultado é "+diceTotal3+".";
if(d3 == 6){
status3.innerHTML += " Resultado crítico! Você arrasou!";
}
if(d3 == 1){
status3.innerHTML += " Resultado crítico! Não foi dessa vez.";
}
}
</script>
<!-- Here starts the code for the 20 dice faces -->
<style>
div.dice{
float: left;
width:50px;
background:#F5F5F5;
border:rgb(0, 0, 0) 1px solid;
padding:50px;
font-size:50px;
text-align:center;
margin:10px;
}
</style>
<script>
function rollDice(){
var die1 = document.getElementById("die1");
var status = document.getElementById("status");
var d1 = Math.floor(Math.random() * 20) + 1;
var diceTotal = d1;
die1.innerHTML = d1;
status.innerHTML = "Seu resultado é "+diceTotal+".";
if(d1 == 20){
status.innerHTML += " Resultado crítico! Você arrasou!";
}
if(d1 == 1){
status.innerHTML += " Resultado crítico! Não foi dessa vez.";
}
}
</script>
<!-- Here starts the code for the 8 dice faces -->
<style>
div.dice2{
float: left;
width:50px;
background:#F5F5F5;
border:rgb(0, 0, 0) 1px solid;
padding:50px;
font-size:50px;
text-align:center;
margin:10px;
}
</style>
<script>
function rollDice2(){
var die2 = document.getElementById("die2");
var status = document.getElementById("status2");
var d2 = Math.floor(Math.random() * 8) + 1;
var diceTotal2 = d2;
die2.innerHTML = d2;
status2.innerHTML = "Seu resultado é "+diceTotal2+".";
if(d2 == 8){
status2.innerHTML += " Resultado crítico! Você arrasou!";
}
if(d2 == 1){
status2.innerHTML += " Resultado crítico! Não foi dessa vez.";
}
}
</script>
</head>
<body>
<img src="dice6faces.png" alt="d6 dice">
<img src="dice8faces.png" alt="d8 dice">
<img src="dice20faces.png" alt="d20 dice">
<!-- Here starts the code for the 6 dice faces-->
<h1 style="text-align: left;">d6</h1>
<div id="die3" class="dice3">0</div>
<button onclick="rollDice3()">Rolar Dado</button>
<h2 id="status3" style="clear:left; color: rgb(26, 0, 170)"></h2>
<!-- Here starts the code for the 8 dice faces -->
<h1 style="text-align: left;">d8</h1>
<div id="die2" class="dice2">0</div>
<button onclick="rollDice2()">Rolar Dado</button>
<h2 id="status2" style="clear:left; color: rgb(26, 0, 170)"></h2>
<!-- Here starts the code for the 20 dice faces -->
<h1 style="text-align: left;">d20</h1>
<div id="die1" class="dice">0</div>
<button onclick="rollDice()">Rolar Dado</button>
<h2 id="status" style="clear:left; color: rgb(26, 0, 170)"></h2>
<!-- The core Firebase JS SDK is always required and must be listed first -->
<script src="/__/firebase/8.3.1/firebase-app.js"></script>
<!-- TODO: Add SDKs for Firebase products that you want to use
https://firebase.google.com/docs/web/setup#available-libraries -->
<!-- Initialize Firebase -->
<script src="/__/firebase/init.js"></script>
</body>
</html>