Оформление
Некоторые селекторы, используемые в скрипте Уведомлений:

Селектор	Элемент
.notification (или .jGrowl-notification)	Всплывающее мгновенное уведомление (во втором случае — все jGrowl-уведомления).
.notification.notification-left .notification-image	Аватар в уведомлении (всплывающем и в списке). Например: Код: .notification-left .notification-image { border-radius: 4px; /* делаем аватар квадратным */ }
#notify-link .unreads, #navpm .unreads	Маркер количества непрочитанных сообщений (около пункта меню "Уведомления"). При изменении цвета шрифта и фона этого маркера автоматически перекрасится в те же цвета и маркер в иконке вкладки. Например: Код: #navpm .unreads { background: #ffea00; color: #333; }
.unread-notifications .modal-inner	Модальное окно со списком и настройками уведомлений.
.unread-notifications #notifications-wrap	Селектор-обертка списка уведомлений.
.unread-notifications #notifications-wrap [id$="-title"]	Заголовки "Новые" и "Просмотренные" в модальном окне уведомлений.
.unread-notifications #notifications	Таблица — список новых уведомлений. Например, можно подсветить непрочитанные полупрозрачным фоном: Код: #notifications td { background-color: rgba(0,255,39,.1) !important; }
.unread-notifications #notifications-stored	Таблица — список просмотренных уведомлений.
.reported	Для сообщений, на которые текущий пользователь уже пожаловался.
.has-reports	Под модератором/администратором, для сообщений, на которые есть жалобы от пользователей.

Расширенные настройки
Дополнительные настройки устанавливаются в Формы - HTML-верх ниже скрипта Уведомлений (в тегах <script></script>).

Параметр	Значение
notifications.enabled	false — отключить функцию уведомлений (по умолчанию — true)
notifications.soundEnabled	false — отключить звук в уведомлениях для всех пользователей (по умолчанию — true)
notifications.life	число — время (в миллисекундах) отображения всплывающего уведомления после реакции пользователя (по умолчанию — 10000)
notifications.blinkInterval	число — интервал мигания вкладки (в миллисекундах), для отключения мигания используется значение -1 (по умолчанию — 1000)
notifications.blinkAllTabs	false — отключить мигание всех вкладок, кроме последней активной (по умолчанию — true)
notifications.position	'top-left' 'top-right' 'bottom-left' — положение блока всплывающих уведомлений (по умолчанию — внизу справа: 'bottom-right')
notifications.maxNumberStored	число — количество сохраняемых просмотренных уведомлений (по умолчанию — 50)
notifications.badge	false — заменить маркер с количеством непрочитанных уведомлений поверх favicon на цифру в названии вкладки (по умолчанию — true)
notifications.markNew	false — не отображать маркер new в настройках (по умолчанию — true)
notifications.maxDataLength	число — максимальная длина сохраняемого контента непрочитанных уведомлений (в символах), не более 65000 (по умолчанию — 65000). Изменять параметр рекомендуется только в случае, если необходимо уменьшить количество хранимых непрочитанных уведомлений.
notifications.useTelegram	false — отключить дополнение "Уведомления: отправка в Telegram" (по умолчанию — true)

Для разработчиков
Подключение новых событий и изменение существующих: Notifications SDK
Работа скрипта уведомлений осуществляется по следующему принципу: уведомляющий отправляет метку адресату (например, при ответе в теме - тому, кому отвечает), на стороне адресата при наличии новых меток вызывается отображение соответствующего уведомления на основе заданного шаблона с переданными в метке свойствами (в частности, данные отправителя).

Для добавления метки уведомления на ключ конкретного пользователя используется метод notifications.add:

Код:

notifications.add(кому, 'тип', {user_id: от кого, username: 'ник', avatar: 'аватар', своеСвойство: 'значениеСвойства'});

• кому, от кого — число (ID пользователя);

• 'тип' — ключевое слово (строка), обозначающее тип уведомления (используется для группировки однотипных уведомлений и в качестве селектора);

Остальные параметры — опциональны (обычно указывается ID отправляющего, ник и ссылка на аватар, а также некоторые свойства, используемые при выводе уведомления). Аватар и ник при их отсутствии заменены на значения по умолчанию (например, для гостей или пользователей, не установивших аватар), соответственно, в переменных UserLogin и UserAvatar.
Каждое уведомление имеет временную метку, содержащую информацию о времени (в миллисекундах), когда оно было отправлено (по UTC, в Unix-формате).
Метку уведомления рекомендуется отправлять после того, как действие было подтверждено (например, для отправки уведомления об ответе тестируется реальное наличие поста с ответом на странице после его отправки).

Для задания шаблона отображения для конкретного типа уведомления используется метод notifications.addTemplate:

Код:

notifications.addTemplate('тип', {
    title: 'Заголовок уведомления',
    url: 'шаблон ссылки, по которой будет происходить переход при клике на уведомление',
    html: 'шаблон HTML содержимого уведомления, где {PROPERTY} будет значением свойства property, переданного в объекте в notifications.add()'
});

• 'тип' — тот же самый, который передается в метод notifications.add();

• 'Заголовок уведомления' выводится во всплывающем уведомлении и в пользовательском блоке настроек уведомлений (в списке опционального отключения).

В url и html можно использовать переданные в метке свойства, например '<a href="/profile.php?id={USER_ID}">{USERNAME}</a>', где паттерны в {} заменятся автоматически на значения соответствующих свойств.
Можно добавить параметр sound (ссылка на mp3-файл), который будет воспроизводиться при получении мгновенного уведомления заданного типа. Этот параметр опционален и не является обязательным, при его отсутствии используется стандартное звуковое оповещение.
Если передать в параметр sound значение false, то уведомления данного типа будут беззвучными.

Также можно изменить любой из стандартных шаблонов, например, задать свой HTML или звук.
Например, notifications.templates.reply.sound = 'ссылка на Ваш mp3-файл';

Если шаблон уведомления для какого-то типа не будет задан, то уведомления этого типа не будут всплывать и отображаться в списке. Это можно использовать, например, для каких-то технических оповещений (например, динамического обновления какого-либо содержимого страницы). Появление таких уведомлений можно отследить по событию notifications.new:

Код:

$(document).on('notifications.new', function(event, data) {
    var notifies = data['тип'];
    for (var timestamp in notifies) {
        //...
    }
});

data содержит объект с метками всех только что пришедших уведомлений (в том числе отображаемых, имеющих шаблон).
Пример содержимого data:

Код:

{
    "reply": {
        "1549963688933": {
            "user_id": 5,
            "username": "test2",
            "avatar": "/i/default_avatar.jpg",
            "id": 357, 
            "title": "tstPoll2-6",
            "text": "проверка уведомлений"
        },
        "1549963711523": {
            "user_id": 5,
            "username": "test2",
            "avatar": "/i/default_avatar.jpg",
            "id": 358,
            "title": "tstPoll2-6",
            "text": "test asdasd"
        }
    },
    "vote": {
        "1550994170383": {
            "user_id": 3,
            "username": "Deff",
            "avatar": "/img/avatars/0015/c4/3f/4-1477313043.png",
            "change": "повысил", 
            "id": 363,
            "title": "Тестовое сообщение"
        }
    }
}

---

Добавлена возможность выборки и удаления уведомлений по заданному набору свойств:
методы notifications.getByProperties(source, properties[, types, callback]) и notifications.deleteByProperties(source, properties[, types, callback]).

• source — ключ хранения уведомлений (новые уведомления пользователя — '_events_' + ID пользователя, прочитанные уведомления пользователя — '_stored_' + ID пользователя) либо объект с метками уведомлений, в котором производится поиск. Метод notifications.deleteByProperties принимает значением этого параметра только ключ, с которого выбранные уведомления будут удалены.

• properties — объект, содержащий свойства и их значения, по которым должны быть выбраны уведомления. Для попадания уведомления в выборку оно должно содержать все из указываемых свойств. Значение можно указать в виде массива из возможных значений свойств.

• types (необязательный параметр) — массив типов уведомлений, среди которых будет производиться выборка. Если не определено либо null, выборка производится по всем типам, имеющихся в источнике source.

• callback(result, source, arrayId) (необязательный параметр) — функция, вызываемая в момент получения результата выборки. Принимает параметрами результат выборки (объект с метками уведомлений), источник (объект с метками уведомлений) и массив идентификаторов (ID, являющихся также временной меткой) уведомлений, который можно использовать, например, для удаления методом delete.

В случае с методом notifications.deleteByProperties — для него функция callback принимает только один параметр (ответ — объект response), а сам метод принимает дополнительный параметр — функцию beforeDeleting(notification, result, source), возвращающую true или false, в зависимости от чего каждое из уведомлений в выборке удаляется или не удаляется (параметры функции — объект со свойствами каждого из выбранных уведомлений, полный результат выборки и источник).

Пример (получение уведомлений по заданным свойствам):

Код:

notifications.getByProperties(notifications.unread, {
    id: ["20003", "20008"],
    user_id: 4
}, ['reply', 'topic_subscribed'], function(result, source, arrayId) {
    console.log(result);
});

Результат выборки:

Код:

{
    "reply": {
        "1564920397267": {
            "user_id": 4,
            "username": "Deff",
            "avatar": "/img/avatars/0015/c4/3f/4-1477313043.png",
            "id": "20003",
            "title": "Технические моменты - 4",
            "text": "Alex_63 Проверка ответа раз"
        },
        "1564920923889": {
            "user_id": 4,
            "username": "Deff",
            "avatar": "/img/avatars/0015/c4/3f/4-1477313043.png",
            "id": "20008",
            "title": "Технические моменты - 4",
            "text": "Не - не стоит ( не мешает реклама)"
        }
    }
}

Метод notifications.getByProperties можно использовать для подключения автопрочтения уведомлений своих типов, привязанных к сообщениям в теме:

Код:

$(document).on('notifications.onPostsRead', function(e, visiblePosts) {
    notifications.getByProperties(notifications.unread, {
        id: visiblePosts
    }, ['тип'], function(result, source, arr) {
        notifications.deleteList = notifications.deleteList.concat(arr);
    });
});

Уведомления помещаются в прочитанные с помощью метода notifications.delete(arrayId[, data, callback]). Метод работает с ключом текущего пользователя.
arrayId — массив идентификаторов прочитываемых уведомлений;
data (необязательный параметр) — массив уведомлений и настроек (массив, содержащий объект с метками непрочитанных уведомлений (индекс 0), массив типов отключенных уведомлений (индекс 1), настройку звука — true/false (включен/отключен, индекс 2));
callback(response) (необязательный параметр) — функция обратного вызова, вызываемая по завершении запроса. Принимает параметром объект, содержащий информацию об ответе на запрос (например, {response: 1} при успешном запросе).

В шаблоне типов уведомлений добавлены новые опциональные параметры:

• description — описание данного типа уведомлений в списке настроек;

• new — логический параметр (true/false), при установке значения true к названию данного типа уведомлений в настройках будет добавлен маркер new (если не отключен флаг notifications.markNew в настройках скрипта).

В тексте и URL в шаблонах теперь могут использоваться, кроме простых паттернов вида {PROPERTY}, условные паттерны вида: {PARAM|значение, если param == true|значение, если param == false}, где в обоих частях могут также быть использованы и простые паттерны, например:

Код:

html: '<span>{USER_ID|<a href="/profile.php?id={USER_ID}">{USERNAME}</a>|Гость}</span>'

---

Изменения в связи с переходом на app_id
Применяемые во внутренних методах ключи уведомлений теперь состоят из app_id и идентификатора пользователя.
Ключ непрочитанных уведомлений конкретного пользователя можно получить, используя метод notifications._toAPIKey(id), где id — UserID пользователя.

События отображения и скрытия всплывающих уведомлений
Теперь при появлении на экране всплывающего уведомления вызывается событие notifications.notification_show на document, а при исчезновении - notifications.notification_hide. Вы можете при необходимости навешивать на них свои обработчики, например:

Код:

$(document).on('notifications.notification_show', function(event, element) { /*...*/});

В этом примере element - элемент-контейнер, содержащий всплывающее уведомление.

Локализация
С последним обновлением интерфейс Мгновенных уведомлений теперь поддерживает по умолчанию русскую и английскую версии, переключающиеся автоматически в соответствии с выбранным языком пользователя или форума.
Вместо этого вы можете заменить текст в любых элементах интерфейса на свой, прописав его в специальном файле.
Правила перевода/замены текста составляются по принципу, описанному ниже.
Правило состоит из двух строк: исходная фраза на русском, локализованный вариант фразы.
В файле могут содержаться комментарии, начинающиеся с ##.
Пример:

Код:

## комментарий
Уведомления
Notifications

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

Код:

на форуме
on forum
 
форум
forum

Файл локализации должен быть загружен в Администрирование - Файлы в формате txt.
Ссылку нужно указать в значении атрибута data-locale у тега script.
Пример:

<!-- Мгновенные уведомления © Alex_63, 2024 -->
<link rel="stylesheet" type="text/css" href="//forumstatic.ru/f/ru/bestbb/notifications.css" />
<script type="text/javascript" src="//forumstatic.ru/f/ru/bestbb/notifications.js" data-locale="//forum.mybb.ru/...ссылка на ваш файл.txt"></script>

Заданный таким образом пользовательский файл локализации будет применяться вне зависимости от выбранного языка пользователя или форума.

Если вы используете пользовательские шаблоны уведомлений, помимо стандартных и содержащихся в дополнениях, они могут быть автоматически переведены в соответствии со стандартным (или вашим пользовательским) файлом локализации. При этом исходные фразы, состоящие менее чем из трёх символов, игнорируются и не переводятся. Перевод применяется к полям title, description и html. Чтобы отключить стандартную локализацию для конкретного шаблона, вы можете задать отдельные шаблоны для русского и английского вариантов, задав в шаблоне параметр locale со значением ru или en.

В шаблоне типов уведомлений добавлены новые опциональные параметры:

• hidden — логический параметр (true или false), при установке значения true пункт скрывается из настроек (при этом шаблон доступен для использования в отображении уведомлений);

• alwaysOn — логический параметр (true или false), при установке значения false флажок состояния у данного неактивен, т.е. уведомления данного типа пользователи не смогут отключать;

• locale — применение данного шаблона строго в соответствии с локализацией (ru или en). Например, при установке значения ru уведомления данного типа и соответствующий пункт настроек не будут отображаться у пользователей, выбравших английский язык).

Актуальная версия — 1.2.5.

Версия содержит минорное обновление (исправление ошибок).

Полный список изменений в версии 1.2.5.

• ‌

• Исправлено: Устранена недоработка, иногда приводившая к открытию пустой страницы вместо всплывающего окна центра уведомлений в мобильной версии браузера Firefox.

• Исправлено: Содержимое блоков "Код" теперь исключается из текста уведомлений, а текст оставшихся параграфов разделяется пробелами.
  ‍