From 8bfb2a14a196eda9bd4160c89fc04e994380784d Mon Sep 17 00:00:00 2001 From: Nick Satinover Date: Mon, 25 Jan 2021 21:10:40 -0500 Subject: [PATCH] initial --- getPicture.js | 40 ++++++++++++++++++++++++++++++++++++++++ index.html | 18 ++++++++++++++++++ schools.js | 21 +++++++++++++++++++++ 3 files changed, 79 insertions(+) create mode 100644 getPicture.js create mode 100644 index.html create mode 100644 schools.js diff --git a/getPicture.js b/getPicture.js new file mode 100644 index 0000000..4337ac6 --- /dev/null +++ b/getPicture.js @@ -0,0 +1,40 @@ + +//GetPicture_OnClick(); + +function GetPicture_OnClick() { + const emptyDiv = document.getElementById('emptyDiv'); + const dogURL = `https://picsum.photos/400`; + const proxy = 'https://cors-anywhere.herokuapp.com/'; + const xhr = new XMLHttpRequest(); + + emptyDiv.innerHTML = ""; + + xhr.open('GET', proxy + dogURL, true); + xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest'); + + xhr.onreadystatechange = function () { + if (xhr.readyState === 4) { + + console.log('status 4'); + + if (xhr.status === 200) { + + console.log('status 200'); + + const dogImage = document.createElement("img"); + dogImage.src = xhr.responseURL; + emptyDiv.appendChild(dogImage); + + } + } + else if (xhr.status === 499) { + console.log('... waiting for thumbnail'); + retryAfter5s(); // implementation of retry loop is not important there + } + else { + console.log('Image not found'); + } + }; + + xhr.send(); +} diff --git a/index.html b/index.html new file mode 100644 index 0000000..1607a4b --- /dev/null +++ b/index.html @@ -0,0 +1,18 @@ + + + + + + Document + + +
+

Image Will Appear Below

+ +
+
+
+ + + + \ No newline at end of file diff --git a/schools.js b/schools.js new file mode 100644 index 0000000..cb9e488 --- /dev/null +++ b/schools.js @@ -0,0 +1,21 @@ +const xmlhttp = new XMLHttpRequest(); +const url = "https://dog.ceo/api/breeds/image/random"; + +xmlhttp.onreadystatechange = function() { + if (this.readyState == 4 && this.status == 200) { + const returnArr = JSON.parse(this.responseText); + ParseImage(returnArr); + } +}; +xmlhttp.open("GET", url, true); +xmlhttp.send(); + +function ParseImage(arr) { + const out = ""; + let i; + for(i = 0; i < arr.length; i++) { + out += '' + + arr[i].display + '
'; + } + document.getElementById("emptyDiv").innerHTML = out; +} \ No newline at end of file