From e2a9006248c982f9cc49a3249b2c67be662529e7 Mon Sep 17 00:00:00 2001 From: Ollie Crook Date: Fri, 15 Jun 2018 14:26:39 +0100 Subject: [PATCH 1/6] initial commit --- index.html | 47 +++++++++++++++++++++++++++++++++++++++++++++++ src/index.js | 0 2 files changed, 47 insertions(+) create mode 100644 index.html create mode 100644 src/index.js diff --git a/index.html b/index.html new file mode 100644 index 0000000..b4bf708 --- /dev/null +++ b/index.html @@ -0,0 +1,47 @@ + + + + + + + + Responsive News Reader + + + + + +
+ +
+ + + +
+ +
+ +
+

body

+
+ +
+ +
+ +
+ + +
+ +
+ + +
+ +
+ + + + + \ No newline at end of file diff --git a/src/index.js b/src/index.js new file mode 100644 index 0000000..e69de29 From af72ee80343f25b39f58fb2dac5683d53299fbe7 Mon Sep 17 00:00:00 2001 From: Ollie Crook Date: Fri, 15 Jun 2018 15:21:54 +0100 Subject: [PATCH 2/6] add sticky footer and img responsiveness --- index.html | 12 +++++++----- src/index.js | 34 ++++++++++++++++++++++++++++++++++ 2 files changed, 41 insertions(+), 5 deletions(-) diff --git a/index.html b/index.html index b4bf708..53df1c5 100644 --- a/index.html +++ b/index.html @@ -21,7 +21,7 @@
-
+

body

@@ -29,18 +29,20 @@
-
- +
+

What do you want to search for?

-
+
- +

Where do you want your news from?

+
+ diff --git a/src/index.js b/src/index.js index e69de29..1676de6 100644 --- a/src/index.js +++ b/src/index.js @@ -0,0 +1,34 @@ +function submitHandler(event) { + event.preventDefault(); + + // Capture search term + const getTopic = document.querySelector("#topicSearchBar"); + const topicToSearch = getTopic.value; + + // Get news information + const url = `https://newsapi.org/v2/everything?q=${topicToSearch}&sortBy=publishedAt&apiKey=814db06ca1814aeca4562dbafab25378`; + fetch(url) + .then(function(response){ + return response.json(); + }).then(function(data){ + + console.log(data); + + const results = data.articles.map(article => + `

${article.title}

${article.source.name}

${article.description}

Author: ${article.author}

+ ` + ).join(''); + getTopic.value = ''; + + const resultsEl = document.querySelector('#articlesBody'); + + resultsEl.innerHTML = results; + + }).catch(function(error){ + alert('Sorry, I couldn\'t find anything.'); + }); +} + +const getSubmit = document.querySelector("#searchTopic"); + +getSubmit.addEventListener("submit", submitHandler); \ No newline at end of file From 9460f349a1030f25e64eb83f95e0ea60f5c31970 Mon Sep 17 00:00:00 2001 From: Ollie Crook Date: Fri, 15 Jun 2018 16:50:28 +0100 Subject: [PATCH 3/6] add countries dropdown list --- index.html | 65 +++++++++++++++++++++++++++++++++++++++++++++++++----- 1 file changed, 60 insertions(+), 5 deletions(-) diff --git a/index.html b/index.html index 53df1c5..b333fbf 100644 --- a/index.html +++ b/index.html @@ -22,7 +22,6 @@
-

body

@@ -34,10 +33,66 @@ -
-

Where do you want your news from?

- -
+
+

Where do you want your news from?

+ +
From ad74d992cd8f823cfc95a030acd1aaa5f47db6bc Mon Sep 17 00:00:00 2001 From: Ollie Crook Date: Fri, 15 Jun 2018 18:24:56 +0100 Subject: [PATCH 4/6] add countries searchability, grid layout at med width and sidebar --- index.html | 26 ++++++++++++++++---------- src/index.js | 9 ++++++--- 2 files changed, 22 insertions(+), 13 deletions(-) diff --git a/index.html b/index.html index b333fbf..7c6cf92 100644 --- a/index.html +++ b/index.html @@ -26,6 +26,12 @@
+
+ +

I'm a sidebar

+ +
+
@@ -36,7 +42,6 @@

Where do you want your news from?

+
+

API powered by News API

+
+
diff --git a/src/index.js b/src/index.js index 5790134..1d9a21b 100644 --- a/src/index.js +++ b/src/index.js @@ -17,8 +17,14 @@ function submitHandler(event) { return response.json(); }).then(function(data){ + // console.log(data); + + const articlesLength = data.articles.length; + + if (articlesLength > 0) { + const results = data.articles.map(article => - `

${article.title}

${article.source.name}

${article.description}

Author: ${article.author}

+ `

${article.title}

${article.source.name}

${article.description}

Author: ${article.author}

` ).join(''); getTopic.value = ''; @@ -26,6 +32,11 @@ function submitHandler(event) { const resultsEl = document.querySelector('#articlesBody'); resultsEl.innerHTML = results; + } + + else { + alert('Hmm, slow news day. Maybe search for something else.'); + } }).catch(function(error){ alert('Sorry, I couldn\'t find anything.'); From fbcabc3b6f6d9121574715372f55423a9f500af2 Mon Sep 17 00:00:00 2001 From: Ollie Crook Date: Mon, 18 Jun 2018 11:35:13 +0100 Subject: [PATCH 6/6] update search functionality --- src/index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/index.js b/src/index.js index 1d9a21b..3e67465 100644 --- a/src/index.js +++ b/src/index.js @@ -10,14 +10,14 @@ function submitHandler(event) { // Get news information - const url = `https://newsapi.org/v2/top-headlines?country=${countryToSearch}&category=${topicToSearch}&apiKey=814db06ca1814aeca4562dbafab25378`; + const url = `https://newsapi.org/v2/top-headlines?country=${countryToSearch}&q=${topicToSearch}&apiKey=814db06ca1814aeca4562dbafab25378`; fetch(url) .then(function(response){ return response.json(); }).then(function(data){ - // console.log(data); + console.log(data); const articlesLength = data.articles.length;