Проблема с изменением размера (растягиванием) расширенной формы ответа. В Chrome

[Roman]

Проблема: в браузере гугл-хром (Google Chrome) не работает функция изменения размеров окна ввода текста в расширенной форме ответа. Тема дефолтная. Собственно, это точно так же не работает и здесь, на simplemachines.ru.

Тут конечно, можно сказать, что проблема несущественна, так как в самом Хроме по умолчанию есть функция растягивания окон ввода. И это действительно так. Но в то же время, хочется, чтобы и стандартная функция SMF работала, так как визуально она все равно присутствует)
К тому же, на версии 1.1.14, где для этих же целей стоит мод digger-а TextareaResizer, все прекрасно работает во всех браузерах, и в гугл-хроме в том числе.

Вопрос. Что и как нужно отредактировать в editor.js, чтобы функция нормально работала в Хроме?

Хромом по моей статистике, пользуется около 19% пользователей. Общая статистика, отличается, полагаю, незначительно. Так что, думаю, решение данной проблемы пригодилось бы многим.

[Roman]

Итак, решение оказалось простым до безобразия.

Идем в editor.js, находим там строку:

// Show the resizer.

if (document.getElementById(this.opt.sUniqueId + '_resizer') && (!is_opera || is_opera95up) && !(is_chrome && !this.bRichTextEnabled))

и меняем ее на

// Show the resizer.

if (document.getElementById(this.opt.sUniqueId + '_resizer') && (!is_opera || is_opera95up))


После этого, ресайз формы ответа начинает вполне хорошо* работать в Хроме. И в других браузерах вроде, не перестает:)
То есть, как я понял, для Хрома с какой-то целью, функция ресайза специально была сделана неактивной.
Там еще есть строчка про какую-то Оперу. Но в Опере 11.51 у меня лично все работает. Возможно, не функционирует в каких-то более старых версиях, и если так, то очевидно, нужно снести строчки и про оперу.


После решения первого, теперь возник второй вопрос)
Как можно прикрутить этот стандартный ресайз к форме быстрого ответа?
Точнее, с самой формой ответа понятно - нужно всего лишь добавить к ней <div id="message_resizer" class="richedit_resize"></div>, а вот какая часть скрипта для этого нужна?
Подгружать для этого на обычные страницы топика огромный editor.js, весом 53 килобайта, мне кажется не совсем логичным. Но в то же время, не совсем понятно, что из него можно вырезать, чтобы для страниц подгружать более компактный файл, так как, все функции из editor.js там явно не нужны. Или, за счет кэширования это не имеет значения? И скорость работы не замедлится, если подгружать к страницам полный скрипт?


*в режиме обычного текста работает отлично, а при переключении в wysiwyg режим, есть небольшие сложности с уменьшением размера, но растягивается при этом нормально.

[BIOHAZARD]

ответ обычно доступен только зарегистрированным = постоянным посетителям у которых скрипт будет просто валяться в кэше

[Roman]

Вобщем, пробовал, пробовал, но почему-то, через стандартный скрипт, форма быстрого ответа у меня не захотела становиться растягивающейся. Так и не нашел причину, в чем дело. На дальнейшие эксперименты терпения не хватило, поэтому решил реализовать это через скрипт от мода TextareaResizer.

На случай, если вдруг кому-то это пригодится, путь будет такой мануал:)

Как сделать растягивающуюся форму быстрого ответа

1. Берем файл textareaResizer.js из упомянутого выше мода (http://custom.simplemachines.org/mods/index.php?mod=1979), и кладем его в папку \Themes\default\scripts\

2. Идем в index.template.php и находим там:

Код Выделить Развернуть

var ajax_notification_cancel_text = "', $txt['modify_cancel'], '";
// ]]></script>';
Сразу после этого вставляем:

Код Выделить Развернуть

if ($context['user']['is_logged'])
echo '
<script language="JavaScript" type="text/javascript" src="', $settings['default_theme_url'], '/scripts/textareaResizer.js"></script>';
Таким образом мы добавляем загрузку скрипта ресайзера к страницам. С условием, что он грузится только для залогиненных пользователей.

3. Открываем Display.template.php, находим там:

Код Выделить Развернуть


<div class="quickReplyContent">
<textarea cols="600" rows="7" name="message" tabindex="', $context['tabindex']++, '"></textarea>
</div>

и заменяем на:

Код Выделить Развернуть

<div class="text_editor">
<textarea id="quickReplyContent" cols="600" rows="7" name="message" tabindex="', $context['tabindex']++, '"></textarea><div id="quickReplyContent_resizer" onmousedown="textareaResizer(event);">&nbsp;</div>
</div>

4. Открываем index.css, и:
а)  находим там:

Код Выделить Развернуть


#quickReplyOptions form textarea
{
height: 100px;
width: 635px;
max-width: 100%;
min-width: 100%;
margin: 0.25em 0 1em 0;
}

и заменяем на:

Код Выделить Развернуть


#quickReplyOptions form textarea
{
height: 100px;
width: 635px;
max-width: 100%;
min-width: 100%;
margin: 0.25em 0 0 0;
}


б) в конце файла добавляем:

Код Выделить Развернуть


/* TextareaResizer */
div.text_editor div {
height: 5px;
font-size: 0;
background: #eee url(../images/bbc/resize-handle.gif) no-repeat 50% 1px;
border: 1px solid #DDD;
border-top-width: 0;
cursor: s-resize;
width: 100%;
padding: 0 2px;
margin: 0 0 9px 0;
}


Готово:)

[jek_recluse]

Итак, решение оказалось простым до безобразия.Идем в editor.js, находим там строку:
...

У меня такая же проблема на SMF 2.0 RC2, в Opera 11.62. Предложенное для Хрома решение для расширенной формы не сработало для Оперы новых версий (делал как написано). Заметил, что здесь на форуме эта проблема также существует (поле не растягивается, хотя стрелка двойная и появляется).

На данный момент в Мозиле и в ИЕ растягивание работает нормально. Хром как и описано здесь отделался собственным растягивателем. А вот Опера не справилась.

Честно говоря, опасался, что дело в моих кривых руках (химичил с шаблонами на днях). А дело похоже даже не в движке форума. Как вижу, эта проблема у Оперы есть и с SMF 2.0.2...

[Roman]

Да, есть такая проблема с новыми версиями Оперы.
http://www.simplemachines.org/community/index.php?topic=482066.0 (Там предлагается вообще скрыть этот ресайз-бар, и юзать стандартный браузерный, который в правом нижнем углу поля ввода)