Code viewer for World: XOR multi-layer network (c...

// Cloned by Paul R on 12 Nov 2022 from World "XOR multi-layer network" by "Coding Train" project 
// Please leave this clone trail here.
 

// XOR multi-layer network

// Port from:
// https://github.com/CodingTrain/Toy-Neural-Network-JS/tree/master/examples/xor
// with modifications 

// libraries from:
// https://github.com/CodingTrain/Toy-Neural-Network-JS/tree/master/lib
// ported to here:
// https://ancientbrain.com/uploads.php?userid=codingtrain 



//=== Tweaker's box ============================================

// number of nodes in each layer:
const noinput = 2;
const nohidden = 6;
const nooutput = 1;

// define the exemplars to learn from:
let training_data = [
  {    inputs: [0, 0],    outputs: [1]  },
  {    inputs: [0, 1],    outputs: [0]  },
  {    inputs: [1, 0],    outputs: [0]  },
  {    inputs: [1, 1],    outputs: [1]  }
];

var nn;     // global var 

const learningrate = 0.2; 

// train this number of times per draw()
const notrain = 10;

// Take screenshot on this step:
AB.screenshotStep  = 200;   


// divide 0,1 into squares 
// show all squares or just the corner squares:
var showall = true;

const canvassize    = 400;
const squaresize    = 40;

const cols          = 10 ;
const rows          = 10;


// Matrix.randomize() is changed to point to this. Must be defined by user of Matrix. 
function randomWeight()
{
//    return 0.5;
//        return 5;
    return ( AB.randomFloatAtoB ( -0.5, 0.5 ) );
//    return ( AB.randomFloatAtoB ( -0.1, 0.1 ) );
//    return ( AB.randomFloatAtoB ( 5, 6 ) );
//    return ( AB.randomFloatAtoB ( -1, 1 ) );
            // Coding Train default is -1 to 1
}    

//=== End of tweaker's box ============================================




function setup() 
{
  createCanvas (canvassize, canvassize);
  
   $.getScript ( "/uploads/codingtrain/matrix.js", function()
   {
        $.getScript ( "/uploads/codingtrain/nn.js", function()
        {
            nn = new NeuralNetwork ( noinput, nohidden, nooutput );
        });
   });
}



function draw() 
{
  // check if libraries loaded yet:
  if ( typeof nn == 'undefined' ) return;
  nn.setLearningRate ( learningrate );

  background ('#ffffcc'); 

  // train n times 
  for (let i = 0; i < notrain ; i++) 
  {
    let data = random ( training_data );
    nn.train ( data.inputs, data.outputs );
  }
  
  let sq_0_0 = nn.predict([0,0]);
  let sq_0_1 = nn.predict([0,1]);
  let sq_1_0 = nn.predict([1,0]);
  let sq_1_1 = nn.predict([1,1]);
  AB.msg ( "f(0,0) = " + sq_0_0 );
  AB.msg ( "<br>f(0,1) = " + sq_0_1,2 );
  AB.msg ( "<br>f(1,0) = " + sq_1_0,3 );
  AB.msg ( "<br>f(1,1) = " + sq_1_1,4 );

// draw either some squares or all squares:

  if ( showall )
  {
    // redraw all squares each time round
    for (let i = 0; i < cols; i++) 
        for (let j = 0; j < rows; j++) 
            drawsquare ( i, j );
  }
  else
  {
    // redraw just the 4 squares 
    for ( let i = 0; i < cols; i = i + cols-1 ) 
        for ( let j = 0; j < rows; j = j + rows-1 ) 
            drawsquare ( i, j );
  }
  
  var str = "<br>Weights ih: ";
  for (var x=0; x<nn.weights_ih.data.length; x++){
      str += "<br> I"+ x + " w1: " + nn.weights_ih.data[x][0];
      str += "<br> I"+ x + " w2: " + nn.weights_ih.data[x][1];
  }
  AB.msg ( str, 5 );
  str = "<br>Weights ho: ";
  for (x=0; x<nn.weights_ho.data[0].length; x++){
      str += "<br> O" + x + " w1: " + nn.weights_ho.data[0][x];
  }
  AB.msg ( str, 6 );

}  
     
 
function drawsquare ( i, j )
{
      let x1 = i / cols;
      let x2 = j / rows;
      let inputs = [x1, x2];
      let y = nn.predict(inputs);
      // console.log ( "input (" +x1 + "," + x2 + ") output " + y );
      
      strokeWeight(2);
      stroke('black');
      fill ( y * 255 );      // 0 is black, 1 is white 
      
      rect ( i * squaresize, j * squaresize, squaresize, squaresize );
}