Smangumb · Smangumb · Nov 6, 2018 · Dec 3, 2018 · Dec 12, 2018 · Dec 12, 2018
diff --git a/checkpoint-three/css/style.css b/checkpoint-three/css/style.css
@@ -1 +1,42 @@
+body {
+    background-image: url(../images/codingbg.jpg);
+    background-repeat: no-repeat;
+    background-size: 2000px;
+}
 
+.content {
+    display: flex;
+    align-items: center;
+    flex-direction: column;
+    width: 450px;
+    background: rgba(0,0,0,0.8);
+    padding: 40px;
+    text-align: center;
+    margin: auto;
+    margin-top: 5%;
+    color: white;
+}
+
+#clickerimage {
+    width: 300px;
+    height: 300px;
+    border-radius: 150px;
+}
+
+#currentTotal {
+    width: 200px;
+    height: 50px;
+    border: 1px solid white;
+    text-align: center;
+    font-size: 48px;
+}
+
+.button {
+    width: 200px;
+    height: 20px;
+    border: 1px solid white;
+    border-radius: 25px;
+    text-align: center;
+    cursor: pointer;
+    padding: 5px;
+}
diff --git a/checkpoint-three/images/bluebh.jpg b/checkpoint-three/images/bluebh.jpg
diff --git a/checkpoint-three/images/codingbg.jpg b/checkpoint-three/images/codingbg.jpg
diff --git a/checkpoint-three/images/pc.jpg b/checkpoint-three/images/pc.jpg
diff --git a/checkpoint-three/index.html b/checkpoint-three/index.html
@@ -1 +1,27 @@
-
+<!DOCTYPE html>
+<html>
+<head>
+    <link rel="stylesheet" href="./css/style.css">
+    <title>Hackathon</title>
+</head>
+<body>
+    <!--Content Class to center all the elements-->
+    <div class="content">
+    <h1>Hackathon</h1>
+    <img src="./images/pc.jpg" id="clickerimage">
+    <br>
+    Terminal <br>
+    <small>Lines of Code per/sec: <span id="rps"></span></small>
+    <div id="currentTotal"></div>
+    <!--Upgrades-->
+    <div id="buttons">
+        <div class="button" data-val=".1" data-cost="10">5 Hour Energy - <span>10</span></div>
+        <div class="button" data-val="1" data-cost="100">Hardware Upgrade - <span>100</span></div>
+        <div class="button" data-val="10" data-cost="1000">ACA Tutor - <span>1000</span></div>
+        <div class="button" data-val="100" data-cost="10000">Master Googler - <span>10000</span></div>
+    </div>
+    </div>  
+<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
+<script type="text/javascript" src="./js/script.js"></script>
+</body>
+</html>
diff --git a/checkpoint-three/js/script.js b/checkpoint-three/js/script.js
@@ -0,0 +1,39 @@
+'use strict';
+
+var data = {
+    totalRevs:360,
+    totalCurrent:0,
+    totalRPS:0
+};
+
+setInterval(goGo,1000);
+
+function goGo() {
+    data.totalRevs += data.totalRPS;
+    data.totalCurrent += data.totalRPS;
+    updateReport();
+}
+
+function updateReport() {
+    $("#currentTotal").text(Math.floor(data.totalCurrent));
+    $("#rps").text((data.totalRPS/70.4).toFixed(3));
+}
+
+// Allows you to click the image for points
+$("#clickerimage").click(function (){
+    data.totalRevs ++;
+    data.totalCurrent ++;
+    updateReport();
+})
+
+// Allows you to purchase upgrades
+$(".button").click(function (){
+    var addVal = $(this).data("cost");
+    if ($(this).data("cost") < data.totalCurrent ) {
+        data.totalCurrent -= parseFloat($(this).data( "cost").toPrecision(2));
+        data.totalRPS += parseFloat($(this).data("val"));
+        $( this ).children("span").html( parseInt($( this).children("span").html()*1.15));
+        $( this ).data("cost", parseInt($(this).data( "cost" ) * 1.15));
+    }
+    updateReport();
+})