RiTa
I followed this Coding Train tutorial to learn how to use the RiTa.js library. RiTa has tools for natural language processing and generative writing. It seems the video is a bit outdated when it comes to using the current version of RiTa, so here are some things I noted:
This is how you include the library: <script src="https://unpkg.com/rita"></script>
I did not create an RiString, I used the tokenize() function
No Lexicon object, right?! I checked the reference and no Lexicon exists…
I did run into an error following the tutorial when trying to check for plural nouns, or part of speech with the PENN tag of “nns”. I ended up figuring out that the randomWord() function expects JSON notation as the parameter by reading the documentation. So I fixed it, yay!
Dan, stop trying to make fetch happen! (Notes)
Sorry! Jk! I love the fetch() web API … but not actually because I don’t understand it.
loadJSON() function is asynchronous
fetch() returns a promise
Use .then() to deal with asynchronous promises
ES8 supports await()
If a function returns a promise you can use await()
Await() can only be in an ASYNC function!
Await() can replace .then() function for promises …. right?!
async functions by definition return a promise
API = application programming interface, how two applications communicate with each other
Assignment
Ok, so I’m officially SO CONFUSED! I wanted to see if I could get some data from the Datamuse API using async and await() because I just went through all the video examples for week 3 and there was no direct Coding Train example for that. From all the videos I learned that you should only call await on functions that return a promise, right?! I’m still not 100% sure what that is either…
So this is what I wrote first, I modeled it after the code we wrote in the fetch video.
The response is really cryptic. It looks like it just returns a bunch of function names or something. Definitely not the JSON response to the Datamuse URL. So what’s all that stuff from lines 8-16? That’s the promise, right? Do I need that stuff?
Then I tried the loadJSON() function. This worked perfectly even though this isn’t how I wanted to retrieve the JSON data.
Then I also saw on the week 3 email from Dan, he attached a code example “Data muse with async and await”. Great, this is exactly what I’m trying to do! So I re-wrote my getDatamuse() function to call the json() function on the fetch response hoping that this would finally unwrap the API data for me. Basically, the console log shows me that data is a Promise and it is perpetually pending, it never resolves. There’s a screen shot below.
AHHHH! I forgot the second awaittttt! For line 25! Now I’m getting my data from the API.
Alrighty, here’s what I made for my assignment! I even tried to load the image asynchronously by calling the fetch() function, but this did not work for drawing on the canvas. I had to use the preload() function like normal. Also, in my sketch I call my asynchronous function in draw(). I was trying to draw the words to the canvas that the async function returned in draw() itself but I quickly learned that wouldn’t work. The text with the retrieved word from the API needs to be drawn to canvas in the async function itself and I lowered the frame rate of the sketch as well.
Q: Why use fetch and await instead of loadJSON?
References
All my p5.js sketches live here ❤️✨
https://github.com/dhowe/ritajs/tree/master