Некорректная обработка тега [img] при добавлении alt

[Roman]

В SMF 2.0, при добавлении тега alt внутрь [ img ], картинка почему-то получает class="bbc_img resized", что вызывает изменение курсора в вид "рука" (он же pointer), как при наведении на картинку с измененным размером, или на ссылку.

Вот пример: (наведите мышку)

Код вставки этой картинки выглядит так:

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

[img alt=Яндекс]http://img.yandex.net/i/www/logo.png[/img]

Вопрос: Что нужно исправить в Subs.php, чтобы при использовании [ img ] вместе с тегом alt, для таких картинок прописывался обычный class="bbc_img", как это происходит для картинок без alt, не требующих ресайза?


p.s. понимаю, что почти никто из пользователей тегом alt не пользуется. Однако, сам размещаю картинки, обычно предварительно загрузив их на сервер, и почти всегда прописывая alt.

[Roman]

Вижу в Subs.php такой код, но что нужно поменять, пока еще не разобрался:

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

array(
'tag' => 'img',
'type' => 'unparsed_content',
'parameters' => array(
'alt' => array('optional' => true),
'width' => array('optional' => true, 'value' => ' width="$1"', 'match' => '(\d+)'),
'height' => array('optional' => true, 'value' => ' height="$1"', 'match' => '(\d+)'),
),
'content' => '<img src="$1" alt="{alt}"{width}{height} class="bbc_img resized" />',
'validate' => create_function('&$tag, &$data, $disabled', '
$data = strtr($data, array(\'<br />\' => \'\'));
if (strpos($data, \'http://\') !== 0 && strpos($data, \'https://\') !== 0)
$data = \'http://\' . $data;
'),
'disabled_content' => '($1)',
),
array(
'tag' => 'img',
'type' => 'unparsed_content',
'content' => '<img src="$1" alt="" class="bbc_img" />',
'validate' => create_function('&$tag, &$data, $disabled', '
$data = strtr($data, array(\'<br />\' => \'\'));
if (strpos($data, \'http://\') !== 0 && strpos($data, \'https://\') !== 0)
$data = \'http://\' . $data;
'),
'disabled_content' => '($1)',
),
Непонятно, какой логикой пользовались разработчики, что при наличии у картинки только alt, она получает class="bbc_img resized".

[Roman]

Преобразовал приведенный выше код таким образом:

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

array(
'tag' => 'img',
'type' => 'unparsed_content',
'parameters' => array(
'alt' => array('optional' => false),
),
'content' => '<img src="$1" alt="{alt}" class="bbc_img" />',
'validate' => create_function('&$tag, &$data, $disabled', '
$data = strtr($data, array(\'<br />\' => \'\'));
if (strpos($data, \'http://\') !== 0 && strpos($data, \'https://\') !== 0)
$data = \'http://\' . $data;
'),
'disabled_content' => '($1)',
),
array(
'tag' => 'img',
'type' => 'unparsed_content',
'parameters' => array(
'alt' => array('optional' => true),
'width' => array('optional' => true, 'value' => ' width="$1"', 'match' => '(\d+)'),
'height' => array('optional' => true, 'value' => ' height="$1"', 'match' => '(\d+)'),
),
'content' => '<img src="$1" alt="{alt}"{width}{height} class="bbc_img resized" />',
'validate' => create_function('&$tag, &$data, $disabled', '
$data = strtr($data, array(\'<br />\' => \'\'));
if (strpos($data, \'http://\') !== 0 && strpos($data, \'https://\') !== 0)
$data = \'http://\' . $data;
'),
'disabled_content' => '($1)',
),
array(
'tag' => 'img',
'type' => 'unparsed_content',
'content' => '<img src="$1" alt="" class="bbc_img" />',
'validate' => create_function('&$tag, &$data, $disabled', '
$data = strtr($data, array(\'<br />\' => \'\'));
if (strpos($data, \'http://\') !== 0 && strpos($data, \'https://\') !== 0)
$data = \'http://\' . $data;
'),
'disabled_content' => '($1)',
),
То есть, теперь вместо двух "циклов" обработки тега img, их стало три штуки.

Попробовал в действии. Картинки, вроде, работают как нужно.
Однако, все таки, просьба к тем, кто в этом лучше разбирается, сказать, корректно ли такое изменение кода? Или можно сделать каким-то более оптимальным способом? Немного смущает, что потребовалось ввести еще один "проход". Не индийское ли это решение проблемы?))

[Bugo]

Дались вам эти опыты. Всё равно класс "resized" в index.css не прописан. Или у вас по-другому?

[Roman]

У меня большое количество картинок размещено с тегом alt (что вобщем-то, неплохо, с точки зрения получения небольшого количества посетителей с яндекс.картинок и поиска по картинкам гугл).
И после перехода с 1.1.14 на 2.0, вылез вот этот нюанс. При наведении на картинку, по клику на которую ничего не происходит, курсор становится активным. Что сбивает с толку.

Тема дефолтная.
Свойства класса "resized" задаются из файла theme.js, вот таким образом:
(ушло некоторое количество времени на то, чтобы обнаружить это:)

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

// Toggles the element height and width styles of an image.
function smc_toggleImageDimensions()
{
var oImages = document.getElementsByTagName('IMG');
for (oImage in oImages)
{
// Not a resized image? Skip it.
if (oImages[oImage].className == undefined || oImages[oImage].className.indexOf('bbc_img resized') == -1)
continue;

oImages[oImage].style.cursor = 'pointer';
oImages[oImage].onclick = function() {
this.style.width = this.style.height = this.style.width == 'auto' ? null : 'auto';
};
}
}
Но сам класс задается в Subs.php.
Можно конечно, убрать его совсем, так как в моем случае, картинок, которые ресайзятся, довольно мало. Но хотелось бы универсальное решение.
Код из предыдущего сообщения вполне работает. Но требуется выяснить, насколько он корректен:)
По аналогии с тем, что там было изначально, мне кажется, что все нормально.

[GeorG]

Если нет ошибок в логах и код работает как надо (вам), то уже тогда он корректен. Другое дело, что например можно найти и другой подход, чтобы добиться того же самого эффекта. И этот подход, не шанс что будет более удачным.

[Roman]

Ошибок нет, все работает как нужно.
Тоже склоняюсь к мнению, что вариант корректный.

Если вкратце, по умолчанию там последовательно были заданы такие условия:

- если тег img имеет 1-3 параметра (alt, width, height) -> присваивается класс "bbc_img resized"
- если тег img без параметров -> присваивается класс "bbc_img"

Я добавил еще одно условие впереди, оставив два последующих без изменения:

- если тег img с обязательным параметром alt -> присваивается класс "bbc_img"
- если тег img имеет 1-3 параметра (alt, width, height) -> присваивается класс "bbc_img resized"
- если тег img без параметров -> присваивается класс "bbc_img"

Картинка с прописанным alt без других параметров, формально удовлетворяет и первому, и второму условию. Но выполняется только первое. Вот корректность этого подхода, меня слегка и смущает. Потому как не на 100% разбираюсь в этом коде.

[GeorG]

Допустим если взять скриншот размером 800x600 и поработать с тем кодом что вы состряпали.
Например, выставить отображаемую ширину скриншота 400 (например width=400), и одновременно с этим задать параметр alt равный - "Скриншот" (например alt=Скриншот width=400) то размер скриншота не измениться, а если просто задать параметр img как width=400 без параметра alt то все сработает, и скрин появится заданного значения/размера.
При правильном коде, размер должен меняться не смотря на добавления параметра alt , если уже есть - width или height.

Т.е., ваш работает некорректно с заданными значениями ширины и длины изображения и при клике на него, не сработает.

[Roman]

Да, любопытно.
При тестировании задавал alt+height, и в этом случае все срабатывает.
А alt+width не проверял, думал, будет по аналогии. Но действительно - не работает.
Получается какая-то странная логика - alt+height по первому условию не проходит. А alt+width почему-то проходит, хотя ни height, ни width там не задано в массиве. Видимо, width задается где-то еще.

Спасибо, буду думать, как исправить.

[Roman]

С учетом того, что картинка с параметрами alt и width непонятным образом проходит по первому условию, преобразовал его так:

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

array(
'tag' => 'img',
'type' => 'unparsed_content',
'parameters' => array(
'alt' => array('optional' => false),
'width' => array('optional' => true, 'value' => ' width="$1"', 'match' => '(\d+)'),
),
'content' => '<img src="$1" alt="{alt}"{width} class="bbc_img" />',
'validate' => create_function('&$tag, &$data, $disabled', '
$data = strtr($data, array(\'<br />\' => \'\'));
if (strpos($data, \'http://\') !== 0 && strpos($data, \'https://\') !== 0)
$data = \'http://\' . $data;
'),
'disabled_content' => '($1)',
),
Остальные два без изменений.
Это не устраняет полностью странную обработку alt + width, но по крайней мере, в таком виде, изменяется размер картинки в соответствии с заданным width.

То есть, в результате имеем:

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


[img width=50 height=50 alt=Яндекс]http://img.yandex.net/i/www/logo.png[/img] - Ok

[img height=50 alt=Яндекс]http://img.yandex.net/i/www/logo.png[/img] - Ok

[img width=50 alt=Яндекс]http://img.yandex.net/i/www/logo.png[/img] - картинка отображается с указанным размером, не не изменяется при клике. То есть, ей присваивается класс "bbc_img".

[img width=50 height=50]http://img.yandex.net/i/www/logo.png[/img] - Ok

[img height=50]http://img.yandex.net/i/www/logo.png[/img] - Ok

[img width=50]http://img.yandex.net/i/www/logo.png[/img] - Ok

[img alt=Яндекс]http://img.yandex.net/i/www/logo.png[/img] - Ok

[img]http://img.yandex.net/i/www/logo.png[/img] - Ok


В таком виде лично для меня вполне приемлемо. Комбинация alt+width встречается крайне редко. Да и невозможность автоматического ресайза не слишком критична.
Но все же, буду рад, если кто-то подскажет, как прописать условия, чтобы во всех случаях без исключения происходило корректное присвоение класса.