Единый форум поддержки

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Единый форум поддержки » Архив » Ветки комментариев


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

Сообщений 1 страница 20 из 40

1

Ещё один набросок. Он позволит строить ветки комментариев. вроде нуждается в доработке
Для того, чтобы начать или продолжить ветку, пользователь должен будет указать в начале своего поста id того поста, к которому хочет обратиться в таком виде:
>100500
Перенос строки в данном случае важен, как и нахождение номера в начале сообщния.
Указание своего или несуществующего номера ничего не даст. Номер поста везде заменяется.
Сделал, ибо привык к друпальным веточкам ><
Проблему вижу одну: переход между страницами. Если пользователь начал новую и обращается к посту на предыдущей - ожидаемого сдвига не будет.
Также скрипт потребует поправок в стиле, касательно нижней границы поста.
Номера постов заменятся на ссылки, отправляющие в форму ответа id поста.

Стиль

Код:
<style>
.post {border-bottom: none 0px transparent !important;}
.ment {margin-left: 4%; margin-top: .3em;}
.ment .pa-reg, .ment .pa-posts, .ment .pa-respect, .ment .pa-positive, .ment .pa-fld1, .ment .pa-ip, .ment .pa-time-visit, .ment .pa-title, .ment .post-sig, .ment .pa-online {display:none;}
.ment .pa-avatar img {max-width: 10em; max-height:6em; width:auto; height:auto;}
.ment, .post {min-width: 46em;}
</style>

Скрипт вниз

Код:
<script type="text/javascript">
post = document.getElementsByClassName('post-content')
f = -1
while (post[++f]) {
xnumb = post[f].firstElementChild.firstChild.length - 3
pnum = post[f].firstElementChild.firstChild.textContent.substr(2, xnumb)
pnum = "p"+pnum
if (ppost = document.getElementById(pnum)) {
tpost = post[f].parentNode.parentNode.parentNode.parentNode
idp = tpost.id
if (idp !== ppost.id && post[f].firstElementChild.firstChild.textContent.substr(0, 2) == "[>" && post[f].firstElementChild.firstChild.textContent.substr(post[f].firstElementChild.firstChild.length - 1) == "]") {
post[f].firstElementChild.firstChild.textContent = ''
post[f].firstElementChild.removeChild(post[f].firstElementChild.firstElementChild)
htp = tpost.innerHTML
tpost.parentNode.removeChild(tpost)
document.getElementById(pnum).innerHTML += '<div id="'+idp+'" class="ment">'+htp+'</div>'
}
}
}
if (GroupID !== 3) {
plinks = document.getElementsByClassName('post-links')
f = -1
while (plinks[++f]) {plinks[f].firstElementChild.innerHTML += '<li><a href="#post-form" title="Оставить комментарий к этому посту"onclick="insert(\'[>'+plinks[f].parentNode.parentNode.id.substr(1)+']\');obje=this; nowanswer();">Комментировать</a></li>'
}
}
</script>

Пробник с примером

Отредактировано Kven (Сб, 8 Янв 2011 16:33:37)

+2

2

Kven написал(а):

Ещё один набросок. Он позволит строить ветки комментариев.

Интересно... :)  А как далеко сообщения могут сдвигаться вправо?
При развитии ветви дискуссии страница станет шире границ монитора, и её придётся прокручивать влево-вправо?

0

3

Kven написал(а):

.post .post {margin-left: 5%;}

это что за двойной класс такой?

0

4

Паутина написал(а):

Интересно... :)  А как далеко сообщения могут сдвигаться вправо?
При развитии ветви дискуссии страница станет шире границ монитора, и её придётся прокручивать влево-вправо?

для того, чтоб избежать нагромождения
я бы вам Kven рекомендовал,
сделать так, чтоб у того кто комментирует, исчезали бы лишние ссылки в профиле под аватаром, а сам аватар в комментариях автоматически становился бы на 50% меньше, тогда бы всё получилось бы гораздо красивее и нагляднее,
ведь пост растягивается в высоту за счёт множества ссылок в профиле под аватаром

короче у комментирующего в его комментарии должно быть так

<style>
.pa-reg, .pa-posts, .pa-respect, .pa-positive, .pa-fld1, .pa-ip, .pa-time-visit {display:none;}
li.pa-avatar img {width:40px; height:40px;}
</style>

Отредактировано Romych (Ср, 5 Янв 2011 20:59:43)

0

5

Romych написал(а):

это что за двойной класс такой?

Эм.. ну, на самом деле скрипт вставляет пост в пост, не меняя класса, т.е. стиль будет обращаться только к тем постам, которые находятся в других.
таким образом .post .post будет обращаться к любому, находящемуся в ветке.

Romych написал(а):

короче у комментирующего в его комментарии должно быть так

Стиль изменил.

Паутина написал(а):

Интересно...   А как далеко сообщения могут сдвигаться вправо?

Как видно на примере - они не сдвигаются, а сжимается блок для них. Это случается благодаря отступу в ветке.
У меня он стоит процентным, как видите:

Код:
.post .post {margin-left: 5%;}

так что сообщения в ветке, например, девятнадцатаго уровня уже будут нечитаемыми ><
Вы можете поставить вполне конкретную велечину в пикселях. Скажем, 15px или 25px, тогда всё будет зависеть только от разрешения экрана пользователя.

0

6

Kven, всё поняла, спасибо за пояснение. http://mybb.ru/f/collection/0211.gif

Отредактировано Паутина (Ср, 5 Янв 2011 21:05:58)

0

7

Kven написал(а):

Стиль изменил.

так намного интереснее смотрится

можно думаю и .pa-title убрать, оставить только имя и уменьшенную аву, а её можно смело ещё пикселей на 10 по длине и ширине уменьшать

0

8

Romych написал(а):

так намного интереснее смотрится
можно думаю и .pa-title убрать, оставить только имя и уменьшенную аву, а её можно смело ещё пикселей на 10 по длине и ширине уменьшать

Спасибо за советы=)
Стиль получился довольно громоздкий, но он должен учесть особенности любого дизайна.
За исключением, пожалуй, тех, где аватары перенесены направо :3

0

9

Kven написал(а):

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

а всё потому, что ты намудрил с классами

достаточно только присвоить другой класс у тебя в скрипте, вместо уже зарезервированного post

например

document.getElementById(pnum).innerHTML += '<div id="'+idp+'" class="ment">'+htp+'</div>'

тогда и стиль получится короче

<style>
.ment {margin-left: 4%;}
.ment .pa-reg, .ment .pa-posts, .ment .pa-respect, .ment .pa-positive, .ment .pa-fld1, .ment .pa-ip, .ment .pa-time-visit, .ment .pa-title, .ment .post-sig, .ment .pa-online {display:none;}
.ment .pa-avatar img {max-width: 10em; max-height:6em; width:auto; height:auto;}
</style>

кстати и подпись у комментирующего лучше скрыть - .post-sig (в примере с классом .ment она скрыта)

+1

10

Romych написал(а):

намудрил с классами

Была необоснованная боязнь потери стиля для поста. Не учёл того, что стиль будет соблюдаться при вкладывании. И не проверил. ><"
Правда с введением класса .ment придётся немного добавить в скрипт, чтобы и для этого класса появилась ссылочка с номером..
Ещё раз поправил. Спасибо.

0

11

Переношу, скрипт интересен )
как на счет скрывать эту первую строку?
ах да, в стиле неплохо бы поставить минимальный размер блока поста
черт, и кнопки ответить нет, которая либо поставила форму ответа под нужным комментарием и в какой-нибудь момент времени добавила туда строку >ID_поста либо в форму быстрого ответа добавила эту же строку

0

12

Kven
доработать кстати, не сложно твой скрипт,
только ты приведи код для комментария от такого вида >257 к такому [>257]
так будет правильнее с ним совершать потом манипуляции и избавишься от случайного срабатывания,
так же неплохо бы добавить надпись Комментировать, чтоб пользователь знал об чём речь и для чего это?
так же пригодится title в ссылке, чтоб при наведении курсора выдавал поясняющую инфу

получится примерно так

psto[f].firstElementChild.firstElementChild.firstElementChild.innerHTML = '<a href="#post-form" title="Оставить комментарий к посту"onclick="bbcode(\'[>'+psto[f].id.substr(1)+']\', \'\');return false">Комментировать&nbsp;'+psto[f].id.substr(1)+'</a>'

только, чтоб корректно отображалось в стиль придётся добавить

.punbb .post h3 strong {width: 15em;}

0

13

Romych

psto[f].firstElementChild.firstElementChild.firstElementChild.innerHTML = '<a href="#post-form" title="Оставить комментарий к посту"onclick="insert(\'[>'+psto[f].id.substr(1)+']\');return false">Комментировать&nbsp;'+psto[f].id.substr(1)+'</a>'

ну и мне кажется, что лучше вставить около ссылок Редактировать, Цитировать

0

14

mkusher написал(а):

как на счет скрывать эту первую строку?

Готово.

mkusher написал(а):

черт, и кнопки ответить нет, которая либо поставила форму ответа под нужным комментарием и в какой-нибудь момент времени добавила туда строку >ID_поста либо в форму быстрого ответа добавила эту же строку

Наверное не так понял.. Сейчас на пробнике оба скрипта: переносящий форму ответа и для веток.
порядок скриптов внизу никак не повлиял на работоспособность. Плюс, если установлены функции переноса формы ответа, кнопочка "Комментировать" также её перенесёт, добавив нужный [>100500] id. Даже под посты в ветках.

Romych написал(а):

только ты приведи код для комментария от такого вида >257 к такому [>257]

Сделано. Спасибо =)

mkusher написал(а):

ах да, в стиле неплохо бы поставить минимальный размер блока поста

Тогда некоторые посты n-цатых веток могут полезть нафик из топика) Сделал)

0

15

Попробовал, - (*в Опере пока у меня не сработало

Отредактировано Deff (Сб, 8 Янв 2011 00:43:41)

0

16

Kven написал(а):

Наверное не так понял.. Сейчас на пробнике оба скрипта: переносящий форму ответа и для веток.
порядок скриптов внизу никак не повлиял на работоспособность. Плюс, если установлены функции переноса формы ответа, кнопочка "Комментировать" также её перенесёт, добавив нужный [>100500] id. Даже под посты в ветках.

я поставил скрипт отсюда и не получил нужной кнопки, вот)

0

17

mkusher написал(а):

я поставил скрипт отсюда и не получил нужной кнопки, вот)

мозиллка, хром и опера стабильно показывают всем, кроме гостей. Ещё в ИЕ гляну.
А так.. Даже на данном форуме мне всё кажет.
она, кстати, справа от кнопки "Цитировать" должна быть .. :unsure:

Отредактировано Kven (Сб, 8 Янв 2011 01:16:16)

0

18

Kven
точно, старый скриптс тоял =)

0

19

Kven У меня кнопки были ( когда отписывался) - не было эффекта преобразования кода в сообщении в эффекты комментария

0

20

[>646566]
Deff,
Всё теперь работает. Бес попутал  :D

Отредактировано Kven (Сб, 8 Янв 2011 02:29:30)

0


Вы здесь » Единый форум поддержки » Архив » Ветки комментариев