-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
137 lines (125 loc) · 5.68 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
<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
<head>
<title>Clicker Game Sample</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-12">
<h1>Clicking Game</h1>
<p class="lead">Click to Kill!</p>
</div>
</div>
<div class="row">
<div class="col-md-12">
<!-- For alerts!! -->
<div id="system"></div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<p>Game Stats:</p>
</div>
<div class="col-md-6">
<p>Shop for upgrades</p>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="panel panel-default">
<div class="panel-body">
<p>Current click damage = <span class="badge" id="output1"></span></p>
<p>Current increment damage = <span class="badge" id="output2"></span></p>
</div>
</div>
<p>Current Damages Clicked: <span class="badge" id="dps"></span></p>
<button onclick="increaseDPS()" class="btn btn-lg btn-info">Tap to Kill</button>
</div>
<div class="col-md-6">
<div class="panel panel-default">
<div class="panel-body">
<button onclick="powerClick()" class="btn btn-success">Power Click (Cost: 20 DPS, increase click damage by 1)</button>
<br />
<button onclick="passiveClick()" class="btn btn-success">Click Staff (Hire Cost: 100 DPS, Generates 1 damage point every 10 seconds)</button>
<br />
<button onclick="stopper()" class="btn btn-lg btn-danger">STOP</button>
</div>
</div>
</div>
</div>
</div>
<!-- Game Scripts -->
<script>
//Game Parameters
var point = 1; // Starting point
var showClickDmg = document.getElementById('output1');
showClickDmg.innerHTML = point; //Display it in Game Stats for current Click Damage
var incrementDamage = 0; //Starting increment damage
var incDmg = document.getElementById('output2');
incDmg.innerHTML = incrementDamage; //Display it in Game Stats for current increment Damage
var currentPoint = 0;
var dpsOutput = document.getElementById('dps');
dpsOutput.innerHTML = currentPoint;
function increaseDPS()
{
currentPoint = currentPoint + point + incrementDamage;
dpsOutput.innerHTML = currentPoint;
}
function powerClick()
{
if(currentPoint >= 20)
{
currentPoint = currentPoint - 20;
point = point + 1;
showClickDmg.innerHTML = point;
document.getElementById('system').innerHTML = ""; //Clear display
document.getElementById('system').innerHTML = "<div class='alert alert-success'>Bought Power Click! Now it's " + point + "!</div>"; //Success message
}
else
{
var remainingPoints = 20 - currentPoint;
document.getElementById('system').innerHTML = "<div class='alert alert-warning'>Insufficient points! You need " + remainingPoints + " more!</div>"; //Standard Error
}
}
//The above for click enhancement is done.
//Below is for passive increments and setting intervals
var interval1;
function minorInc()
{
currentPoint = currentPoint + incrementDamage;
dpsOutput.innerHTML = currentPoint;
}
function passiveClick()
{
if (currentPoint >= 100)
{
incrementDamage++; //increase passive integer
incDmg.innerHTML = incrementDamage; //display the passive integer
currentPoint = currentPoint - 100; //
interval1 = setInterval('minorInc()', 1000);
document.getElementById('system').innerHTML = ''; //Reset system display
document.getElementById('system').innerHTML = "<div class='alert alert-warning'>You bought Click Staff! Increment Damage is now " + incrementDamage + "</div>"; //Show if its successful
}
else
{
var remainingPoints = 100 - currentPoint;
document.getElementById('system').innerHTML = "<div class='alert alert-warning'>Insufficient points for Click Staff! You need " + remainingPoints + " more!</div>"; //Standard Error
}
}
//For development purposes if the incremental won't stop or the timer is hogging any of my resources, this stopper will do the trick. Otherwise stop the browser manually.
function stopper()
{
clearInterval(interval1);
}
</script>
</body>
</html>