Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Adventures with Yusof #201

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Adventures with Yusof #201

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
5c754f8
First Commit
YusofGotboudine Mar 23, 2020
890f71b
Second Commit
YusofGotboudine Mar 23, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
55 changes: 29 additions & 26 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,31 +1,34 @@
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="style.css">
</head>
<body>
<h3>DOM Manipulation Template</h3>
<input class="starter" id="input" placeholder="input"/>
<h2>output:</h2>
<div class="starter" id="output"></div>
<script>

var display = function( data ){
var displayElement = document.querySelector('#output');
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="style.css">
</head>

// get rid of the entire contents
displayElement.innerHTML = "";
<body>
<h3>DOM Manipulation Template</h3>
<input class="starter" id="input" placeholder="What is your name?" />
<h2>output:</h2>
<div class="starter" id="output"></div>
<script>

// put the data into the div
output.innerText = data;
};
var display = function (data) {
var displayElement = document.querySelector('#output');

document.querySelector('#input').addEventListener('change', function(event){
var currentInput = event.target.value;
var result = inputHappened(currentInput)
display( result );
});
</script>
<script src="script.js" charset="utf-8"></script>
</body>
</html>
// get rid of the entire contents
displayElement.innerHTML = "";

// put the data into the div
output.innerText = data;
};

document.querySelector('#input').addEventListener('change', function (event) {
var currentInput = event.target.value;
var result = inputHappened(currentInput)
display(result);
});
</script>
<script src="script.js" charset="utf-8"></script>
</body>

</html>
85 changes: 81 additions & 4 deletions script.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,85 @@
console.log("hello script js");

var inputHappened = function(currentInput){
console.log( currentInput );
return "SOMETHING HAPPENED";
};
var userName;
var options = ["a", "b", "c"];
var selectedOption;
var secondOption;
var thirdOption;

var inputHappened = function (currentInput) {

userName = currentInput.toString();
console.log(userName);
var beningin = "Welcome to Paradise Island!\nWhat would you like to do today? \nA: Go for a swim at Shark Reef \nB: Go for a drive at Minacious Ravine\nC: Trek at Murderous Mountain\n(Input A, B or C)";
var intro = "Nice to meet you " + userName + "!\n" + beningin;
var sharkReefOptions = "You have arrived at Shark Reef. \nDo you (A) Join up with a tour to get a good look around or,\n(B) Venture on your own to the corals\n(Input A or B)";
var sharkReefOptionA = "The tour guide ushers you onto the speed boat. As it starts to sail off, you notice how disorientated the boat captain looks. \nYou sit helplessly and hold on to dear life as the drunk captain tries to navigate through the sudden choppy waves. The boat capsizes and sinks, no one survives. \nThe End!";
var sharkReefOptionB = "You venture to the lagoon nearby. It is relatively deep. \nThe allure of the colourful corals overwhelm you. You take a dive. \nAs you swim back up to the surface, you feel intense pain, only to realise the water has turned red. It's called Shark Reef for a reason. \nThe End!";
var ravineOptions = "You have arrived at the breathtaking view of Minacious Ravine. \nDo you (A) Carpool in a 4WD with random strangers or,\n(B) Rent a Dirtbike to bring yourself around for the views\n(Input A or B)";
var ravineA = "You met interesting Russian friends on a post-grad trip. They cordially invite you to join them on their 4WD.\nYou hop on the backseat next to the biggest guy amongst them. After some time you notice that they went of track.\nThey pull over at an unknown location and torture you for all your valuables. After which, they beat you up and leave you for dead\nThe End!";
var ravineB = "You rented a DirtBike from a booth nearby. They inform you of the routes that are still safe to travel by.\nOn your journey, you stumble across an old shortcut that locals fabled about.\nAs you're travelling through that route, an unexpected boulder tumbles down and smashes through the road. you fail to stop on time.\nThe End!";
var mountainsOptions = "You arrived at the basecamp of Murderous Mountains\nDo you (A) Follow the recommended trekking route or \n(B) Explore an off-trail track?\n(Input A or B)";
var mountainsA = "You took the scenic trekking routh that goes along the base of the mountain and gives you tremendous views.\nUnfortunately, it starts to rain, and the forecast didn't mention any rain. \nSoon, a flood ensues, trapping you in quicksand. you scream for help only to hear your own echoes.\nThe End!";
var mountainsB = "You notice a little bunny off track.\nDo you (A) Approach it or \n(B) Ignore it?\n(Input A or B)";
var mountainsB1 = "The bunny doesn't fret away from you. In fact it is attracted to your scent. You are able to pet it.\nDo you (A)Feed it or \n(B) Go back to the track?\n(Input A or B)";
var mountainsB1A = "To unlock further levels, please make full purchase at the respective authorised dealer.";


// selectedOption = currentInput.toString();
currentInput = currentInput.toLowerCase();
selectedOption = currentInput;
console.log(selectedOption);

//Shark Reef
if (selectedOption === 'a') {
selectedOption = "";
console.log(selectedOption);

if (secondOption == 'a') {
console.log(sharkReefOptionA);
return sharkReefOptionA;
}

if (selectedOption == 'b') {
console.log(sharkReefOptionB);
return sharkReefOptionB;
};

console.log(sharkReefOptions);
return sharkReefOptions;
}
// Minacious Ravine
if (selectedOption === 'b') {
console.log(ravineOptions);
return ravineOptions;
if (selectedOption === 'a') {
console.log(ravineA);
return ravineA;
} else if (selectedOption === 'b') {
console.log(ravineB);
return ravineB;
};
}
// Murderous Mountains
if (selectedOption === 'c') {
console.log(mountainsOptions);
return mountainsOptions;
if (selectedOption === 'a') {
console.log(mountainsA);
return mountainsA;
} else if (selectedOption === 'b') {
console.log(mountainsB);
return mountainsB;
if (selectedOption === 'a') {
console.log(mountainsB1);
return mountainsB1;
} else if (selectedOption === 'b') {
console.log(mountainsB2);
return mountainsB2;
};
};
};
console.log(intro);
return intro;
};