var x1, y1, x2, y2;
var  jcrop_api;
$(document.forms['load_img']).on('change', "input[id=form_image_load_file_input]" , function(){ upload_image();});

function get_current_clip_id(name, id){
    var response = '';
            $.ajax({
              type: 'GET',
              url: '/storage/get_current_image_clip_id/',
              data: ({'obj': name, 'id': id}),
              async: false,
              success: function(data) {
                  if (data.code == '1'){
                      response = data.data;
                  }
            }});
    return response;
}
function get_image_url(clip_id, size, empty){
    if (clip_id) {
        var response = '';
        console.log(clip_id);
        $.ajax({
            type: 'GET',
            url: '/storage/get_image_url/',
            data: ({'key': clip_id, 'type_in': size}),
            async: false,
            success: function (data) {
                if (data.code == '1') {
                    response = data.data;
                } else {
                    $('[name="file_load_error"]').css('display', 'block');
                }

            }
        });
        return response;
    } else {
        if (empty){
            return empty
        } else {
            return '/static/img/1404128195_Graphic_Design_Tools-06.png'
        }
    }
}
function write_image(name, id, size, attr, empty){
    var url = get_image_url(get_current_clip_id(name, id), size, empty);
    var image = '<img name="'+name+'" src="'+url+'" ';
    for (var key in attr){
        image = image + key + '="' + attr[key] + '"'
    }
    image = image + ' />';
    return image
}
function check_file_load(clip_id, type_in){
    var response = '';
            $.ajax({
              type: 'GET',
              url: '/storage/check_file_load/',
              data: ({key:clip_id, 'type_in': type_in}),
              async: false,
              success: function(data) {
                  if (data.code == '1'){
                      response = true;
                  } else {
                      response = false;
                  }

              }
            });
    return response;
}
function check_file_error(clip_id){
    var response = '';
            $.ajax({
              type: 'GET',
              url: '/storage/check_file_error/',
              data: ({key:clip_id}),
              async: false,
              success: function(data) {
                  if (data.code == '1'){
                      response = true;
                  } else {
                      response = false;
                  }

              }
            });
    return response;
}
function send_crop_data(x, y, x1, y1, w, h, clip_id){
    var response = '';
            $.ajax({
              type: 'GET',
              url: '/storage/send_crop_data/',
              data: ({x: x, y: y, x1: x1, y1: y1, w: w, h: h, clip_id: clip_id}),
              async: false,
              success: function(data) {
                  if (data.code == '1'){
                      response = true;
                  } else {
                      response = false;
                  }

              }
            });
    return response;
}

function load_image(place, placed_size){
    $('[name="load_image_place_name"]').val(place);
    $('[name="load_image_placed_size"]').val(placed_size);
    $('#settingsModal').modal('hide');
    $('#img-load').modal('show');
}
function remove_image(self, place, empty_image){
    $('[name=' + place + ']').attr('src', empty_image);
    clear_load_img_data();
    $(self).hide()
}
function load_process(){
    if (!window.load_process_interval){
        start_load();
    }
    function start_load(){
        window.load_process_interval = setInterval( function(){check_error(); check_load();}, 1000);
    }
    function stop_load_process(){
        clearInterval(window.load_process_interval);
        delete window.load_process_interval;
    }
    function check_load(){
        var type_in = 'img';
        if (check_file_load($('form[name=load_img]').find($( "[name='clip_file_id']" )).val(), 'loaded')){
            stop_load_process();
            $('.progress_'+type_in+'_load').css('display', 'none');
            $('.form_'+type_in+'_load').css('display', 'block');
            $('#'+type_in+'-load').modal('hide');
            open_workshop()
        }
    }
    function check_error(){
        var type_in = 'img';
        if (check_file_error($('form[name=load_img]').find($( "[name='clip_file_id']" )).val())){
            stop_load_process();
            $('.progress_'+type_in+'_load').css('display', 'none');
            $('.form_'+type_in+'_load').css('display', 'block');
            $("#form_image_load_file_input").replaceWith($("#form_image_load_file_input").clone());
            console.log('При загрузке файла произошла ошибка.<br>Попробуйте загрузить файл другого формата или размера.')
        }
    }
}

function upload_image(){
    var type_in = 'img';
    $('.form_'+type_in+'_load').css('display', 'none');
    $('.progress_'+type_in+'_load').css('display', 'block');
    var code = gen_unique_key();
    $('form[name=load_img]').find($( "[name='clip_file_id']" )).val(code);
    $( "[name='avatar_code']" ).val(code);
    document.forms['load_img'].submit();
    load_process();

}

function crop_changes(c){
    $('[name="load_image_x1"]').val(c.x);
    $('[name="load_image_x2"]').val(c.x2);
    $('[name="load_image_y1"]').val(c.y);
    $('[name="load_image_y2"]').val(c.y2);
    $('[name="load_image_width"]').val(c.w);
    $('[name="load_image_height"]').val(c.h);
}

function do_crop(){
    send_crop_data(
        $('[name="load_image_x1"]').val(),
        $('[name="load_image_x2"]').val(),
        $('[name="load_image_y1"]').val(),
        $('[name="load_image_y2"]').val(),
        $('[name="load_image_width"]').val(),
        $('[name="load_image_height"]').val(),
        $('form[name=load_img]').find($( "[name='clip_file_id']" )).val()
    );
    final_load_img()
}
function load_thumbnails_process(){
    if (!window.load_thumbnails_process_interval){
        start_load();
    }
    function start_load(){
        window.load_thumbnails_process_interval = setInterval( function(){check_load()}, 1000);
    }
    function stop_load_process(){
        clearInterval(window.load_thumbnails_process_interval);
        delete window.load_thumbnails_process_interval;
    }
    function check_load(){
        var type_in = 'img';
        if (check_file_load($('form[name=load_img]').find($( "[name='clip_file_id']" )).val(), 'croped')){
            stop_load_process();
            $('img[name="'+$('[name="load_image_place_name"]').val()+'"]').attr('src',
                get_image_url($('form[name=load_img]').find($( "[name='clip_file_id']" )).val(), $('[name="load_image_placed_size"]').val(), null));
            $('button[name=' + $('[name="load_image_place_name"]').val() + '_remove]').show();
        }
    }
}
function load_thumbnails(){
    var name = $('[name="load_image_place_name"]').val();
    $('input[name="'+name+'"]').val($('form[name=load_img]').find($( "[name='clip_file_id']" )).val());
    var img = $('img[name="'+name+'"]');
    img.attr('src', '/static/img/ui-anim_basic_16x16.gif');
    load_thumbnails_process()

}
function clear_load_img_data(){
    $('[name="load_image_x1"]').val('');
    $('[name="load_image_x2"]').val('');
    $('[name="load_image_y1"]').val('');
    $('[name="load_image_y2"]').val('');
    $('[name="load_image_width"]').val('');
    $('[name="load_image_height"]').val('');
    $('form[name=load_img]').find($( "[name='clip_file_id']" )).val('');
    $('[name="load_image_place_name"]').val('');
    $('[name="load_image_placed_size"]').val('');
}

function final_load_img(){
    load_thumbnails();
}
function open_file_clip(url){
    try {
        var type_in = get_file_mime_type(location.protocol + '//'+ location.host + url).split('/')[0];
    } catch (e){
        //
    }
    var file_name = url.split('/')[url.split('/').length - 1];
    var block = $('.modal-body#feedback_file_view_block');
    var button_block = $('#feedback_file_view_button');
    var button_href = $('#feedback_file_view_button_href');
    block.html('<img src="/static/img/1407646900_new_seo2-34.png" style="margin-top: 20px;"><br><br>'+
        '<b>Файл: </b>' + file_name);
    button_block.css('display', 'none');
    if ( type_in == 'image' ){
        block.append('<br><br><img src="'+location.protocol + '//'+ location.host+ '/' + url +
            '" style="max-height: 260px; max-width: 370px; border-radius: 5px; vertical-align: middle;background: #ffc; ' +
            'padding: 10px; border-radius: 10px;">');
    } else {
        block.append('<br><br><img src="'+location.protocol + '//'+ location.host + '/static/img/1407650423_new_seo-37.png" ' +
            'style="max-width: 370px; border-radius: 5px; vertical-align: middle;' +
            'margin-top: 20px;">');
        button_block.css('display', 'block');
        button_href.attr('href', location.protocol + '//'+ location.host + '/' +url);
    }

    $('#open_feedback_file').modal('toggle');
}
function close_workshop(){
    $("#form_image_load_file_input").replaceWith($("#form_image_load_file_input").clone());
    $('#image-workshop').modal('hide');
            $('#img-load').modal('toggle');
}
function save_workshop(){
    do_crop();
               $('#image-workshop').modal('hide');
               $('#img-load').modal('hide');
               $('#settingsModal').modal('show');
}
function open_workshop(){
    $('#image-workshop').modal('toggle');
    $('[name="file_load_error"]').css('display', 'none');
            var url = get_image_url($( "[name='clip_file_id']").val(), '', null);
            $('.image_change_workshop_place').html('<img name="image_change_workshop" src="/static/img/ui-anim_basic_16x16.gif">');
    setTimeout(function() {
            var workshop = $('img[name="image_change_workshop"]');
            workshop.attr('src', url).Jcrop({
                bgColor: '#fff',
                maxSize: [ 640, 600 ],
                minSize:  [ 256, 256 ],
                setSelect:   [ 100, 100, 50, 50 ],
                aspectRatio: 2/2,
                onChange: crop_changes,
                onSelect: crop_changes
            },function(){
                jcrop_api = this;
            });}, 2000);
}