Hsiao-CropUpload

Hsiao-CropUpload — это Ajax-плагин для расширенной версии известного плагина Jcrop, который позволяет предварительно просматривать или обрезать изображения перед загрузкой. Он подходит для случаев, когда требуется загрузить, например, аватарку.

Благодарим Jcrop за пакет расширения!
Если вы хотите использовать только Jcrop, обратитесь к GitHub по адресу: https://github.com/tapmodo/Jcrop/.

Метод сжатия
Для сжатой версии CropUpload используется Google Closure-Compiler. Вы можете найти его на GitHub по адресу: https://github.com/google/closure-compiler. Как его использовать, вы можете узнать самостоятельно в Google.

###Последняя версия 1.4.1

1. Исправлена ошибка, из-за которой не вызывался обратный вызов при загрузке нескольких файлов.

###Пример HTML:

<div class="upload"></div>

Javascript:

$('.upload').cropupload({
    url : 'upload.php',
    autoload : true,	//Если preview = true, autoload устанавливается как недействительный
    preview : true,
    progress : function(process){
        console.log("Прогресс загрузки: " + process);
    },
    success : function(res){
        console.log("Загрузка прошла успешно");
    },
    crop : {
        /* Параметры этой части см. в официальной документации Jcrop */
        options : {
            aspectRatio: 1,		//Соотношение сторон поля выбора. Описание: ширина / высота
            allowMove:true,		//Разрешить перемещение поля выбора
            allowResize:true,	//Разрешить изменение размера поля выбора
            minSize:[50,50],	//Минимальный размер поля выбора
            setSelect: [0,0,100,100]	//Установить поле предварительного выбора
        },
        callback : function(e,s,c){
            console.log('Координаты X оси поля выбора:'+c.x);
            console.log('Координаты Y оси поля выбора:'+c.y);
        }
    }
});

###Параметры

url : '', //Адрес загрузки
crop : {}, //Параметры функции обрезки
prefix : 'cp_', //Префикс
selectText : 'Выберите файл', //Текст кнопки выбора файла
inputName : 'files', //Имя пространства загрузки
data : {}, //Предварительно установленные параметры POST
fileType : '', //Ограничение типа файла, пусто для неограниченного, поддерживает jpg,gif,png,jpeg,bmp
fileSize : '2048', //Максимальный размер файла, единица измерения - байт (по умолчанию 2M)
multiple : false, //Поддержка множественного выбора файлов, поддержка множественного выбора отключает предварительный просмотр и обрезку
preview : false, //Состояние включения функции предварительного просмотра, включение отключает ручную загрузку
autoupload : false, //Состояние включения автоматической загрузки, действует только при отключенном предварительном просмотре
success : function(){}, //Функция обратного вызова после успешной загрузки
progress : function(){}, //Метод передачи значения прогресса
fileUrl : function(){}, //Способ получения адреса файла
beforeUpload : function(){}, //Метод, выполняемый перед началом загрузки
onSelect : function(){} //Событие выбора файла, отправка информации о выбранном файле

###События

setData

Используется для добавления данных POST при последующей загрузке файлов (рекомендуется использовать в методе beforeUpload). Использование:

$('.upload').trigger('setData',{data:'data1',data2:'data3'});

startUpload Выполняет загрузку вручную, отменяя создание кнопки загрузки. Использование:

$('.upload').trigger('startUpload');