JavaScript. Работа с изображениями.

Даниил19 лет в сервисе
Данные заказчика будут вам доступны после подачи заявки
18.05.2015

Необходимо создать на JavaScript / HTML5 систему для нанесения логотипа на любое изображение.

Есть типичный сайт, нужно добавить такой функционал:

Пользователь может перетащить в определенную область на сайте файл-изображение (формат jpg/png) – это логотип.

После этого, на все png-картинки на сайте – ставится логотип (то самое пользовательское изображение).

Размер логотипа: 1/5 от размера картинки по ширине и высоте.

Место размещения: нижний левый угол (с отступом 10%).

Прозрачность логотипа: 50%

КЛЮЧЕВЫЕ ОСОБЕННОСТИ:

1. Обработка идет только на клиенте. Сервер отдает обычные картинки, в браузере на них ставится логотип.

2. Логотип не накладывается на изображение поверх как отдельный div, а именно внедряется в изображение. Должна быть возможность скачать изображение с логотипом. Желательно – как обычную картинку (ПКМ+"сохранить изображение"). Но если это сложно – можно и по кнопке "скачать" накладывающейся на каждую картинку при наведении.

3. Нужен понятный, прокомментированный на русском код. Я буду менять его в дальнейшем.

4. Поддержка старых браузеров – не обязательна. Можно даже ограничиться только последними версиями распространенных браузеров.

5. Необходима несложная процедура подключения. В идеале – скрипт прописывается в head, всем изображениям назначается обработчик, указывается обработчик для div`а куда перетаскиваются изображения и все.

Большая просьба – детально ознакомиться с ключевыми особенностями указанными выше.

Работа должна быть выполнена именно так, а не иначе.

Жду ваших предложений по срокам, цене и используемым подходам для решения задачи.

Также жду вариантов решения такого вопроса: если пользователь перейдет на другую страницу сайта – логотип пропадет, и на новых картинках его уже не будет. Нужно этого избежать.

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

Если сработаемся – будут еще заказы по развитию этого проекта.

С уважением,

Даниил

Заявки фрилансеров