From ac09785dcd6415c284e7dacb2fb28b74a760fed3 Mon Sep 17 00:00:00 2001 From: sm Date: Mon, 9 Oct 2017 16:17:18 +0800 Subject: [PATCH 1/3] random quote --- index.html | 16 ++++++++++++++++ script.js | 40 ++++++++++++++++++++++++++++++++++++++++ 2 files changed, 56 insertions(+) create mode 100644 index.html create mode 100644 script.js diff --git a/index.html b/index.html new file mode 100644 index 0000000..c4a5948 --- /dev/null +++ b/index.html @@ -0,0 +1,16 @@ + + + + + + + +

Random Quote Generator

+
+ +

+
+ + + + diff --git a/script.js b/script.js new file mode 100644 index 0000000..f832fd3 --- /dev/null +++ b/script.js @@ -0,0 +1,40 @@ +//fetch using post request +//h1 random quote +$(function() { + let myHeaders = new Headers() + + myHeaders.append( + "X-Mashape-Key", + "6qClgHZ6abmshFPEOwtnIL5Jbn7tp1bbv0Ijsn9JINTyyizALz" + ) + let myKey = { + method: "POST", + headers: myHeaders + } + let randomQuote = fetch( + "https://andruxnet-random-famous-quotes.p.mashape.com/?cat=famous&count=1", + myKey + ) + + const updateRandomQuote = data => { + console.log(data) + $h2 = $("h2") + $div = $("div") + $author = $("

") + $category = $("

") + $h2.text(data.quote) + $author.text("by: " + data.author) + $category.text("category :" + data.category) + $div.append($author) + $div.append($category) + } + + randomQuote + .then(response => { + return response.json() + }) + .then(updateRandomQuote) + .catch(err => { + console.log(err) + }) +}) From dea4d675a1de9a7e30e502e049a4e9a0f1e2d5fd Mon Sep 17 00:00:00 2001 From: sm Date: Mon, 9 Oct 2017 16:51:41 +0800 Subject: [PATCH 2/3] updated headers --- index.html | 1 - script.js | 14 ++++---------- 2 files changed, 4 insertions(+), 11 deletions(-) diff --git a/index.html b/index.html index c4a5948..e384ad1 100644 --- a/index.html +++ b/index.html @@ -7,7 +7,6 @@

Random Quote Generator

-

diff --git a/script.js b/script.js index f832fd3..b513ce5 100644 --- a/script.js +++ b/script.js @@ -1,23 +1,17 @@ -//fetch using post request -//h1 random quote $(function() { - let myHeaders = new Headers() - - myHeaders.append( - "X-Mashape-Key", - "6qClgHZ6abmshFPEOwtnIL5Jbn7tp1bbv0Ijsn9JINTyyizALz" - ) let myKey = { method: "POST", - headers: myHeaders + headers: { + "X-Mashape-Key": "6qClgHZ6abmshFPEOwtnIL5Jbn7tp1bbv0Ijsn9JINTyyizALz" + } } + let randomQuote = fetch( "https://andruxnet-random-famous-quotes.p.mashape.com/?cat=famous&count=1", myKey ) const updateRandomQuote = data => { - console.log(data) $h2 = $("h2") $div = $("div") $author = $("

") From 237e14d16b5d6854eac6c06527a59a256efd4e88 Mon Sep 17 00:00:00 2001 From: sm Date: Mon, 9 Oct 2017 17:29:43 +0800 Subject: [PATCH 3/3] added buttons to get more quotes --- index.html | 7 ++++--- script.js | 45 +++++++++++++++++++++++++++++---------------- 2 files changed, 33 insertions(+), 19 deletions(-) diff --git a/index.html b/index.html index e384ad1..b786424 100644 --- a/index.html +++ b/index.html @@ -6,9 +6,10 @@

Random Quote Generator

-
-

-
+
+ + + diff --git a/script.js b/script.js index b513ce5..3ed94a8 100644 --- a/script.js +++ b/script.js @@ -6,29 +6,42 @@ $(function() { } } - let randomQuote = fetch( - "https://andruxnet-random-famous-quotes.p.mashape.com/?cat=famous&count=1", - myKey - ) + const $getFamous = $(".getFamous") + const $getMovie = $(".getMovie") const updateRandomQuote = data => { - $h2 = $("h2") + let $h2 = $("

") + let $author = $("

") + let $category = $("

") $div = $("div") - $author = $("

") - $category = $("

") $h2.text(data.quote) $author.text("by: " + data.author) - $category.text("category :" + data.category) + $category.text("category: " + data.category) + $div.append($h2) $div.append($author) $div.append($category) } - randomQuote - .then(response => { - return response.json() - }) - .then(updateRandomQuote) - .catch(err => { - console.log(err) - }) + const getRandomQuote = type => { + let url = `https://andruxnet-random-famous-quotes.p.mashape.com/?cat=${type}&count=1` + let randomQuote = fetch(url, myKey) + randomQuote + .then(response => { + return response.json() + }) + .then(updateRandomQuote) + .catch(err => { + console.log(err) + }) + } + + getRandomQuote("movie") + getRandomQuote("famous") + + $getFamous.on("click", () => { + getRandomQuote("famous") + }) + $getMovie.on("click", () => { + getRandomQuote("movie") + }) })