Hello
I have an instanced version of p5.js on my site. I am trying to get a canvas with a createInput method to accept some input from user. This is how it’s defined
var sketch3 = function( controller ) {
controller.setup = function () {
controller.createCanvas(100, 100);
controller.background('grey');
let inp = controller.createInput('');
inp.position(0, 0);
inp.size(100);
inp.input(myInputEvent);
}
controller.draw = function () {
console.log('you are typing: ', this.value());
}
}
var myp5 = new p5(sketch3, 'sketch3');
and the html
<html>
<head>
<link rel="stylesheet" type="text/css" href="../css/site.css">
<link href="https://fonts.googleapis.com/css2?family=Varela+Round&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Lato:wght@300;900&display=swap" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.12"></script>
<script language="javascript" type="text/javascript" src="../javascript/libraries/p5.js"></script>
<script language="javascript" type="text/javascript" src="../javascript/sketch.js"></script>
<!-- <script src="../javascript/navbar.js"></script> -->
</head>
<body>
<main>
<div class="content-container">
<div id="sketch3"></div>
</div>
</main>
</body>
</html>
I know other functions work okay and i referenced them in similar ways but i cant seem to get the page to find the definition for createInput(). Is there something wrong with what i am doing here?