Учебник Noty

Введение
- Что такое Noty
- История и эволюция библиотеки
- Преимущества использования Noty
- Сравнение с альтернативными решениями
- Требования и совместимость
Установка и подключение
- Установка через npm
- Установка через yarn
- Подключение через CDN
- Загрузка и локальное подключение файлов
- Проверка корректности установки
Базовая настройка
- Минимальная конфигурация для запуска
- Структура объекта настроек
- Глобальные настройки по умолчанию
- Локальные настройки для отдельных уведомлений
- Приоритет настроек
Создание первого уведомления
- Синтаксис создания уведомления
- Метод show()
- Передача текста уведомления
- Базовые параметры
- Отображение и закрытие уведомления
Типы уведомлений
- Тип alert
- Тип success
- Тип error
- Тип warning
- Тип info
- Создание кастомных типов
Позиционирование уведомлений
- Доступные позиции на экране
- Настройка через параметр layout
- Верхние позиции
- Нижние позиции
- Центральные позиции
- Левые и правые позиции
- Комбинирование позиций
Темы оформления
- Встроенные темы
- Тема mint
- Тема sunset
- Тема relax
- Тема nest
- Тема metroui
- Тема semanticui
- Тема bootstrap-v3
- Тема bootstrap-v4
- Переключение между темами
Текст и форматирование
- Обычный текст
- HTML-разметка в тексте
- Экранирование HTML
- Многострочный текст
- Длинные сообщения
- Ограничение длины текста
Время жизни уведомлений
- Параметр timeout
- Бесконечные уведомления
- Автоматическое закрытие
- Настройка задержки
- Поведение при наведении мыши
Анимация
- Типы анимации открытия
- Типы анимации закрытия
- Параметр animation.open
- Параметр animation.close
- Скорость анимации
- Отключение анимации
- Кастомные анимации через CSS
Кнопки действий
- Добавление кнопок в уведомление
- Структура объекта buttons
- Текст кнопки
- Класс кнопки
- Обработчик клика на кнопку
- Множественные кнопки
- Закрытие уведомления при клике на кнопку
События и колбэки
- Список доступных событий
- onShow
- onShown
- onClose
- onClosed
- onClick
- onHover
- onTemplate
- Передача параметров в колбэки
- Контекст выполнения колбэков
Очередь уведомлений
- Принцип работы очереди
- Параметр queue
- Ограничение количества видимых уведомлений
- Управление порядком отображения
- Очистка очереди
- Приоритет уведомлений
Модальные уведомления
- Параметр modal
- Блокировка взаимодействия с интерфейсом
- Наложение затемнения
- Настройка overlay
- Закрытие модального уведомления
Прогресс-бар
- Включение прогресс-бара
- Параметр progressBar
- Настройка внешнего вида
- Автоматическое уменьшение прогресса
- Обновление прогресса вручную
Звуковые уведомления
- Добавление звука к уведомлениям
- Параметр sounds
- Настройка громкости
- Условия воспроизведения звука
Шаблоны
- Использование встроенных шаблонов
- Создание кастомного шаблона
- Переменные в шаблонах
- Функция template
- Возврат HTML из шаблона
- Интеграция с template-движками
Методы управления
- Метод close()
- Метод closeAll()
- Метод setTimeout()
- Метод setType()
- Метод setText()
- Метод setTheme()
- Метод stop()
- Метод resume()
API для работы с экземплярами
- Получение экземпляра уведомления
- Хранение ссылки на уведомление
- Проверка существования уведомления
- Получение свойств уведомления
- Изменение свойств после создания
Глобальные методы
- Noty.setMaxVisible()
- Noty.closeAll()
- Noty.clearQueue()
- Noty.button()
- Настройка defaults
- Перезапись дефолтных значений
Стилизация и кастомизация
- Переопределение стилей через CSS
- Структура классов Noty
- Изменение цветов
- Изменение размеров
- Изменение шрифтов
- Адаптивная верстка уведомлений
- Использование CSS-переменных
Контейнеры
- Параметр container
- Встраивание в конкретный элемент
- Селекторы для контейнеров
- Ограничения при использовании контейнеров
- Позиционирование внутри контейнера
Убийство уведомлений
- Автоматическое убийство старых уведомлений
- Параметр killer
- Логика замещения
- Управление видимыми уведомлениями
Accessibility
- Поддержка ARIA-атрибутов
- Роли для скринридеров
- Навигация с клавиатуры
- Объявление уведомлений
Работа с мобильными устройствами
- Адаптация под маленькие экраны
- Тач-события
- Оптимизация производительности
- Особенности iOS и Android
- Позиционирование на мобильных
Интеграция с фреймворками
- Использование с jQuery
- Интеграция в React
- Интеграция в Vue.js
- Интеграция в Angular
- Работа с TypeScript
Производительность
- Оптимизация рендеринга
- Управление памятью
- Удаление DOM-элементов
- Ограничение количества уведомлений
- Профилирование и отладка
Отладка и обработка ошибок
- Включение режима отладки
- Логирование в консоль
- Обработка ошибок в колбэках
- Типичные проблемы и решения
- Валидация параметров
Миграция и обновление
- Изменения между версиями
- Устаревшие методы и параметры
- Процесс обновления
- Обратная совместимость
- Решение конфликтов
Расширенные техники
- Цепочка уведомлений
- Группировка связанных уведомлений
- Динамическое обновление содержимого
- Вложенные уведомления
- Уведомления с формами ввода
- Комплексные интерактивные элементы
Безопасность
- XSS и HTML-инъекции
- Санитизация пользовательского ввода
- Безопасное использование HTML
- Валидация данных
- Content Security Policy
Тестирование
- Юнит-тесты для уведомлений
- Тестирование колбэков
- Мокирование Noty
- Автоматизация проверок
Лучшие практики
- Когда использовать уведомления
- Выбор типа уведомления
- Оптимальное время показа
- Количество одновременных уведомлений
- Текст сообщений
- UX рекомендации
- Частые ошибки и антипаттерны
Справочник API
- Полный список параметров
- Полный список событий
- Типы данных
- Константы и перечисления