portfoliopost
FDteam-portf
freepost
Гибкий инструмент для работы с BB-кодами на форумах, основанных на платформе mybb.ru. Текущая версия — 1.2.
Условия использования:
Вы можете использовать все материалы, соблюдая условия использования бесплатного контента.
Поддерживаемые браузеры
Неподдерживаемые браузеры
Firefox 43+
Chromium 49+
Google Chrome
Microsoft Edge 13+
Safari 11+
Opera 36+
Internet Explorer (все версии)
Opera Presto (в т.ч. Opera Mini)
Чтобы установить скрипт, нужно в начало HTML-верха ("Администрирование" / "Формы" на форумах mybb.ru) добавить следующий загрузчик:
Обратите внимание, что скрипт сам по себе ничего не делает. Для работы необходимо добавить дополнительный код (так же в HTML-верх), в котором необходимо задать, какие именно изменения предполагаются.
Ещё раз: этот инструмент не делает ничего самостоятельно, и для работы необходимо добавить дополнительный код. Все дополнительные объявления, использующие MyBBCode также должны быть добавлены в HTML-верх после загрузки утилиты (после кода, указанного выше).
Объявления обработчиков и других элементов MyBBCode в HTML-низ возможна, но крайне не рекомендуется, так как это не является ожидаемым поведением.
Я этой утилитой хочу разгрузить HTML-низ, зачем туда всё это пихать?! XD
© kozhilya
Зачем нужна эта утилита?
Недавние изменения на MyBB, в частности, добавление пользовательских тегов и ajax в форме ответа, несколько изменили методы работу с пользовательскими тегами: первое изменение упростило, второе же усложнило. Это, впрочем, нормально, но, по меньшей мере, у разработчика случилась некоторая фрустрация оттого, как в некоторых местах приходиться работать с некоторыми тегами. Фрустрацию он преодолел, написав прослойку, которая позволяет при помощи относительно короткого и простого кода добавить методы для модификации.Что утилита делает?
Если простыми словами, то данный скрипт не делает ничего сам по себе, но он помогает облегчить жизнь тем, кто использует различные скрипты для модификации сообщений на форумах, обеспечивая простой доступ к
обработке сообщений, в том числе загруженных через ajax, добавленных в предпросмотр и других местах,
добавлению кнопок в форме ответа, а так же изменению порядка их отображения.
И всё это с использованием последних новинок на сервисе MyBB, которые могут позволить минимизировать количество кода для реализации простых функций.
Где можно посмотреть, как работает утилита?
Если вы начали использовать утилиту и так же хотите попасть в этот список - пишите, добавим вас в список.
На моём форуме и так всё хорошо работает, почему мне стоит начать использовать эту утилиту?
Решительное большинство существующие на данный момент решений для модификации сообщений используют регулярные сообщения для добавления новых тегов, что имеет ряд существенных проблем.
Они не гибкие. Как правило, они добавляются в HTML-низ, и срабатывают 1 раз, когда загрузится страница. И когда на MyBB появилась возможность сообщения при помощи ajax, то есть без полной перезагрузки страницы, оказалось, что новые сообщений не обрабатываются. И решение этой проблемы весьма нетривиальное, так что многие предпочли отключить эту функцию совсем.
Пользовательские bb-теги громоздки. Если у вас есть скрипт, который добавляет какой-либо bb-код, то он с вероятностью 99% имеет регулярное выражение типа /\[example=(.*?)\](.*?)\[\/example\]/gi — и это ещё безобидный пример.
Пользовательские bb-теги перестраивают DOM-дерево. Это происходит из-за того, что идёт переопределения значения .innerHTML (возможно через jQuery.html()). Подобная перестройка кажется крайне незначительной проблемой, но тут есть несколько "забавных" проблем. Во-первых, это относительно медленно, да, порядка 0.1 секунды, но браузеру потребуется время. Если же это делается несколько раз подряд, то и того дольше. Во-вторых, при таком подходе полностью убивается DOM-структура. Некоторые встречались с проблемой, что после добавления bb-кода, в сообщении переставали работать всплывающие подсказки — так вот это именно из-за того, текст с подсказкой мог сохранить свои внешние атрибуты, но само сообщение подсказки теряется, так как оно было записано в JS-данные, которые перестали ассоциироваться с новым элементом.
Утилита MyBBCode решает все указанные выше проблемы:
Вместо перебора сообщений утилита использует следующие jQuery-события:
pun_main_ready — начальная загрузка страницы;
pun_preview — ajax-предпросмотр сообщения;
pun_post — ajax-отправка сообщения;
pun_edit — ajax-редактирование сообщения;
spoiler.firstOpen — открытие спойлера с загрузкой при открытии (медиа-спойлер).
Это позволяет использовать все возможные сообщения, как загруженные классическим образом, так и для добавленные после отправки через ajax. При этом можно без проблем добавлять свои события, если требуется добавление сообщений каким-то другим способом.
Использование встроенной в движок системы пользовательских тегов позволяет избавиться от регулярных сообщений в JS, и в целом процесс добавления обработчиков тегов в MyBBCode занимает меньше места, таким образом предоставляя больше возможностей при меньшем объёме кода.
Так же система пользовательских тегов уже добавляет HTML-контейнеры для тегов, что позволяет изолировать область изменения DOM-древа, и даже вовсе избавиться от подобных манипуляций.
Разумеется, мы не можем вас использовать этот функционал. Однако, если аргументы выше вас не убедили, прежде чем отказываться от инструмента совсем, просим посмотреть примеры реализации тегов, и подумать, как это может помочь улучшить и оптимизировать код, который уже имеется у вас на форуме.
Почему такая поддержка браузеров? Почему мой браузер не поддерживается?!
Да, в скрипте использованы "новые" технологии, которые на MyBB использует, похоже, только @kozhilya. Вот их список:
ES6-класс — работает во всех актуальных браузерах с марта 2016 года (последними реализовали Mozilla Firefox);
let — работает во всех актуальных браузерах с марта 2016 года (последними реализовали Mozilla Firefox); в 2017 году Safari исправили баг, который касался случаев, не используемых в данной утилите.
стрелочные функции — работает во всех актуальных браузерах с сентября 2016 года (последними реализовали Safari);
строки-подстановки — работает во всех актуальных браузерах с марта 2016 года (последними реализовали Safari);
Да, это "синтаксический сахар", без которого можно обойтись... Но все эти вещи были предложены в ECMAScript 6, уже устаревшем стандарте, на котором основан JavaScript, в 2015 (!!!) году, и поддерживаются основными браузерами лишь слегка меньший срок. И не хочется возвращаться во времени и писать устаревший код, используя прототипы и костыли вроде var self = this для сохранения доступа к текущему объекту в подчинённых функциях.
Поэтому, если вас интересует поддержка старых браузеров, то извините, разработчик не хочет вам помогать. По крайней мере, не за бесплатно.
Что такое обработчики и адаптеры?
Двумя основными инструментами для обработки сообщений в MyBBCode являются обработчики тегов и адаптеры.
Обработчики тегов — это способ дополнительно обработать теги, добавленные через систему пользовательских тегов (/admin_forms.php — "Пользовательские bb-теги"). Для того, чтобы добавить адаптер, необходимо использовать метод addTag.
Адаптеры позволяют производить более общие манипуляции над сообщениями. Для того, что бы добавить адаптер, необходимо использовать метод addAdapter.
Это бесплатно?
Код выложен в свободный доступ, вы можете свободно его брать, подключать и применять на своём проекте. Как и со всеми разработками наших специалистов, мы оказываем техподдержку бесплатно и всегда рады подсказать почему не работает. Но обратите внимание, что для настройки этой утилиты нужны хотя бы минимальные знания языков программирования. У неподготовленного юзера, скорее всего, ничего не получится самостоятельно. Дело тут в том, что помимо подключения, нужно прописывать ещё и дополнительный код.
Но, если вы хотите "разгрузить" от кодов и оптимизировать свой форум, но не разбираетесь в программировании - мы можем за вас установить и настроить MyBBCode на ваш форум, но не за бесплатно. Примерная цена за работу: 500 - 1000р (в зависимости от количества задач, которые инструмент должен выполнять).
Мастер-классыВидео
