[WT] [Архив]  [Поиск] Главная Управление
[Совместно с Ычаном]
[Назад] [Вся нить] [Первые 100 сообщений] [Последние 50 сообщений]
Ответ в нить [Первые 100 сообщений]
Имя
Animapcha image [@] [?]
Тема   ( ответ в 17371)
Сообщение flower
Файл 
Пароль  (для удаления файлов и сообщений)
Параметры   
  • Прежде чем постить, ознакомьтесь с правилами.
  • Поддерживаются файлы типов 7Z, BZ, BZ2, GIF, GZ, JPG, MO, MP3, OGG, PDF, PNG, PSD, RAR, SVG, SWF, TXT, XCF, ZIP размером до 5000 кБ.
  • Ныне 3108 unique user posts. Посмотреть каталог
  • Максимальное количество бампов нити: 500
  • ">
150682259759.jpg-(84.21KB, 960×720, 1258163340905.jpg)
17371
No. 17371 watch    
Давайте попробуем, что ли.

JS у нас по-прежнему ковырять некому, но хотелось бы доработать местную функцию разворота картинок. Сейчас она просто разворачивает изображение целиком без учёта размера окна браузера. Соответственно, требуется доработать её так, чтобы ширина окна учитывалась.
Скрипт лежит в http://410chan.org/lib/javascript/kusaba.js

Да, я в курсе, что все привыкли к тому, что для разворота надо нажимать на картинку, а не ссылку над ней (как у нас сейчас). Если скрипт научится учитывать ширину окна, это можно будет переделать.
Развернуть все изображения
No. 17373    
Если что, то искомая функция называется function expandimg(I, H, F, C, G, E, A)

>>17371
Одним из самых простых вариантов будет просто добавить аттрибут maxWidth, используя один из существующих элементов для референса. Например, в своём предложении для ычана, я брал текущую ширину первого поста, и работал от неё:


function iithumbresolvemaxwidth() {
  //Это будет первый пост, и на бордах он обычно по полной доступной ширине
  var referenceelement = document.getElementsByTagName('blockquote')[0];
  //Если мы первый пост нашли, то забираем его ширину
  //Ноль возвращается, чтобы можно было определить, удачно мы разрезолвили ширину, или нет.
  var resolvedmaxwidth = referenceelement ? referenceelement.clientWidth : 0;
  return resolvedmaxwidth;
}

Если подобное решение подходит, могу встроить его в наши текущие скрипты.

Хотя, конечно, у нас сейчас движок все параметры большой картинки забивает железно на этапе генерации страницы (именно поэтому у функции такая сигнатура) и поверх этого maxWidth еще делать это кайнда война скриптов.
No. 17374    
>>17371
Впрочем, если мы хотим открывать картинку по нажатию на тумбнейл, то мы вообще можем просто применить к себе скрипт-победитель для ычана, т.к. там они почти полностю автономные, а на нажатие на картинку у нас сейчас ничего не висит.
No. 17375    
15068881657.zip-(666.57KB, 410chan_expand_images.zip)
17375
>>17371
Адаптировал вам скрипт с ычана хоть мне и не очень нравится как он сделан, и добавил пример на базе текущего /dev/. Разворот делается по нажатию на картинку, события онклик со ссылок убрал. Скрипт соответствует всем тем же требованиям, что и для ычана, внутри полная и минифицированная версии см. папку extras

Оригинал скрипта для ычана был тут: https://github.com/WagonOfDoubt/iichan-extensions/blob/master/dist/iichan-expand-images.js
No. 17376    
150688942849.jpg-(276.46KB, 500×752, 7200283.jpg)
17376
>>17375
А вы учли, что есть ещё кнопка «Развернуть все изображения», которая появляется в нитях, где много картинок?
No. 17377    
>>17376
Честно говоря, я как-то не замечал её. Сейчас посмотрю как там всё устроено.
No. 17379    
150696121437.zip-(1.36MB, 410chan_expand_images_expand_all_min.zip)
17379
>>17371
>>17376

Вот версия с поддержкой кнопки «Развернуть все изображения», которая разворачивает / сворачивает их. Чтобы кнопка работала, ей нужно дать аттрибут id, соответствующий указанному в константе в скрипте. И убрать у неё её стандартный аттрибут onclick

В примере нить Caturday в /b/
В архиве обычная и минифицированная версии
Предыдушие проблемы с минификацией были связаны с тем, что я дурак и не заметил, что изначальный скрипт - часть проекта в котором уже все таски уже настроены, включая минификацию и эскейпинг
No. 17381    
Что-то по-моему местная разворачивалка идеальная.
А вот в ычанской разворачивалке баг, иногда картинка налезает на текст.
No. 17382    
>>17381
>Сейчас она просто разворачивает изображение целиком без учёта размера окна браузера. Соответственно, требуется доработать её так, чтобы ширина окна учитывалась.

Там основная проблема в том что ширина и высота будущей картинки проставляются с сервера.

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

Алсо, если можешь воспроизвести баг разворачивалки с ычана, то напиши как это делать, т.е. на какой картинке в какой ситуации оно налезет на текст
No. 17383    
15070629558.png-(1.08MB, 1726×782, Screenshot_2017-10-03_23-31-47.png)
17383
>>17382
Похоже, только в хроме лисоюзеры, молчать.

1. Открываем хром(оперу|иум).
2. Задаем размер окна 868 x 531 (W x H)
3. Заходим в /a/ и нажимаем превьюху.
4. Налезает.

Заметил на мобильнике первый раз.
Может быть там float: left надо?
No. 17384    
>>17383
Возможно, что это еще и только в линуксе. Вижу, что тема уходит под изображение, а не наплывает сверху на него

Если просто раскрыть картинку и уменьшать окно, проблема себя проявит?
No. 17389    
150715120333.zip-(2.04MB, 410chan_expand_images_old.zip)
17389
>>17371
>>17382
Как и обещал, сделал дополнительно версию на базе текущей функции, с использованием трюка из >>17373 Это Ctrl+C Ctrl+V решение. Мне не хотелось устраивать войну скриптов, когда один скрипт проставляет ширину-высоту, а второй удаляет, поэтому я дополнительно раcчитываю макс высоту с учетом аспекта, и вроде все живы

В архиве пример на базе темы Persona 5 в /b/
No. 17393    
Может, такой вопрос лучше в /д, но здесь могут мимодевы объяснить или подтвердить проблему. У меня стабильно какая-то лабуда с посещением автобуса на ведре. Хожу по сайту, захожу в треды, всё ок. Через пару переходов загрузка страниц останавливается, и автобус намертво перестаёт грузиться без сообщений об ошибке. Надо ждать какое-то время. Примерно не скажу сколько, но долго, не несколько минут. Это опера на ведре. Такая проблема только с автобусом замечена. По той же сети на пеке всё хорошо.
No. 17398    
>>17393
Сжатие трафика (прокся) включена? С зарубежных ип замечал тоже такое, отваливается.
No. 17399    
>>17398
Интересная версия, но экономия трафика выключена. Посмотрю ещё из другого браузера и с другой сети.
No. 17405    
>>17398
На лисе на ведре попробовал, когда снова возникли проблемы на опере. То же самое. С временем мог преувеличить, за несколько минут все же проходит.
Проверяю на другой сети, вроде нет проблем.
No. 17407    
Сделал не копипасту с Ычана, но принцип тот же. Технологически и визуально отличий нет.
https://gist.github.com/WagonOfDoubt/84b3bb2182525e083359359170dfb0b6/revisions
См. дифф второй ревизии. В img_global.css добавлен класс .image-fullsize, в kusaba.js переписана только expandimg.
Никаких let, const, и прочей esNext-лабуды нет, оно конечно хорошо, но уж если перепиливать, так вообще все, сейчас хоть смотрится аутентично. Эх, запилить бы свою котобу с маджонгом и булочками.
Должно нормально работать начиная с Chrome 26, Firefox 16, Internet Explorer 10, Opera ?, Safari 7.
Фича не раскрывать на маленьких экранах убрана, так как работает по прежнему через onclick, и return false там перманентный. Какой бы ни было дикостью вешать onclick, этот способ требует наименьших изменений.
Для владельцев черно-белых нокий и прочих утюгов, можно обернуть тело функции expandimg в try...catch, впрочем все равно непонятно как у них остальные функции тогда не падают.
Вариант >>17373 меня не устраивает подходом. Масштабировать картинку по размеру страницы это прямая задача браузера, и проблема эта должна решаться и нормально сейчас решается средствами css, в то время как javascript отвечает за пользовательское взаимодействие, а не рассчитывает по формулам положение каждого элемента на странице. Раньше иного выхода не было, и приходилось делать именно так, но даже поддержка более старых браузеров для меня не перевешивает. К тому же, при таком варианте уже развернутые картинки не масштабируются при изменении размеров окна, в отличие от варианта как на Ычане.
No. 17408    
Кстати,
> <meta name="twitter:card" content="summary">
I see what you did there.
Мета должна быть в <head>, Твиттер все равно это парсит?
И да, разворот картинок нужно обязательно перенести на картинку, на ссылку пальцем попасть невозможно.
Еще есть один фичереквест, требующий мааленького изменения шаблона.
Если в ссылку на картинку
<a href="{$file_path}/src/{$post.file}.{$post.file_type}" onclick="javascript:expandimg('{$post.id}', '{$file_path}/src/{$post.file}.{$post.file_type}', '{$file_path}/thumb/{$post.file}s.{$post.file_type}', '{$post.image_w}', '{$post.image_h}', '{$post.thumb_w}', '{$post.thumb_h}');return false;">

Добавить
{if $post.file_original neq '' && $post.file_original neq $post.file}download="{$post.file_original}.{$post.file_type}"{/if}

Чтобы получилось
<a href="{$file_path}/src/{$post.file}.{$post.file_type}" onclick="javascript:expandimg('{$post.id}', '{$file_path}/src/{$post.file}.{$post.file_type}', '{$file_path}/thumb/{$post.file}s.{$post.file_type}', '{$post.image_w}', '{$post.image_h}', '{$post.thumb_w}', '{$post.thumb_h}');return false;" {if $post.file_original neq '' && $post.file_original neq $post.file}download="{$post.file_original}.{$post.file_type}"{/if}>

То картинки будут скачиваться на компьютер под тем же именем, под которым они заливались, и можно иметь buločka.jpg вместо 123456789.jpg
Более того, я бы отказался от отображения нумерованных имен файлов за ненадобностью, и заменил бы чуть дальше строку
{$post.file}.{$post.file_type}</a>

на
{if $post.file_original neq '' && $post.file_original neq $post.file}{$post.file_original}.{$post.file_type}{else}{$post.file}.{$post.file_type}{/if}</a>

Только эти ссылки скопипасщенны в нескольких местах, как винимум в img_thread.tpl и в img_board_page.tpl
No. 17409    
И в css не помешало бы добавить
.inline-pp, .prettyprint {

    white-space: pre-wrap;
}

No. 17410    
Понапридумывають хѣрню и головы ломають.
.thumb{max-width:100%;height:auto;box-sizing:border-box;margin:0;padding:2px 20px}

No. 17411    
Еще реквест: на странице треда есть группа ссылок
[Назад] [Вся нить] [Первые 100 сообщений] [Последние 50 сообщений]
, их не помешало бы обернуть в div, иначе стилями с ними ничего не сделаешь.
No. 17412    
150746210020.png-(599.22KB, 1158×645, 12345681.png)
17412
>>17408
>Мета должна быть в <head>, Твиттер все равно это парсит?
Я просто сунул туда, куда можно сунуть штатными средствами. «Твиттеру» всё равно. В принципе, надо будет это вообще убрать, оно в таком виде бесполезно.
>То картинки будут скачиваться на компьютер под тем же именем, под которым они заливались
Не нужно.
>как винимум в img_thread.tpl и в img_board_page.tpl
Которых у нас вообще в движке нет.

>>17409
Да, добавлю, когда буду ковырять CSS в следующий раз.
No. 17413    
150747249385.png-(189.01KB, 1349×631, nazad.png)
17413
>>17412
> Не нужно.
А жаль. Это хоть >>17411 можно сделать, а то некрасиво в body текст держать.
No. 17414    
150748862150.png-(8.22KB, 362×180, Untitled.png)
17414
Заодно поделайте что-нибудь со ссылкой «Назад» на форме треда, чтобы та на границу не наезжала.

Можно, например, в шаблоне вместо span с float сделать div с правым text-align.
No. 17415    
А ещё сделайте так, чтобы при наведении курсора на ссылку на пост был какой-то таймаут закрытия разворачивающегося по ссылке поста вместо моментального закрытия при выходе курсора за область ссылки на пост. Чтобы можно было просмотреть цепочку постов.
No. 17416    
Вот, кстати, более насущный фичреквест по поводу шаблонов страницы, болезнь всех ванильных бордодвижков: перенеси прикреплённые кортинки в ОП-постах под лейбл с именем, темой и прочей лабудой, как в обычных постах. Тогда и раскрытие оных будет более правильно выглядеть.
No. 17426    
150784341346.png-(586.80KB, 898×641, 12345697.png)
17426
По скриптам сроков у меня, разумеется, нет.

>>17409 добавил.
>>17414 ждёт своего часа в репозитории.
>>17411 про это я давно знаю, да. Когда-нибудь.
No. 17428    
>>17426
Видели эти версии скриптов?

Ычан-стайл >>17379
410-стайл >>17389
No. 17429    
>>17428
Вот это >>17410 решение самое простое. Никаких скриптов и работает отлично, нечего тут голову ломать.
No. 17434    
150792261956.jpg-(87.55KB, 422×600, c4d7c0338fa92352c6f9eef098fc8867e69df5fc.jpg)
17434
>>17428
Никто пока ничего не смотрел.

>>17429
И в чём его суть, если оно только вёрстку портит и больше ничего не даёт? По крайней мере, при вписывании в CSS всё именно так, возможно, я что-то не так делаю вдруг.
No. 17436    
>>17434
Не знаю, что оно портит, но у меня работает как и требовалось: картинки больше не вылезают за края постов. Результат тот же, что и в >>17407, но не требует правки скриптов. Остается только в шаблонах
onclick
перевесить со ссылки на картинку.
No. 17437    
>>17434
Отвечу ак автор: добавь в конце глобальной цссины или замени маргин на паддинг и добавь остальное. И ещё оно работает только там, где есть цсс3 (кроме Осла, вроде как, потому что они слоупоки и не принимают до конца стандарт). Суть в том, что бокс-сайзинг приказыает параметру ширины учитывать паддинг как часть самого элемента при подсчёте максимальной ширины, из-за чего 100% считается как максимальная ширина кортинки с отступом до полного ухода края поста к краю экрана, опять же с учётом отступов, а параметр высоты уже подстраивает высоту под оригинальные пропорции, чтоб искажений не было. “Сломать” оно могло только на браузерах без поддержки бокс-сайзинга “вываливанием” кортинки за границу поста на сорок пиксолей, которые берутся от отступов (по двадцать с каждой стороны), т.е. если в нормальных браузерах, допустим, 1000 пикселей — ширина кортинки+отступов, то в Осле и древних браузерах — только кортинки.
No. 17477    
Мнѣніе >>17437 вѣрно передаётъ смыслъ правила
box-sizing: border-box
и необходимость его.
No. 17518    
150860023842.jpg-(262.98KB, 563×800, 509b751a4e790f2d07bfc204876f3806e5a980f9.jpg)
17518
>>17414 сделано.

>>17437
Ок, гляну ещё раз, когда будем глядеть.
No. 17524    
По виду реплики >>17477 с неудовольствием вижу, что текст в обратных апострофах не только обёртывается в тег pre, но и попадает на отдельную строку.

Не надо так.
No. 17701    
>>17437

> И ещё оно работает только там, где есть цсс3 (кроме Осла, вроде как, потому что они слоупоки и не принимают до конца стандарт).

По-моему, нѣтъ.

Статья https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing в настоящее время гласит, что Осёл (ведь имелся в виду Internet Explorer, не правда ли?) понимает «box-sizing: border-box», начиная от версии IE8.

В таком случае в Internet Explorer, как сказано там дальше в MDN, фигово работает вычисление высоты функцией «window.getComputedStyle()»; но так как 410chan её вроде как и не использует вообще нигде, то и не пофигу ли?
No. 17702    
Имею пожелание о доработке интерфейса 410чана, и выскажу.

Сейчас в реплике >>17698 звукопроигрыватель выводится вот каким кодом:

<span style="float: left;">

<embed type="application/x-shockwave-flash" src="/player.swf?playerID=17698&amp;soundFile=/dev/src/151085654446.mp3" width="80" height="15" /></embed></span>


Во-первых, этот код внутренне противоречив, потому что при наличии закрывающего тега «embed» в конце открывающего тега «embed» не нужна косая черта. Кромѣ того, онъ противорѣчитъ и стандарту, въ которомъ¹ сказано, что у тега «embed» нѣтъ закрывающаго тега.

Во-вторых, всѣ современные браузеры достаточно давно (начиная от версий Chrome 3, Firefox 3.5, IE9, Opera 10.5, Safari 3.1, а также во всѣхъ версіяхъ Edge)² понимают тег HTML5 «audio» и отображают на его месте звукопроигрыватель, который внешне более красив, а в употреблении более удобен и функционально развит, чем флэшёвый звукопроигрыватель на 410чанѣ.

В то же время поддержка Flash на всѣхъ сколько-нибудь новых мобильных устройствах отсутствует на протяжении шести лет, будучи отозвана производителем Flash (компанией Adobe) по адресу http://blogs.adobe.com/conversations/2011/11/flash-focus.html 9 ноября 2011 года. Что же касается немобильных устройств, то у их пользователей Flash блокируется и некоторыми блокировщиками рекламы, и даже некоторыми браузерами, да притом ещё и глючит да тормозит.

Принимая вышеизложенное во внимание, прошу администрацию 410чана найти в исходном коде сайта 410чана генератор вышеизложенного кода и переменить его таким образом, чтобы вместо него создавался код звукопроигрывателя HTML5:

<audio style="float: left; margin: 0 1em 1em 0;" src="/dev/src/151085654446.mp3" controls preload="metadata"></audio>


(Единственная переменная часть этого кода — значение атрибута «src»: туда вписывается относительный URL конкретного звукового файла.)

Этакий-то звукопроигрыватель будет куда лучше нынешнего, в том я совершенно уверен и администрацию 410чана спешу заверить — по крайней мере, в случае файлов MP3.

Звукопроигрыватели HTML5 в настоящее время более всего способны воспроизводить MP3. Некоторые другие форматы звуковых файлов имеют³ с этим изрядные проблемы: Ogg Vorbis не слышно в IE и Edge и в Safari (и вообще на iOS), FLAC опережает Ogg Vorbis только в Edge, AAC не слышно в Firefox (если не внутри контейнера MP4, а это изврат), Opus не слышно в IE и во встроенном браузере системы Android.

Будущее принадлежит Opus по мере погибели IE и обновления встроенного браузера в системе Android.

__________

¹ См. https://www.w3.org/TR/html5/embedded-content-0.html#the-embed-element

² Свѣдѣнія о браузерной поддержкѣ audio взяты со страницы https://developer.mozilla.org/en-US/docs/Web/HTML/Element/audio#Browser_compatibility въ MDN.

³ Списокъ проблемъ взятъ на страницѣ https://caniuse.com/#search=audio
No. 17704    
>>17702
Тут история с
alert(req.statusText);
длилась годами: просили закомментировать одну единственную строчку, так она до сих пор там.
No. 17713    
15108878131.png-(804.52KB, 1280×720, 1419959214456.png)
17713
>>17702
Это одна из тех вещей, которая есть, пока не отвалится окончательно.
Никаких планов развивать эту функцию нет. Сама загрузка этих форматов разрешена только в /dev/ в силу специфики раздела, а не для удобного прослушивания музла.

>>17704
Я не лезу в те части движка, принцип работы которых не понимаю. А кроме меня сейчас некому.

>>17410 сунуто в репозиторий.
No. 17727    
151093155630.png-(10.85KB, 120×120, face-palm_1f926.png)
17727
>>17713
No. 17728    
151093267738.jpg-(244.46KB, 700×808, 1359818223014.jpg)
17728
>>17727
Я вот, например, реализацию с тегом вместо флэшь-плеера сунул в репозиторий шесть часов назад, а вы мне жёлтые рожи постите.
Постыдились бы.
No. 17729    
151093362778.png-(10.45KB, 120×120, clapping-hands-sign_emoji-modifier-fitzpatrick-typ.png)
17729
>>17728
No. 17730    
>>17728
Ну вот и молодец. А теперь по случаю сования >>17410 в репозиторий, можно и разворачивание картинки перенести со ссылки с названием на превью. Говорю об этом, если что:
onclick="javascript:expandimg('17662', '/dev/src/151072352512.jpg', '/dev/thumb/151072352512s.jpg', '2369', '2000', '200', '168');return false;"

Не так уж и сложно. Достаточно пройтись поиском "expandimg" по файлам шаблонов и переместить это дело из одного <a> в другой.
No. 17732    
Прямо сейчас в коде этой страницы есть строка «onclick="javacript: request_faptcha('dev');"».

Оттуда надо бы слово «javacript» с последующим двоеточием и пробелом убрать, потому что в атрибутах onчто-то_там URLы не пишут, а сразу код JavaScript нафигачивают.

Строка «onclick="javascript:» (с лишним «javascript:» без опечатки) повторяется сейчас на странице 111 раз.

Оттуда надо бы слово «javascript» с последующим двоеточием убрать.
No. 17733    
>>17732
А еще лучше этот onclick вообще убрать, да куда там...
No. 17744    
151102172495.jpg-(53.75KB, 400×533, f465557e3d0d0d1c58f7b6aa136c0227041fc3b1.jpg)
17744
Отправил >>17410 на тест.
Использование свойства box-sizing приводит к тому, что стандартные превью (200 пикселей) показываются раза в полтора меньше реального размера (но разворачиваются с учётом ширины, да), а картинки меньшего размера (32×32, например) не показываются вообще (и не разворачиваются при нажатии на).
Либо объясняете почему, либо идёте к чертям с этой реализацией, к сожалению.
No. 17745    
>>17744
Абисняю.
Дело в том, что ширина, задоваемая Кусабой, с
box-sizing
будет считаться с отступами от
paddng
. То есть у твоей превьюхи 150 пиксолей, допустим, потому ширина уменьшится на 40 оных из-за отступов по двум бокам в 20 пиксолей, после чего высота автоматически подгоняется под полученную ширину. Собсна, от этого не видно превьюх меньше сорока пиксолей.
Моя вина, звиняйти-с.
По-хорошему, нужно развёрнутой кортинке отдельный класс вешать, но можно и сейчас проблему решить, всего лишь добавив условие, что в ссылка на кортинку, у которой класс
.thumb
, идёт в директорию /src/, то есть на оригинал; превьюхи же будут использовать ванильные маргины без бокс-сайзингов.
.thumb[src*="/src/"]{max-width:100%;height:auto;box-sizing:border-box;margin:0;padding:2px 20px}

No. 17746    
А ещё можно добавить
.inline-pp{display:inline-block;margin:0}
. А то вроде инлайн указан, а он вовсе не инлайн. И вообще в Кусабе вроде как есть отдельно инлайновый код и блочный. Странно, что тут всё инлайновым пишется.

Короче, ещё погляжу, что можно подправить.
No. 17747    
>>17744
Я просто добавил данное решение через stylish, и более месяца пользуясь, ничего подобного не наблюдал. Проблема в приоритетах: данный код устанавливает margin в 0 и добавляет padding, далее css кусабы возвращает свой margin обратно, таким образом оба отступа сохраняются. Нужно либо убрать существующий margin из css, либо добавить этот код в самый конец файла, а не в начало, либо повысить приоритет селектора, написав не 《.thumb》, а《img.thumb》, либо 《body .thumb》, 《a .thumb》и тому подобное. Очевидные вещи, вроде бы.
No. 17748    
151102975081.png-(267B, 16×16, 410.png)
17748
>>17747
Ащета должен был наблюдать. Попробуй потыкать туда-сюда переключатель этого стиля и посмотри на тумбинашки.

Алсо тест.
No. 17749    
151103004130.png-(1.49KB, 32×32, flower-power.png)
17749
>>17745
>.thumb[src*="/src/"]
Это решает проблему превью, но не решает проблему разворота. При развороте они по-прежнему исчезают или уменьшаются.

>>17747
Какой маргин откель оно берёт, если единственный маргин там 0? Туда был внесён класс .thumb ровно такой, какой указан >>17410. Старый .thumb убран. Я понять не могу, что вы пишете вообще.

Вот на этой картинке я тестирую это всё сейчас.
No. 17750    
>>17749
Всё, нашёл правильное решение:
.thumb[src*="/src/"]{max-width:100%;height:auto;width:auto;box-sizing:border-box;margin:0!important;padding:2px 20px}

No. 17751    
>>17750
Ой, точнее, даже так:
.thumb{max-width:100%;height:auto;width:auto;box-sizing:border-box;margin:0!important;padding:2px 20px}

No. 17752    
>>17751
> margin: 0 !important;
Таки значит откуда-то margin таки берется.
Лучше все же не использовать important, а как говорилось, переделать селектор.
No. 17755    
>>17752
Импортант тама для убирания другого маргина.
Правильнее всего было бы, конечно, в img_global.css c 30-й строки поменять
.thumb {border: none;float: left;margin: 2px 20px;}

на
.thumb {border: none;float: left;box-sizing: border-box;max-width: 100%;height: auto;width: auto;padding: 2px 20px;}

No. 17756    
151103189646.jpg-(3.81MB, 2893×4089, 8757161.jpg)
17756
>>17751
Похоже, что это оно.
Когда-нибудь оно дойдёт досюда.
No. 17761    
151103887133.jpg-(62.63KB, 578×767, высадка инопланетного деса.jpg)
17761
>>17728

> Я вот, например, реализацию с тегом вместо флэшь-плеера сунул в репозиторий шесть часов назад, а вы мне жёлтые рожи постите.

> Постыдились бы.

Не постыжусь вовек, потому что вовсе не знал об этом и оттого отреагировал на предшествующее; а предшествующее объективно выглядело как бесперспективняк.

>>17733

> А ещё лучше этот onclick вообще убрать, да куда там...

Исходный код Flower Bus Engine закрыт, но исходный код джаваскрипта его всё же невозбранно виден во браузере, так что теоретически ничто не мешает отпилить http://410chan.org/lib/javascript/kusaba.js и напилить вместо этого такой новый JavaScript с улучшенным управлением событиями, который сам будет обработчики событий навешивать на элементы, так что атрибуты onclick в HTML-коде не понадобятся, и оттого выглядеть он станет, право же, куда чище.

Проект такого переустройства должен будет, разумеется, сопровождаться, окромя джаваскриптовой части, также и инструктивною частью, содержащей указания наподобие «устранить создание атрибута onlick, вызывающего функцию expandimg(), в том месте Flower Bus Engine, которое аналогично строке https://github.com/tslocum/kusaba/blob/79479456141fe2ce937e94b5f5939d838071387b/trunk/inc/classes/board-post.class.php#L1086 в Кусабе,¹ и заменить на создание четырёх data-атрибутов таким-то кодом PHP» или «отпилить http://410chan.org/lib/javascript/protoaculous-compressed.js с заменой на такую-то версию jQuery».

На том пути прозреваю два преткновения:

1) Кроме исходного кода джаваскрипта, невозбранно видного во браузере, есть ведь (или теоретически может быть) не видный, который обеспечивает администрирование. Надо так действовать, чтобы и его не порюхать; но нѣтъ увѣренности въ томъ, что возможно дѣйствовать такъ.

2) Точно ли Flower Bus Engine основан на той именно Кусабе, исходники которой по адресу https://github.com/tslocum/kusaba/ лежат? — если он основан на какой-нибудь другой версии Кусабе (быть может, отчасти допиленной, как вот http://kusabax.cultnet.net/ например), то ценность инструктивной части может стремительно падать, так как в коде Flower Bus Engine не отыщется прямого аналога того куска Кусабы, который будет указан со словами «править надо вот тут и вот так».

____________

¹ Отдельно отмечу, что оплошность >>17732 (употребление «javascript:» внутри атрибута onclick) встречается непосредственно в исходном коде у Кусабы, чего я никак не ждал, по умолчанию относя её появление на счёт создателей Flower Bus Engine.
No. 17775    
А зачем в превью постов мусор из заголовка страницы?
No. 17776    
>>17775
Щта.
No. 17783    
>>17776
https://pastebin.com/NUGpK4Fi
No. 17785    
151111003392.jpg-(312.36KB, 532×720, 9901633.jpg)
17785
>>17783
Если оно и так, то я не знаю, почему.
No. 17786    
>>17775
Видимо причина кроется в следующем:
У кусабы/автобуса есть подобие api, позволяющее получить пост по доске, треду, и его номеру. При наведении на >>ссылку запрашивается url вида http://410chan.org/read.php?b=dev&t=17371&p=17776&single
Вот только во время ковыряния шаблонов случилась так, что шаблон, применяемый в read.php, который вообще не должен содержать <head>, <body> и прочее, а выдавать текстом простой div, стал наследоваться от дефолтного шаблона для всех страниц, с метрикой и прочим.
Надо бы пофиксить.
No. 17788    
>>17786
Агась.
От этого, кстати, перестанут ломаться границы между тредами и прочее при появления попапа с превью, так как недобраузеры всё же загружают стили (в частности img_global.css) не из head и получается так, что значения из этого самого глобал.цсс перебивают каштомные от стиля, выбранного в менющке сверху.
No. 17789    
151111143956.jpg-(111.44KB, 600×338, 00000029.jpg)
17789
>>17786
Оно и в самой что ни на есть исходной «Кусабе» 1.0.4 это всё дёргает.
Попробуйте для неё исправление сделать, возможно оно нам подойдёт.
No. 17807    
151112014541.gif-(38.35KB, 553×579, anti-anime.gif)
17807
В дополнение к реплике >>17789 сообщаю, что в репозитории https://github.com/tslocum/kusaba лежит, по-видимому, именно Кусаба версии 1.0.4, что в строчке https://github.com/tslocum/kusaba/blob/master/trunk/config.php#L203 прописано.
No. 17839    
Кстате, как вы смотрите на унификацию стилей, чтоб только цвета перекрашивало?
No. 17841    
151120529174.jpg-(495.82KB, 595×841, 9157815.jpg)
17841
>>17839
На самом деле, я уже начал это готовить потихоньку.
Всякие отступы со временем точно в глобальный стиль переползут.
No. 17865    
151132392835.jpg-(1.08MB, 3508×2480, Вселённые люди.jpg)
17865
Также ещё на 410чане надо отпилить атрибут «type="text/javascript"» ото всех HTML-тегов «script», потому что и без него по умолчанию так, так что он зря только мѣсто занимает в исходном коде.
No. 17869    
151135053190.jpg-(399.05KB, 1024×1024, __uiharu_kazari_to_aru_kagaku_no_railgun_and_to_ar.jpg)
17869
>>17865
Дайте мне ссылку на стандарт, где так сказано.
No. 17871    
>>17869
https://www.w3.org/TR/html5/scripting-1.html#attr-script-type
> The type attribute gives the language of the script or format of the data. If the attribute is present, its value must be a valid MIME type. The charset parameter must not be specified. The default, which is used if the attribute is absent, is "text/javascript".
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script
https://www.w3schools.com/Tags/tag_script.asp
No. 17872    
151135179118.jpg-(470.43KB, 1024×1024, __uiharu_kazari_to_aru_kagaku_no_railgun_and_to_ar.jpg)
17872
>>17870
Ага, если HTML5.
А у нас тут 4.01 пока.
No. 17873    
>>17872
Даже на Netscape 2 это поддерживается.
No. 17874    
>>17872
Тут кстати и HTML 4.01 не валидный.
http://validator.w3.org/check?uri=http://410chan.org/dev/&charset=(detect automatically)&doctype=Inline&group=0
No. 17875    
151135362220.jpg-(572.72KB, 800×800, 54217868_p3.jpg)
17875
>>17874
Спасибо, Капитан.
Хотя вот почему он не видит <head>, я не понять не могу.
No. 17876    
151135394695.jpg-(45.21KB, 400×400, автобусу пиздец.jpg)
17876
>>17872

Этот кусок стандарта HTML5 просто документирует то поведение по умолчанию, которое и до HTML5 было во всѣхъ браузерах во всѣ времена.
No. 17877    
>>17875
Из-за Яндекс.Метрики. Подразумевалось, что этот код надо копипастить в самый конец <body>, а не в начало <head>, о чем свидетельствует даже кусок кода
<noscript><div><img src="https://mc.yandex.ru/watch/38099020" style="position:absolute; left:-9999px;" alt="" /></div></noscript>

Ну а валидатор в первой ошибке сообщает, что это "/>" в конце img по его соображениям закрывает <head>.
No. 17879    
151136738210.png-(2.57MB, 1920×1080, Suzumiya Haruhi no Yuuutsu - a celestial.png)
17879
>>17877

На самомъ дѣлѣ нѣтъ.

Просто тэги «div» и «img» в стандарте прописаны как недолжные для внутренностей «head», поэтому при их появлении валидатор (да и почти каждый браузер, наверное) начинает мысленно подразумевать закрывающий «/head» и открывающий «body» перед ними.
No. 17880    
151136794827.jpg-(128.42KB, 1280×720, anime frame.jpg)
17880
>>17877

Ну а валидатор в первой ошибке сообщает только то, что желающим выпендриваться с XML-подобными «самозакрывающимися» тэгами (с косой чертою на заднице) следует наперёд переключить весь документ в режим XHTML или хотя бы HTML5.

If you expect <FOO /> to be interpreted as an XML-compatible "self-closing" tag, then you need to use XHTML or HTML5.

No. 17903    
Хотел победить горизонтальные скроллбары от кода, но хѣр там.
Нужно отдельный блочный код с максимальной шириной 480px и инлайновый в спане, чтоб не ставило неразрывные пробелы. Или обернуть посты в контейнер-блок, но тогда не будет обтекания постов вокруг кортинки в ОП-посте.
No. 17904    
Взглянул детальнее на глобал_имг.цсс и… о госпадя.
Корочи, если унифицировать, то ориентироваться на Умночан?
Как руки дойдут — скину сразу все стили.
No. 17905    
Подход >>17903 выглядит сложноватым, дорогуша.

Рекомендую для начала попробовать придание свойству https://developer.mozilla.org/en-US/docs/Web/CSS/white-space значения «pre-wrap». Может быть, хватит одного этого.
No. 17910    
>>17905
Ничего сложного. Можно ще <br> добавить между постами и пользовать display:inline-block без опаски, що друг на друга посты полезуть.
Не достаточно. Оно там ужо стоит. А ты почетай про таблицы и как они расширяются в зависимости от ширины содержимого шире ширины экрана. И про перенос неразрывных пробелов, которые используются в <pre> тута.
No. 17918    
151172247015.png-(248.24KB, 500×500, 1356681797821.png)
17918
Новая расширялка картинок поставлена. Онклик пока не перемещался.
И ещё некоторые мелочи.

>>17904
Не бегите впереди паровоза автобуса, это делается и так.
No. 17919    
>>17918
Можно ли .threadlinksbottom вынести за пределы div'а треда?
И обернуть в div верхнюю кнопку "[Назад]"
No. 17920    
>>17919
То же касается кнопки "[Mod]". Она не обернута.
No. 17925    
>>17918
Поздна.
Ещё тебе свг-иконки зделою наконец.
No. 17926    
151174991272.jpg-(2.59KB, 108×50, 2017-11-27 05_29_25.jpg)
17926
>>17925
Пока только ворованные.
Или ну его? Или заморочеца и перерисовать Умночяновские, шоб можно было перекрашивать в любой цвет?
No. 17931    
151179805590.gif-(537.81KB, 500×598, 1456460504951.gif)
17931
>>17925
Вы-то можете делать что угодно, просто это потом окажется никому не нужным.
Исходники у (некоторых) значков и так в SVG, так что опять же рисовать их заново не нужно.
No. 17932    
>>17931
Ууу~ глупая банка!
Не кажи гоп. От зделою — тогда посмотрим.
Так понимаю, речь про те, которые в админбаре и умночановский пнг? Чому тогда других цветов не нарендерил?
No. 17933    
151189152344.png-(116.28KB, 1024×1024, tex_chara_l_567.png)
17933
>>17919
>Можно ли .threadlinksbottom вынести за пределы div'а треда?
Вряд ли.
>И обернуть в div верхнюю кнопку "[Назад]"
Найдите её в оригинальной «Кусабе» 1.0.4 и покажите мне, что там оборачивать. Так быстрее будет.
No. 17935    
>>17933
Предположительно, где-то в конце:
https://github.com/tslocum/kusaba/blob/79479456141fe2ce937e94b5f5939d838071387b/trunk/inc/func/pages.php
No. 17936    
151198010329.png-(158.60KB, 1024×1024, tex_chara_l_568.png)
17936
>>17935
>Предположительно
Наверное, не стоит умничать, если вы разбираетесь в этом даже меньше меня (хотя куда уж меньше меня-то, лол?).
В этом файле содержится само формирование ссылок, которое нам не нужно. Перед нами не стоит цель изменить их содержание или концепцию.
Формирование внешнего вида доски содержится в файле /inc/classes/board-post.class.php. Именно там надо смотреть, куда впихнуть условный <div class="threadlinkstop">. Мне это надо знать точно, потому что с нижними ссылками было проще, ибо они уже были обёрнуты в <span>, который и был мной переделан на <div>.
Верхние не обёрнуты ни во что, и именно эту проблему мы хотим устранить.
No. 17937    
>>17936
Ага, нашёл.
https://github.com/tslocum/kusaba/blob/79479456141fe2ce937e94b5f5939d838071387b/trunk/inc/classes/board-post.class.php
640 строка
'<div class="threadlinkstop">' .

threadLinks('return', $thread_op_id, $this->board_dir, $this->board_type, $modifier_last50, $modifier_first100) .

'</div>' .

No. 17938    
>>17937
Меня, как мимокрокодила, волнует строка 1170 того же файла.
No. 17939    
151198459736.png-(554.95KB, 1016×683, 12345703.png)
17939
В общем, непонятно.
С одной стороны, кажется, что именно pages.php отвечает за эту часть страницы. С другой, тогда непонятно, как это потом повлияет на нижние ссылки в board-post.class.php.
Поэтому я туда и не полезу.
No. 17941    
>>17938
Это для тредов на странице доски, рядом с кнопками скрытия и прочего.
Можно так:
$info_post .= ' &nbsp; ' . <span class="threadlinkspage">' .  threadLinks('page', $post['op_id'], $this->board_dir, $this->board_type, $modifier_last50, $modifier_first100) . '</span>';


>>17939
Да понел уже. Хотя можно было бы добавлять спан-контейнер ко всем тредлинкам в pages.php, а в board-post.class.php добавлять уже ойди или класс с положением.
Вообще, думал чому-то, что всё построение страниц именно в темплейтах хранится у Кусабы. Теперь понел, чому все с неё плюются и говорят, что проще новый движок написать, чем сношаться с этим трупом.
No. 17942    
>>17941
>Это для тредов на странице доски, рядом с кнопками скрытия и прочего.
Но это https://github.com/tslocum/kusaba/blob/79479456141fe2ce937e94b5f5939d838071387b/trunk/read.php#L78 !
No. 17943    
>>17942
>&nbsp; [<a href="/dev/res/17662.html">Ответ</a>] [<a href="/dev/res/17662-100.html">Первые 100 сообщений</a>] [<a href="/dev/res/17662+50.html">Последние 50 сообщений</a>]
>$info_post .= ' &nbsp; ' . threadLinks('page', $post['op_id'], $this->board_dir, $this->board_type, $modifier_last50, $modifier_first100);
Ну чё ты, чё ты?
No. 17948    
>>17943
Тогда для чего код по ссылке?
No. 17949    
>>17948
Насколько помню, чтение.пехопе вытягивает посты в попапы и всякое такое.
418 сообщений пропущено. Показаны 100 первых сообщений.
Удалить сообщение []
Пароль  
[Mod]