diff --git a/Existing_API_Collection/RickMortyAPI/Rick-And-Morty.jpeg b/Existing_API_Collection/RickMortyAPI/Rick-And-Morty.jpeg new file mode 100644 index 0000000..8988576 Binary files /dev/null and b/Existing_API_Collection/RickMortyAPI/Rick-And-Morty.jpeg differ diff --git a/Existing_API_Collection/RickMortyAPI/index.html b/Existing_API_Collection/RickMortyAPI/index.html new file mode 100644 index 0000000..dd637eb --- /dev/null +++ b/Existing_API_Collection/RickMortyAPI/index.html @@ -0,0 +1,39 @@ + + + + + + Random Rick and Morty Character + + + + +
+

Random Rick and Morty Character

+ +
+
+ + + + diff --git a/Existing_API_Collection/RickMortyAPI/logo.png b/Existing_API_Collection/RickMortyAPI/logo.png new file mode 100644 index 0000000..479b464 Binary files /dev/null and b/Existing_API_Collection/RickMortyAPI/logo.png differ diff --git a/Existing_API_Collection/RickMortyAPI/manifest.json b/Existing_API_Collection/RickMortyAPI/manifest.json new file mode 100644 index 0000000..869240a --- /dev/null +++ b/Existing_API_Collection/RickMortyAPI/manifest.json @@ -0,0 +1,12 @@ +{ + "name": "Rick and Morty", + "version": "0.0.1", + "manifest_version": 2, + "browser_action": { + "default_popup": "index.html", + "default_icon": "logo.png" + }, + "icons": { + "128": "logo.png" + } +} \ No newline at end of file diff --git a/Existing_API_Collection/RickMortyAPI/script.js b/Existing_API_Collection/RickMortyAPI/script.js new file mode 100644 index 0000000..6c6bc1e --- /dev/null +++ b/Existing_API_Collection/RickMortyAPI/script.js @@ -0,0 +1,30 @@ +document.addEventListener('DOMContentLoaded', function() { + const generateButton = document.getElementById('generateButton'); + const characterInfo = document.getElementById('characterInfo'); + + generateButton.addEventListener('click', async function() { + const randomId = Math.floor(Math.random() * 826) + 1; + const apiUrl = `https://rickandmortyapi.com/api/character/${randomId}`; + + try { + const response = await fetch(apiUrl); + const data = await response.json(); + + const characterName = data.name; + const characterImage = data.image; + + const characterElement = document.createElement('div'); + characterElement.innerHTML = ` +

${characterName}

+ ${characterName} + `; + + characterInfo.innerHTML = ''; + characterInfo.appendChild(characterElement); + } catch (error) { + console.error('Error fetching data:', error); + characterInfo.innerHTML = '

Failed to fetch character data.

'; + } + }); + }); + \ No newline at end of file