//

// This software is released under the MIT License.

// https://opensource.org/licenses/MIT

​

/* ===

ml5 Example

SketchRNN

=== */

​

// The SketchRNN model

let model;

// Start by drawing

let previousPen = "down";

// Current location of drawing

let x, y;

// The current "stroke" of the drawing

let strokePath;

​

// For when SketchRNN is fixed

function preload() {

  // See a list of all supported models: https://github.com/ml5js/ml5-library/blob/master/src/SketchRNN/models.js

  model = ml5.sketchRNN("cat");

}

​

function setup() {

  createCanvas(640, 480);

  background(220);

​

  // Button to reset drawing

  const button = createButton("clear");

  button.mousePressed(startDrawing);

​

  // run sketchRNN

  startDrawing();

}

​

function modelReady() {

  console.log("model loaded");

  startDrawing();

}

​

// Reset the drawing

function startDrawing() {

  background(220);

  // Start in the middle

  x = width / 2;

  y = height / 2;

  model.reset();

  // Generate the first stroke path

  model.generate(gotStroke);

}

​

function draw() {

  // If something new to draw

  if (strokePath) {

    // If the pen is down, draw a line

    if (previousPen === "down") {

      stroke(0);

      strokeWeight(3.0);

      line(x, y, x + strokePath.dx, y + strokePath.dy);

    }

    // Move the pen

    x += strokePath.dx;

    y += strokePath.dy;

    // The pen state actually refers to the next stroke

    previousPen = strokePath.pen;

​

    // If the drawing is complete

    if (strokePath.pen !== "end") {

      strokePath = null;

      model.generate(gotStroke);

    }

  }

}

​

// A new stroke path

function gotStroke(err, s) {

  strokePath = s;

}

​