Trying to Add Drawing Function to Intro Section

[hesuhpark]

Hi!

I'm trying to add in some styling where you can "draw" on the page. I sourced some code but am having a hard time adding it to the specific Intro/header section of the page (when I simply paste the code in without the 'newpageshown' code, it automatically loads on the bottom of every page)

Here's my code so far:

<script>
    window.laytheme.on("newpageshown", function(layoutObj, type, obj){
        if(type == "page" && obj.id == 930){

function setup() {
  createCanvas(windowWidth, windowHeight);
  background("#fbf8f3");
 document.getElementById("time-block");
}

function draw() {
  if (mouseIsPressed) {
    pen();
  }
}

function pen() {
  // set the color and weight of the stroke
  stroke(0, 0, 0, 255);
  strokeWeight(2);

  // draw a line from current mouse point to previous mouse point
  line(mouseX, mouseY, pmouseX, pmouseY);
}
</script> 

And I have the section on my page as

<div id="time-block"></div>

And as reference, this is the code I'm trying to have featured: https://library.superhi.com/posts/how-to-paint-with-code-creating-paintbrushes <- Under the first section "Drawing a simple line"

Thank you so much if anyone responds! I truly appreciate it. I've been trying to figure it out myself for about 2 hours and can't seem to navigate Java.

TYTY! Going strong with Lay theme <3

[hesuhpark]

I forgot to mention, I also have this above my code (as provided in the Superhi link)

<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.3.1/p5.min.js"></script>