-
Notifications
You must be signed in to change notification settings - Fork 0
/
script.js
106 lines (89 loc) · 3.15 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
'use strict';
//declare a variable for LOC API URL
const searchURL = 'https://www.loc.gov/collections/chronicling-america/';
//declare a variable for Quote API URL
const quoteURL = 'https://qvoca-bestquotes-v1.p.rapidapi.com/quote/?genre=history';
//Format the query results for use in search URL
function formatQueryParams(params){
const queryItems = Object.keys(params)
.map(key => `${encodeURIComponent(key)}=${encodeURIComponent(params[key])}`)
return queryItems.join('&');
}
//Get the news articles
function getNews(topic, limit=5){
const params = {
q: topic,
c: limit
};
const queryString = formatQueryParams(params);
const url = searchURL + '?' + queryString + '&fo=json';
fetch(url)
.then(response =>{
if (response.ok){
return response.json();
}
throw new Error(response.statusText);
})
.then(responseJson => displayResults(responseJson))
.catch(error => {
$('#error-message').text(`Oops! Something went wrong: ${error.message}`);
});
}
//Display the results into the <ul>
function displayResults(responseJson){
//clear previous results
$('#results-list').empty();
//create a loop to iterate over results
for (let i = 0; i < responseJson.results.length; i++){
let title = responseJson.results[i].partof_title;
let image = responseJson.results[i].image_url[1];
let url = responseJson.results[i].id;
let date = responseJson.results[i].date;
$('#results-list').append(
`<li class="wrapper-results"><h2> Newspaper Source: ${title}</h2>
<p> Date Published: ${date} </p>
<a href="${url}" target="_blank"><img src="${image}" alt="Digitally Scanned Newspaper"></a>
<p> To follow up with more details <a href="${url}" target="_blank">More Information</a></p>
</li>`
)
}
$('#results').removeClass('hidden');
$('#scrollUp').removeClass('hidden');
}
//Get History QOD
function getQuote(){
fetch("https://qvoca-bestquotes-v1.p.rapidapi.com/quote?genre=history", {
"method": "GET",
"headers": {
"x-rapidapi-key": "eedb904fd7mshdbabd39c1ef8444p1e448cjsn4120f5877999",
"x-rapidapi-host": "qvoca-bestquotes-v1.p.rapidapi.com"
}
})
.then(responseQuote =>{
if (responseQuote.ok){
return responseQuote.json();
}
throw new Error(responseQuote.statusText);
})
.then(responseQuoteJson => displayQuote(responseQuoteJson))
.catch(error => {
$('error-message').text(`Oops! Something went wrong: ${error.message}`);
});
}
//display historical quote on page load and on each submit click
function displayQuote(responseQuoteJson){
$('#history-quote').empty();
$('#history-quote').append(
`<h3> "${responseQuoteJson.message}" - ${responseQuoteJson.author} </h3>`);
}
//create a watchForm to tie in above functions and variables
function watchForm(){
$('form').submit( event => {
event.preventDefault();
const topic = $('#topic-search').val();
const limit = $('#max-results').val();
getNews(topic, limit);
getQuote();
});
}
$(watchForm)