function textInputHtmlGenerator(text, className, title = "متن", direction = "rtl") {
    if(text == null || text == undefined) text = "";
    let htmlG = "";
    htmlG += '<div class="form-group newgen-form-group text-group">';
    htmlG += '<label class="mppanel_labels"><span>'+title+':</span></label><input style="direction:'+direction+'" type="text" class="'+className+' form-control" value="' + text + '">';
    htmlG += '</div>';
    return htmlG;
}

function imageInputHtmlGenerator(imgUrl, imgClass, imgId, title = "تصویر") {
    if(imgUrl == null || imgUrl == undefined) imgUrl = "";
    
    let no_image_style = 'style="display:none"';
    let has_image_style = '';
    if(imgUrl == ""){
        no_image_style = '';
        has_image_style = 'style="display:none"';
    }

    let htmlG = "";
    htmlG += '<div class="form-group newgen-form-group">';
    htmlG += '<label class="mppanel_labels"><span>'+title+'</span>:</label><div class="image_url_box super-file-select-box"><input id="' + imgId + '" type="text" class="'+imgClass+' form-control ltr mppanel_image_url" value="' + imgUrl + '">';
    htmlG += '<div class="sfsb-wrapper">';
    htmlG += '<div class="section-right"><div '+has_image_style+' class="image-wrapper"><a class="img-preview-a" target="_blank" href="'+imgUrl+'"><img class="img-preview" src="'+imgUrl+'"/></a></div><div '+no_image_style+' class="dropzone general_file_dropzone"></div></div>';
    htmlG += '<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>';
    htmlG += '</div>';
    htmlG += '</div>';
    htmlG += '</div>';
    return htmlG;
}

function intentInputHtmlGenerator(intentType, intentData, typeClassName , dataClassName , title = "مقصد") {
    if(intentType == null || intentType == undefined) intentType = "0";
    if(intentData == null || intentData == undefined) intentData = "";
    let htmlG = "";
    htmlG += '<div class="form-group newgen-form-group newgen-itentarea">';
    htmlG += '<label class="mppanel_labels">'+title+'</label>';
    htmlG += '<div class="intentarea">';
    
    htmlG += '<div class="intent_type_selector"><span class="nia-dbox"><span class="nia-it">مقصد:</span><span class="intent_type_select_btn"></span><input type="number" class="'+typeClassName+' form-control ltr width30 intent_type_code_input" value="'+intentType+'" disabled></span><span class="intent_type_change_btn"><i class="ph ph-pencil"></i>تغییر مقصد</span></div>';
    htmlG += '<span class="line-dash2"></span>';
    htmlG += '<div class="nia-des-box"><span class="nia-dbt"><span class="niad-title">داده مقصد:</span><span class="intent_data_change_btn"><i class="ph ph-pencil"></i>تغییر داده</span></span><span class="nia-db-exp"></span><textarea style="display:none" class="'+dataClassName+' form-control intent_data_text_area" rows="2">'+intentData+'</textarea></div>';
    
    htmlG += '</div>';
    htmlG += '</div>';
    return htmlG;
}

function iconInputHtmlGenerator(iconCode, className, iconId, title = "آیکون") {
    if(iconCode == null || iconCode == undefined) iconCode = "";
    let htmlG = "";
    htmlG += '<div class="form-group icon-group">';
    htmlG += '<label class="mppanel_labels"><span>'+title+':</span></label>';
    htmlG += '<span class="line-dash"></span>';
    htmlG += '<div class="icon_selector_box">';
    htmlG += '<input type="text" id="' + iconId + '" class="'+className+' form-control ltr width86 mppanel_icon_forms" placeholder="" value="'+iconCode+'">';
    htmlG += '<span class="icon_box"><i class="iconpreview '+(iconCode != "" ? modifyIcon(iconCode) : "")+'"></i></span>';
    htmlG += '</div>';
    htmlG += '</div>';

    return htmlG;
}

function colorInputHtmlGenerator(colorCode, className, colorId, title = "رنگ") {
    if(colorCode == null || colorCode == undefined) colorCode = "";
    let htmlG = "";
    htmlG += '<div class="form-group icon-group">';
    htmlG += '<label class="mppanel_labels"><span>'+title+':</span></label>';
    htmlG += '<span class="line-dash"></span>';

    htmlG += '<div class="color_selector_box pickr-container">';
    htmlG += '<input id="'+ colorId +'" type="text" class="'+className+' form-control ltr width86 mppanel_color_forms" value="'+ colorCode +'">';
    htmlG += '<span class="color_box" style="background:'+colorCode+'"><span class="color-hint"><i class="ph ph-eyedropper"></i></span></span>';
    htmlG += '</div>';

    htmlG += '</div>';

    return htmlG;
}

function numberInputHtmlGenerator(number, className, title = "عدد") {
    if(number == null || number == undefined) number = 0;
    let htmlG = "";
    htmlG += '<div class="form-group number-group row-numbers-group">';
    htmlG += '<label class="mppanel_labels"><span>'+title+':</span></label><span class="line-dash"></span><input type="number" class="'+className+' form-control mppanel_number_forms" value="' + number + '">';
    htmlG += '</div>';
    return htmlG;
}

function numberPriceInputHtmlGenerator(number, className, title = "قیمت") {
    if(number == null || number == undefined) number = 0;
    let htmlG = "";
    htmlG += '<div class="form-group number-group price-group row-numbers-group">';
    htmlG += '<label class="mppanel_labels"><span>'+title+':</span></label>';
    htmlG += '<span class="line-dash"></span>';
    htmlG += '<div class="price-input-wrapper">';
    htmlG += '<input type="number" class="'+className+' ng-price-input form-control mppanel_number_forms" value="' + number + '">';
    htmlG += '<span class="price-preview">'+convertPriceToHumanReadable(number)+'</span>';
    htmlG += '</div>';
    htmlG += '</div>';
    return htmlG;
}

function rowOptionsInputHtmlGenerator(value, options, className, title = "گزینه") {
    if(value == null || value == undefined) value = Object.keys(options)[0];
    let htmlG = "";
    let options_html = '';
    let swithers_html = '';
    Object.entries(options).forEach(([val, text]) => {
        let selected = '';
        let row_selected = '';
        if(val == value) {
            selected = 'selected';
            row_selected = 'row-option-selected';
        }
        options_html += '<option '+selected+' value="'+val+'">'+text+'</option>';
        swithers_html += '<span class="row-option '+row_selected+'" data-val="'+val+'">'+text+'</span>';
    });
    htmlG += '<div class="form-group row-options-group">';
    htmlG += '<label class="mppanel_labels"><span>'+title+':</span></label>';
    htmlG += '<span class="line-dash"></span>';
    htmlG += '<div class="row-option-box">';
    htmlG += '<select style="display:none" class="'+className+' form-control">'+options_html+'</select>';
    htmlG += '<span class="row-options-wrapper">'+swithers_html+'</span>';
    htmlG += '</div>';
    htmlG += '</div>';
    return htmlG;
}