// Cloned by Cian on 4 Dec 2021 from World "Recognise any image (clone by Cian)" by Cian 
// Please leave this clone trail here.
 



// Cloned by Cian on 4 Dec 2021 from World "Recognise any image" by Starter user 
// Please leave this clone trail here.



// ML5 image recognition using MobileNet 
// uses AB framework
// enter URL of image at runtime


// no run, pause, step
AB.drawRunControls = false;

let classifier;
let img;

let clearButton;
let canvas;
let doodleClassifier;

// display Pr, pass it into a html elem to display
let resultsDiv;


// asynchronous loads of resources, with callback functions when ready 
var classifierLoaded = false;
var imgLoaded = false;



AB.world.newRun = function () {

    ABWorld.init('lightblue')
    ABWorld.canvas;
    
    
   
    //AB.headerRHS();   
    // uisng splash screen for clear button
   // AB.newSplash();
   // AB.splashHtml(" <button onclick='clearCanvas();'  class=ab-normbutton >Clear</button> <p> " );

    // DoodleNet load pretrained
    doodleClassifier = ml5.imageClassifier('DoodleNet', modelReady)
    resultsDiv = createDiv('model loading');
    //resultsDiv = createDiv('model loading')


function modelReady() {
    console.log('model loaded');
    doodleClassifier.classify(canvas, gotResults);
}
function gotResults(error, results) {
  if (error) {
    console.error(error);
    return;
  }
  // console.log(results);
  let content = `${results[0].label} 
                 ${nf(100 * results[0].confidence, 2, 1)}%<br/>
                 ${results[1].label} 
                 ${nf(100 * results[1].confidence, 2, 1)}%`;

  resultsDiv.html(content);
  doodleClassifier.classify(canvas, gotResults);
}
    

};

function clearCanvas() {
     
     //ABWorld.canvas('lightblue');
     console.log('button pressed')
    ABWorld.init('lightblue');
    ABWorld.canvas;
    }

//---- setup -------------------------------------------------------
// Do NOT make a setup function.
// This is done for you in the API. The API setup just creates a canvas.
// Anything else you want to run at the start should go into the following two functions.



function beforesetup()      // Optional 
{
    // Anything you want to run at the start BEFORE the canvas is created 
   // canvas = createCanvas(400, 400);
    // clearButton = createButton('clear');
    
    

}





function aftersetup()       // Optional
{
    // Anything you want to run at the start AFTER the canvas is created 
}


//---- draw -------------------------------------------------------

function draw()             // Optional
{
    // Can put P5 instructions to be executed every step here, or in AB.world.nextStep()  
    if (mouseIsPressed) {
        strokeWeight(8);
        line(mouseX, mouseY, pmouseX, pmouseY);
    }
    
    
    
}