-
Notifications
You must be signed in to change notification settings - Fork 0
/
script.js
118 lines (93 loc) · 3.08 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
import { localQuotes } from "./arQuotes.js";
let apiQuotes = [];
let newQuote;
let lang = "ar";
const quoteTextElem = document.querySelector("#quote");
const authorTextElem = document.querySelector("#author");
const quoteTextContainer = document.querySelector(".qoute-text");
const languageSelect = document.getElementById("language");
const loaderElem = document.querySelector(".loader");
const quotContainerElem = document.querySelector(".quote-container");
const newQuoteButtonElem = document.querySelector("#new-quote");
const tweetQuoteButtonElem = document.querySelector("#twitter");
const copyButtonElem = document.getElementById("copy");
function showLoader() {
loaderElem.hidden = false;
quotContainerElem.hidden = true;
}
function hideLoader() {
loaderElem.hidden = true;
quotContainerElem.hidden = false;
}
function showNewQuote() {
showLoader();
if (lang === "ar") {
const randomeQuote = Math.floor(Math.random() * localQuotes.length);
newQuote = localQuotes[randomeQuote];
} else {
const randomeQuote = Math.floor(Math.random() * apiQuotes.length);
newQuote = apiQuotes[randomeQuote];
}
checkLength(newQuote.text.length);
updateQuote();
}
function checkLength(len) {
//quoteTextContainer.style.width = len < 50 ? "500px" : "auto";
}
function showNewQuoteAr() {
showLoader();
const randomeQuote = Math.floor(Math.random() * localQuotes.length);
newQuote = localQuotes[randomeQuote];
checkLength(newQuote.text.length);
updateQuote();
}
async function getQuotes() {
if (lang === "ar") {
showNewQuoteAr();
} else {
// showLoader();
try {
const apiUrl =
"https://jacintodesign.github.io/quotes-api/data/quotes.json";
const response = await fetch(apiUrl);
apiQuotes = await response.json();
showNewQuote();
console.log("new quote");
} catch (error) {
alert("Internet Connection Problem");
}
}
}
function tweetQuote() {
const twitterUrl = `https://twitter.com/intent/tweet?text=${newQuote.text}-${newQuote.author}`;
window.open(twitterUrl, "_blank");
}
function updateQuote() {
quoteTextElem.textContent = newQuote.text;
authorTextElem.textContent = newQuote.author;
hideLoader();
}
function handleLanguageChange() {
lang = languageSelect.value === "Arabic" ? "ar" : "en";
newQuoteButtonElem.textContent = lang === "ar" ? "اقتباس" : "Quote";
copyButtonElem.textContent = lang === "ar" ? "حفظ" : "Copy";
getQuotes();
}
function copyQuoteToClipboard() {
const input = document.createElement("input");
input.type = "text";
const quoteSpan = document.getElementById("quote");
input.value = quoteSpan.innerText;
document.body.appendChild(input);
input.select();
input.setSelectionRange(0, 99999);
document.execCommand("copy");
document.body.removeChild(input);
alert("Text copied to clipboard!");
}
newQuoteButtonElem.addEventListener("click", getQuotes);
tweetQuoteButtonElem.addEventListener("click", tweetQuote);
languageSelect.addEventListener("change", handleLanguageChange);
copyButtonElem.addEventListener("click", copyQuoteToClipboard);
//On Load
getQuotes();