From eef0e39993fb5e7e7be3d9766bde86da18dfa666 Mon Sep 17 00:00:00 2001 From: sprim0 Date: Tue, 7 Oct 2025 02:18:09 -0400 Subject: [PATCH 1/2] done --- .DS_Store | Bin 0 -> 6148 bytes complex-api-bootcamp | 1 + css/styles.css | 0 index.html | 33 +++++++++++++++++++ js/main.js | 76 +++++++++++++++++++++++++++++++++++++++++++ 5 files changed, 110 insertions(+) create mode 100644 .DS_Store create mode 160000 complex-api-bootcamp create mode 100644 css/styles.css create mode 100644 index.html create mode 100644 js/main.js diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..f8d289668a4e4fd67ba1da9a1ea6458479b3fa39 GIT binary patch literal 6148 zcmeH~&2G~`6ot>U5i0Gb3l`l}@(U0HQYDsdnl36)7F58Nrm@t3TSu`Ym7Vu}m_8!? z=FTjL15#muP&7BXb7tQeKy=wwI?BnJLB2K?TAp)1w8VbA`&e`oCD3HDko{!8zlx083vrd^QpRTuiM249IM z*C*mCEt!{CbB)Pp(Oe%{ms*&$(Y4JNj1`|b_8B>~W%$f*WYySneXvS1qGrr)v1dBL zH?;~4t2cUu9%&Rk*LWAi<@!uaNv%w8Sv|2kBL9qw_mPVy^GE${zD=X%tg5djRXxGt zU%kiZ@P`RAX_uaFtL>D6_Iy_n~)ddkzrItPbTovv1O_q`03 zNj8)L7y8=S+tB_}TZw_hz~3|A-wzq;v543Ov{wg%T>-!WW)tTAK=V0S#3EuB5D(%) zDi~5-ykfYJjy;QUMZ_*(NSBM34;P>8;tj>w)2W|XxLgr1jfsK8z$ydVVY%! z|5uaJDlw24*eC|vV0 + + + + + GOT + + + +

Find Your Game of Thrones Character!

+ + + + + +

+ + +
+ + + + + + \ No newline at end of file diff --git a/js/main.js b/js/main.js new file mode 100644 index 0000000..5764ecd --- /dev/null +++ b/js/main.js @@ -0,0 +1,76 @@ +// Goal: Use data returned from one api to make a request to another api and display the data returned +// User enters GOT character +// listen for on'click +// fetch for the character info (first name, last name) from 1st API + +// once information show up, a second api will populate a character's image. + + +const select = document.getElementById('characters'); + const nameDisplay = document.querySelector('h2'); + const img = document.getElementById('charImg'); + + select.addEventListener('change', function() { + const charName = select.value; + + fetch('https://thronesapi.com/api/v2/Characters') + .then(function(response) { return response.json(); }) + .then(function(data) { + for (let i = 0; i < data.length; i++) { + if (data[i].fullName === charName) { + nameDisplay.innerText = data[i].fullName; + img.src = data[i].imageUrl; + } + } + return fetch('https://api.gameofthronesquotes.xyz/v1/characters'); + }) + .then(function(response) { return response.json(); }) + .then(function(data2) { + console.log(data2); + }) + .catch(function(err) { + console.error('Error:', err); + }); + }); + + + + + + + + + +// const character = document.getElementById('characters') +// const char = document.getElementById('characters').value + + +// fetch("https://thronesapi.com/api/v2/Characters") +// .then((response) => response.text()) +// .then((result) => console.log(result)) + + +// fetch('https://api.gameofthronesquotes.xyz/v1/characters') +// .then(res => res.json()) +// .then((result) => console.log(result)) +// console.log(result) + + +// document.querySelector('h2').innerText += `${data[0].name}` + +// .catch(err => { +// console.error('error', err) +// }) + + + + + + + + + + + + + From fa510241912b866b9b82dad5e9aa1b99adbb1efb Mon Sep 17 00:00:00 2001 From: sprim0 Date: Tue, 7 Oct 2025 02:42:34 -0400 Subject: [PATCH 2/2] citations --- js/main.js | 28 +--------------------------- 1 file changed, 1 insertion(+), 27 deletions(-) diff --git a/js/main.js b/js/main.js index 5764ecd..093eefa 100644 --- a/js/main.js +++ b/js/main.js @@ -32,6 +32,7 @@ const select = document.getElementById('characters'); console.error('Error:', err); }); }); +// completed with the help of Angie, Sylvie, chatgpt and MJ @@ -41,33 +42,6 @@ const select = document.getElementById('characters'); -// const character = document.getElementById('characters') -// const char = document.getElementById('characters').value - - -// fetch("https://thronesapi.com/api/v2/Characters") -// .then((response) => response.text()) -// .then((result) => console.log(result)) - - -// fetch('https://api.gameofthronesquotes.xyz/v1/characters') -// .then(res => res.json()) -// .then((result) => console.log(result)) -// console.log(result) - - -// document.querySelector('h2').innerText += `${data[0].name}` - -// .catch(err => { -// console.error('error', err) -// }) - - - - - - -