Комментирование с цитатой в 1 клик в подгруженных статьях

в 7:19, , рубрики: HabrAjax, Веб-разработка, интерфейсы, метки:

Рассмотрим нетрадиционные способы комментирования сообщений в форуме на примере сайта Х и скриптов автоматизации HabrAjax. Они, как известно, имеют основное назначение — смотреть статьи и комментарии без перезагрузки страницы. Смотреть — это не писать в ответ, не ставить оценки комментариям, а просто смотреть. Если захотим прокомментировать, то у нас нет API Хабра, которое позволило бы отправить комментарий. Придётся открыть статью в новом окне, найти тот же комментарий и ответить на него. Неудобно. Но есть механизм контекстного цитирования и ответа на цитату, который до сих пор работал для комментариев в одиночной статье, но не в подгруженной статье в ленте. А также — он работал везде (в подгруженных и одиночных статях) для написания писем (личных сообщений) через Хабр.

Почему бы не использовать механизм, аналогичный написанию писем? Открыть статью в фрейме или новом окне, если делаем ответ с цитатой в подгруженной статье.

Как работает ответ в почту (ЛС) через цитирование?

1) выделяем текст в статье или в комментарии к ней;
Комментирование с цитатой в 1 клик в подгруженных статьях
      1.1) можно что-то написать в ответ прямо в контексте цитаты;
Комментирование с цитатой в 1 клик в подгруженных статьях
2) выбираем кнопку «Письмо» или «Автору» — открывается фрейм, а если нажата Ctrl — то новое окно (вкладка);
3) если было «Автору», то уточняем имя автора в странице выбора авторов; если выделено было короткое имя с латинницей, то, возможно, выбрали имя автора — оно появляется в поле выбора автора как подсказка (если выбрали «Письмо» — открывается сразу письмо автору статьи или комментатору);
4) в поле письма появляются вспомогательные тексты: тема (название статьи и дата), цитата (с автором и датой), набранный контекстный ответ (по пункту 1.1), ссылка на статью и комментарий (или только на статью);

Комментирование с цитатой в 1 клик в подгруженных статьях

Если посмотреть в предпросмотре, то заготовка письма будет выглядеть так:
Комментирование с цитатой в 1 клик в подгруженных статьях
Далее, дописываем или редактируем письмо и отправляем его (или не отправляем).

И вот, в дополнение к механизму написания писем, при отсутствии API отправки комментария, используем с похожими правилами…

Механизм отправки комментария через фрейм

1) выделяем текст в статье (вопросе) или в комментарии к ней;
      1.1) можно что-то написать в ответ прямо в контексте цитаты;
2) выбираем кнопку «Ответ»…

Комментирование с цитатой в 1 клик в подгруженных статьях

Если мы — не в одиночной статье, а в ленте, в фрейме наблюдаем поле ответа, в которое подгружена выбранная цитата. Как видно, ответ происходит на тот самый комментарий, цитату из которого выбрали. Появляется одиночная статья в фрейме, уже подкрученная к комментарию тем, что в поле ввода под ним заносится цитата с фокусом текстового ввода на последней позиции.

Далее — дописываем комментарий. Проверяем, что аналогично ещё не ответили в соседних новых комментариях, и отправляем или не отправляем набранное. В отличие от письма, в ответе не требуется писать ссылки, потому что ответ, очевидно, выполняется в контексте — пишется только цитата.

Небольшой лайфхак: если хотим ответить, но не цитировать, надо выделить 1 символ комментария или статьи, не считая крайних пробелов. Скрипт обрежет пробелы, сосчитает символы и решит, что цитат с 1 символом не существует, и не выведет цитату.

Второй лайфхак: если хотим поставить оценку комментарию, перейти к комментарию можно в фрейме, показав скрипту намерение ввести цитату. Но вместо этого не вводим комментарий, а ставим оценку в фрейме обычным способом, нажав на кнопку-стрелку.

Опять же, хак с оцениванием — это следствие отсутствия API ввода оценки комментарию на сайте. Когда и если оно появится, ввод комментариев и оценок будет возможен более изящным и естественным образом — простым нажатием контекстной кнопки «Ответ», простым нажатием стрелки оценки.

Подробнее о контестном цитировании, но исключительно в текстовом формате, было описано здесь.

Автор: spmbt

Источник

* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js