From 87c8f1b73326c209c81a28ec60272f726996c14b Mon Sep 17 00:00:00 2001
From: AllTrueVision <85555604+AllTrueVision@users.noreply.github.com>
Date: Sun, 30 Mar 2025 23:02:20 -0400
Subject: [PATCH 1/2] Cat API
---
css/style.css | 3 +++
html/index.html | 24 ++++++++++++++++++++++++
js/catPics.js | 36 ++++++++++++++++++++++++++++++++++++
js/html/css/css | 3 +++
4 files changed, 66 insertions(+)
create mode 100644 css/style.css
create mode 100644 html/index.html
create mode 100644 js/catPics.js
create mode 100644 js/html/css/css
diff --git a/css/style.css b/css/style.css
new file mode 100644
index 0000000..e6923bb
--- /dev/null
+++ b/css/style.css
@@ -0,0 +1,3 @@
+*{
+ box-sizing: border-box;
+}
\ No newline at end of file
diff --git a/html/index.html b/html/index.html
new file mode 100644
index 0000000..9d8b981
--- /dev/null
+++ b/html/index.html
@@ -0,0 +1,24 @@
+
+
+
+
+
+
+
+ Whose Down For Some Kitten Pictures?
+
+
+
+
+ Dont you just LOOOOVVVEEE cute Kittens?
+ ![]()
+ If so, don't hesitate to click the button below!
+
+
+
+
+
\ No newline at end of file
diff --git a/js/catPics.js b/js/catPics.js
new file mode 100644
index 0000000..e861be5
--- /dev/null
+++ b/js/catPics.js
@@ -0,0 +1,36 @@
+document.querySelector('button').addEventListener('click', getKitty)
+
+function kittyKeys(){
+ const key = "live_z4zUQbzc0pk87zhPzuYtSmwrud8WjQMlf3kBOIKAhDruZp5bJJRmv1aYTyDpFmFa"
+}
+
+ function getKitty(){
+ const catSelector = document.querySelector('button').value
+
+ const url = 'https://api.thecatapi.com/v1/images/search?limit=10&breed_ids=beng&api_key=live_z4zUQbzc0pk87zhPzuYtSmwrud8WjQMlf3kBOIKAhDruZp5bJJRmv1aYTyDpFmFa'
+ fetch(url,{headers: {
+ 'x-api-key': "live_z4zUQbzc0pk87zhPzuYtSmwrud8WjQMlf3kBOIKAhDruZp5bJJRmv1aYTyDpFmFa"
+ }})
+ .then((response) => {
+ return response.json();
+ })
+ .then((data) => {
+ let imagesData = data;
+ imagesData.map(function(imageData) {
+
+ let image = document.createElement('img');
+ //use the url from the image object
+ image.src = `${imageData.url}`;
+
+ let gridCell = document.createElement('div');
+ gridCell.classList.add('col');
+ gridCell.classList.add('col-lg');
+ gridCell.appendChild(image)
+
+ document.getElementById('grid').appendChild(gridCell);
+
+ });
+ })
+ .catch(function(error) {
+ console.log(error);
+ })};
\ No newline at end of file
diff --git a/js/html/css/css b/js/html/css/css
new file mode 100644
index 0000000..e6923bb
--- /dev/null
+++ b/js/html/css/css
@@ -0,0 +1,3 @@
+*{
+ box-sizing: border-box;
+}
\ No newline at end of file
From 0609e898f3f811f2c0fd350355301657e689199e Mon Sep 17 00:00:00 2001
From: AllTrueVision <85555604+AllTrueVision@users.noreply.github.com>
Date: Mon, 31 Mar 2025 13:37:41 -0400
Subject: [PATCH 2/2] changed button
---
html/index.html | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/html/index.html b/html/index.html
index 9d8b981..bd4fbac 100644
--- a/html/index.html
+++ b/html/index.html
@@ -13,7 +13,7 @@
Dont you just LOOOOVVVEEE cute Kittens?
![]()
If so, don't hesitate to click the button below!
-
+