как мы можем достичь этой функциональности при загрузке изображений

Моя задача:

Шаг 1a: Пользователь загружает изображение

Вход: Исходный размер изображения (фиксированная ширина переменной высоты) - он может быть любого размера.

Ограничение:

A. ТИП: JPG/BMP/PNG и т.д.

B. МАКС. ИЗМЕРЕНИЕ

-example 1024X1024px.

Шаг 1b: После загрузки система проверяет критерии, соответствующие нашим критериям.

Критерии: ПРОВЕРЬТЕ МАКСИМАЛЬНЫЕ РАЗМЕРЫ

Если да:

Если критерии соответствия запрашивают у пользователя создание уменьшенного изображения размера (145 x 190)

Если нет:

Снова попросите пользователя изменить размер изображения до тех пор, пока оно не соответствует нашим критериям

Конечный выход:

2) 145 x 190 (Результат поиска изображение) (thumbnail)

3) 30% thumbnail

4) Для профиля pic мы определим фиксированную ширину, в зависимости от того, какая высота будет изменяться (ширина пока не определена)

---

Это моя задача. В этой задаче я могу добиться загрузки изображений, проверить размер. Но не шаг за шагом. пожалуйста, помогите мне выполнить эту задачу. Я новичок в JQuery, у меня есть только 1 месяц опыта, и эта задача для меня очень сложна. Надеюсь, вы поймете мой вопрос.

Мое обучение (для проверки размера): html:

<input type="file" id="file" />

JQuery:

var _URL = window.URL || window.webkitURL;

$("#file").change(function(e) {
    var file, img;


    if ((file = this.files[0])) {
        img = new Image();
        img.onload = function() {
            alert(this.width + " " + this.height);
        };
        img.onerror = function() {
            alert( "not a valid file: " + file.type);
        };
        img.src = _URL.createObjectURL(file);


    }

});

Мое обучение (для загрузки изображения): Html:

JQuery:

function readURL(input) {
            if (input.files && input.files[0]) {
                var reader = new FileReader();

                reader.onload = function (e) {
                    $('#blah')
                        .attr('src', e.target.result)
                        .width(thumbWidth)
                        .height(thumbHeight);
                };

                reader.readAsDataURL(input.files[0]);
            }
        }