<script type="text/javascript">
    $(document).ready(function() {
        list_data();
    });

    $(document).on('click', '.btn_reset_deviceid', function() {
        var id_user = $(this).attr("id");
        $('#tampil_form').load('<?= route("master.karyawan.akun.form.reset") ?>', () => {
            $('#tampil_form .title').text('<?= $this->lang->line('title_form_reset_deviceid') ?>');
            $('#tampil_form #id_user').val(id_user);
            $('#tampil_form .ladda-button').addClass("btn_proses_reset_deviceid");
            $('#modal_form').modal('show');
        });
    });

    $(document).on('click', '.btn_reset_facerecognition', function() {
        var id_user = $(this).attr("id");
        $('#tampil_form').load('<?= route("master.karyawan.akun.form.reset") ?>', () => {
            $('#tampil_form .title').text('Apakah Anda ingin mereset data face recognition?');
            $('#tampil_form #id_user').val(id_user);
            $('#tampil_form .ladda-button').addClass("btn_proses_reset_facerecognition");
            $('#modal_form').modal('show');
        });
    });

    function list_data() {
        $("#list_data").load("<?= route('master.karyawan.akun.data') . '/' . $id_karyawan ?>", function() {
            $(".btn_edit_akun").click(function() {
                var id_karyawan = $(this).attr('id-karyawan');
                var id_user = $(this).attr('id-user');
                $('#tampil_form').load("<?= route('master.karyawan.akun.form.edit') . '/' ?>" + id_karyawan + "/" + id_user, function() {
                    $('#modal_form').modal('show');
                    $("#modal_form .title").text("<?= $this->lang->line('title_form_edit_data') ?>");
                    $("#modal_form .btn_save_akun").addClass("btn_save_akun btn btn-warning");
                    $("#modal_form .btn_save_akun").append('<i class="fa fa-edit (alias)"></i> ');
                    $("#modal_form .btn_save_akun").append('<?= $this->lang->line('button_form_perbarui') ?>');
                    $("#modal_form #btn_new_input").hide();
                    simpan_data()
                });
            });

            $(".btn_show_facerecognition").click(function() {
                var image = $(this).attr("url-image");
                $("#modal_image #image_facerecognition").attr("src", image);
                $('#modal_image').modal('show');
            });
        });
    }

    function simpan_data() {
        $(".btn_save_akun").click(function(e) {
            e.preventDefault();
            $('#message').html("");
            var loading = Ladda.create(this);

            if ($("#username").val() == "") {
                $('#message').html("<font style='color:Crimson'><i class='fa fa-exclamation-triangle'></i> <?= $this->lang->line('error_username') ?></font>");
                $("#username").focus();
                return false;
            } else if ($("#level").val() == "") {
                $('#message').html("<font style='color:Crimson'><i class='fa fa-exclamation-triangle'></i> <?= $this->lang->line('error_level_user') ?></font>");
                $("#level").focus();
                return false;
            }
            loading.start();
            // var lok = JSON.stringify($("#id_lok").val());
            //console.log(lok);
            var param = new FormData();
            param.append('username', $("#username").val());
            param.append('password_baru', $("#password_baru").val());
            param.append('lock_facerecognition', $("#lock_facerecognition").val());
            param.append('lock_device', $("#lock_device").val());
            param.append('lock_lokasi', $("#lock_lokasi").val());
            param.append('id_lokasi', $("#id_lokasi").val());
            param.append('id_user', $("#id_user").val());
            param.append('id_karyawan', $("#id_karyawan").val());

            $.ajax({
                type: 'POST',
                url: "<?= route('master.karyawan.akun.save') ?>",
                data: param,
                dataType: 'JSON',
                contentType: false,
                processData: false,
                cache: false,
                success: function(result) {
                    if (result.success == true) {
                        list_data();
                    }
                    loading.stop();
                    $('#message').show();
                    $('#message').html(result.message);
                },
                error: function() {
                    loading.stop();
                    $('#message').show();
                    $('#message').html('<font color="#eb3a28"><i class="fa fa-close(alias)">&nbsp;</i><strong><?= $this->lang->line('error') ?></strong></font>');
                }
            });
        });
        //btn_save
    }

    $(document).on("click", ".btn_proses_reset_deviceid", function(e) {
        e.preventDefault();
        $('#tampil_form #message').html("");
        var loading = Ladda.create(this);
        loading.start();
        var param = new FormData();
        param.append('id_user', $("#tampil_form #id_user").val());

        $.ajax({
            type: 'POST',
            url: "<?= route('master.karyawan.akun.reset.deviceid') ?>",
            data: param,
            dataType: 'JSON',
            contentType: false,
            processData: false,
            cache: false,
            success: function(result) {
                if (result.success == true) {
                    list_data();
                }
                loading.stop();
                $('#tampil_form #message').show();
                $('#tampil_form #message').html(result.message);
            },
            error: function() {
                loading.stop();
                $('#tampil_form #message').show();
                $('#tampil_form #message').html('<font color="#eb3a28"><i class="fa fa-close(alias)">&nbsp;</i><strong><?= $this->lang->line('error') ?></strong></font>');
            }
        });
    });

    $(document).on("click", ".btn_proses_reset_facerecognition", function(e) {
        e.preventDefault();
        $('#tampil_form #message').html("");
        var loading = Ladda.create(this);
        loading.start();
        var param = new FormData();
        param.append('id_user', $("#tampil_form #id_user").val());

        $.ajax({
            type: 'POST',
            url: "<?= route('master.karyawan.akun.reset.facerecognition') ?>",
            data: param,
            dataType: 'JSON',
            contentType: false,
            processData: false,
            cache: false,
            success: function(result) {
                if (result.success == true) {
                    list_data();
                }
                loading.stop();
                $('#tampil_form #message').show();
                $('#tampil_form #message').html(result.message);
            },
            error: function() {
                loading.stop();
                $('#tampil_form #message').show();
                $('#tampil_form #message').html('<font color="#eb3a28"><i class="fa fa-close(alias)">&nbsp;</i><strong><?= $this->lang->line('error') ?></strong></font>');
            }
        });
    });

    function radio_camera(item) {
        var id_user = item.getAttribute("iduser");
        var value = item.value;
        var idcamera = $("#camera_default").val();
        $('#tampil_form').load('<?= route("master.karyawan.akun.form.kamera") ?>', () => {
            $('#tampil_form #id_user').val(id_user);
            $('#tampil_form #camera').val(value);
            if (value == "0") {
                var title = "<?= $this->lang->line('title_form_alert_kamera_0') ?>";
            } else {
                var title = "<?= $this->lang->line('title_form_alert_kamera_1') ?>"
            }
            $('#tampil_form .title').html(title);
            $('#tampil_form #btn_close_camera').hide();
            $('#tampil_form #btn_unconfrim_camera').show();
            $('#tampil_form #btn_confrim_camera').show();
            $("#tampil_form #btn_unconfrim_camera").attr("idcamera", idcamera)
            $('#modal_form').modal('show');
        });
    }

    function btn_unconfrim_camera(item) {
        var idcamera = item.getAttribute("idcamera");
        if (idcamera == "2" || idcamera == "1") {
            $("#c_plugin").prop("checked", true);
        } else {
            $("#c_default").prop("checked", true);
        }
        $('#modal_form').modal('hide');
    }

    $(document).on("click", "#btn_confrim_camera", function(e) {
        e.preventDefault();
        $('#tampil_form #message').html("");
        var loading = Ladda.create(this);
        loading.start();
        var param = new FormData();
        param.append('id_user', $("#tampil_form #id_user").val());
        param.append('id_camera', $("#tampil_form #camera").val());

        $.ajax({
            type: 'POST',
            url: "<?= route('master.karyawan.akun.kamera.save') ?>",
            data: param,
            dataType: 'JSON',
            contentType: false,
            processData: false,
            cache: false,
            success: function(result) {
                if (result.success == true) {
                    $('#tampil_form #btn_close_camera').show();
                    $('#tampil_form #btn_unconfrim_camera').hide();
                    $('#tampil_form #btn_confrim_camera').hide();
                    list_data();
                }
                loading.stop();
                $('#tampil_form #message').show();
                $('#tampil_form #message').html(result.message);
            },
            error: function() {
                loading.stop();
                $('#tampil_form #message').show();
                $('#tampil_form #message').html('<font color="#eb3a28"><i class="fa fa-close(alias)">&nbsp;</i><strong><?= $this->lang->line('error') ?></strong></font>');
            }
        });
    });
</script>
<div class="row">
    <div id="list_data" class="col-md-12"></div>
</div>

<!-- START TAMPIL MODAL IMAGE-->
<div id="modal_image" class="modal fade in">
    <div class="modal-dialog modal-md text-center">
        <img class="modal-content rounded mx-auto d-block" id="image_facerecognition" style="max-height:500px; width:auto">
    </div>
</div>
<!-- END TAMPIL MODAL IMAGE-->