include(Resources.id("jsblock:scripts/pids_util.js"));
var eta;

function create(ctx, state, pids) {
    print("Hello World ^^");
}

function render(ctx, state, pids) {
    Texture.create("background")
    .texture("jsblock:textures/led_bg.png")
    .size(pids.width, 65)
    .pos(0, 11)
    .draw(ctx);

    Texture.create("header")
    .texture("jsblock:textures/rectangle.png")
    .size(pids.width, 10)
    .pos(0, 0)
    .color(0x2977FF)
    .draw(ctx);

    Texture.create("header line")
    .texture("jsblock:textures/rectangle.png")
    .size(pids.width, 1)
    .pos(0, 10)
    .color(0xFFFFFF)
    .draw(ctx);

    /*Text.create("station name")
    .text(pids.station().getName() + " Station")
    .color(0xFFFFFF)
    .pos(2.5, 2)
    .bold()
    .scale(0.8)
    .draw(ctx);*/

    let platforms = pids.arrivals().platforms().toArray();
    let uniqueNumbers = [];
    for (let j = 0; j < platforms.length; j++) {
        let platform = platforms[j];
        if (!uniqueNumbers.includes(platform.getName())) {
            uniqueNumbers.push(platform.getName());
        }
    }

    let platformStringStart = "Tracks";
    if (uniqueNumbers.length == 1) {
        platformStringStart = "Track";
    }

    let platformString = `${platformStringStart} ${uniqueNumbers.join(", ")}`;

    Text.create("Platform list")
    .text(platformString)
    .color(0xFFFFFF)
    .pos(133.5, 2)
    .rightAlign()
    .scale(0.8)
    .draw(ctx);

    for (let i = 0; i < 4; i++) {
        let arrival = pids.arrivals().get(i);
        if (arrival != null) {
            let arrivalDate = new Date(arrival.arrivalTime());
            let arrivalHours = arrivalDate.getHours();
            if (arrivalHours > 12) {
                arrivalHours -= 12;
            }
            if (arrivalHours == 0) {
                arrivalHours = 12;
            }
            let arrivalMinutes = arrivalDate.getMinutes().toString().padStart(2, "0");
            let arrivalTime = `${arrivalHours}:${arrivalMinutes}`;

            Text.create("Arrival time")
            .text(arrivalTime)
            .color(0xFFAE00)
            .pos(10, i * 13 + 16)
            .scale(1)
            .centerAlign()
            .draw(ctx);

            Text.create("Arrival destination")
            .text(TextUtil.cycleString(arrival.destination()))
            .color(0xFFAE00)
            .pos(23.5, i*13+16)
            .scale(1)
            .stretchXY()
            .size(70, 100)
            .draw(ctx);

            Text.create("Arrival route")
            .text(TextUtil.cycleString(arrival.routeNumber()))
            .color(0xFFAE00)
            .pos(102, i * 13 + 16)
            .scale(1)
            .draw(ctx);

            Text.create("Arrival platform")
            .text(TextUtil.cycleString(arrival.platformName()))
            .color(0xFFAE00)
            .pos(134, i * 13 + 16)
            .scale(1)
            .rightAlign()
            .draw(ctx);
        }
    }

    const months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
    let dateObj = new Date();
    let month = months[dateObj.getMonth()];
    let dayOfMonth = dateObj.getDate();
    let hours = dateObj.getHours();
    let ampm = "AM";
    if (hours > 12) {
        hours -= 12;
        ampm = "PM";
    }
    if (hours == 0) {
        hours = 12;
    }
    let minutes = dateObj.getMinutes().toString().padStart(2, "0");

    let dateString = `${month} ${dayOfMonth},${hours}:${minutes} ${ampm}`;

    Text.create("Clock")
    .text(dateString)
    .color(0xFFAE00)
    .pos(68, 66)
    .scale(1)
    .centerAlign()
    .draw(ctx);
}

function dispose(ctx, state, pids) {
    print("Goodbye World ^^;");
}