Merge branch 'master' of https://github.com/fyrfli/quotes
This commit is contained in:
commit
3217ccaf4f
@ -4,6 +4,8 @@ I wanted to create an "app" that would read in JSON and print out the results ra
|
||||
|
||||
## Next steps ...
|
||||
|
||||
I want to add more quotes and a button to run the code instead of having the user reload the page
|
||||
I want to add more quotes and a button to run the code instead of having the user reload the page.
|
||||
|
||||
-- 18 May, 2022; 00:13:59
|
||||
Or at least create a timer loop to do the refreshing of the quotes automatically.
|
||||
|
||||
-- 18 May, 2022 - 10:42:14
|
36
app.js
36
app.js
@ -3,41 +3,13 @@ const todayDate = new Date();
|
||||
jsyear.innerText = todayDate.getFullYear();
|
||||
|
||||
const disp = document.querySelector(".display");
|
||||
const numIterations = 20;
|
||||
let ctr = 0;
|
||||
|
||||
fetch("FavouriteQuotes.json")
|
||||
.then((response) => {
|
||||
return response.json();
|
||||
})
|
||||
.then((data) => {
|
||||
// quotes = data;
|
||||
doTheLoop(data);
|
||||
})
|
||||
|
||||
// doTheLoop(quotes);
|
||||
|
||||
function doTheLoop(quotes) {
|
||||
console.log("Entering doTheLoop");
|
||||
numQuotes = Object.entries(quotes).length;
|
||||
console.log(numQuotes);
|
||||
getQuote(quotes, numQuotes);
|
||||
timerID = setInterval(getQuote, 6000, quotes, numQuotes);
|
||||
console.log("Timer ID: " + timerID);
|
||||
setTimeout(() => {
|
||||
console.log("Stopping");
|
||||
clearInterval(timerID);
|
||||
console.log("Stopped");
|
||||
30000
|
||||
});
|
||||
}
|
||||
|
||||
function getQuote(quotes, numQuotes) {
|
||||
console.log("Entering getQuote");
|
||||
num = Math.floor(Math.random() * numQuotes);
|
||||
disp.classList.remove(".hidden");
|
||||
disp.classList.add(".anim");
|
||||
disp.innerText = quotes[num].quote + "\n\n" + quotes[num].author.replace(/"/g, '');
|
||||
disp.classList.remove(".anim");
|
||||
// disp.classList.add(".hidden");
|
||||
}
|
||||
numQuotes = Object.entries(data).length;
|
||||
num = Math.floor(Math.random() * numQuotes);
|
||||
disp.innerText = data[num].quote + "\n\n" + data[num].author.replace(/"/g, '');
|
||||
})
|
@ -11,13 +11,10 @@
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="display hidden"></div>
|
||||
<div class="instructions">
|
||||
<p>{{ Hit Reload to see a new quote }}</p>
|
||||
</div>
|
||||
<div class="footer">
|
||||
<div class="display"></div>
|
||||
<footer class="footer">
|
||||
©<span id="jsyear"></span> Camille Frantz (<a href="https://github.com/fyrfli" target="_blank">@fyrfli</a>).
|
||||
</div>
|
||||
</footer>
|
||||
<script src="app.js"></script>
|
||||
</body>
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user