я по событию это делаю

смотрите как сделал

$('.original-image').on('click', testF);

testF = function() {
            var fileReader = new FileReader();
            var im = new Image();
            im.onload = function() {
                selectFromFile(this);
            }
            im.src =       'http://look.loc/statics/web/blogs/preview/9602/9602.jpg';
        },

и мне выкидывает ошибку Uncaught TypeError: Cannot read property 'files' of undefined

Нужно код переработать немножко, просто так вставить строки не получиться. )

Не надо дважды FileReader, нужно лишь описать отдельной функций получение содержимого изображения как для формы так и для кнопки, понятно о чем я говорю?

ой fileReader нечаянно вставил у меня один он. ну я частично понимаю о чем вы только вот до конца не могу понять. Вот в im у меня объект изображения и я так понимаю в функции selectFromFile нужно сделать чтобы он загружался. я правильно понял или нет?

я просто с js не на таком уровне дружу чтобы нормально это всё сделать(

так а для кнопки как будет правильно получение? логику то я разделю для того и для того, меня больше волнует как сделать для кнопки

Функция selectFromFile должна принимать аргумент, например

selectFromFile = function(f)

который задает источник изображения - или files[0], или полученное по сети изображение, то есть передается в нее

selectFromFile(this.files[0]) - в обработчике onchange поля file

или

selectFromFile(this) - загруженное по сети в событии onload

а в функци работать с аргументом

fileReader.readAsDataURL(f);


В общем код надо править так или иначе. Ну и серверную часть тоже.

Ну если затруднительно, то смотрите далее - где полученное изображение передается непосредственно в обрезку, да еще если и аргументом, то есть будет более понятно.

смотрите можно же и так сделать, т.е если криво для начала

$('.original-image').on('click', resetImage);
resetImage = function() {
            var im = new Image();
            im.src = 'http://look.loc/statics/web/blogs/preview/9602/9602.jpg';
            im.onload = function() {
                var fileReader = new FileReader();
                fileReader.readAsDataURL(this);
                $(fileReader).one(EVENT_LOAD, loadImage);
            }
        },

т.е просто чуть продублировать кода. но тогда выскакивает ошибка
Uncaught TypeError: Failed to execute 'readAsDataURL' on 'FileReader': parameter 1 is not of type 'Blob'.

Запутал беднягу ). Это удалить в случае чтения сетевого файла

fileReader.readAsDataURL(this);

хотя можно и Blob получить, но нет смысла.

Это в функции selectFromFile

fileReader.readAsDataURL(f)

будет получать FileReader, а сетевое изображение (аргумент f), должно передаваться дальше на обработку. Для него не нужно var fileReader = new FileReader(); и fileReader.readAsDataURL(this);

Ищите далее по коду - передача этого в саму обрезку.