DOM-and-Events-Studio/scripts.js at f9b20bd3c7b12cbd0d1f9ede9b8ad4116ac45172 · LaunchCodeEducation/DOM-and-Events-Studio · GitHub

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
// Write your JavaScript code here.
// Remember to pay attention to page loading!

window.addEventListener("load", function(){
    let status = this.document.getElementById("flightStatus");
    let bg = this.document.getElementById("shuttleBackground");
    let shuttleHeight = this.document.getElementById("spaceShuttleHeight");
    let rocketImg = this.document.getElementById("rocket");
    rocketImg.style.position = "absolute";
    rocketImg.style.left = "0px";
    rocketImg.style.bottom = "0px";

    let left = this.document.getElementById("left");
    left.addEventListener("click", function(){
        if (parseInt(rocketImg.style.left) > 0){
            rocketImg.style.left = parseInt(rocketImg.style.left) - 10 + "px";
        }
    })

    let right = this.document.getElementById("right");
    right.addEventListener("click", function(){
        if (parseInt(rocketImg.style.left) < 300){
            rocketImg.style.left = parseInt(rocketImg.style.left) + 10 + "px";
        }
    })

    let up = this.document.getElementById("up");
    up.addEventListener("click", function(){
        if (parseInt(rocketImg.style.bottom) < 250) {
            rocketImg.style.bottom = parseInt(rocketImg.style.bottom) + 10 + "px";
            shuttleHeight.innerHTML = parseInt(shuttleHeight.innerHTML) + 10000;
        }
    })
    let down = this.document.getElementById("down");
    down.addEventListener("click", function(){
        if (parseInt(rocketImg.style.bottom) > 0) {
        rocketImg.style.bottom = parseInt(rocketImg.style.bottom) - 10 + "px";
        shuttleHeight.innerHTML = parseInt(shuttleHeight.innerHTML) - 10000;
        }
    })

    let takeOff = this.document.getElementById("takeOff");
    takeOff.addEventListener("click", function(){
        if (window.confirm("Are you sure the shuttle is ready for takeoff?")){
            status.innerHTML = "Shuttle in flight";
            bg.style.backgroundColor = "blue";
            shuttleHeight.innerHTML = "10000";
        }
    })

    let landing = this.document.getElementById("landing");
    landing.addEventListener("click", function(){
            window.alert("The shuttle is landing. landing gear engaged.");
            status.innerHTML = "Shuttle landed";
            bg.style.backgroundColor = "green";
            shuttleHeight.innerHTML = "0";
            rocketImg.style.bottom = "0px";
    })

    let missionAbort = this.document.getElementById("missionAbort");
    missionAbort.addEventListener("click", function(){
            window.alert("Confirm that you want to abort the mission.");
            status.innerHTML = "Mission aborted";
            bg.style.backgroundColor = "green";
            shuttleHeight.innerHTML = "0";

})

})