const CameraConfig = {
    obj_current_camera: null,

    init: () => {
        // Initialized on demand when a camera is selected
    },

    show: (obj_camera) => {
        CameraConfig.obj_current_camera = obj_camera;

        let obj_label = document.getElementById("label_selected_camera");
        obj_label.textContent = obj_camera.str_name;

        let obj_container = document.getElementById("container_camera_config");
        obj_container.innerHTML = "";

        let str_html = ""
            + '<div class="row g-2">'
            + '  <div class="col-6">'
            + '    <label class="form-label form-label-sm">Resolution X</label>'
            + '    <input type="number" class="form-control form-control-sm bg-dark text-light border-secondary" id="input_res_x" value="' + obj_camera.nb_resolution_x + '" min="1">'
            + "  </div>"
            + '  <div class="col-6">'
            + '    <label class="form-label form-label-sm">Resolution Y</label>'
            + '    <input type="number" class="form-control form-control-sm bg-dark text-light border-secondary" id="input_res_y" value="' + obj_camera.nb_resolution_y + '" min="1">'
            + "  </div>"
            + '  <div class="col-6">'
            + '    <label class="form-label form-label-sm">Frame start</label>'
            + '    <input type="number" class="form-control form-control-sm bg-dark text-light border-secondary" id="input_frame_start" value="' + obj_camera.nb_frame_start + '" min="0">'
            + "  </div>"
            + '  <div class="col-6">'
            + '    <label class="form-label form-label-sm">Frame end</label>'
            + '    <input type="number" class="form-control form-control-sm bg-dark text-light border-secondary" id="input_frame_end" value="' + obj_camera.nb_frame_end + '" min="0">'
            + "  </div>"
            + '  <div class="col-6">'
            + '    <label class="form-label form-label-sm">Frame step</label>'
            + '    <input type="number" class="form-control form-control-sm bg-dark text-light border-secondary" id="input_frame_step" value="' + obj_camera.nb_frame_step + '" min="1">'
            + "  </div>"
            + '  <div class="col-12">'
            + '    <label class="form-label form-label-sm">Format</label>'
            + '    <select class="form-select form-select-sm bg-dark text-light border-secondary" id="select_format">'
            + '      <option value="PNG"' + (obj_camera.str_format === "PNG" ? " selected" : "") + ">PNG</option>"
            + '      <option value="JPEG"' + (obj_camera.str_format === "JPEG" ? " selected" : "") + ">JPEG</option>"
            + '      <option value="OPEN_EXR"' + (obj_camera.str_format === "OPEN_EXR" ? " selected" : "") + ">EXR</option>"
            + '      <option value="BMP"' + (obj_camera.str_format === "BMP" ? " selected" : "") + ">BMP</option>"
            + '      <option value="TIFF"' + (obj_camera.str_format === "TIFF" ? " selected" : "") + ">TIFF</option>"
            + "    </select>"
            + "  </div>"
            + '  <div class="col-12 mt-3">'
            + '    <button class="btn btn-sm btn-primary w-100" id="btn_apply_config">'
            + '      <i class="mdi mdi-check me-1"></i>Appliquer'
            + "    </button>"
            + "  </div>"
            + "</div>";

        obj_container.innerHTML = str_html;

        CameraConfig._bind_events();
    },

    _bind_events: () => {
        let obj_btn_apply = document.getElementById("btn_apply_config");
        obj_btn_apply.addEventListener("click", () => {
            CameraConfig._apply();
        });
    },

    _apply: () => {
        let obj_cam = CameraConfig.obj_current_camera;
        if (!obj_cam) {
            return;
        }

        obj_cam.nb_resolution_x = parseInt(document.getElementById("input_res_x").value, 10) || 1920;
        obj_cam.nb_resolution_y = parseInt(document.getElementById("input_res_y").value, 10) || 1080;
        let nb_parsed_start = parseInt(document.getElementById("input_frame_start").value, 10);
        obj_cam.nb_frame_start = isNaN(nb_parsed_start) ? 1 : nb_parsed_start;
        let nb_parsed_end = parseInt(document.getElementById("input_frame_end").value, 10);
        obj_cam.nb_frame_end = isNaN(nb_parsed_end) ? 250 : nb_parsed_end;
        let nb_parsed_step = parseInt(document.getElementById("input_frame_step").value, 10);
        obj_cam.nb_frame_step = isNaN(nb_parsed_step) || nb_parsed_step < 1 ? 1 : nb_parsed_step;
        obj_cam.str_format = document.getElementById("select_format").value;

        ConsoleLog.add("Config appliquee pour " + obj_cam.str_name);
    },

    clear: () => {
        CameraConfig.obj_current_camera = null;
        let obj_label = document.getElementById("label_selected_camera");
        obj_label.textContent = "-";
        let obj_container = document.getElementById("container_camera_config");
        obj_container.innerHTML = '<div class="text-center text-light-emphasis py-4">Selectionnez une camera</div>';
    },
};