Here is my code to build a 20 page document with prime numbered grids and random image positions and formats but they go out of the page, and it would be good to get the images to snap to the grid and have an individual comment/text per image.

I think I would need to include a JSON file for the individual text and tile of each image. Ideally the document should be for 500 images.

#include "basiljs/bundle/basil.js";

function draw() {
    var nbPages= 20;
    var wImage = 100;
    var hImage = 100;
    b.units(b.MM);
    
    // add one page at the end of the document and jump to it
   
    for(var i=0;i<nbPages;i++){

        var posX = posWidth()
        var posY = posHeight();
        
        if(i<10){
        var imgPath = "img00000000"+i+".png";
        }else if(i<100){
            var imgPath = "img0000000"+i+".png"; 
        }else{
            var imgPath = "img000000"+i+".png"; 
 
        }
        b.addPage();
        createIMG(imgPath, posX, posY, wImage, hImage); 
    }

    
}

function createIMG(imgPath, posX, posY, w, h){

    var bleed = 10;
    var random = b.random(0,4);

b.noStroke();
    b.image(imgPath, bleed +posX,bleed + posY, b.random(0,175), 100);
    b.text('I would need an individual text per image in a JSON file i guess', bleed +posX,bleed + posY+100, 150, 50); 
    b.margins(20,20,18,15,b.pageCount(20))
    b.pageNumber()
//   Prime number *10 grid
    b.guideY(20);
    b.guideY(30);
    b.guideY(50);
    b.guideY(70);
    b.guideY(110);
    b.guideY(130);
    b.guideY(170);
    b.guideY(190);
    b.guideY(230);
    b.guideY(290);
    b.guideY(310);
    b.guideY(370);
    b.guideY(410);
    b.guideY(430);
    b.guideY(470);
    b.guideY(530);
    b.guideY(590);
    b.guideY(610);
    b.guideY(670);
    b.guideY(710);
    b.guideY(730);
    b.guideY(790);
    b.guideY(830);
    b.guideY(890);
    b.guideY(970);
  
    b.guideX(20);
    b.guideX(30);
    b.guideX(50);
    b.guideX(70);
    b.guideX(110);
    b.guideX(130);
    b.guideX(170);
    b.guideX(190);
    b.guideX(230);
    b.guideX(290);
    b.guideX(310);
    b.guideX(370);
    b.guideX(410);
    b.guideX(430);
    b.guideX(470);
    b.guideX(530);
    b.guideX(590);
    b.guideX(610);
    b.guideX(670);
    b.guideX(710);
    b.guideX(730);
    b.guideX(790);
    b.guideX(830);
    b.guideX(890);
    b.guideX(970);
    
}

function posWidth(){
    var widthPage =210;
    var random = b.random(0,4);

    if(random<1){
        return 0;
    }else if(random<2){
        return widthPage/4;
    }else if(random<3){
        return widthPage/2;

    }else{
        return widthPage/4*3;

    
    }
}
function posHeight(){
    var widthPage =210;
    var random = b.random(0,4);

    if(random<1){
        return 0;
    }else if(random<2){
        return widthPage/4;
    }else if(random<3){
        return widthPage/2;

    }else{
        return widthPage/4*3;

    
    }
}
function sizeAndPosImg(){
    var  heightPage= 297
    var random = b.random(0,4);

    if(random<1){
        return 0;
    }else if(random<2){
        return widthPage/4;
    }else if(random<3){
        return widthPage/2;

    }else{
        return widthPage/4*3;    
    }
}
b.go();