12 KiB

Raw Blame History

Рефакторинг app.js → Модули: Прогресс

Дата начала: 2025-12-25 Стратегия: Постепенная миграция (app.js остаётся рабочим) Статус: 🟡 В процессе

📊 Общий прогресс: 20%

[████░░░░░░░░░░░░░░░░] 20% завершено

Этапы рефакторинга

✅ Этап 1: Подготовка (ЗАВЕРШЁН)

Дата: 2025-12-25 Статус: ✅ Готово

Создать структуру папок static/js/
- js/state/
- js/services/
- js/ui/
- js/utils/
- js/data/
Создать js/config.js с константами

Результат: Структура готова, app.js не тронут ✅

✅ Этап 2: Утилиты (ЗАВЕРШЁН)

Дата: 2025-12-25 Статус: ✅ Готово

2.1. utils/format.utils.js ✅

Строки из app.js: 150-273 Функции (11 шт.):

generateUUID() - генерация UUID
formatTime(seconds) - форматирование времени
formatTimestamp(isoString) - ISO → локальное время
isTableText(text) - проверка на таблицу
parseTextTable(text) - парсинг текстовых таблиц
escapeHtml(text) - экранирование HTML
pluralize(count, one, few, many) - склонение числительных

Экспорт: ES6 named exports ✅

2.2. utils/file.utils.js ✅

Строки из app.js: 262-273, 984-1132 Функции (6 шт.):

downloadJSON(data, filename) - скачать JSON
loadFileAsJSON(file) - загрузить JSON
loadFileAsText(file) - загрузить текст
selectFile(accept) - выбрать файл
downloadText(text, filename) - скачать текст

Экспорт: ES6 named exports ✅

2.3. utils/validation.utils.js ✅

Строки из app.js: 823-860 Функции (4 шт.):

validateJSON(jsonString) - валидация JSON
validateLoginFormat(login) - проверка формата логина (8 цифр)
validateQuestions(questions) - валидация массива вопросов
validateEnvironment(environment) - проверка окружения

Экспорт: ES6 named exports ✅

2.4. utils/dom.utils.js ✅

Строки из app.js: 277-281 + новые Функции (15 шт.):

showElement(element) - показать элемент
hideElement(element) - скрыть элемент
toggleElement(element) - переключить видимость
setElementText(element, text) - установить текст
setElementHTML(element, html) - установить HTML
getInputValue(element) - получить значение input
setInputValue(element, value) - установить значение input
addClass(element, className) - добавить класс
removeClass(element, className) - удалить класс
hasClass(element, className) - проверить класс
showToast(message, type) - показать уведомление
clearChildren(element) - очистить детей
createElement(tag, attributes, parent) - создать элемент

Экспорт: ES6 named exports ✅

🟡 Этап 3: State Management (В ПРОЦЕССЕ)

Дата: - Статус: 🔲 Ожидает

3.1. state/appState.js 🔲

Строки из app.js: 10-51 Что нужно:

Создать класс AppState
Геттеры: getCurrentEnv(), getCurrentEnvSettings()
Сеттеры: setCurrentEnvironment(), updateSettings()
Методы: saveToLocalStorage(), loadFromLocalStorage()
Export: default export singleton

3.2. data/storage.js 🔲

Строки из app.js: 618-642 Что нужно:

saveEnvironmentData(env, data) - сохранить данные окружения
loadEnvironmentData(env) - загрузить данные окружения
clearEnvironmentData(env) - очистить данные
clearAllData() - очистить всё

3.3. data/defaults.js 🔲

Файл: settings.js (перенести) Что нужно:

Экспортировать defaultSettings из settings.js
Адаптировать для использования в модулях

🔲 Этап 4: Services (ОЖИДАЕТ)

Дата: - Статус: 🔲 Ожидает

4.1. services/api-client.js 🔲

Файл: api-client.js (переместить)

Переместить существующий api-client.js в services/
Добавить ES6 экспорт: export default new BriefBenchAPI()
Протестировать импорт

4.2. services/auth.service.js 🔲

Строки из app.js: 60-140 Функции:

checkAuth() - проверка авторизации
login(loginString) - вход
logout() - выход
isAuthenticated() - проверка статуса

4.3. services/settings.service.js 🔲

Строки из app.js: 290-357 Функции:

loadFromServer() - загрузить с сервера
saveToServer(settings) - сохранить на сервер
extractEnvSettings(envSettings) - извлечь настройки окружения
resetToDefaults() - сброс к дефолтным

4.4. services/query.service.js 🔲

Строки из app.js: 861-1063 Функции:

buildRequestBody() - построить тело запроса
sendQuery(env, apiMode, body) - отправить запрос
extractQuestions() - извлечь вопросы из textarea
loadRequestFromFile() - загрузить запрос из файла
loadResponseFromFile() - загрузить ответ из файла

🔲 Этап 5: UI Components (ОЖИДАЕТ)

Дата: - Статус: 🔲 Ожидает

5.1. ui/auth.ui.js 🔲

Строки из app.js: 77-132

showLoginScreen() - показать экран входа
hideLoginScreen() - скрыть экран входа
setupListeners() - подключить обработчики
handleLoginSubmit() - обработка входа

5.2. ui/loading.ui.js 🔲

Строки из app.js: 1137-1145

show(message) - показать загрузку
hide() - скрыть загрузку

5.3. ui/settings.ui.js 🔲

Строки из app.js: 362-813

open() - открыть диалог
close() - закрыть диалог
populate() - заполнить поля
read() - прочитать поля
toggleBackendSettings(show) - показать/скрыть backend настройки
save() - сохранить настройки
reset() - сбросить настройки
export() - экспорт настроек
import() - импорт настроек
setupListeners() - подключить обработчики

5.4. ui/query-builder.ui.js 🔲

Строки из app.js: 643-883, 884-950

show() - показать построитель запросов
switchMode(mode) - переключить режим (questions/raw-json)
validateJSON() - валидация JSON
handleSendQuery() - обработка отправки
setupListeners() - подключить обработчики

5.5. ui/questions-list.ui.js 🔲

Строки из app.js: 1179-1273

render() - рендер списка вопросов
selectAnswer(index) - выбрать ответ
updateCount() - обновить счётчик
hasAnnotations(docsSection) - проверить наличие аннотаций
setupListeners() - подключить обработчики

5.6. ui/answer-viewer.ui.js 🔲

Строки из app.js: 1279-1443

render(index) - рендер ответа
renderBody(elementId, text) - рендер тела ответа
renderDocuments(containerId, docs, ...) - рендер документов
toggleExpansion(id) - раскрыть/свернуть
switchTab(tabButton, tabId) - переключить таб
setupListeners() - подключить обработчики

5.7. ui/annotations.ui.js 🔲

Строки из app.js: 1448-1615

initForAnswer(index) - инициализация аннотаций
loadForAnswer(index) - загрузить аннотации
loadSection(section, data) - загрузить секцию
loadDocuments(section, subsection, docs) - загрузить документы
setupListeners() - подключить обработчики
saveDraft() - сохранить черновик

🔲 Этап 6: Main Entry Point (ОЖИДАЕТ)

Дата: - Статус: 🔲 Ожидает

6.1. js/main.js 🔲

Что нужно:

Импортировать все модули
Функция initApp() - инициализация приложения
Функция setupEnvironmentTabs() - настройка табов
Функция switchEnvironment(env) - переключение окружения
Функция updateUI() - обновление UI
DOMContentLoaded listener - точка входа

🔲 Этап 7: Тестирование (ОЖИДАЕТ)

Дата: - Статус: 🔲 Ожидает

7.1. Ручное тестирование 🔲

Авторизация работает
Загрузка/сохранение настроек
Отправка запросов (bench mode)
Отправка запросов (backend mode)
Отображение ответов
Аннотации сохраняются
Экспорт/импорт работает
Переключение окружений

7.2. Обновление index.html 🔲

Закомментировать старые скрипты:

<!-- <script src="settings.js"></script> -->
<!-- <script src="api-client.js"></script> -->
<!-- <script src="app.js"></script> -->

Подключить новый entry point:

<script type="module" src="js/main.js"></script>

7.3. Очистка 🔲

Удалить старый app.js (или переименовать в app.js.old)
Удалить settings.js (или переименовать)
Переместить api-client.js (если еще не перемещён)
Проверить что всё работает

📈 Статистика

Создано файлов: 5/17

Категория	Создано	Всего	Прогресс
Config	1	1	100% ✅
Utils	4	4	100% ✅
State	0	1	0% 🔲
Data	0	2	0% 🔲
Services	0	4	0% 🔲
UI	0	7	0% 🔲
Main	0	1	0% 🔲

Перенесено функций: ~36/~150

✅ Format utils: 11 функций
✅ File utils: 6 функций
✅ Validation utils: 4 функций
✅ DOM utils: 15 функций
🔲 Остальное: ~114 функций

🎯 Следующий шаг

Этап 3: State Management

Создать:

state/appState.js - глобальное состояние
data/storage.js - обёртка localStorage
data/defaults.js - дефолтные настройки

📝 Заметки

app.js (1671 строка) остаётся рабочим до конца рефакторинга
Все новые модули используют ES6 синтаксис
Экспорты: named exports для utils, default export для сервисов/UI
Модули полностью автономны и тестируемы

Последнее обновление: 2025-12-25 (Этап 2 завершён)

12 KiB Raw Blame History Unescape Escape

Рефакторинг app.js → Модули: Прогресс

📊 Общий прогресс: 20%

Этапы рефакторинга

✅ Этап 1: Подготовка (ЗАВЕРШЁН)

✅ Этап 2: Утилиты (ЗАВЕРШЁН)

2.1. utils/format.utils.js ✅

2.2. utils/file.utils.js ✅

2.3. utils/validation.utils.js ✅

2.4. utils/dom.utils.js ✅

🟡 Этап 3: State Management (В ПРОЦЕССЕ)

3.1. state/appState.js 🔲

3.2. data/storage.js 🔲

3.3. data/defaults.js 🔲

🔲 Этап 4: Services (ОЖИДАЕТ)

4.1. services/api-client.js 🔲

4.2. services/auth.service.js 🔲

4.3. services/settings.service.js 🔲

4.4. services/query.service.js 🔲

🔲 Этап 5: UI Components (ОЖИДАЕТ)

5.1. ui/auth.ui.js 🔲

5.2. ui/loading.ui.js 🔲

5.3. ui/settings.ui.js 🔲

5.4. ui/query-builder.ui.js 🔲

5.5. ui/questions-list.ui.js 🔲

5.6. ui/answer-viewer.ui.js 🔲

5.7. ui/annotations.ui.js 🔲

🔲 Этап 6: Main Entry Point (ОЖИДАЕТ)

6.1. js/main.js 🔲

🔲 Этап 7: Тестирование (ОЖИДАЕТ)

7.1. Ручное тестирование 🔲

7.2. Обновление index.html 🔲

7.3. Очистка 🔲

📈 Статистика

Создано файлов: 5/17

Перенесено функций: ~36/~150

🎯 Следующий шаг

📝 Заметки

12 KiB

Raw Blame History