// NYUSH F24 - gohai

​

// Note: this sketch consists of additional JavaScript

// files. Make sure to duplicate it, rather than copying

// and pasting code :)

​

let openai_api_proxy = "https://zest-quiet-phalange.glitch.me/";

​

function setup() {

  createCanvas(400, 400);

  background(255);

​

  select("#submit").mouseClicked(sendMessage);

  select("#clearcanvas").mouseClicked(clearCanvas);

}

​

function sendMessage() {

  let content = select("#content").value();

​

  if (content == "") {

    return;

  }

​

  // we start out with an image variable (e.g. the current canvas via get())

  let img = get();

  // load the pixels

  img.loadPixels();

  // and turn them into a data url

  // (a data url is basically a file but encoded as an ordinary string,

  // i.e a-z, A-Z, 0-9 and a bunch of other characters)

  let dataUrl = img.canvas.toDataURL();

  //console.log(dataUrl);

​

  messages = [

    {

      role: "user",

      content: [

        {

          type: "text",

          text: select("#content").value(),

        },

        {

          type: "image_url",

          image_url: {

            url: dataUrl,

          },

        },

      ],

    },

  ];

​

  select("#content").value("");

​

  // gpt-4o-mini is the cheaptest model that supports vision input

  let params = {

    model: "gpt-4o-mini",

    messages: messages,

  };

  requestOAI("POST", "/v1/chat/completions", params, gotResults);

​

  // Note: there are additional parameters available, see

  // https://platform.openai.com/docs/api-reference/chat

}

​

function gotResults(results) {

  //console.log(results);

  let message = results.choices[0].message.content;

  console.log(message);

}

​

function draw() {

  if (mouseIsPressed) {

    fill(0);

    circle(mouseX, mouseY, 50);

  }

}

​

function clearCanvas() {

  background(255);

}

​