From 949855ccf58b2c0122c5d292fd1c5269084c6f02 Mon Sep 17 00:00:00 2001 From: glitchwhostolexmas Date: Mon, 6 Oct 2025 00:39:51 -0400 Subject: [PATCH 1/4] first commit and will add more styling --- css/style.css | 4 ++++ index.html | 24 ++++++++++++++++++++++++ js/main.js | 38 ++++++++++++++++++++++++++++++++++++++ 3 files changed, 66 insertions(+) create mode 100644 css/style.css create mode 100644 index.html create mode 100644 js/main.js diff --git a/css/style.css b/css/style.css new file mode 100644 index 0000000..b1edbe4 --- /dev/null +++ b/css/style.css @@ -0,0 +1,4 @@ +*{ + box-sizing: border-box; + background-color:honeydew; +} \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..220978b --- /dev/null +++ b/index.html @@ -0,0 +1,24 @@ + + + + + Poetry Word Cloud Generator + + + + + + + +

+

+

+ + + \ No newline at end of file diff --git a/js/main.js b/js/main.js new file mode 100644 index 0000000..9cc1ceb --- /dev/null +++ b/js/main.js @@ -0,0 +1,38 @@ +// alert("La buena guana bana"); + + +document.querySelector('button').addEventListener('click', getPoem) + + +// const img = "https://quickchart.io/wordcloud?text=How%soon hath Time, the subtle thief of youth,,Stoln on his wing my three and twentieth year!,My hasting days fly on wtih full career,,But my late spring no bud or blossom shew'th.,Perhaps my semblance might deceive the truth,,That I to manhood am arrived so near,,And inward ripeness doth much less appear,,That some more timely-happy spirits endu'th.,Yet be it less or more, or soon or slow,,It shall be still in strictest measure even,To that same lot, however mean or high,,Toward which Time leads me, and the will of Heaven;,All is, if I have grace to use it so,,As ever in my great Taskmaster's eye." + + +function getPoem () { + const api_URL = "https://poetrydb.org/random/1.text" + const poemPlace = document.querySelector('p').innerHTML + + document.querySelector('p').innerHTML = '' + + fetch(api_URL) + .then(res => res.json()) + .then(data => { + console.log(data) + document.querySelector('p').innerHTML += `
${data[0].lines}
` + getCloud(data[0].lines) +} + +)} + +// Mentor Karim Hassan helped me debug this to get the image to populate +function getCloud (text) { + const cloud_URL = "https://quickchart.io/wordcloud?text=" + const imgText = document.querySelector('div').innerHTML + console.log(text.join(' ')) + const cleanText = encodeURIComponent(text.slice(0,20).join(' ')) + console.log(cleanText) + fetch(`https://quickchart.io/wordcloud?text=${cleanText}`) + .then(res => { + document.querySelector('img').src = res.url +}) + +} \ No newline at end of file From 725422d38debe1bf2e303037971e2e06fae8fd87 Mon Sep 17 00:00:00 2001 From: glitchwhostolexmas Date: Tue, 7 Oct 2025 00:47:34 -0400 Subject: [PATCH 2/4] second commit --- .DS_Store | Bin 0 -> 6148 bytes css/style.css | 36 +++++++++++++++++++++++++++++++++++- index.html | 14 ++++++++------ js/main.js | 2 +- 4 files changed, 44 insertions(+), 8 deletions(-) create mode 100644 .DS_Store diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..d24f072ac2f0a577b77654d4121db295465657f2 GIT binary patch literal 6148 zcmeHK&2AGh5FRIiI;}uCfCLAmmAFQsOZls~Y{T}@1D9@94*Y~{HfpwP)=_ptkfNZy z!wDXM8&@t|cmm#l*C{jh6!Hg06d{jff40YCd%juQYXA_EJt!@k<;1MLXy%jk*ajq!2+D-arF-kV7Amg*ARzSYruJ7yS@7 zR`m(T*?`yjEgU3qmTzzW5T$bE!o>}_A-Cl7pr^(`-p)r^vpsxDwIijH@Vwj(kK^vR zRlD*?rFlC}yF+adM_ugl>`9zPYTQ(#G|IGXU=*?{tF7Ag$;7>X??K(!aqmv+&Scl! ztvh#iZcnFGdG+S4hlj0KNk3KZ48;PERxOtp&*425w8JYxqT6Q!@*@8FkpsfI-{Dx) ztq6v;c^wSXM5QM$4=g63c*P zU`-gH^TEMH=rI-s_0fTuegYs?uvrV1_0K<|Lk)-?V_^_mP=ql>G^T=|7=qsp!kDAp z Poetry Word Cloud Generator + + - - - + +

Poetry Word Cloud Generator

- -

-

+
+ +

diff --git a/js/main.js b/js/main.js index 9cc1ceb..33b3141 100644 --- a/js/main.js +++ b/js/main.js @@ -17,7 +17,7 @@ function getPoem () { .then(res => res.json()) .then(data => { console.log(data) - document.querySelector('p').innerHTML += `
${data[0].lines}
` + document.querySelector('p').innerHTML += `
${data[0].lines}
` getCloud(data[0].lines) } From a6ab8c6d0b2ed31445b1f67297350838da104106 Mon Sep 17 00:00:00 2001 From: Justin Jimenez Date: Tue, 11 Nov 2025 01:05:00 -0500 Subject: [PATCH 3/4] Update README.md --- README.md | 64 ++++++++++++++++++++++++++++++++++++++++--------------- 1 file changed, 47 insertions(+), 17 deletions(-) diff --git a/README.md b/README.md index 83ce771..27173fe 100644 --- a/README.md +++ b/README.md @@ -1,22 +1,52 @@ -# 📊 Project: Complex API 2 +# Poetry Word Cloud Generator -### Goal: Use data returned from one api to make a request to another api and display the data returned +- An application that generates a random classic poem and then turns it into a word cloud using a chain of APIs. -### How to submit your code for review: +## [Live Demo](https://jj-javascript.github.io/Poetry-Word-Cloud-Generator/) -- Fork and clone this repo -- Create a new branch called answer -- Checkout answer branch -- Push to your fork -- Issue a pull request -- Your pull request description should contain the following: - - (1 to 5 no 3) I completed the challenge - - (1 to 5 no 3) I feel good about my code - - Anything specific on which you want feedback! +## Table of Contents +1. [Project Overview](#project-overview) +2. [Features](#features) +3. [Technologies Used](#technologies-used) +4. [Installation](#installation) +5. [Usage](#usage) -Example: -``` -I completed the challenge: 5 -I feel good about my code: 4 -I'm not sure if my constructors are setup cleanly... +## Project Overview + +Poetry Word Cloud Generator is an application that lets users view classic poems in dynamic word cloud shapes. + +Poetry Word Cloud 1 +Poetry Word Cloud 2 + + +## Features + +- Button to generate random classic poem. +- Word Cloud Generation. + +## Technologies Used + +VS Code JavaScript HTML5 CSS3 Git + +## Installation + +1. Clone the repository: + +```bash +git clone https://github.com/yourusername/Poetry-Word-Cloud-Generator.git +```` + +2. Navigate to the project directory: + +```bash +cd poetry-word-cloud-generator ``` + +3. Open Project File + +4. Use in browser + +## Usage + +1. Click "Click for Cloud" button to generate poem. +2. Watch as the poem is turned into a word cloud. From 7470e00186d0fa1be7c92e4a9060bef00f17f5f7 Mon Sep 17 00:00:00 2001 From: Justin Jimenez Date: Tue, 11 Nov 2025 04:30:57 -0500 Subject: [PATCH 4/4] Update README.md