logboard/app/docs/ajax-update.md

# AJAX Auto-update для LogBoard+

## Описание

AJAX Auto-update - это система автоматического обновления логов через AJAX запросы, которая позволяет получать новые логи без перезагрузки страницы.

## Основные возможности

- **Автоматическое обновление**: Логи обновляются с заданным интервалом
- **Умное управление кнопкой Refresh**: Кнопка refresh автоматически скрывается при включенном AJAX autoupdate и показывается при выключенном
- **Поддержка Multi-view**: Работает как в single-view, так и в multi-view режимах
- **Настраиваемый интервал**: Интервал обновления настраивается через API
- **Эффективное обновление**: Обновляются только новые логи с момента последнего запроса

## Управление кнопками

### Кнопка Refresh

Кнопка refresh в header автоматически управляется в зависимости от состояния AJAX autoupdate:

- **AJAX autoupdate включен** → Кнопка refresh **скрыта**
- **AJAX autoupdate выключен** → Кнопка refresh **показана**

### Кнопка Update

Кнопка update в header показывает состояние AJAX autoupdate и позволяет переключать его:

- **AJAX autoupdate включен** → Кнопка update **зеленая**
- **AJAX autoupdate выключен** → Кнопка update **красная**
- **Клик по кнопке** → Переключает состояние AJAX autoupdate

### Функции управления

```javascript
/**
 * Обновить видимость кнопки refresh в header
 */
function updateRefreshButtonVisibility() {
  const refreshButtons = document.querySelectorAll('.log-refresh-btn');
  refreshButtons.forEach(btn => {
    if (ajaxUpdateEnabled) {
      // Если ajax autoupdate включен, скрываем кнопку refresh
      btn.style.display = 'none';
    } else {
      // Если ajax autoupdate выключен, показываем кнопку refresh
      btn.style.display = 'inline-flex';
    }
  });
}
```

### Автоматическое обновление видимости

Видимость кнопки refresh автоматически обновляется в следующих случаях:

1. **При инициализации AJAX update**
2. **При изменении состояния чекбокса "Auto-update logs"**
3. **При программном включении/выключении AJAX update**
4. **При переключении состояния через функцию toggleAjaxLogUpdate**

## Настройки

### Интервал обновления

Интервал обновления настраивается через API endpoint `/api/settings`:

```json
{
  "ajax_update_interval": 2000
}
```

По умолчанию используется интервал 2000ms (2 секунды).

### Чекбокс управления

В sidebar есть чекбокс "Auto-update logs", который позволяет пользователю:

- Включить автоматическое обновление
- Выключить автоматическое обновление
- Автоматически управляет видимостью кнопки refresh

## API Endpoints

### Получение настроек

```
GET /api/settings
Authorization: Bearer <token>
```

Ответ:
```json
{
  "ajax_update_interval": 2000
}
```

### Получение логов с поддержкой AJAX

```
GET /api/logs/{container_id}?tail={lines}&since={timestamp}
Authorization: Bearer <token>
```

Параметры:
- `tail`: количество строк для получения (или "all")
- `since`: временная метка последнего обновления (опционально)

## Переменные состояния

```javascript
let ajaxUpdateEnabled = true;        // Состояние AJAX обновления (по умолчанию включен)
let ajaxUpdateIntervalMs = 2000;      // Интервал обновления в миллисекундах
let ajaxUpdateInterval = null;        // ID интервала
const containerStates = new Map();    // Состояние контейнеров для отслеживания обновлений
```

## Функции управления

### enableAjaxLogUpdate(intervalMs)
Включает AJAX обновление логов с заданным интервалом.

### disableAjaxLogUpdate()
Отключает AJAX обновление логов.

### toggleAjaxLogUpdate()
Переключает состояние AJAX обновления.

### performAjaxLogUpdate()
Выполняет одно обновление логов через AJAX.

### updateContainerLogs(containerId, tailLines, token)
Обновляет логи для конкретного контейнера.

### updateRefreshButtonVisibility()
Обновляет видимость кнопки refresh и состояние кнопки update в зависимости от состояния AJAX autoupdate.

### setAjaxUpdateState(enabled)
Обновляет визуальное состояние кнопки update (зеленая/красная) в зависимости от состояния AJAX autoupdate.

## Интеграция с существующим кодом

AJAX update интегрируется с существующими функциями:

- **switchToSingle**: Останавливает AJAX обновление при смене контейнера
- **switchToMultiView**: Останавливает AJAX обновление при переключении в multi-view
- **refreshLogsAndCounters**: Ручное обновление логов (кнопка refresh)

## Логирование

Все операции AJAX update логируются в консоль браузера:

```javascript
console.log('AJAX обновление логов включено с интервалом 2000ms');
console.log('AJAX обновление логов отключено');
console.log('AJAX Update: Обновляем 2 контейнеров: ["container1", "container2"]');
```

## Обработка ошибок

При ошибках AJAX запросов:

- Обновление не останавливается автоматически
- Ошибки логируются в консоль
- Пользователь может вручную отключить обновление через чекбокс

## Совместимость

- Работает с существующими WebSocket соединениями
- Поддерживает все режимы просмотра (single-view, multi-view)
- Совместимо с фильтрацией и настройками уровней логирования