import zim from "https://zimjs.org/cdn/016/zim_physics.js";
import Pizzazz from "https://zimjs.org/cdn/016/zim_pizzazz.js";
new Frame(FIT, 1024, 768, clear, purple, ready);
function ready(F, S, W, H) {
    /*let pattern = makePattern({
        type: "slants",
        colors: series([grey, dark]),
        size: 20,
        rows: 80,
        cols: 100
    });
    var wPanel = new Window({
        width: 1000,
        height: 700,
        content: pattern,
        scrollBarH: false,
        scrollBarV: false,
        backgroundColor: grey,
        titleBar: "set window",
        titleBarBackgroundColor: orange,
        titleBarHeight: 40
    }).pos(0, 0, "center", "top");
*/
    var colLen = 5,
        rowLen = 5,
        curTile = null;
    var infoData = [];
    loop(10, function (i) {
        var colItemArr = [];
        loop(10, function (j) {
            var itemData = { data: `${i}-${j}`, color: blue.toAlpha(0.4) };
            colItemArr.push(itemData);
        });
        infoData.push(colItemArr);
    });
    var board = new Board({
        size: 100,
        rows: rowLen,
        cols: colLen,
        labels: true,
        color:white,
        info:infoData,
        arrowColor: orange,
        arrowRollColor: red,
        swipe: true
    })
        .sca(0.6).alp(0.5)
        .pos(0, 10, "center", "center");
    //wPanel.add(board);
    loop(10, function () {
        board.addCol();
        board.addRow();
    });
    var infoData2 = [];
    loop(board.numRows, function (i) {
        var colItemArr = [];
        loop(board.numCols, function (j) {
            var itemData = { data: `${i}-${j}`, color: blue.toAlpha(0.4) };
            colItemArr.push(itemData);
        });
        infoData2.push(colItemArr);
    });

    board.info = infoData2;
    board.update();
        //board.positionBoard(5, 3);
    const person = new Person();
            board.add(person, 2, 2);
    board.tiles.tap(function (evt) {
        var tile = evt.target;
        var data = board.getData(tile);
        var index = board.getIndexes(tile);
        var item = board.getItems(tile);
        zogg(index);
        zogy(board.numRows, board.numCols, board.startRow, board.startCol);
        zogr(
            `boardRow=${tile.boardRow}`,
            `boardCol=${tile.boardCol}`,
            `tileRow=${tile.tileRow}`,
            `tileCol=${tile.tileCol}`,
            `data=${data}`,
            `index=` + index,
            `item=${item}`
        );
    });
    interval(2, function () {
        //board.moveCamera("left");
    });
}
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.