$(document).ready(function(){
        //Элемент изображения (img)
        var image = document.getElementById('crop-image');
        //Пропорции выделяемой области (1 для квадратной)
        var ratio = 1;
        //Поле (скрытый input), в которое будет записываться информация (JSON) о выделенной области
        var cropDataField = $('.crop-data');
        //Информация об обрезке (пусто по умолчанию)
        var cropData = undefined;

        //Пытаемся получить информацию об обрезке из поля (например если нужно показать старую область обрезки, информация о которой имеется в базе), если нет - оставляем пустой
        try {
            cropData = cropDataField.length > 0 ? JSON.parse(cropDataField.val()) : undefined;
        }catch (err) {
            cropData = undefined;
        }

        //Если скрипт подключен и изображение доступно
        if(typeof Cropper !== 'undefined' && image){
            var cropper = new Cropper(image, {
                aspectRatio: ratio,
                viewMode: 2,
                scalable: false,
                rotatable: false,
                zoomable: false,
                zoomOnWheel: false,

                //Событие смены области. Вписываем в cropData информацию об области и помещаем JSON этого объекта
                //в скрытое поле
                crop: function(e) {
                    var cropData = {};
                    cropData.x = Math.round(e.detail.x);
                    cropData.y = Math.round(e.detail.y);
                    cropData.w = Math.round(e.detail.width);
                    cropData.h = Math.round(e.detail.height);
                    $('.crop-data').val(JSON.stringify(cropData));
                },

                //Событие инициализации плагина. Если есть инфа в cropData - устанавливаем область
                //согласно этой инфе
                ready: function (e) {
                    if(cropData){
                        cropper.setData({
                            x: cropData.x,
                            y: cropData.y,
                            width: cropData.w,
                            height: cropData.h
                        });
                    }
                }
            });
        }
    });