<!DOCTYPE html> <head> <script src="p5.min.js" ></script> <script> console.log("hey there"); function preload(){ img=loadImage('wheel-of-fortune') } function setup() { createCanvas(windowWidth, windowHeight); button = createButton("spin the wheel!"); button.position(windowWidth/2-250, windowHeight/2); button.mousePressed(spin); } var spinning = 1; var currentSpinning = 0; function spin(){ spinning = 1800 + random(0,500); currentSpinning = 0; } function card(){ rect(0, 0, 55, 55); console.log("hey pop up here"); } function draw() { background(220); imageMode(CENTER); angleMode(DEGREES); translate (windowWidth/2, windowHeight/2); rotate(currentSpinning); image (img,0,0,200,200); currentSpinning = currentSpinning+10; if (currentSpinning > spinning){ currentSpinning = spinning; card(); } } </script> </head> <body> <h1>Spin the Oracle Wheel!</h1> <p></p> </body>