From 6be089fd4192658daaa9e43c539bc63b741662a3 Mon Sep 17 00:00:00 2001 From: Prasanthi Date: Sun, 25 Oct 2020 14:51:55 -0500 Subject: [PATCH 1/2] form checklist assignment --- .vscode/launch.json | 15 ++++++++ debug.log | 1 + index.html | 81 ++++++++++++++++++++++--------------------- script.js | 84 ++++++++++++++++++++++++++++++++++++++++----- 4 files changed, 133 insertions(+), 48 deletions(-) create mode 100644 .vscode/launch.json create mode 100644 debug.log diff --git a/.vscode/launch.json b/.vscode/launch.json new file mode 100644 index 00000000..7a9dfa04 --- /dev/null +++ b/.vscode/launch.json @@ -0,0 +1,15 @@ +{ + // Use IntelliSense to learn about possible attributes. + // Hover to view descriptions of existing attributes. + // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 + "version": "0.2.0", + "configurations": [ + { + "type": "pwa-chrome", + "request": "launch", + "name": "Launch Chrome against localhost", + "url": "http://localhost:8080", + "webRoot": "${workspaceFolder}" + } + ] +} \ No newline at end of file diff --git a/debug.log b/debug.log new file mode 100644 index 00000000..282ffde5 --- /dev/null +++ b/debug.log @@ -0,0 +1 @@ +[1023/160135.842:ERROR:directory_reader_win.cc(43)] FindFirstFile: The system cannot find the path specified. (0x3) diff --git a/index.html b/index.html index bc185ad2..5c0f01a5 100644 --- a/index.html +++ b/index.html @@ -1,42 +1,45 @@ - - Launch Checklist - - - - -

Launch Checklist Form

-
- -
-
-
-
- -
-
- -
-
- -
-
- -
- -
-
-
-

Awaiting Information Before Launch

-
-
    -
  1. Pilot Ready
    2. -
  2. Co-pilot Ready
    3. -
  3. Fuel level high enough for launch
    4. -
  4. Cargo mass low enough for launch
    5. -
+ + + Launch Checklist + + + + + +

Launch Checklist Form

+
+ +
+
+
+
+ +
+
+ +
+
+
-
- - +
+ +
+ + +
+
+

Awaiting Information Before Launch

+
+
    +
  1. Pilot Ready
    2. +
  2. Co-pilot Ready
    3. +
  3. Fuel level high enough for launch
    4. +
  4. Cargo mass low enough for launch
    5. +
+
+
+ + + \ No newline at end of file diff --git a/script.js b/script.js index 8d2e0821..39839efb 100644 --- a/script.js +++ b/script.js @@ -1,13 +1,79 @@ // Write your JavaScript code here! /* This block of code shows how to format the HTML once you fetch some planetary JSON! -

Mission Destination

-
    -
  1. Name: ${}
    2. -
  2. Diameter: ${}
    3. -
  3. Star: ${}
    4. -
  4. Distance from Earth: ${}
    5. -
  5. Number of Moons: ${}
    6. -
- + */ +function getPlanetaryInfo() { + let url = "https://handlers.education.launchcode.org/static/planets.json"; + let missionTargetDiv = document.getElementById("missionTarget"); + fetch(url).then(function (response) { + response.json().then(function (json) { + let planetInfo = json[Math.floor(Math.random() * json.length)]; + missionTargetDiv.innerHTML = `

Mission Destination

+
    +
  1. Name: ${planetInfo.name}
    2. +
  2. Diameter: ${planetInfo.diameter}
    3. +
  3. Star: ${planetInfo.star}
    4. +
  4. Distance from Earth: ${planetInfo.distance}
    5. +
  5. Number of Moons: ${planetInfo.moons}
    6. +
+ ` + + }); + }); +} + +window.addEventListener("load", function () { + // alert(form is loading); + getPlanetaryInfo(); + + let form = document.querySelector("form"); + form.addEventListener("submit", function (event) { + let pilotNameInput = document.querySelector("input[name=pilotName]"); + let copilotNameInput = document.querySelector("input[name=copilotName]"); + let fuelLevelInput = document.querySelector("input[name=fuelLevel]"); + let cargoMassInput = document.querySelector("input[name=cargoMass]"); + if (pilotNameInput.value === "" || copilotNameInput.value === "" || fuelLevelInput.value === "" || cargoMassInput.value === "") { + alert("All fields are required"); + event.preventDefault(); + } + if (!(isNaN(pilotNameInput.value) && isNaN(copilotNameInput.value))) { + alert("Pilot & co-pilot names should not be number"); + event.preventDefault(); + } + if (isNaN(fuelLevelInput.value) || isNaN(cargoMassInput.value)) { + alert("FuelLevel & CargoMass should not be text"); + event.preventDefault(); + } + + let faultyItemsDiv = document.getElementById("faultyItems"); + let launchStatusDiv = document.getElementById("launchStatus"); + + let fuelLeveOrMassFail = false; + + if (fuelLevelInput.value < 10000) { + fuelLeveOrMassFail = true; + document.getElementById("fuelStatus").innerHTML = `Fuel level too low for launch`; + } + + if (cargoMassInput.value > 10000) { + fuelLeveOrMassFail = true; + document.getElementById("cargoStatus").innerHTML = `Cargo mass high for launch`; + } + + if (fuelLeveOrMassFail) { + launchStatusDiv.innerHTML = "Shuttle not ready for launch"; + launchStatusDiv.style.color = "red"; + faultyItemsDiv.style.visibility = 'visible'; + document.getElementById("pilotStatus").innerHTML = `Pilot ${pilotNameInput.value} is ready for launch`; + document.getElementById("copilotStatus").innerHTML = `Co-pilot ${copilotNameInput.value} is ready for launch`; + event.preventDefault(); + } + else { + launchStatusDiv.innerHTML = "Shuttle is ready for launch"; + launchStatusDiv.style.color = "green"; + event.preventDefault(); + } + + }); +}); \ No newline at end of file From caa6f8d02cb3da5b0f2e5f5e38212fb82c676461 Mon Sep 17 00:00:00 2001 From: Prasanthi Date: Wed, 28 Oct 2020 18:45:44 -0500 Subject: [PATCH 2/2] added more validations --- script.js | 33 ++++++++++++++++++++------------- 1 file changed, 20 insertions(+), 13 deletions(-) diff --git a/script.js b/script.js index 39839efb..88c50c01 100644 --- a/script.js +++ b/script.js @@ -9,7 +9,7 @@ function getPlanetaryInfo() { fetch(url).then(function (response) { response.json().then(function (json) { let planetInfo = json[Math.floor(Math.random() * json.length)]; - missionTargetDiv.innerHTML = `

Mission Destination

+ missionTargetDiv.innerHTML = `

Mission Destination

  1. Name: ${planetInfo.name}
  2. Diameter: ${planetInfo.diameter}
    3. @@ -18,13 +18,12 @@ function getPlanetaryInfo() {
  3. Number of Moons: ${planetInfo.moons}
` - + }); }); } window.addEventListener("load", function () { - // alert(form is loading); getPlanetaryInfo(); let form = document.querySelector("form"); @@ -33,47 +32,55 @@ window.addEventListener("load", function () { let copilotNameInput = document.querySelector("input[name=copilotName]"); let fuelLevelInput = document.querySelector("input[name=fuelLevel]"); let cargoMassInput = document.querySelector("input[name=cargoMass]"); + + if (pilotNameInput.value === "" || copilotNameInput.value === "" || fuelLevelInput.value === "" || cargoMassInput.value === "") { alert("All fields are required"); event.preventDefault(); + return; } if (!(isNaN(pilotNameInput.value) && isNaN(copilotNameInput.value))) { alert("Pilot & co-pilot names should not be number"); event.preventDefault(); + return; } + if (isNaN(fuelLevelInput.value) || isNaN(cargoMassInput.value)) { alert("FuelLevel & CargoMass should not be text"); event.preventDefault(); + return; } let faultyItemsDiv = document.getElementById("faultyItems"); let launchStatusDiv = document.getElementById("launchStatus"); - let fuelLeveOrMassFail = false; - if (fuelLevelInput.value < 10000) { - fuelLeveOrMassFail = true; document.getElementById("fuelStatus").innerHTML = `Fuel level too low for launch`; } + else{ + document.getElementById("fuelStatus").innerHTML = `Fuel level high enough for launch`; + } if (cargoMassInput.value > 10000) { - fuelLeveOrMassFail = true; document.getElementById("cargoStatus").innerHTML = `Cargo mass high for launch`; } + else{ + document.getElementById("cargoStatus").innerHTML = `Cargo mass low enough for launch`; + } - if (fuelLeveOrMassFail) { + if (fuelLevelInput.value < 10000 || cargoMassInput.value > 10000) { launchStatusDiv.innerHTML = "Shuttle not ready for launch"; launchStatusDiv.style.color = "red"; - faultyItemsDiv.style.visibility = 'visible'; - document.getElementById("pilotStatus").innerHTML = `Pilot ${pilotNameInput.value} is ready for launch`; - document.getElementById("copilotStatus").innerHTML = `Co-pilot ${copilotNameInput.value} is ready for launch`; - event.preventDefault(); + } else { launchStatusDiv.innerHTML = "Shuttle is ready for launch"; launchStatusDiv.style.color = "green"; - event.preventDefault(); } + faultyItemsDiv.style.visibility = 'visible'; + document.getElementById("pilotStatus").innerHTML = `Pilot ${pilotNameInput.value} is ready for launch`; + document.getElementById("copilotStatus").innerHTML = `Co-pilot ${copilotNameInput.value} is ready for launch`; + event.preventDefault(); }); }); \ No newline at end of file