var $specSelects = $('.-spec-select')

var specSelectOptions = {
    language: 'ru',
    //minimumInputLength: 1, // Commented out to immediately load remote data
    placeholder: '', // Required by `allowClear`
    allowClear: true,
    
    ajax: {
        url: '/api/specializations/',
        dataType: 'json',
        quietMillis: 250,
        cache: true,
        
        data: function(term, page) {
            return {
                'name__icontains': term,
                page: page,
            }
        },
        
        results: function(data, page) {
            return {
                results: _.map(function(item) {
                    return {
                        text: item.name,
                        id: item.id,
                        origItem: item,
                    }
                }, data.results),
                
                more: (page * 10) < data.count,
            }
        },
    },
    
    initSelection: function(element, callback) {
        var id = $(element).val()
        
        if (id !== '') {
            $.ajax({url: '/api/specializations/' + id + '/', method: 'GET', dataType: 'json'})
                .then(function(data) {callback(data)})
        }
    }
}

$specSelects.select2(specSelectOptions)

var $specSelect1 = $('.-spec-select-level-1')
var $specSelect2 = $('.-spec-select-level-2')
var $specSelect3 = $('.-spec-select-level-3')
var $specSelect4 = $('.-spec-select-level-4')


var chosenSpecId = $('#chosenSpecId').val()

if (chosenSpecId) {
    $.ajax({url: '/api/specializations/' + chosenSpecId + '/', method: 'GET', dataType: 'json'})
        .then(function(spec) {
            return updateSpecializationWidgets(spec)
        })
}

$specSelects.on('change', function($evt) {
    updateSpecializationWidgets($evt.added.origItem)
})


function updateSpecializationWidgets(spec) {
    return getSpecializationTree(spec).then(function(specs) {
        var specLevel1 = specs.specLevel1
        var specLevel2 = specs.specLevel2
        var specLevel3 = specs.specLevel3
        var specLevel4 = specs.specLevel4
        var chosenSpecId = specs.chosenSpecId
        
        $specSelect1.select2('data', specLevel1 ? {id: specLevel1.id, text: specLevel1.name, origItem: specLevel1} : null)
        $specSelect2.select2('data', specLevel2 ? {id: specLevel2.id, text: specLevel2.name, origItem: specLevel2} : null)
        $specSelect3.select2('data', specLevel3 ? {id: specLevel3.id, text: specLevel3.name, origItem: specLevel3} : null)
        $specSelect4.select2('data', specLevel4 ? {id: specLevel4.id, text: specLevel4.name, origItem: specLevel4} : null)
        
        $('#chosenSpecId').val(chosenSpecId)
    })
}









//---------------------------------------------------



var $locationSelects = $('.-location-select')

var locationSelectOptions = {
    language: 'ru',
    //minimumInputLength: 1, // Commented out to immediately load remote data
    placeholder: '', // Required by `allowClear`
    allowClear: true,
}

//$locationSelects.select2(locationSelectOptions)

var $countrySelect = $('.-location-select-country')
var $regionSelect = $('.-location-select-region')
var $citySelect = $('.-location-select-city')

var chosenLocationId = $('#chosenLocationId').val()

$countrySelect.select2(_.merge(locationSelectOptions, {
    query: function(query) {
        $.ajax({url: '/api/locations/?level=1', method: 'GET', dataType: 'json'})
            .then(function(res) {
                query.callback({
                    results: _.map(function(item) {
                        return {
                            text: item.name,
                            id: item.id,
                            origItem: item,
                        }
                    }, res.results)
                })
            })
    },
}))













$('#realtyId').on('change', function($evt) {
    var realtyId = Number($(this).val())
    
    if (realtyId) {
        loadRealtyDetails(realtyId).then(function(res) {
            $('#realtyName').val(res.name)
            $('#realtyBuildingClassificationId').val(res.building_classification.id).change()
            $('#realtyConstructionTypeId').val(res.construction_type.id).change()
            //$('#realtyLocationId').val(res.location.id).change()
        })
    } else {
        $('#realtyName').val('')
        $('#realtyBuildingClassificationId').val('').change()
        $('#realtyConstructionTypeId').val('').change()
        //$('#realtyLocationId').val('').change()
    }
})

function loadRealtyDetails(realtyId) {
    return $.ajax({
        url: '/api/realties/' + realtyId + '/',
        method: 'GET',
        dataType: 'json',
    })
        .then(function(res) {return res})
}







// File uploading ---------------------------------------


var $fileUploadContainer = $('#fileUploadContainer')

$('#fileUploadAddBtn').on('click', function($evt) {
    $fileUploadContainer.find('.file-upload-widget').last().children('.file-upload-input').click()
})

$fileUploadContainer.on('change', '.file-upload-input', function($evt) {
    var $fileInput = $(this)
    var $fileUploadWidget = $fileInput.parent('.file-upload-widget')
    var filePath = $fileInput.val().replace(/\\/g, '/')
    var fileName = path.basename(filePath)
    //var fileExt = path.extname(filePath)
    var fileSize = $fileInput.get(0).files && humanFileSize($fileInput.get(0).files[0].size)
    
    if (fileName) {
        $fileUploadWidget.children('.file-upload-label').text(fileName + ' ' + fileSize)
        
        var $newFileUploadWidget = $fileUploadWidget.clone()
        $newFileUploadWidget.children('.file-upload-label').text('')
        
        $fileUploadContainer.children('ul').first().append($newFileUploadWidget)
        
        $fileUploadWidget.css('display', 'block')
    }
})

$fileUploadContainer.on('click', '.file-upload-remove-btn', function($evt) {
    var $btn = $(this)
    $btn.parent('.file-upload-widget').remove()
})

$fileUploadContainer.on('click', '.existing-file-remove-btn', function($evt) {
    var $btn = $(this)
    $btn.parent('.existing-file-widget').remove()
})
















// Helpers ---------------------------------------------


function getSpecializationTree(spec) {
    var specLevel1, specLevel2, specLevel3, specLevel4
    specLevel1 = specLevel2 = specLevel3 = specLevel4 = null
    
    var chosenSpecId = ''
    
    if (spec.level === 1) {
        specLevel1 = spec
        chosenSpecId = spec.id
        
        return $.when({
            specLevel1: specLevel1,
            specLevel2: specLevel2,
            specLevel3: specLevel3,
            specLevel4: specLevel4,
            chosenSpecId: chosenSpecId,
        })
    } else if (spec.level === 2) {
        specLevel2 = spec
        chosenSpecId = spec.id
        
        return $.ajax({url: '/api/specializations/' + specLevel2.parent.id + '/', method: 'GET', dataType: 'json'})
            .then(function(spec) {
                specLevel1 = spec
                
                return {
                    specLevel1: specLevel1,
                    specLevel2: specLevel2,
                    specLevel3: specLevel3,
                    specLevel4: specLevel4,
                    chosenSpecId: chosenSpecId,
                }
            })
    } else if (spec.level === 3) {
        specLevel3 = spec
        chosenSpecId = spec.id
        
        return $.ajax({url: '/api/specializations/' + specLevel3.parent.id + '/', method: 'GET', dataType: 'json'})
            .then(function(spec) {
                specLevel2 = spec
                
                return $.ajax({url: '/api/specializations/' + specLevel2.parent.id + '/', method: 'GET', dataType: 'json'})
                    .then(function(spec) {
                        specLevel1 = spec
                        
                        return {
                            specLevel1: specLevel1,
                            specLevel2: specLevel2,
                            specLevel3: specLevel3,
                            specLevel4: specLevel4,
                            chosenSpecId: chosenSpecId,
                        }
                    })
            })
    } else if (spec.level === 4) {
        specLevel4 = spec
        chosenSpecId = spec.id
        
        return $.ajax({url: '/api/specializations/' + specLevel4.parent.id + '/', method: 'GET', dataType: 'json'})
            .then(function(spec) {
                specLevel3 = spec
                
                return $.ajax({url: '/api/specializations/' + specLevel3.parent.id + '/', method: 'GET', dataType: 'json'})
                    .then(function(spec) {
                        specLevel2 = spec
                        
                        return $.ajax({url: '/api/specializations/' + specLevel2.parent.id + '/', method: 'GET', dataType: 'json'})
                            .then(function(spec) {
                                specLevel1 = spec
                                
                                return {
                                    specLevel1: specLevel1,
                                    specLevel2: specLevel2,
                                    specLevel3: specLevel3,
                                    specLevel4: specLevel4,
                                    chosenSpecId: chosenSpecId,
                                }
                            })
                    })
            })
    }
}









//function getLocationTree(loc) {
//    var country, region, city, countries, regions, cities
//    country = region = city = countries = regions = cities = null
//    
//    var chosenLocId = ''
//    
//    if (loc.level === 1) {
//        country = loc
//        chosenLocId = loc.id
//        
//        return $.ajax({url: '/api/locations/?level=1', method: 'GET', dataType: 'json'})
//            .then(function(res) {
//                specLevel1 = spec
//                
//                return {
//                    specLevel1: specLevel1,
//                    specLevel2: specLevel2,
//                    specLevel3: specLevel3,
//                    specLevel4: specLevel4,
//                    chosenSpecId: chosenSpecId,
//                }
//            })
//        
//        return $.when({
//            country: country,
//            region: region,
//            city: city,
//            chosenLocId: chosenLocId,
//        })
//    }
//    
//    ........
//}











// Utils -----------------------------------------------


function humanFileSize(bytes, si) {
    var thresh = si ? 1000 : 1024
    
    if (Math.abs(bytes) < thresh)
        return bytes + ' B'
    
    var units = si
        ? ['kB','MB','GB','TB','PB','EB','ZB','YB']
        : ['KiB','MiB','GiB','TiB','PiB','EiB','ZiB','YiB']
    
    var u = -1
    
    do {
        bytes /= thresh
        ++u
    } while (Math.abs(bytes) >= thresh && u < units.length-1)
    
    return bytes.toFixed(1) + ' ' + units[u]
}