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


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


// 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.

// 1.) collecting the data (uisng KNN?) 2.) pre-trained model 3). inference/deploy
// saveData() <- data save
// save <- model save
// loadData
// load
// this example uses key-presses, model.saveData(filename, callback)


// 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



// 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)
   // AB.msg('model loading')
  
  //---------------------------//  
  
  let cat;
  let filtered;
  let dim = 28;
  function preload(){
      cat = loadImage('https://ancientbrain.com/uploads/c123ian/my_cat.PNG')
  }
  // apply filter to img
  let filter = [
      [-1, 1, 0],
      [-1, 1, 0],
      [-1, 1, 0]
      ]
  
  
    
    // results----------------------------------------- could use AB.newDiv(id) rather than AB.msg https://ancientbrain.com/docs.ab.php

//---- 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()  
    // below line thickness could be affecting classification (overfot to line thickness on train set), originally 8 stroke
    if (mouseIsPressed) {
        strokeWeight(16);
        line(mouseX, mouseY, pmouseX, pmouseY);
        
        
    }
    
    
    
}