-
Notifications
You must be signed in to change notification settings - Fork 0
/
script.js
128 lines (104 loc) · 3.21 KB
/
script.js
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
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
const quoteContainer = document.getElementById('quote-container');
const quoteText = document.getElementById('quote');
const authorText = document.getElementById('author');
const twitterBtn = document.getElementById('twitter');
const newQuoteBtn = document.getElementById('new-quote');
const prevBtn = document.getElementById('prev-button')
const loader = document.getElementById('loader');
const quoteStorage = [];
let prevQuote = '';
let prevAuthor = '';
let counter = 0;
let init = false;
function showLoadingSpinner() {
loader.hidden = false;
quoteContainer.hidden = true;
}
function removeLoadingSpinner() {
if (!loader.hidden) {
quoteContainer.hidden = false;
loader.hidden = true;
}
}
// Get quote from API
async function getQuote() {
showLoadingSpinner();
const proxyUrl = 'https://cors-anywhere.herokuapp.com/';
const apiUrl = 'http://api.forismatic.com/api/1.0/?method=getQuote&lang=en&format=json';
try {
const response = await fetch(proxyUrl + apiUrl);
const data = await response.json();
const quoteObj = {
quote: data.quoteText,
author: data.quoteAuthor
}
const { quote, author } = quoteObj;
// Checking for author
if (author === '') {
authorText.innerText = 'Unknown';
} else {
authorText.innerText = author;
}
// Reduce font size for long quotes
if (quote.length > 120) {
quoteText.classList.add('long-quote');
} else {
quoteText.classList.remove('long-quote');
}
quoteText.innerText = quote;
removeLoadingSpinner();
if (init){
enableBackButton();
}
init = true;
storePrevQuote(quoteObj);
} catch (err) {
// Infinite Loop handling
if (counter < 60) {
counter++
console.log('whoops, something went from');
getQuote();
} else {
return alert('error please refresh the page');
counter = 0;
}
}
}
function tweetQuote() {
const quote = quoteText.innerText;
const author = authorText.innerText;
const twitterUrl = `https://twitter.com/intent/tweet?text=${quote} - ${author}`;
window.open(twitterUrl, '_blank');
}
function storePrevQuote(quoteObj) {
quoteStorage.push(quoteObj);
if (quoteStorage.length > 2) {
quoteStorage.shift();
}
console.log(quoteStorage);
prevQuote = quoteStorage[0].quote;
prevAuthor = quoteStorage[0].author;
}
function enableBackButton(prevQuote) {
prevBtn.disabled = false;
prevBtn.classList.remove('button-inactive');
}
function disableBackButton(prevQuote) {
prevBtn.disabled = true;
prevBtn.classList.add('button-inactive');
}
function backButtonClick() {
if (prevQuote !== '') {
quoteText.innerText = prevQuote;
authorText.innerText = prevAuthor;
quoteStorage[1].quote = prevQuote;
quoteStorage[1].author = prevAuthor;
}
disableBackButton();
}
// Event listeners
newQuoteBtn.addEventListener('click', getQuote);
twitterBtn.addEventListener('click', tweetQuote);
prevBtn.addEventListener('click', backButtonClick);
// On Load
getQuote();