Как осуществить загрузку изображения с последующим редактированием размера?

[braveheart]

Столкнулся с такой задачей:
Необходимо с помощью fileAPI реализовать загрузку и "обрезку изображения" как в примере Userpic + Crop (rubaxa.github.io/jquery.fileapi).

При выполнении данного кода примера, выходит ошибка:

...
  else if( file ){
         $('#popup').modal({
            closeOnEsc: true,
            closeOnOverlayClick: false,
            ...



    TypeError: $(...).modal is not a function/

Метода modal() (всплывающее окно) у меня нет, т.е. необходимо самому заменить/написать этот элемент.
Как правильно написать этот участок кода, чтобы я смог:

1) При нажатии кнопки - выходит окно браузера для выбора локального файла
2) После выбора необходимого файла, открываем попап и вставляем изображение туда (где есть только одна кнопка под изображение - 'Upload')

В общем-то все как в примере, только вот всплывающее окно, затормозило весь процесс...

[WorM32]

Подключить к странице jQuery UI с modal?

[braveheart]

Дело в том что, использовать JQuery UI, это было бы достаточно просто и не возникло бы проблем, но ситуация такова что есть уже написанный попап, который вызывается при условии того что ссылка будет иметь класс js-popup-btn.
Но я не знаю что писать в самом попапе, к примеру:

<div class="popup">
 Принимаем изображение
 Выводим выделение для кропа
 Отображаем кнопку для загрузки изображения с кропом
</div>

и что написать вместо:

('#popup').popup({
  onOpen: function (overlay){
	  $(overlay).on('click', '.js-upload', function (){
	    $.modal().close();
	    $('#userpic').fileapi('upload');
      });
..

в самом скрипте.
Подскажите как это реализовать?

[skrudjmakdak]

Дело в том что, использовать JQuery UI, это было бы достаточно просто и не возникло бы проблем

т.е. создавать свой велосипед куда лучше?

но ситуация такова что есть уже написанный попап, который вызывается при условии того что ссылка будет иметь класс js-popup-btn.

хорошо, свой велосипед мы создали. найди класс js-popup-btn, привяжи событие к нему по которому будешь открывать свое изобретение..

[braveheart]

т.е. создавать свой велосипед куда лучше?


хорошо, свой велосипед мы создали. найди класс js-popup-btn, привяжи событие к нему по которому будешь открывать свое изобретение..

Дело не в том чтобы я не хотел использовать JqueryUI. Сказали что есть уже готовый метод, чтобы не делать дубликатов )

[braveheart]

т.е. создавать свой велосипед куда лучше?


хорошо, свой велосипед мы создали. найди класс js-popup-btn, привяжи событие к нему по которому будешь открывать свое изобретение..

К сожалению у меня не получается сделать.
Пробовал по примеру повторить с modal() в JSFiddle, таже самая ситуация