Свой каталог аватаров в профиле

Добрый день!
Подскажите пожалуйста, как в профиле пользователя при клике на ссылке создать свое модальное окно (с iframe) для выбора аватаров из собственной базы?

Единственное, до чего дошел — так это до размещения ссылки в шаблоне actions\ActionSettings\profile.tpl, куда можно вставить свой код:

<div>
<a href="#" id="avatar-upload" class="link-dotted">{if $oUserCurrent->getProfileAvatar()}{$aLang.settings_profile_avatar_change}{else}{$aLang.settings_profile_avatar_upload}{/if}</a><br />
<a href="#" id="avatar-remove" class="link-dotted" onclick="return ls.user.removeAvatar();" style="{if !$oUserCurrent->getProfileAvatar()}display:none;{/if}">{$aLang.settings_profile_avatar_delete}</a>
<strong>

<a target=_blank href=http://ХХХХХХХХ.com/>Создать свой аватар</a></strong>
</div>


1. Но как вызывать свое модальное окно?
2. Как в это окно воткнуть iframe?

3. И как обрабатывать событие при клике на аватар? Какую функцию навесить на него, чтобы выбранный аватар поместился в профиль?

10 комментариев

avatar
Вы же понимаете что никто не даст ответа т.к. это не пару строк и куча второстепенных вопросов типа «из какого каталога» и т.п.
avatar
Не согласен. Я вполне конкретные вопросы задал.
Как вызываются js-модальн-окна я уже видел в коде, но до конца не смог разобраться.
avatar
Не согласен.
ваше мнение. я вам сказал свое.
не в модальном окне вопрос и не в ифрейме, а в организации сохранения аватаров, где их взять, как хранить. либо у вас что уже есть решенное, но вы не указали что именно.
avatar
либо у вас что уже есть решенное
Да, все верно. Есть функционал который выводит по-простому из каталога сервера набор картинок. Но к обозначенным вопросам 1-3 это не имеет большого отношения.

А вы не подскажете, как, к примеру, хотя бы из js-скрипта вызывать модальное окно?
avatar
его нужно создать:
<div id="window_id" class="modal">
  <header class="modal-header">
    <h3>title</h3>
    <a href="#" class="close jqmClose"></a>
  </header>

  <div class="modal-content">
    something inside

  </div>
</div>


потом привязать вызов:
$('#window_id').jqm({trigger: '#link_to_open_id'});


и кнопка для вызова:
<span id="link_to_open_id">open my window</span>
avatar
С выводом модального окна по клику уже разобрался. Спасибо.

А как при клике на картинку в этом окне поставить (или залить) ее как аватар?

Я так понимаю ls.user.uploadAvatar(null,input) это делает. Но простое ее подключение
$('#22').click(function() {
    input = $("#avatar-cat").attr("src"); 
    ls.user.uploadAvatar(null,input);
});


выдает ошибку «Uncaught exception: TypeError: 'input.clone' is not a function»
avatar
Я уже чуть разобрался с функцией ls.user.uploadAvatar(null, input); из user.js, которая загружает аватар и показывает окно для ресайза.

Но никак не могу продебагить что за объект input надо передавать в нее?
Может кто-нибудь поможет на последнем этапе?

Пробовал указывать
var input = $("input [name=avatar]").attr("value", img);

где img — это адрес нового аватара, но в окне ресайза картинка всегда имеет src=«undefined».
avatar
input — это объект поля выбора файла ( <input type="file" /> ) с уже выбранным файлом на локальном компьютере. Сам метод uploadAvatar() производит загрузку этого локального файла на сервер, сохраняет его временную копию и вызывает метод this.showResizeAvatar(data.sTmpFile);, который уже показывает изображения для ресайза.
Без создания некого аналога обработчика экшена /settings/profile/upload-avatar/ здесь не обойтись.
avatar
Спасибо за подсказку! Небольшой шаг вперед.
Но, как установить для
<input type="file" />
уже выбранный файл?

Код
var input = $("input [name=avatar]").attr("value", "http://www.....");

не работает.
avatar
этот инпут предназначен только для файлов с локального компьютера
по этому поводу я и писал:
Без создания некого аналога обработчика экшена /settings/profile/upload-avatar/ здесь не обойтись.
Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.