class Pinterest {
    constructor() {
        this.token = $("meta[name='csrf-token']").attr("content");
    }

    /**
     *
     */
    listPinterest() {
        new DataTable('#pinterestList', {
            debug: true,
            processing: true,
            serverSide: true,
            dom: 'lfptip', // l: length selector, f: search box, p: pagination trên, t: table, i: info, p: pagination dưới
            ajax: {
                data: {_token: this.token},
                url: '/pinterest',
                type: 'POST',
                "dataSrc": function (json) {
                    return json.data;  // đảm bảo dữ liệu của bạn nằm trong mảng `data`
                }
            },
            columns: [
                {data: 'title'},
                {data: 'imageintro'},
                {data: 'imagestep'},
                {data: 'language'},
                {data: 'view'},
                {data: 'category'},
                {data: 'copyright'},
                {data: 'updated_at'},

            ],
            columnDefs: [
                {
                    targets: 0,
                    className: 'tdCenter',
                    'render': function (data, value, meta, key) {
                        return `<a target="_blank" href="http://handmadev.com/p/${meta.slug}">${data}</a> <br> <input class="titlePost" name="${meta._id}" id="${meta._id}" value="${data}" />`;
                    },
                },
                {
                    targets: 1,
                    className: 'tdCenter',
                    'render': function (data, value, meta, key) {
                        let string = '';
                        if(meta.imageintro?.['237']?.url && meta.imageintro['237'].url !== undefined && meta.imageintro['237'].url != null){
                            string = `<img width="100px" src="http://img.handmadev.com.local/${meta.imageintro['237'].url}" />`;
                        }else{
                            string = "<span style='color: red; background: yellow'>ko thấy ảnh</span>"
                        }
                        return string;
                    },
                },
                {
                    targets: 2,
                    className: 'tdCenter',
                    'render': function (data, value, meta, key) {
                        let string = '';
                        $.each(meta.imagestep, function (key, value) {
                            if(key < 4 ){
                                if (value?.url &&  value.url !== undefined) {
                                    string += `<img width="100px" src="http://img.handmadev.com.local/${value.url}" />`;
                                }else{
                                    string += "<span style='color: red;  background: yellow'>ko thấy ảnh</span>"
                                }
                            }
                        });
                        return string;
                    },
                },
                {
                    targets: 3,
                    className: 'tdCenter',
                    'render': function (data, value, meta, key) {
                        let string = '';
                        let language = Pinterest.languageList();
                        $.each(language, function (key, value) {
                            let checked = '';
                            if (key === data) {
                                checked = 'checked';
                            }
                            string += `<div class="form-check">
                                      <input class="form-check-input languageRadio" type="radio" name="language${meta._id}" id="language${key}${meta._id}" value="${key}" data-id="${meta._id}" ${checked}>
                                      <label class="form-check-label" for="language${key}${meta._id}">
                                        ${value}
                                      </label>
                                    </div>`;
                        });
                        return string;
                    },
                },
                {
                    targets: 4,
                    className: 'tdCenter',
                    'render': function (data, value, meta, key) {
                        return data;
                    },
                },
                {
                    targets: 5,
                    className: 'tdCenter',
                    'render': function (data, value, meta, key) {
                        const categories = ['chart', 'food', 'flat-patterns'];
                        let string = '';
                        
                        categories.forEach(category => {
                            const checked = (data === category) ? 'checked' : '';
                            const categoryId = category.replace('-', ''); // chuyển flat-chat thành flatchat cho ID
                            string += `<div class="form-check">
                                          <input class="form-check-input categoryRadio" type="radio" name="category${meta._id}" id="category${categoryId.charAt(0).toUpperCase() + categoryId.slice(1)}${meta._id}" value="${category}" data-id="${meta._id}" ${checked}>
                                          <label class="form-check-label" for="category${categoryId.charAt(0).toUpperCase() + categoryId.slice(1)}${meta._id}">${category}</label>
                                        </div>`;
                        });

                        return string;
                    },
                },
                {
                    targets: 6,
                    className: 'tdCenter',
                    'render': function (data, value, meta, key) {
                        let checked = '';
                        let copyright = 0;
                        if (data == 1) {
                            copyright = 1;
                            checked = 'checked';
                        }
                        return `<div class="form-check">
                                  <input class="form-check-input copyright" type="checkbox" value="${copyright}" ${checked}  id="${meta._id}">
                                  <label class="form-check-label" for="${meta._id}">
                                    Copyright
                                  </label>
                                </div>`;
                    },
                },
                {
                    targets: 7,
                    className: 'tdCenter',
                    'render': function (data, value, meta, key) {
                        console.log(meta);
                        let updateAt = Pinterest.convertToVietNamTime(data);
                        let createAt = Pinterest.convertToVietNamTime(meta.created_at);
                        let deleteButton = `<button data="${meta._id}" class="delete" >Remove</button>`
                        return updateAt + ' <Br> ' + createAt + ' <Br> ' + deleteButton ;
                    },
                },
            ]
        });

    }

    /**
     * @description chuyển ngày tháng iso sang ngày tháng việt nam
     * @param isoTimeString
     * @returns {string}
     */
    static convertToVietNamTime(isoTimeString) {
        // Tạo đối tượng Date từ chuỗi thời gian
        const dateObject = new Date(isoTimeString);
        // Chuyển múi giờ sang múi giờ Việt Nam (UTC+7)
        dateObject.setHours(dateObject.getHours() + 7);
        // Lấy thông tin ngày, tháng, năm, giờ, phút, giây
        const day = dateObject.getDate();
        const month = dateObject.getMonth() + 1; // Tháng tính từ 0 (0 = tháng 1)
        const year = dateObject.getFullYear();
        const hours = dateObject.getHours();
        const minutes = dateObject.getMinutes();
        const seconds = dateObject.getSeconds();
        // Định dạng lại chuỗi thời gian theo định dạng Việt Nam
        const vietnamTimeString = `${day}/${month}/${year} ${hours}:${minutes}:${seconds}`;
        return vietnamTimeString;
    }

    /**
     * @author thuypv
     * @description change status of post to copyright and opposite (ngược lại)
     */
    copyright() {
        $('#pinterestList').on('change', '.copyright', function () {
            let token = $("meta[name='csrf-token']").attr("content");
            let checked = 0;
            if (this.checked === true) {
                checked = 1;
            }
            let id = $(this).attr('id');
            jQuery.ajax({
                url: '/change-copyright',
                data: {_token: token, _id: id, copyright: checked},
                type: "POST",
                timeout: 30000,
                success: function (data) {
                    Pinterest.showToast("Save Success", 'success');
                },
                error: function () {
                    Pinterest.showToast("Can't connect server, please try again", 'error');
                }
            });

        });
    }

    categoryChange() {
        let token = this.token;
        $('#pinterestList').on('change', '.categoryRadio', function () {
            let id = $(this).attr('data-id');
            let category = $(this).attr('value');
            jQuery.ajax({
                url: '/change-category',
                data: {_token: token, _id: id, category: category},
                type: "POST",
                timeout: 30000,
                success: function (data) {
                    Pinterest.showToast("Save Success", 'success');
                },
                error: function () {
                    Pinterest.showToast("Can't connect server, please try again", 'error');
                }
            });

        });
    }

    /**
     * @description list of language and it's key
     * @returns array
     */
    static languageList() {
        let language = {
            vi: 'Việt Nam',
            en: 'English',
            cn: 'China',
            rus: 'Rusia',
            es: 'Tây ban nha(Spanish)',
            tr: 'Thổ nhĩ kỳ(Turkish)',
            fr: 'Pháp(French)',
            por: 'Bồ đào nha (Portuguese)',
        };
        return language;
    }

    /**
     * @description change language
     */
    changeLanguage() {
        let token = this.token;

        $('#pinterestList').on('change', '.languageRadio', function () {
            let id = $(this).attr('data-id');
            let language = $(this).attr('value');
            jQuery.ajax({
                url: '/change-language',
                data: {_token: token, _id: id, language: language},
                type: "POST",
                timeout: 30000,
                success: function (data) {
                    Pinterest.showToast('success', 'success');
                },
                error: function () {
                    Pinterest.showToast('error', 'error');
                }
            });

            console.log(id);
            console.log(language);
        });
    }

    editTitle() {
        $('#pinterestList').on('keyup', '.titlePost', function () {
            clearTimeout(window.timer);
            // Đặt lại timer mới
            let title = $(this).val();
            let id = $(this).attr('id');
            let token = $("meta[name='csrf-token']").attr("content");
            console.log('thuy');

            window.timer = setTimeout(function () {
                // Gửi request tới server ở đây
                jQuery.ajax({
                    url: '/change-title',
                    data: {_token: token, _id: id, title: title},
                    type: "POST",
                    timeout: 30000,
                    success: function (data) {
                        Pinterest.showToast('success', 'success');
                    },
                    error: function (data) {
                        Pinterest.showToast(data.responseJSON.message, 'error');
                    }
                });

            }, 1000);
        });


    }

    static showToast(msg, type) {
        let typeToast = {
            success: "linear-gradient(to right, #00b09b, #96c93d)",
            error: "red",
            warning: "yellow",
        };
        Toastify({
            text: msg,
            duration: 3000,
            close: true,
            gravity: "top", // `top` or `bottom`
            position: "right", // `left`, `center` or `right`
            stopOnFocus: true, // Prevents dismissing of toast on hover
            style: {
                background: typeToast[type],
            },
            onClick: function () {
            } // Callback after click
        }).showToast();
    }

    deletePost() {
        let token = this.token;
        $('#pinterestList').on('click', '.delete', function () {
            if (confirm("Are you sure to delete this post?")) {
                let id = $(this).attr('data');
                jQuery.ajax({
                    url: '/pinterest/delete-post',
                    data: {_token: token, _id: id},
                    type: "POST",
                    timeout: 30000,
                    success: function (data) {
                        Pinterest.showToast("Delete Success", 'success');
                        // reload table
                        $('#pinterestList').DataTable().ajax.reload();
                    },
                    error: function () {
                        Pinterest.showToast("Can't connect server, please try again", 'error');
                    }
                });
            }

        });
    }
}

$(function () {
    let PinterestData = new Pinterest();
    PinterestData.listPinterest();
    PinterestData.copyright();
    PinterestData.changeLanguage();
    PinterestData.editTitle();
    PinterestData.categoryChange();
    PinterestData.deletePost();
});