This week was a whole lot of learning at once, I have the idea in my head but executing it within and while learning the multiple layers of html/js/css proved too much for my week. Alas.
The idea:
I wanted to create a full-window interactive canvas, that would lead people through multiple input boxes that would pop up as each input was submitted. They would all have a question to be answered, the answer would not be stored... currently because I don't know how, but I also took that lack of knowledge as a choice and decided to make it a game of deep listening.
What is deep listening?
It's a form of communication (usually between two people) in which one party speaks for a given amount of time, and the other party acts as a non-reactive, fully-receptive listener. No responses, either vocal, tonal, facial, or body language.
The struggle:
I got stuck on the first function, and it time-sucked my ICM assignment budget. I wanted to have the input ask a question, and upon submit there would be a fairly generic response, or the input box would "remove" from its location and pop up somewhere else on the screen. At the same time, a meditative image of some sort would pop up behind the text generated with the input value. Another thought was drawing a line using a for loop of points that would connect one input box to the next, creating a web of pointless answers.
I got the input working and the response, but nothing past that. Office hours needed, or a full day of deep code study.
Full page: https://editor.p5js.org/full/rJVdjuSsm
Editor: https://editor.p5js.org/medusamachina/sketches/rJVdjuSsm
First layer of questions:
Can you store images in project-folder?
how do you 'centerMode' an input?
How do you call an image as a background in a function?
How do you center text generated by a function using the input value?
Achievements:
"Clear" canvas at windowWidth/Height that would resize when windowResized
Input that was centered and responsive to windowResized
CSS button class
input.remove &submit.remove to delete all text fields to only show text "response" using input value