fluid-lab · rutvishah859 · Jun 7, 2018 · Jun 11, 2018 · Jun 12, 2018 · Jun 12, 2018
diff --git a/Astroid Base.png b/Astroid Base.png
diff --git a/README.md b/README.md
diff --git a/alien.png b/alien.png
diff --git a/copper.png b/copper.png
diff --git a/dropDown.png b/dropDown.png
diff --git a/fuel.png b/fuel.png
diff --git a/iron.png b/iron.png
diff --git a/loadingImagesRebuildingShip.js b/loadingImagesRebuildingShip.js
@@ -0,0 +1,24 @@
+function loadImage() {
+    backgroundAsteroid = this.document.getElementById("background");
+    alienAvatar = this.document.getElementById("alien");
+    speechBubble = this.document.getElementById("speechBubble");
+    yesButton = this.document.getElementById("yes");
+    noButton = this.document.getElementById("no");
+    scannedNoButton = this.document.getElementById("scannedNo");
+    scannedYesButton = this.document.getElementById("scannedYes");
+    dropDownMenu = this.document.getElementById("menu");
+    scannedMenu = this.document.getElementById("scannedMenu");
+    dropDown = this.document.getElementById ("dropDown");
+    plus = this.document.getElementById ("plus");
+    minus = this.document.getElementById("minus");
+    scannedPlus = this.document.getElementById ("scannedPlus");
+    scannedMinus = this.document.getElementById ("scannedMinus");
+}
+
+//loading resources
+function loadResources() {
+    fuel = this.document.getElementById("fuel");
+    copper = this.document.getElementById("copper");
+    iron = this.document.getElementById("iron");
+    stars = this.document.getElementById("stars");
+}
diff --git a/menu.png b/menu.png
diff --git a/minus.png b/minus.png
diff --git a/no.png b/no.png
diff --git a/onKeyUp.js b/onKeyUp.js
@@ -0,0 +1,45 @@
+window.onkeyup = function(e) { //takes the spacebar as a key input
+    if (e.key === " ") {
+        if(stage === "rebuildingShip"){
+            if(rebuildingShipScanningStage === 2 && pressedButton === false){
+                if(imageSelection === 0){
+                    if(scanTimes - 0.25 >= 0.25){
+                        scanTimes -= 0.25;
+                    }
+                    pressedButton = true;
+                }
+                if(imageSelection === 1){
+                    if(scanTimes + 0.25 <= 3){
+                        scanTimes += 0.25;
+                    }
+                    pressedButton = true;
+                }
+                if(imageSelection === 2){
+                    rebuildingShipScanningStage = 1;
+                    pressedButton = true;
+                    imageSelection = 3;
+                    speedCounter = 0;
+                }
+                speedLimit = 1500/ scanSpeed / scanTimes;
+            }
+            if(rebuildingShipScanningStage === 1 && pressedButton === false){
+                if(imageSelection === 0){
+                    stage = "map";
+                }
+                if(imageSelection === 1){
+                    stage = "map";
+                }
+                if(imageSelection === 2){
+                    rebuildingShipScanningStage = 2;
+                    imageSelection = 3;
+                    speedCounter = 0;
+                }
+            }
+        }
+        else if(stage === "map"){
+            stage = "rebuildingShip";
+            imageSelection = 0;
+            speedCounter = 0;
+        }
+    }
+}
diff --git a/plus.png b/plus.png
diff --git a/printingRebuildShip.js b/printingRebuildShip.js
@@ -0,0 +1,39 @@
+function printNumOfResources (){
+    //prints the number of items the
+    ctx.fillText(randAmount[0], (xposOfResource + 80), 260);
+    if (randNum === 2 || randNum === 3) {
+        ctx.fillText(randAmount[1], (xposOfResource2 + 80), 260);
+    }
+    if (randNum === 3) {
+        ctx.fillText(randAmount[2], (xposOfResource3 + 80), 260);
+    }
+    for(var i = 0; i < randNum; i++){
+        if(resourceUsed[i] === 1){
+            ctx.drawImage(copper, xposOfResource, 210 , 100, 100);
+        }
+        if(resourceUsed[i] === 2){
+            ctx.drawImage(fuel, xposOfResource2, 190, 100, 100);
+        }
+        if(resourceUsed[i] === 3){
+            ctx.drawImage(iron, xposOfResource3, 200, 100, 100);
+        }
+    }
+}
+//function prints the number of resources the player currently has left
+function printResources() {
+    ctx.drawImage(fuel, 1000, -10, 100, 100);
+    ctx.drawImage(copper, 750, 10, 100, 100);
+    ctx.drawImage(stars, 400, -10, 100, 100);
+    ctx.drawImage(iron, 50, -10, 100, 100);
+}
+//background plus alien thats always printed out
+function printGame(){
+    ctx.drawImage(backgroundAsteroid, 0, 0, 1280, 720); //draws the background
+    printResources(); //print the resouces onto the screen
+    //prints image of the alien that is asking for the resources, and a speech bubble
+    ctx.drawImage(alienAvatar, 800, 350, 200, 200);
+    ctx.drawImage(speechBubble, 750, 200, 500, 150);
+    ctx.drawImage(yesButton, 50, 150, 200, 150);
+    ctx.drawImage(noButton, 50, 350, 200, 150);
+    ctx.drawImage (menu, 1220, 10, 50, 50);
+}
diff --git a/randomMaterialsNeededRebuildingShip.js b/randomMaterialsNeededRebuildingShip.js
@@ -0,0 +1,11 @@
+var randNum = Math.floor(Math.random() * 3) + 1; //a number that determines how many items the alien will ask for
+//a random numeber generator for the aliens request
+//stores the number of resrouces the alien asks for each category
+var randAmount = [0, 0, 0]; //number of each item (will be between 1 - 7)
+var resourceUsed = [1 , 2, 3];
+
+function randResources (){
+    for(var i = 0; i < randNum; i++){
+        randAmount[i] = Math.floor(Math.random() * 7) + 1;
+    }
+}
diff --git a/rebuildShip.html b/rebuildShip.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <title>Ship Rebuild</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
+    <style>
+        canvas {
+            border: 1px solid white;
+            background-color: grey;
+        }
+        img{
+            visibility: hidden;
+        }
+    </style>
+</head>
+<body>
+    <canvas id = "myCanvas" width = "1280" height="720"></canvas>
+    <script src = "rebuildShip.js"></script>
+    <script src = "loadingImagesRebuildingShip.js"></script>
+    <script src = "randomMaterialsNeededRebuildingShip.js"></script>
+    <script src = "printingRebuildShip.js"></script>
+    <script src = "onKeyUp.js"></script>
+    <br>
+    <img id = "background" width= "1" height="1" src = "Astroid Base.png" alt = "Background Image">
+    <img id = "fuel" width = "1" height = "1" src = "fuel.png" alt = "Fuel">
+    <img id = "iron" width = "1" height = "1" src = "iron.png" alt = "Iron">
+    <img id = "copper" width = "1" height = "1" src = "copper.png" alt = "Copper">
+    <img id = "stars" width = "1" height "1" src = "stars.png" alt = "Stars">
+    <img id = "alien" width = "1" height = "1" src = "alien.png" alt = "Alien">
+    <img id = "speechBubble" width = "1" height = "1" src = "speechBubble.png" alt = "Speech Bubble">
+    <img id = "yes" width= "1" height= "1" src = "yes.png" alt = "Yes Button">
+    <img id = "no" width= "1" height= "1" src = "no.png" alt = "No Button">
+    <img id = "scannedYes" width= "1" height= "1" src = "scannedYes.png" alt = "Scanned Yes Button">
+    <img id = "scannedNo" width= "1" height= "1" src = "scannedNo.png" alt = "Scanned No Button">
+    <img id = "menu" width = "1" height = "1" src = "menu.png" alt = "Menu">
+    <img id = "scannedMenu" width = "1" height = "1" src = "scannedMenu.png" alt = "Scanned Menu">
+    <img id = "dropDown" width = "1" height = "1" src = "dropDown.png" alt = "DropDown Menu">
+    <img id = "plus" width = "1" height = "1" src = "plus.png" alt = "Plus Button">
+    <img id = "minus" width = "1" height = "1" src = "minus.png" alt = "Minus Button"> 
+    <img id = "scannedPlus" width = "1" height = "1" src = "scannedPlus.png" alt = "Scanned Plus">
+    <img id = "scannedMinus" width = "1" height = "1" src = "scannedMinus.png" alt = "Scanned Minus">
+</body> 
+</html>
diff --git a/rebuildShip.js b/rebuildShip.js
@@ -0,0 +1,100 @@
+//FOR ALL SCRIPTS
+var canvasWidth = 1280;
+var canvasHeight = 720;
+
+var scanSpeed = 10;
+var speedCounter = 0;
+var scanTimes = 1;
+var speedLimit = 1500/scanSpeed / scanTimes;
+var canvas = document.getElementById("myCanvas");
+var ctx = canvas.getContext("2d");
+
+var stage = "rebuildingShip";
+//End of all variables thats global
+
+//variables for images
+//variables to store images
+var backgroundAsteroid;
+var alienAvatar;
+var speechBubble;
+var noButton;
+var yesButton;
+var scannedNoButton;
+var scannedYesButton;
+var dropDownMenu;
+var scannedMenu;
+var dropDown;
+var plus;
+var minus;
+var scannedPlus;
+var scannedMinus;
+
+//variables of resources (images)
+var fuel;
+var iron;
+var copper;
+var stars;
+
+//var for x positions of the resources
+var xposOfResource = 770;
+var xposOfResource2 = 870;
+var xposOfResource3 = 990;
+
+//Different Stages of scanning
+var rebuildingShipScanningStage = 1;
+var imageSelection = 0;
+var pressedButton = false;
+
+window.onload = function() {
+    //loads images
+    loadImage();
+    loadResources();
+    printGame ();
+    ctx.font = "40pt Calibri";
+    randResources();
+    printNumOfResources();
+    var id = setInterval(animation, scanSpeed);
+};
+
+function animation(){
+    if(stage === "rebuildingShip"){
+        printGame();
+        printNumOfResources();
+        speedCounter++;
+        if(speedCounter >= speedLimit){
+            imageSelection++;
+            pressedButton = false;
+            speedCounter = 0;
+            if(imageSelection >= 3){
+                imageSelection = 0;
+            }
+        }
+        if(rebuildingShipScanningStage === 1){
+            if(imageSelection === 0){
+                ctx.drawImage(scannedYesButton, 50, 150, 200, 150);
+            }
+            if(imageSelection === 1){
+                ctx.drawImage(scannedNoButton, 50, 350, 200, 150);
+            }
+            if(imageSelection === 2){
+                ctx.drawImage(scannedMenu, 1220, 10, 50, 50);
+            }
+        }
+        if(rebuildingShipScanningStage === 2){
+            ctx.drawImage(dropDown, 0, 0, 1280, 300);
+            ctx.drawImage (plus, 200, 150, 50,50);
+            ctx.fillText (scanTimes.toFixed(2) + "x", 100, 150);
+            ctx.drawImage (minus, 50, 150, 50, 50);
+            ctx.drawImage (menu, 1200,200,50,50);
+            if(imageSelection === 0){
+                ctx.drawImage (scannedMinus, 50, 150, 50,50);
+            }
+            if(imageSelection === 1){
+                ctx.drawImage (scannedPlus, 200, 150, 50,50);
+            }
+            if(imageSelection === 2){
+                ctx.drawImage (scannedMenu, 1200,200,50,50);
+            }
+        }
+    }
+}
diff --git a/scannedMenu.png b/scannedMenu.png
diff --git a/scannedMinus.png b/scannedMinus.png
diff --git a/scannedNo.png b/scannedNo.png
diff --git a/scannedPlus.png b/scannedPlus.png
diff --git a/scannedYes.png b/scannedYes.png
diff --git a/speechBubble.png b/speechBubble.png
diff --git a/stars.png b/stars.png
diff --git a/yes.png b/yes.png