Skip to content

Code challenge for the Asynchronous JavaScript #6

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

Open
JairoAussie wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Code challenge for the Asynchronous JavaScript #6

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
5 changes: 5 additions & 0 deletions Asynchronous Javascript/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
# Asynchronous JavaScript CodeChallenge
We have two files index.html and script.js. Index.html contains a paragraph with a quote and a button. This file shouldn't be modified.

Script.js already contains an array of quotes and the header of two functions.
The main goal of this challenge is to display quotes randomly every time the button is clicked or after 10 seconds (it doesn't matter if the button is not clicked, every 10 seconds a new quote will be displayed). We can help ourselves with the asynchronous function setInterval.
20 changes: 20 additions & 0 deletions Asynchronous Javascript/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Random Quotes</title>
</head>
<body>
<div class="container">

<div id="quote-box">
<p class="quote">Never say never because limits, like fears, are often just an illusion.</p>
</div>

<button id="loadQuote">Show another quote</button>

</div>
<script src="js/script.js"></script>
</body>
</html>
50 changes: 50 additions & 0 deletions Asynchronous Javascript/js/script.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,50 @@
let quotes = [
{
quote:"Hard work beats talent when talent doesn’t work hard."
},
{
quote:"It’s hard to beat a person who never gives up."
},
{
quote:"The harder the battle, the sweeter the victory."
},
{
quote:"Never say never because limits, like fears, are often just an illusion."
},
{
quote:"You miss 100% of the shots you don’t take"
},
{
quote:"Today, you have 100% of your life left."
},
{
quote:"You have to expect things of yourself before you can do them."
},
{
quote:"Winning isn’t everything, but wanting to win is."
},
{
quote:"There may be people that have more talent than you, but there’s no excuse for anyone to work harder than you do."
},
{
quote:"I became a good pitcher when I stopped trying to make them miss the ball and started trying to make them hit it."
}];

//checks if the array has been created correctly
console.log(quotes);

//get the random number with math random and floor, return the object with the index.
function getRandomQuote()
{

}

//displays a new random quote in the HTML paragraph when is called
function printQuote ()
{

}

//Develop a way to show a new random quote every 10 seconds

//the button need an eventListener...