$(document).ready(function (){
    renderContent()
})

function getInfoAboutUser (){
    let user_type = ''
    if (screen.width <= 800){
        user_type = 'mobile'
    } else if (screen.width > 1024) {
        user_type = 'desktop'
    } else if (screen.width >= 800 && screen.width <= 1024) {
        user_type = 'laptop'
    }
    return [user_type,screen.width]
}

function sendWidthAjax () {
    let width = getInfoAboutUser()[1]
    let data = {
        'screen_width': width
    }
    return data
}

function renderContent () {
    let data = sendWidthAjax()
    let section_button = document.querySelector(".section_btn")
    data['section_url'] = section_button.dataset['url']
    $.ajax({
        headers: { "X-CSRFToken": $('input[name=csrfmiddlewaretoken]').val() },
        url: '/get_content_for_section/',
        type: "POST",
        // async: true,
        cache: false,
        processData: false,
        // contentType: false,
        enctype: 'json',
        contentType: "application/json; charset=utf-8",
        data: JSON.stringify(data),
        success: function(data){
            document.querySelector(".content").innerHTML = data.html
            replaceHrefOnOnclick()
        },
        error: function (data){
            alert(data)
        }
    });
}

function replaceHrefOnOnclick () {
    let elements = document.querySelectorAll('.section_btn')
    let i = 0
    elements.forEach(function (){
        let cur_el = elements[i]
        if (cur_el.attributes.hasOwnProperty("href")){
            let str = cur_el.outerHTML
            let str_f_replace = cur_el.href
            str_f_replace = str_f_replace.replace(`${window.location.origin}`,'')
            str_f_replace = `href="${str_f_replace}"`
            str = str.replace(str_f_replace,'')
            str = str.replace('"target="_blank""','')
            cur_el.outerHTML = str
        }
        i++
    })
}