diff --git a/canvas_node.py b/canvas_node.py index 06f2926..feb2c38 100644 --- a/canvas_node.py +++ b/canvas_node.py @@ -24,7 +24,7 @@ import os try: from python.logger import logger, LogLevel, debug, info, warn, error, exception - logger.set_module_level('canvas_node', LogLevel.NONE) + logger.set_module_level('canvas_node', LogLevel.DEBUG) logger.configure({ 'log_to_file': True, diff --git a/js/REFACTORING_GUIDE.md b/js/REFACTORING_GUIDE.md new file mode 100644 index 0000000..bfe1c19 --- /dev/null +++ b/js/REFACTORING_GUIDE.md @@ -0,0 +1,130 @@ +# Przewodnik refaktoryzacji Canvas + +## Podsumowanie wykonanych prac + +Przeprowadzono kompleksową refaktoryzację klasy `Canvas` oraz powiązanych plików w celu poprawy architektury i zastosowania wzorca fasady. + +## Zmiany w architekturze + +### 1. Wzorzec Fasady w `Canvas.js` +Klasa `Canvas` została przekształcona w prawdziwą fasadę: + +#### Struktura przed refaktoryzacją: +- ✗ Dziesiątki metod delegujących (`copySelectedLayers() { return this.canvasLayers.copySelectedLayers(); }`) +- ✗ Canvas jako pośrednik dla wszystkich operacji +- ✗ Trudność w utrzymaniu kodu + +#### Struktura po refaktoryzacji: +- ✅ **Główne operacje fasady**: `loadInitialState()`, `saveState()`, `render()`, `addLayer()` +- ✅ **Publiczne moduły**: `canvas.canvasLayers`, `canvas.canvasInteractions`, `canvas.canvasIO`, `canvas.canvasState` +- ✅ **Metody delegujące**: Zachowane dla kompatybilności, wyraźnie oznaczone jako tymczasowe + +### 2. Nowa struktura `Canvas.js` +``` +Canvas/ +├── Konstruktor i inicjalizacja +│ ├── _initializeModules() +│ └── _setupCanvas() +├── Główne operacje fasady +│ ├── loadInitialState() +│ ├── saveState() +│ ├── render() +│ └── addLayer() +├── Operacje na masce +│ └── startMaskEditor() +├── Metody pomocnicze +│ ├── getMouseWorldCoordinates() +│ ├── updateHistoryButtons() +│ └── incrementOperationCount() +└── Metody delegujące (tymczasowe) + └── [zachowane dla kompatybilności] +``` + +### 3. Aktualizacja `CanvasView.js` +Główny interfejs użytkownika został zaktualizowany aby używać nowego podejścia: + +#### Przykłady zmian: +```javascript +// PRZED +onclick: () => canvas.mirrorHorizontal() + +// PO +onclick: () => canvas.canvasLayers.mirrorHorizontal() + +// PRZED +const imageData = await canvas.getLayerImageData(selectedLayer); + +// PO +const imageData = await canvas.canvasLayers.getLayerImageData(selectedLayer); +``` + +## Mapowanie modułów + +| Moduł | Odpowiedzialność | Przykładowe metody | +|-------|------------------|-------------------| +| `canvasLayers` | Operacje na warstwach | `copySelectedLayers()`, `moveLayerUp()`, `mirrorHorizontal()` | +| `canvasInteractions` | Obsługa interakcji | `handleMouseMove()`, `handleKeyDown()` | +| `canvasIO` | Operacje wejścia/wyjścia | `importLatestImage()`, `sendDataViaWebSocket()` | +| `canvasState` | Zarządzanie stanem | `saveStateToDB()`, `undo()`, `redo()` | +| `canvasRenderer` | Renderowanie | `render()` (wywoływane przez fasadę) | +| `maskTool` | Narzędzie masek | `activate()`, `setBrushSize()` | +| `imageReferenceManager` | Zarządzanie pamięcią | `manualGarbageCollection()` | + +## Instrukcje migracji + +### Stare podejście (przestarzałe) +```javascript +// Bezpośrednie wywołanie metod delegujących +canvas.copySelectedLayers(); +canvas.handleMouseMove(e); +canvas.getLayerImageData(layer); +``` + +### Nowe podejście (zalecane) +```javascript +// Dostęp bezpośrednio do modułów +canvas.canvasLayers.copySelectedLayers(); +canvas.canvasInteractions.handleMouseMove(e); +canvas.canvasLayers.getLayerImageData(layer); + +// Lub użycie głównych operacji fasady +canvas.render(); +canvas.saveState(); +canvas.addLayer(image); +``` + +### Zasady wyboru podejścia +1. **Główne operacje** → Używaj fasady (`canvas.render()`, `canvas.saveState()`) +2. **Operacje specjalistyczne** → Używaj modułów (`canvas.canvasLayers.mirrorHorizontal()`) +3. **Częste operacje** → Metody delegujące zostały zachowane dla kompatybilności + +## Korzyści refaktoryzacji + +### Przed refaktoryzacją: +- 🔴 80+ metod delegujących w klasie Canvas +- 🔴 Każda nowa funkcja wymagała aktualizacji fasady +- 🔴 Trudne debugowanie i śledzenie przepływu danych +- 🔴 Naruszenie zasady Single Responsibility + +### Po refaktoryzacji: +- ✅ **Czysta fasada** z kluczowymi operacjami wysokiego poziomu +- ✅ **Modułowa architektura** z jasnym podziałem odpowiedzialności +- ✅ **Łatwiejsze utrzymanie** - zmiany w module nie wpływają na fasadę +- ✅ **Większa elastyczność** - wybór między uproszczonym a szczegółowym interfejsem +- ✅ **Kompatybilność wsteczna** - istniejący kod nadal działa + +## Kolejne kroki + +1. **Stopniowa migracja** istniejącego kodu do nowego podejścia +2. **Usunięcie metod delegujących** w przyszłych wersjach +3. **Rozszerzenie dokumentacji** dla poszczególnych modułów +4. **Dodanie testów jednostkowych** dla modułów + +## Uwagi dla deweloperów + +- ⚠️ **Metody delegujące** są oznaczone jako tymczasowe i zostaną usunięte +- ✅ **Nowy kod** powinien używać modułów bezpośrednio +- 📚 **Dokumentacja** została zaktualizowana w tym przewodniku +- 🔄 **Kompatybilność** z istniejącym kodem jest zachowana + +Refaktoryzacja została zakończona pomyślnie i system jest gotowy do dalszego rozwoju z lepszą architekturą. diff --git a/js/utils/LoggerUtils.js b/js/utils/LoggerUtils.js index d88afe6..d1cbdbc 100644 --- a/js/utils/LoggerUtils.js +++ b/js/utils/LoggerUtils.js @@ -11,7 +11,7 @@ import {logger, LogLevel} from "../logger.js"; * @param {LogLevel} level - Poziom logowania (domyślnie DEBUG) * @returns {Object} Obiekt z metodami logowania */ -export function createModuleLogger(moduleName, level = LogLevel.NONE) { +export function createModuleLogger(moduleName, level = LogLevel.DEBUG) { logger.setModuleLevel(moduleName, level); return {