
function jsonType1RowHtmlMacker(disableImage, json) { //dont use ids because ids cant be repeated in DOM
    let imgStyle = '';
    if(disableImage) imgStyle = 'display:none';
    let htmlRow = "";
    htmlRow += '<div class="json_type1_card card card-outline card-json-item global-json-handler-card">';

    htmlRow += '<div class="card-body">';
    
    let no_image_style = 'style="display:none"';
    let has_image_style = '';
    let json_image_url = json != null ? json['img'] : "";
    if(json_image_url == ""){
        no_image_style = '';
        has_image_style = 'style="display:none"';
    }
    let imgClass = 'js_type1_img';
    //let counter = json['id'];
    let counter = randomUID(21);
    
    htmlRow += '<div class="form-group newgen-form-group" style="'+imgStyle+'">';
    htmlRow += '<label class="mppanel_labels">تصویر: </label><div class="image_url_box super-file-select-box"><input id="cat-image-' + counter + '" type="text" class="'+imgClass+' form-control ltr mppanel_image_url" value="' + json_image_url + '">';
    htmlRow += '<div class="sfsb-wrapper">';
    htmlRow += '<div class="section-right"><div '+has_image_style+' class="image-wrapper"><a class="img-preview-a" target="_blank" href="'+json_image_url+'"><img class="img-preview" src="'+json_image_url+'"/></a></div><div '+no_image_style+' class="dropzone general_file_dropzone"></div></div>';
    htmlRow += '<div class="section-left"><span class="ffwrapper">فرمت‌های مورد قبول:<br><span class="fileformats">.png,.gif,.jpg,.jpeg,.webp</span></span><span '+has_image_style+' class="btn-remove-image">حذف و انتخاب مجدد</span><span '+no_image_style+' class="btn-select-image">انتخاب از مدیریت فایل</span></div>';
    htmlRow += '</div>';
    htmlRow += '</div>';
    htmlRow += '</div>';

    htmlRow += '<div class="form-group newgen-form-group text-group">';
    htmlRow += '<label class="mppanel_labels">متن: </label><input type="text" class="js_type1_txt form-control" value="' + (json != null ? json['text'] : "") + '">';
    htmlRow += '</div>';

    let intentType = (json != null ? json['intent_type'] : "-");
    let intentData = (json != null ? json['intent_data'] : "-");
    htmlRow += intentInputHtmlGenerator(intentType,intentData,"js_type1_intent_type","js_type1_intent_data");

    htmlRow += '</div>';
    htmlRow += '</div>';

    return htmlRow;

}



// const jsonType1SimpleCancelBtn = function () {

//     let root_of_current = $(this).parent().parent().parent().parent().parent();
//     let card = root_of_current.find('.global-json-handler-card');
//     root_of_current.find('.json_handler_box_opener_btn').show();
//     card.addClass("collapsed-card");
//     let card_body = card.find('.card-body');
//     card_body.slideUp();

// };


const jsonType1SubmitBtn = function () {

    let root = $('.json_handler_type1');
    // let root_of_current = $(this).parent().parent().parent().parent().parent().parent();
    let textarea = root.find('.json_text_area');
    // let card = $(this).parent().parent().parent();

    let _img = root.find('.js_type1_img').val();
    let _text = root.find('.js_type1_txt').val();
    let _intent_type = root.find('.js_type1_intent_type').val();
    let _intent_data = root.find('.js_type1_intent_data').val();

    // root_of_current.find('.json_handler_box_opener_btn').show();

    // card.find('.json_type1_showimg').attr("src", _img);
    // card.find('.json_type1_showtext').html("متن: " + _text);
    // card.find('.json_type1_showintent').html(getIntentName(_intent_type));

    let obj = {
        img: _img,
        text: _text,
        intent_type: _intent_type,
        intent_data: _intent_data
    }

    let stringjs = JSON.stringify(obj);

    textarea.val(stringjs);

    // card.addClass("collapsed-card");
    // let card_body = card.find('.card-body');
    // card_body.slideUp();

    // notyf.open({
    //     type: 'info',
    //     message: 'تغییرات ثبت شد'
    // });

};


$(function () { // start of document ready:

    //json type1 SIMPLE:

    $('.json_type1_card').find('input, textarea').on('input change',jsonType1SubmitBtn);

    // $('.json_type1_submit').click(jsonType1SubmitBtn);
    // $('.json_type1_simple_cancel').click(jsonType1SimpleCancelBtn);

    if ($(".json_handler_type1")[0]) { //there is json type 1 simple:

        const jsonString = $('.json_handler_type1 > textarea').val();

        let jsonType1;

        if (jsonString == '') {
            jsonType1 = null;
        } else {
            jsonType1 = JSON.parse(jsonString);
        }

        if (jsonType1 == null) {
            let noImageData = $(".json_handler_type1").attr('data-noimage');
            let noImage = (noImageData == "1");
            const htmlrow = jsonType1RowHtmlMacker(noImage, null);
            $(".json_handler_type1").find(".showbox").find("#fixbox").html(htmlrow);
            // $(".json_handler_type1").find("#add_json_type1_item").show();
        } else {
            let noImageData = $(".json_handler_type1").attr('data-noimage');
            let noImage = (noImageData == "1");
            const htmlrow = jsonType1RowHtmlMacker(noImage, jsonType1);
            $(".json_handler_type1").find(".showbox > div").html(htmlrow);
            // $(".json_handler_type1").find("#add_json_type1_item").hide();
        }

        //re init all js functions:
        $('.json_type1_card').find('input, textarea').on('input change',jsonType1SubmitBtn);
        // $('.json_handler_box_opener_btn').click(jsonHandlersBoxOpener);
        // $('.json_type1_submit').click(jsonType1SubmitBtn);
        // $('.json_type1_simple_cancel').click(jsonType1CancelBtn);
        $('.intent_type_change_btn').click(selectIntentDialog);
        $('.intent_data_change_btn').click(editIntentDataSelector);
        //$('.intent_data_help_btn').click(showIntentDataHelper);
        //$('.intent_type_code_input').each(intentNamesPrinter);
        $('.intent_type_code_input').each(function (){intentNamesPrinter($(this));});
        $('.mppanel_image_url').on("input", changeImagePreview);
        newGenImageHandler();

    }

    // $('#add_json_type1_item').click(function () {

    //     const root = $(this).parent();
    //     root.find('.no-item-found').remove();
    //     $(".json_handler_type1").find("#add_json_type1_item").hide();

    //     let noImageData = $(".json_handler_type1").attr('data-noimage');
    //     let noImage = (noImageData == "1");

    //     const htmlrow = jsonType1RowHtmlMacker(noImage, null);
    //     root.find(".showbox").find("#fixbox").prepend(htmlrow);

    //     //re init all js functions:
    //     $('.json_handler_box_opener_btn').click(jsonHandlersBoxOpener);
    //     $('.json_type1_submit').click(jsonType1SubmitBtn);
    //     // $('.json_type1_simple_cancel').click(jsonType1SimpleCancelBtn);
    //     $('.intent_type_change_btn').click(selectIntentDialog);
    //     $('.intent_data_change_btn').click(editIntentDataSelector);
    //     //$('.intent_data_help_btn').click(showIntentDataHelper);
    //     //$('.intent_type_code_input').each(intentNamesPrinter);
    //     $('.intent_type_code_input').each(function (){intentNamesPrinter($(this));});
    //     $('.mppanel_image_url').on("input", changeImagePreview);
    //     newGenImageHandler();

    // });

}); //end of jqury doc ready