Removes excessive logging statements
Cleans up the codebase by removing unnecessary console log statements. These logs were primarily used for debugging and are no longer needed in the production code. This reduces noise in the console and improves overall performance.
This commit is contained in:
Janus Knudsen
parent
383eab7524
commit
fafad16926
24 changed files with 4 additions and 275 deletions
4
build.js
4
build.js
|
|
@ -23,7 +23,6 @@ async function renameFiles(dir) {
|
|||
if (baseName !== kebabName) {
|
||||
const newPath = join(dirname(fullPath), kebabName + '.js');
|
||||
await rename(fullPath, newPath);
|
||||
console.log(`Renamed: ${entry.name} -> ${kebabName}.js`);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -32,7 +31,6 @@ async function renameFiles(dir) {
|
|||
// Build with esbuild
|
||||
async function build() {
|
||||
try {
|
||||
console.log('Building TypeScript files...');
|
||||
|
||||
await esbuild.build({
|
||||
entryPoints: ['src/index.ts'],
|
||||
|
|
@ -46,9 +44,7 @@ async function build() {
|
|||
platform: 'browser'
|
||||
});
|
||||
|
||||
console.log('Bundle created: js/calendar.js');
|
||||
|
||||
console.log('Build completed successfully!');
|
||||
} catch (error) {
|
||||
console.error('Build failed:', error);
|
||||
process.exit(1);
|
||||
|
|
|
|||
|
|
@ -67,10 +67,7 @@ export class EventBus {
|
|||
cancelable: true
|
||||
});
|
||||
|
||||
// Log event
|
||||
if (this.debug) {
|
||||
console.log(`📢 Event: ${eventType}`, detail);
|
||||
}
|
||||
|
||||
|
||||
this.eventLog.push({
|
||||
type: eventType,
|
||||
|
|
|
|||
|
|
@ -529,7 +529,6 @@
|
|||
if (e.target.classList.contains('month-day-cell') || e.target.closest('.month-day-cell')) {
|
||||
const cell = e.target.closest('.month-day-cell');
|
||||
const dayNumber = cell.querySelector('.month-day-number').textContent;
|
||||
console.log('Day clicked:', dayNumber);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -163,10 +163,8 @@ export class CalendarConfig {
|
|||
// Set calendar mode
|
||||
if (typeParam === 'resource' || typeParam === 'date') {
|
||||
this.calendarMode = typeParam;
|
||||
console.log(`CalendarConfig: Calendar mode set to '${this.calendarMode}' from URL parameter`);
|
||||
} else {
|
||||
this.calendarMode = 'date'; // Default
|
||||
console.log(`CalendarConfig: Calendar mode defaulted to '${this.calendarMode}'`);
|
||||
}
|
||||
|
||||
// Set selected date
|
||||
|
|
@ -174,14 +172,11 @@ export class CalendarConfig {
|
|||
const parsedDate = new Date(dateParam);
|
||||
if (!isNaN(parsedDate.getTime())) {
|
||||
this.selectedDate = parsedDate;
|
||||
console.log(`CalendarConfig: Selected date set to '${this.selectedDate.toISOString()}' from URL parameter`);
|
||||
} else {
|
||||
console.warn(`CalendarConfig: Invalid date parameter '${dateParam}', using current date`);
|
||||
this.selectedDate = new Date();
|
||||
}
|
||||
} else {
|
||||
this.selectedDate = new Date(); // Default to today
|
||||
console.log(`CalendarConfig: Selected date defaulted to today: ${this.selectedDate.toISOString()}`);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -62,7 +62,6 @@ export class EventBus implements IEventBus {
|
|||
emit(eventType: string, detail: any = {}): boolean {
|
||||
// Validate eventType
|
||||
if (!eventType || typeof eventType !== 'string') {
|
||||
console.error('EventBus.emit: Invalid eventType provided', eventType);
|
||||
return false;
|
||||
}
|
||||
|
||||
|
|
@ -103,9 +102,6 @@ export class EventBus implements IEventBus {
|
|||
const { emoji, color } = this.getCategoryStyle(category);
|
||||
|
||||
// Use collapsed group to reduce visual noise
|
||||
console.groupCollapsed(`%c${emoji} ${category.toUpperCase()}`, `color: ${color}; font-weight: bold`);
|
||||
console.log(`Event: ${eventType}`, detail);
|
||||
console.groupEnd();
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -113,7 +109,6 @@ export class EventBus implements IEventBus {
|
|||
*/
|
||||
private extractCategory(eventType: string): string {
|
||||
if (!eventType || typeof eventType !== 'string') {
|
||||
console.error('EventBus.extractCategory: Invalid eventType', eventType);
|
||||
return 'unknown';
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -27,7 +27,6 @@ export class CalendarTypeFactory {
|
|||
*/
|
||||
static initialize(): void {
|
||||
if (this.isInitialized) {
|
||||
console.warn('CalendarModeFactory: Already initialized, skipping');
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -45,7 +44,6 @@ export class CalendarTypeFactory {
|
|||
});
|
||||
|
||||
this.isInitialized = true;
|
||||
console.log('CalendarModeFactory: Initialized with default renderers', Array.from(this.renderers.keys()));
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -53,7 +51,6 @@ export class CalendarTypeFactory {
|
|||
*/
|
||||
static registerRenderers(type: CalendarMode, config: RendererConfig): void {
|
||||
this.renderers.set(type, config);
|
||||
console.log(`CalendarModeFactory: Registered renderers for type '${type}'`);
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -63,7 +60,6 @@ export class CalendarTypeFactory {
|
|||
const renderers = this.renderers.get(type);
|
||||
|
||||
if (!renderers) {
|
||||
console.warn(`CalendarModeFactory: No renderers found for type '${type}', falling back to 'date'`);
|
||||
return this.renderers.get('date')!;
|
||||
}
|
||||
|
||||
|
|
@ -110,6 +106,5 @@ export class CalendarTypeFactory {
|
|||
*/
|
||||
static clear(): void {
|
||||
this.renderers.clear();
|
||||
console.log('CalendarModeFactory: All renderers cleared');
|
||||
}
|
||||
}
|
||||
|
|
@ -37,7 +37,6 @@ export class ManagerFactory {
|
|||
calendarManager: CalendarManager;
|
||||
dragDropManager: DragDropManager;
|
||||
} {
|
||||
console.log('🏭 ManagerFactory: Creating managers with proper DI...');
|
||||
|
||||
// Create managers in dependency order
|
||||
const eventManager = new EventManager(eventBus);
|
||||
|
|
@ -58,7 +57,6 @@ export class ManagerFactory {
|
|||
scrollManager
|
||||
);
|
||||
|
||||
console.log('✅ ManagerFactory: All managers created successfully');
|
||||
|
||||
return {
|
||||
eventManager,
|
||||
|
|
@ -79,13 +77,10 @@ export class ManagerFactory {
|
|||
calendarManager: CalendarManager;
|
||||
[key: string]: any;
|
||||
}): Promise<void> {
|
||||
console.log('🚀 ManagerFactory: Initializing managers...');
|
||||
|
||||
try {
|
||||
await managers.calendarManager.initialize();
|
||||
console.log('✅ ManagerFactory: All managers initialized successfully');
|
||||
} catch (error) {
|
||||
console.error('❌ ManagerFactory: Manager initialization failed:', error);
|
||||
throw error;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,14 +8,12 @@ import { ManagerFactory } from './factories/ManagerFactory.js';
|
|||
* Initialize the calendar application with simple direct calls
|
||||
*/
|
||||
async function initializeCalendar(): Promise<void> {
|
||||
console.log('🗓️ Initializing Calendar Plantempus with factory pattern...');
|
||||
|
||||
try {
|
||||
// Use the singleton calendar configuration
|
||||
const config = calendarConfig;
|
||||
|
||||
// Initialize the CalendarTypeFactory before creating managers
|
||||
console.log('🏭 Initializing CalendarTypeFactory...');
|
||||
CalendarTypeFactory.initialize();
|
||||
|
||||
// Create managers using factory pattern
|
||||
|
|
@ -28,8 +26,6 @@ async function initializeCalendar(): Promise<void> {
|
|||
// Initialize all managers
|
||||
await managerFactory.initializeManagers(managers);
|
||||
|
||||
console.log('🎊 Calendar Plantempus initialized successfully!');
|
||||
console.log('📊 Initialization Report:', managers.calendarManager.getInitializationReport());
|
||||
|
||||
// Expose to window for debugging
|
||||
(window as any).calendarDebug = {
|
||||
|
|
@ -38,7 +34,6 @@ async function initializeCalendar(): Promise<void> {
|
|||
};
|
||||
|
||||
} catch (error) {
|
||||
console.error('💥 Calendar initialization failed:', error);
|
||||
throw error;
|
||||
}
|
||||
}
|
||||
|
|
@ -47,11 +42,9 @@ async function initializeCalendar(): Promise<void> {
|
|||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
initializeCalendar().catch(error => {
|
||||
console.error('Failed to initialize calendar:', error);
|
||||
});
|
||||
});
|
||||
});
|
||||
} else {
|
||||
initializeCalendar().catch(error => {
|
||||
console.error('Failed to initialize calendar:', error);
|
||||
});
|
||||
}
|
||||
|
|
@ -43,7 +43,6 @@ export class CalendarManager {
|
|||
this.eventFilterManager = new EventFilterManager();
|
||||
this.dateCalculator = new DateCalculator(config);
|
||||
this.setupEventListeners();
|
||||
console.log('📋 CalendarManager: Created with proper dependency injection');
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -51,23 +50,18 @@ export class CalendarManager {
|
|||
*/
|
||||
public async initialize(): Promise<void> {
|
||||
if (this.isInitialized) {
|
||||
console.warn('CalendarManager is already initialized');
|
||||
return;
|
||||
}
|
||||
|
||||
console.log('🚀 CalendarManager: Starting simple initialization');
|
||||
|
||||
try {
|
||||
// Debug: Check calendar type
|
||||
const calendarType = this.config.getCalendarMode();
|
||||
console.log(`🔍 CalendarManager: Initializing ${calendarType} calendar`);
|
||||
|
||||
// Step 1: Load data
|
||||
console.log('📊 Loading event data...');
|
||||
await this.eventManager.loadData();
|
||||
|
||||
// Step 2: Pass data to GridManager and render grid structure
|
||||
console.log('🏗️ Rendering grid...');
|
||||
if (calendarType === 'resource') {
|
||||
const resourceData = this.eventManager.getResourceData();
|
||||
this.gridManager.setResourceData(resourceData);
|
||||
|
|
@ -76,7 +70,6 @@ export class CalendarManager {
|
|||
|
||||
// Step 2b: Trigger event rendering now that data is loaded
|
||||
// Re-emit GRID_RENDERED to trigger EventRendererManager
|
||||
console.log('🎨 Triggering event rendering...');
|
||||
const gridContainer = document.querySelector('swp-calendar-container');
|
||||
if (gridContainer) {
|
||||
const periodRange = this.gridManager.getDisplayDates();
|
||||
|
|
@ -90,19 +83,15 @@ export class CalendarManager {
|
|||
}
|
||||
|
||||
// Step 3: Initialize scroll synchronization
|
||||
console.log('📜 Setting up scroll synchronization...');
|
||||
this.scrollManager.initialize();
|
||||
|
||||
// Step 4: Set initial view and date BEFORE event rendering
|
||||
console.log('⚙️ Setting initial view and date...');
|
||||
this.setView(this.currentView);
|
||||
this.setCurrentDate(this.currentDate);
|
||||
|
||||
// Step 5: Event rendering will be triggered by GRID_RENDERED event
|
||||
console.log('🎨 Event rendering will be triggered automatically by grid events...');
|
||||
|
||||
this.isInitialized = true;
|
||||
console.log('✅ CalendarManager: Simple initialization complete');
|
||||
|
||||
// Emit initialization complete event
|
||||
this.eventBus.emit(CoreEvents.INITIALIZED, {
|
||||
|
|
@ -111,7 +100,6 @@ export class CalendarManager {
|
|||
});
|
||||
|
||||
} catch (error) {
|
||||
console.error('❌ CalendarManager initialization failed:', error);
|
||||
throw error;
|
||||
}
|
||||
}
|
||||
|
|
@ -127,7 +115,6 @@ export class CalendarManager {
|
|||
const previousView = this.currentView;
|
||||
this.currentView = view;
|
||||
|
||||
console.log(`Changing view from ${previousView} to ${view}`);
|
||||
|
||||
// Emit view change event
|
||||
this.eventBus.emit(CoreEvents.VIEW_CHANGED, {
|
||||
|
|
@ -145,7 +132,6 @@ export class CalendarManager {
|
|||
public setCurrentDate(date: Date): void {
|
||||
// Validate input date
|
||||
if (!date || !(date instanceof Date) || isNaN(date.getTime())) {
|
||||
console.error('CalendarManager.setCurrentDate: Invalid date provided', date);
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -156,7 +142,6 @@ export class CalendarManager {
|
|||
const prevDateStr = previousDate && !isNaN(previousDate.getTime()) ? previousDate.toISOString() : 'Invalid Date';
|
||||
const newDateStr = this.currentDate.toISOString();
|
||||
|
||||
console.log(`Changing date from ${prevDateStr} to ${newDateStr}`);
|
||||
|
||||
// Emit date change event
|
||||
this.eventBus.emit(CoreEvents.DATE_CHANGED, {
|
||||
|
|
@ -235,7 +220,6 @@ export class CalendarManager {
|
|||
* Genindlæs calendar data
|
||||
*/
|
||||
public refresh(): void {
|
||||
console.log('Refreshing calendar...');
|
||||
|
||||
this.eventBus.emit(CoreEvents.REFRESH_REQUESTED, {
|
||||
view: this.currentView,
|
||||
|
|
@ -247,7 +231,6 @@ export class CalendarManager {
|
|||
* Ryd calendar og nulstil til standard tilstand
|
||||
*/
|
||||
public reset(): void {
|
||||
console.log('Resetting calendar...');
|
||||
|
||||
this.currentView = 'week';
|
||||
this.currentDate = new Date();
|
||||
|
|
@ -265,7 +248,6 @@ export class CalendarManager {
|
|||
// Listen for workweek changes only
|
||||
this.eventBus.on(CoreEvents.WORKWEEK_CHANGED, (event: Event) => {
|
||||
const customEvent = event as CustomEvent;
|
||||
console.log('CalendarManager: Workweek changed to', customEvent.detail.workWeekId);
|
||||
this.handleWorkweekChange();
|
||||
|
||||
// Also update week info display since workweek affects date range display
|
||||
|
|
@ -379,7 +361,6 @@ export class CalendarManager {
|
|||
* Handle workweek configuration changes
|
||||
*/
|
||||
private handleWorkweekChange(): void {
|
||||
console.log('CalendarManager: Handling workweek change - forcing full grid rebuild');
|
||||
|
||||
// Force a complete grid rebuild by clearing existing structure
|
||||
const container = document.querySelector('swp-calendar-container');
|
||||
|
|
@ -401,7 +382,6 @@ export class CalendarManager {
|
|||
* Re-render events after grid structure changes
|
||||
*/
|
||||
private rerenderEvents(): void {
|
||||
console.log('CalendarManager: Re-rendering events for new workweek');
|
||||
|
||||
// Get current period data to determine date range
|
||||
const periodData = this.calculateCurrentPeriod();
|
||||
|
|
@ -409,7 +389,6 @@ export class CalendarManager {
|
|||
// Find the grid container to render events in
|
||||
const container = document.querySelector('swp-calendar-container');
|
||||
if (!container) {
|
||||
console.warn('CalendarManager: No container found for event re-rendering');
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -426,19 +405,16 @@ export class CalendarManager {
|
|||
*/
|
||||
private updateWeekInfoForWorkweekChange(): void {
|
||||
// Don't do anything here - let GRID_RENDERED event handle it
|
||||
console.log('CalendarManager: Workweek changed - week info will update after grid renders');
|
||||
}
|
||||
|
||||
/**
|
||||
* Update week info based on actual rendered columns
|
||||
*/
|
||||
private updateWeekInfoFromRenderedColumns(): void {
|
||||
console.log('CalendarManager: Updating week info from rendered columns');
|
||||
|
||||
// Get actual dates from rendered columns
|
||||
const columns = document.querySelectorAll('swp-day-column');
|
||||
if (columns.length === 0) {
|
||||
console.warn('CalendarManager: No columns found for week info update');
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -450,7 +426,6 @@ export class CalendarManager {
|
|||
const lastDateStr = lastColumn.dataset.date;
|
||||
|
||||
if (!firstDateStr || !lastDateStr) {
|
||||
console.warn('CalendarManager: Column dates not found');
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -464,13 +439,6 @@ export class CalendarManager {
|
|||
// Format date range
|
||||
const dateRange = this.dateCalculator.formatDateRange(firstDate, lastDate);
|
||||
|
||||
console.log('CalendarManager: Week info from columns:', {
|
||||
firstDate: firstDateStr,
|
||||
lastDate: lastDateStr,
|
||||
weekNumber,
|
||||
dateRange
|
||||
});
|
||||
|
||||
// Emit week info update
|
||||
this.eventBus.emit(CoreEvents.WEEK_CHANGED, {
|
||||
weekNumber,
|
||||
|
|
|
|||
|
|
@ -52,7 +52,6 @@ export class DragDropManager {
|
|||
*/
|
||||
public setSnapInterval(minutes: number): void {
|
||||
this.snapIntervalMinutes = minutes;
|
||||
console.log(`DragDropManager: Snap interval set to ${minutes} minutes (${this.snapDistancePx}px)`);
|
||||
}
|
||||
|
||||
private init(): void {
|
||||
|
|
@ -126,10 +125,6 @@ export class DragDropManager {
|
|||
column: this.currentColumn
|
||||
});
|
||||
|
||||
console.log('DragDropManager: Drag started', {
|
||||
eventId: this.draggedEventId,
|
||||
column: this.currentColumn
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -156,10 +151,6 @@ export class DragDropManager {
|
|||
mouseOffset: this.mouseOffset
|
||||
});
|
||||
|
||||
console.log(`DragDropManager: Drag moved ${this.snapIntervalMinutes} minutes`, {
|
||||
snappedY,
|
||||
column
|
||||
});
|
||||
}
|
||||
|
||||
// Check for auto-scroll
|
||||
|
|
@ -168,7 +159,6 @@ export class DragDropManager {
|
|||
// Check for column change
|
||||
const newColumn = this.detectColumn(event.clientX, event.clientY);
|
||||
if (newColumn && newColumn !== this.currentColumn) {
|
||||
console.log(`DragDropManager: Column changed from ${this.currentColumn} to ${newColumn}`);
|
||||
this.currentColumn = newColumn;
|
||||
|
||||
this.eventBus.emit('drag:column-change', {
|
||||
|
|
@ -203,11 +193,6 @@ export class DragDropManager {
|
|||
finalY
|
||||
});
|
||||
|
||||
console.log('DragDropManager: Drag ended', {
|
||||
eventId: this.draggedEventId,
|
||||
finalColumn,
|
||||
finalY
|
||||
});
|
||||
|
||||
// Clean up
|
||||
this.draggedEventId = null;
|
||||
|
|
@ -263,7 +248,6 @@ export class DragDropManager {
|
|||
if (!this.scrollContainer) {
|
||||
this.scrollContainer = document.querySelector('swp-scrollable-content') as HTMLElement;
|
||||
if (!this.scrollContainer) {
|
||||
console.warn('DragDropManager: Could not find swp-scrollable-content for auto-scroll');
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -35,7 +35,6 @@ export class EventFilterManager {
|
|||
this.searchInput = document.querySelector('swp-search-container input[type="search"]');
|
||||
|
||||
if (!this.searchInput) {
|
||||
console.warn('EventFilterManager: Search input not found');
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -113,7 +112,6 @@ export class EventFilterManager {
|
|||
|
||||
private applyFilter(query: string): void {
|
||||
if (!this.fuse) {
|
||||
console.warn('EventFilterManager: Cannot filter - Fuse not initialized');
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -12,10 +12,8 @@ export class EventManager {
|
|||
private events: CalendarEvent[] = [];
|
||||
|
||||
constructor(eventBus: IEventBus) {
|
||||
console.log('EventManager: Constructor called');
|
||||
this.eventBus = eventBus;
|
||||
this.setupEventListeners();
|
||||
console.log('EventManager: Waiting for CALENDAR_INITIALIZED before loading data');
|
||||
}
|
||||
|
||||
private setupEventListeners(): void {
|
||||
|
|
@ -28,17 +26,10 @@ export class EventManager {
|
|||
* Public method to load data - called directly by CalendarManager
|
||||
*/
|
||||
public async loadData(): Promise<void> {
|
||||
console.log('EventManager: Loading data via direct call');
|
||||
await this.loadMockData();
|
||||
console.log(`EventManager: Data loaded successfully - ${this.events.length} events`);
|
||||
|
||||
// Debug: Log first few events
|
||||
if (this.events.length > 0) {
|
||||
console.log('EventManager: First event:', {
|
||||
title: this.events[0].title,
|
||||
start: this.events[0].start,
|
||||
end: this.events[0].end
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -47,7 +38,6 @@ export class EventManager {
|
|||
const calendarType = calendarConfig.getCalendarMode();
|
||||
let jsonFile: string;
|
||||
|
||||
console.log(`EventManager: Calendar type detected: '${calendarType}'`);
|
||||
|
||||
if (calendarType === 'resource') {
|
||||
jsonFile = '/src/data/mock-resource-events.json';
|
||||
|
|
@ -55,7 +45,6 @@ export class EventManager {
|
|||
jsonFile = '/src/data/mock-events.json';
|
||||
}
|
||||
|
||||
console.log(`EventManager: Loading ${calendarType} calendar data from ${jsonFile}`);
|
||||
|
||||
const response = await fetch(jsonFile);
|
||||
if (!response.ok) {
|
||||
|
|
@ -63,7 +52,6 @@ export class EventManager {
|
|||
}
|
||||
|
||||
const data = await response.json();
|
||||
console.log(`EventManager: Loaded data for ${calendarType} calendar`);
|
||||
|
||||
// Store raw data for GridManager
|
||||
this.rawData = data;
|
||||
|
|
@ -71,7 +59,6 @@ export class EventManager {
|
|||
// Process data for internal use
|
||||
this.processCalendarData(calendarType, data);
|
||||
} catch (error) {
|
||||
console.error('EventManager: Failed to load mock events:', error);
|
||||
this.events = []; // Fallback to empty array
|
||||
}
|
||||
}
|
||||
|
|
@ -87,17 +74,14 @@ export class EventManager {
|
|||
resourceEmployeeId: resource.employeeId
|
||||
}))
|
||||
);
|
||||
console.log(`EventManager: Processed ${this.events.length} events from ${resourceData.resources.length} resources`);
|
||||
} else {
|
||||
this.events = data as CalendarEvent[];
|
||||
console.log(`EventManager: Processed ${this.events.length} date events`);
|
||||
}
|
||||
}
|
||||
|
||||
private syncEvents(): void {
|
||||
// Events are synced during initialization
|
||||
// This method maintained for internal state management only
|
||||
console.log(`EventManager: Internal sync - ${this.events.length} events in memory`);
|
||||
}
|
||||
|
||||
public getEvents(): CalendarEvent[] {
|
||||
|
|
@ -122,7 +106,6 @@ export class EventManager {
|
|||
* Get events for a specific time period
|
||||
*/
|
||||
public getEventsForPeriod(startDate: Date, endDate: Date): CalendarEvent[] {
|
||||
console.log(`EventManager.getEventsForPeriod: Checking ${this.events.length} events for period ${startDate.toDateString()} - ${endDate.toDateString()}`);
|
||||
return this.events.filter(event => {
|
||||
const eventStart = new Date(event.start);
|
||||
const eventEnd = new Date(event.end);
|
||||
|
|
|
|||
|
|
@ -22,7 +22,6 @@ export class GridManager {
|
|||
private eventCleanup: (() => void)[] = [];
|
||||
|
||||
constructor() {
|
||||
console.log('🏗️ GridManager: Constructor called with Strategy Pattern');
|
||||
|
||||
// Default to week view strategy
|
||||
this.currentStrategy = new WeekViewStrategy();
|
||||
|
|
@ -34,12 +33,10 @@ export class GridManager {
|
|||
this.findElements();
|
||||
this.subscribeToEvents();
|
||||
|
||||
console.log('GridManager: Initialized with strategy pattern');
|
||||
}
|
||||
|
||||
private findElements(): void {
|
||||
this.container = document.querySelector('swp-calendar-container');
|
||||
console.log('GridManager: Found container:', !!this.container);
|
||||
}
|
||||
|
||||
private subscribeToEvents(): void {
|
||||
|
|
@ -69,7 +66,6 @@ export class GridManager {
|
|||
* Switch to a different view strategy
|
||||
*/
|
||||
public switchViewStrategy(view: CalendarView): void {
|
||||
console.log(`GridManager: Switching to ${view} strategy`);
|
||||
|
||||
// Clean up current strategy
|
||||
this.currentStrategy.destroy();
|
||||
|
|
@ -84,7 +80,6 @@ export class GridManager {
|
|||
this.currentStrategy = new MonthViewStrategy();
|
||||
break;
|
||||
default:
|
||||
console.warn(`GridManager: Unknown view type ${view}, defaulting to week`);
|
||||
this.currentStrategy = new WeekViewStrategy();
|
||||
}
|
||||
|
||||
|
|
@ -97,7 +92,6 @@ export class GridManager {
|
|||
*/
|
||||
public setResourceData(resourceData: ResourceCalendarData | null): void {
|
||||
this.resourceData = resourceData;
|
||||
console.log('GridManager: Updated resource data');
|
||||
this.render();
|
||||
}
|
||||
|
||||
|
|
@ -106,11 +100,9 @@ export class GridManager {
|
|||
*/
|
||||
public async render(): Promise<void> {
|
||||
if (!this.container) {
|
||||
console.warn('GridManager: No container found, cannot render');
|
||||
return;
|
||||
}
|
||||
|
||||
console.log(`🎨 GridManager: Rendering ${this.currentDate.toDateString()} using ${this.currentStrategy.constructor.name}`);
|
||||
|
||||
// Create context for strategy
|
||||
const context: ViewContext = {
|
||||
|
|
@ -128,7 +120,6 @@ export class GridManager {
|
|||
// Get period range from current strategy
|
||||
const periodRange = this.currentStrategy.getPeriodRange(this.currentDate);
|
||||
|
||||
console.log(`GridManager: Emitting GRID_RENDERED for main container with period ${periodRange.startDate.toDateString()} - ${periodRange.endDate.toDateString()}`);
|
||||
|
||||
// Emit grid rendered event with explicit date range
|
||||
eventBus.emit(CoreEvents.GRID_RENDERED, {
|
||||
|
|
@ -140,7 +131,6 @@ export class GridManager {
|
|||
columnCount: layoutConfig.columnCount
|
||||
});
|
||||
|
||||
console.log(`✅ Grid rendered with ${layoutConfig.columnCount} columns`);
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -208,7 +198,6 @@ export class GridManager {
|
|||
* Clean up all resources
|
||||
*/
|
||||
public destroy(): void {
|
||||
console.log('GridManager: Cleaning up');
|
||||
|
||||
// Clean up event listeners
|
||||
this.eventCleanup.forEach(cleanup => cleanup());
|
||||
|
|
|
|||
|
|
@ -18,7 +18,6 @@ export class NavigationManager {
|
|||
private animationQueue: number = 0;
|
||||
|
||||
constructor(eventBus: IEventBus, eventRenderer: EventRenderingService) {
|
||||
console.log('🧭 NavigationManager: Constructor called');
|
||||
this.eventBus = eventBus;
|
||||
this.dateCalculator = new DateCalculator(calendarConfig);
|
||||
this.navigationRenderer = new NavigationRenderer(eventBus, calendarConfig, eventRenderer);
|
||||
|
|
@ -30,13 +29,11 @@ export class NavigationManager {
|
|||
private init(): void {
|
||||
this.setupEventListeners();
|
||||
// Don't update week info immediately - wait for DOM to be ready
|
||||
console.log('NavigationManager: Waiting for CALENDAR_INITIALIZED before updating DOM');
|
||||
}
|
||||
|
||||
private setupEventListeners(): void {
|
||||
// Initial DOM update when calendar is initialized
|
||||
this.eventBus.on(CoreEvents.INITIALIZED, () => {
|
||||
console.log('NavigationManager: Received CALENDAR_INITIALIZED, updating week info');
|
||||
this.updateWeekInfo();
|
||||
});
|
||||
|
||||
|
|
@ -75,13 +72,11 @@ export class NavigationManager {
|
|||
|
||||
// Validate date before processing
|
||||
if (!dateFromEvent) {
|
||||
console.warn('NavigationManager: No currentDate provided in DATE_CHANGED event', customEvent.detail);
|
||||
return;
|
||||
}
|
||||
|
||||
const targetDate = new Date(dateFromEvent);
|
||||
if (isNaN(targetDate.getTime())) {
|
||||
console.warn('NavigationManager: Invalid currentDate in DATE_CHANGED event', dateFromEvent);
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -146,19 +141,15 @@ export class NavigationManager {
|
|||
const currentGrid = container?.querySelector('swp-grid-container:not([data-prerendered])');
|
||||
|
||||
if (!container || !currentGrid) {
|
||||
console.warn('NavigationManager: Required DOM elements not found');
|
||||
return;
|
||||
}
|
||||
|
||||
console.group(`🎬 NAVIGATION ANIMATION: ${direction} to ${targetWeek.toDateString()}`);
|
||||
console.log('1. Creating new container with events...');
|
||||
|
||||
let newGrid: HTMLElement;
|
||||
|
||||
// Always create a fresh container for consistent behavior
|
||||
newGrid = this.navigationRenderer.renderContainer(container as HTMLElement, targetWeek);
|
||||
|
||||
console.log('2. Starting slide animation...');
|
||||
|
||||
// Clear any existing transforms before animation
|
||||
newGrid.style.transform = '';
|
||||
|
|
@ -185,7 +176,6 @@ export class NavigationManager {
|
|||
|
||||
// Handle animation completion
|
||||
slideInAnimation.addEventListener('finish', () => {
|
||||
console.log('3. Animation finished, cleaning up...');
|
||||
|
||||
// Cleanup: Remove all old grids except the new one
|
||||
const allGrids = container.querySelectorAll('swp-grid-container');
|
||||
|
|
@ -215,8 +205,6 @@ export class NavigationManager {
|
|||
weekStart: this.currentWeek
|
||||
});
|
||||
|
||||
console.log('✅ Animation completed successfully');
|
||||
console.groupEnd();
|
||||
});
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -94,7 +94,6 @@ export class ViewManager {
|
|||
const previousView = this.currentView;
|
||||
this.currentView = newView;
|
||||
|
||||
console.log(`ViewManager: Changing view from ${previousView} to ${newView}`);
|
||||
|
||||
this.updateViewButtons();
|
||||
|
||||
|
|
@ -105,7 +104,6 @@ export class ViewManager {
|
|||
}
|
||||
|
||||
private changeWorkweek(workweekId: string): void {
|
||||
console.log(`ViewManager: Changing workweek to ${workweekId}`);
|
||||
|
||||
// Update the calendar config
|
||||
calendarConfig.setWorkWeek(workweekId);
|
||||
|
|
|
|||
|
|
@ -39,7 +39,6 @@ export class DateColumnRenderer implements ColumnRenderer {
|
|||
const dateSettings = config.getDateViewSettings();
|
||||
const daysToShow = dates.slice(0, dateSettings.weekDays);
|
||||
|
||||
console.log('DateColumnRenderer: About to render', daysToShow.length, 'date columns with work hours');
|
||||
|
||||
daysToShow.forEach((date) => {
|
||||
const column = document.createElement('swp-day-column');
|
||||
|
|
@ -61,7 +60,6 @@ export class DateColumnRenderer implements ColumnRenderer {
|
|||
if (workHours === 'off') {
|
||||
// No work hours - mark as off day (full day will be colored)
|
||||
(column as any).dataset.workHours = 'off';
|
||||
console.log(`DateColumnRenderer: ${this.dateCalculator.formatISODate(date)} is an off day`);
|
||||
} else {
|
||||
// Calculate and apply non-work hours overlays (before and after work)
|
||||
const nonWorkStyle = this.workHoursManager.calculateNonWorkHoursStyle(workHours);
|
||||
|
|
@ -72,7 +70,6 @@ export class DateColumnRenderer implements ColumnRenderer {
|
|||
// After work overlay (::after pseudo-element)
|
||||
column.style.setProperty('--after-work-top', `${nonWorkStyle.afterWorkTop}px`);
|
||||
|
||||
console.log(`DateColumnRenderer: ${this.dateCalculator.formatISODate(date)} non-work overlays - before: ${nonWorkStyle.beforeWorkHeight}px, after: ${nonWorkStyle.afterWorkTop}px (work hours: ${workHours.start}-${workHours.end})`);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -87,11 +84,9 @@ export class ResourceColumnRenderer implements ColumnRenderer {
|
|||
const { resourceData } = context;
|
||||
|
||||
if (!resourceData) {
|
||||
console.warn('ResourceColumnRenderer: No resource data available for resource columns');
|
||||
return;
|
||||
}
|
||||
|
||||
console.log('ResourceColumnRenderer: About to render', resourceData.resources.length, 'resource columns');
|
||||
|
||||
resourceData.resources.forEach((resource) => {
|
||||
const column = document.createElement('swp-resource-column');
|
||||
|
|
|
|||
|
|
@ -71,7 +71,6 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
if (this.draggedClone && targetDate) {
|
||||
// Scenario 1: Timed event being dragged to header - convert to all-day
|
||||
if (this.draggedClone.tagName === 'SWP-EVENT') {
|
||||
console.log('EventRenderer: Converting timed event to all-day for date:', targetDate);
|
||||
headerRenderer.addToAllDay(element);
|
||||
this.convertToAllDayPreview(targetDate);
|
||||
}
|
||||
|
|
@ -80,7 +79,6 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
else if (this.draggedClone.tagName === 'SWP-ALLDAY-EVENT') {
|
||||
const currentDate = this.draggedClone.parentElement?.getAttribute('data-date');
|
||||
if (currentDate !== targetDate) {
|
||||
console.log('EventRenderer: Moving all-day event from', currentDate, 'to', targetDate);
|
||||
this.moveAllDayToNewDate(targetDate);
|
||||
}
|
||||
}
|
||||
|
|
@ -105,7 +103,6 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
if (dayHeader) {
|
||||
const targetDate = dayHeader.dataset.date;
|
||||
if (targetDate && this.draggedClone.tagName === 'SWP-EVENT') {
|
||||
console.log(`EventRenderer: Mouse over day header for date ${targetDate}`);
|
||||
|
||||
// Find the header renderer from the calendar header
|
||||
const calendarHeader = dayHeader.closest('swp-calendar-header');
|
||||
|
|
@ -153,13 +150,11 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
const duration = timeElement.getAttribute('data-duration');
|
||||
if (duration) {
|
||||
const durationMinutes = parseInt(duration);
|
||||
console.log(`EventRenderer: Read duration ${durationMinutes} minutes from data-duration attribute`);
|
||||
return durationMinutes;
|
||||
}
|
||||
}
|
||||
|
||||
// Fallback to 60 minutes if attribute not found
|
||||
console.warn('EventRenderer: No data-duration found, using fallback 60 minutes');
|
||||
return 60;
|
||||
}
|
||||
|
||||
|
|
@ -179,7 +174,6 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
const originalDurationMinutes = this.getOriginalEventDuration(originalEvent);
|
||||
clone.dataset.originalDuration = originalDurationMinutes.toString();
|
||||
|
||||
console.log(`EventRenderer: Clone created with ${originalDurationMinutes} minutes duration from data-duration`);
|
||||
|
||||
// Style for dragging
|
||||
clone.style.position = 'absolute';
|
||||
|
|
@ -221,7 +215,6 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
const newTimeText = `${this.formatTime(startTotalMinutes)} - ${this.formatTime(endTotalMinutes)}`;
|
||||
timeElement.textContent = newTimeText;
|
||||
|
||||
console.log(`EventRenderer: Updated timestamp to ${newTimeText} (${cachedDuration} min duration)`);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -259,13 +252,6 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
private handleDragStart(originalElement: HTMLElement, eventId: string, mouseOffset: any, column: string): void {
|
||||
this.originalEvent = originalElement;
|
||||
|
||||
console.log('EventRenderer: Starting drag on element:', {
|
||||
eventId,
|
||||
tagName: originalElement.tagName,
|
||||
currentOpacity: originalElement.style.opacity,
|
||||
hasDataDuration: !!originalElement.querySelector('swp-event-time')?.getAttribute('data-duration')
|
||||
});
|
||||
|
||||
// Create clone
|
||||
this.draggedClone = this.createEventClone(originalElement);
|
||||
|
||||
|
|
@ -279,7 +265,6 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
originalElement.style.opacity = '0.3';
|
||||
originalElement.style.userSelect = 'none';
|
||||
|
||||
console.log('EventRenderer: Drag started - original set to opacity 0.3, clone created');
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -294,7 +279,6 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
// Update timestamp display
|
||||
this.updateCloneTimestamp(this.draggedClone, snappedY);
|
||||
|
||||
console.log('EventRenderer: Clone position and timestamp updated');
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -307,7 +291,6 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
const newColumnElement = document.querySelector(`swp-day-column[data-date="${newColumn}"]`);
|
||||
if (newColumnElement && this.draggedClone.parentElement !== newColumnElement) {
|
||||
newColumnElement.appendChild(this.draggedClone);
|
||||
console.log(`EventRenderer: Clone moved to column ${newColumn}`);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -315,19 +298,12 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
* Handle drag end event
|
||||
*/
|
||||
private handleDragEnd(eventId: string, originalElement: HTMLElement, finalColumn: string, finalY: number): void {
|
||||
console.log('EventRenderer: Handling drag end', {
|
||||
hasClone: !!this.draggedClone,
|
||||
hasOriginal: !!this.originalEvent,
|
||||
originalOpacity: this.originalEvent?.style.opacity
|
||||
});
|
||||
|
||||
if (!this.draggedClone || !this.originalEvent) {
|
||||
console.warn('EventRenderer: Missing clone or original element at drag end');
|
||||
return;
|
||||
}
|
||||
|
||||
// Fade out original
|
||||
console.log('EventRenderer: Fading out original element');
|
||||
this.fadeOutAndRemove(this.originalEvent);
|
||||
|
||||
// Remove clone prefix and normalize clone to be a regular event
|
||||
|
|
@ -342,13 +318,11 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
this.draggedClone.style.userSelect = '';
|
||||
this.draggedClone.style.zIndex = '';
|
||||
|
||||
console.log('EventRenderer: Clone normalized to regular event with ID:', this.draggedClone.dataset.eventId);
|
||||
|
||||
// Clean up
|
||||
this.draggedClone = null;
|
||||
this.originalEvent = null;
|
||||
|
||||
console.log('EventRenderer: Drag completed and cleaned up');
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -366,7 +340,6 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
// Expand header if needed
|
||||
headerRenderer.addToAllDay(this.draggedClone.parentElement);
|
||||
|
||||
console.log(`EventRenderer: Converted to all-day event for date ${targetDate}`);
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -441,7 +414,6 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
// Transform clone to all-day format
|
||||
this.transformCloneToAllDay(this.draggedClone, targetDate);
|
||||
|
||||
console.log(`EventRenderer: Converted clone to all-day preview for ${targetDate}`);
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -474,10 +446,8 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
allDayContainer.appendChild(this.draggedClone);
|
||||
}
|
||||
|
||||
console.log(`EventRenderer: Moved all-day event to date ${targetDate}, column ${columnIndex}`);
|
||||
}
|
||||
renderEvents(events: CalendarEvent[], container: HTMLElement, config: CalendarConfig): void {
|
||||
console.log('BaseEventRenderer: renderEvents called with', events.length, 'events');
|
||||
|
||||
// NOTE: Removed clearEvents() to support sliding animation
|
||||
// With sliding animation, multiple grid containers exist simultaneously
|
||||
|
|
@ -488,31 +458,25 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
const allDayEvents = events.filter(event => event.allDay);
|
||||
const regularEvents = events.filter(event => !event.allDay);
|
||||
|
||||
console.log(`BaseEventRenderer: Rendering ${allDayEvents.length} all-day events and ${regularEvents.length} regular events`);
|
||||
|
||||
// Always call renderAllDayEvents to ensure height is set correctly (even to 0)
|
||||
this.renderAllDayEvents(allDayEvents, container, config);
|
||||
|
||||
// Find columns in the specific container for regular events
|
||||
const columns = this.getColumns(container);
|
||||
console.log(`BaseEventRenderer: Found ${columns.length} columns in container`);
|
||||
|
||||
columns.forEach(column => {
|
||||
const columnEvents = this.getEventsForColumn(column, regularEvents);
|
||||
console.log(`BaseEventRenderer: Rendering ${columnEvents.length} regular events in column`);
|
||||
|
||||
const eventsLayer = column.querySelector('swp-events-layer');
|
||||
if (eventsLayer) {
|
||||
columnEvents.forEach(event => {
|
||||
console.log(`BaseEventRenderer: Rendering event "${event.title}" in events layer`);
|
||||
this.renderEvent(event, eventsLayer, config);
|
||||
});
|
||||
|
||||
// Debug: Verify events were actually added
|
||||
const renderedEvents = eventsLayer.querySelectorAll('swp-event');
|
||||
console.log(`BaseEventRenderer: Events layer now has ${renderedEvents.length} events`);
|
||||
} else {
|
||||
console.warn('BaseEventRenderer: No events layer found in column');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
@ -525,19 +489,16 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
* Render all-day events in the header row 2
|
||||
*/
|
||||
protected renderAllDayEvents(allDayEvents: CalendarEvent[], container: HTMLElement, config: CalendarConfig): void {
|
||||
console.log(`BaseEventRenderer: Rendering ${allDayEvents.length} all-day events using nested grid`);
|
||||
|
||||
// Find the calendar header
|
||||
const calendarHeader = container.querySelector('swp-calendar-header');
|
||||
if (!calendarHeader) {
|
||||
console.warn('BaseEventRenderer: No calendar header found for all-day events');
|
||||
return;
|
||||
}
|
||||
|
||||
// Find the all-day container
|
||||
const allDayContainer = calendarHeader.querySelector('swp-allday-container') as HTMLElement;
|
||||
if (!allDayContainer) {
|
||||
console.warn('BaseEventRenderer: No swp-allday-container found - HeaderRenderer should create this');
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -617,13 +578,11 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
|
||||
allDayContainer.appendChild(allDayEvent);
|
||||
|
||||
console.log(`BaseEventRenderer: Placed "${event.title}" in row ${row}, columns ${span.startColumn} to ${span.startColumn + span.columnSpan - 1}`);
|
||||
});
|
||||
|
||||
// Update height based on max row
|
||||
this.updateAllDayHeight(maxRow);
|
||||
|
||||
console.log(`BaseEventRenderer: Created ${maxRow} rows with auto-expanding grid`);
|
||||
}
|
||||
|
||||
protected renderEvent(event: CalendarEvent, container: Element, config: CalendarConfig): void {
|
||||
|
|
@ -654,17 +613,8 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
<swp-event-title>${event.title}</swp-event-title>
|
||||
`;
|
||||
|
||||
console.log(`BaseEventRenderer: Rendered "${event.title}" with ${durationMinutes} minutes duration`);
|
||||
|
||||
container.appendChild(eventElement);
|
||||
|
||||
console.log(`BaseEventRenderer: Created event element for "${event.title}":`, {
|
||||
top: eventElement.style.top,
|
||||
height: eventElement.style.height,
|
||||
dataType: eventElement.dataset.type,
|
||||
position: eventElement.style.position,
|
||||
innerHTML: eventElement.innerHTML
|
||||
});
|
||||
}
|
||||
|
||||
protected calculateEventPosition(event: CalendarEvent, config: CalendarConfig): { top: number; height: number } {
|
||||
|
|
@ -687,16 +637,6 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
const durationMinutes = endMinutes - startMinutes;
|
||||
const height = (durationMinutes / 60) * hourHeight;
|
||||
|
||||
console.log('Event positioning calculation:', {
|
||||
eventTime: `${startDate.getHours()}:${startDate.getMinutes()}`,
|
||||
startMinutes,
|
||||
endMinutes,
|
||||
dayStartMinutes,
|
||||
dayStartHour,
|
||||
hourHeight,
|
||||
top,
|
||||
height
|
||||
});
|
||||
|
||||
return { top, height };
|
||||
}
|
||||
|
|
@ -716,18 +656,17 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
*/
|
||||
private updateAllDayHeight(maxRows: number): void {
|
||||
const root = document.documentElement;
|
||||
const eventHeight = parseInt(getComputedStyle(root).getPropertyValue('--allday-event-height') || '26');
|
||||
const eventHeight = parseInt(getComputedStyle(root).getPropertyValue('--all-day-event-height'));
|
||||
const calculatedHeight = maxRows * eventHeight;
|
||||
root.style.setProperty('--all-day-row-height', `${calculatedHeight}px`);
|
||||
|
||||
// Update grid-template-rows for all swp-allday-containers
|
||||
const allDayContainers = document.querySelectorAll('swp-allday-container');
|
||||
allDayContainers.forEach(container => {
|
||||
const gridRows = `repeat(${maxRows}, var(--allday-event-height, 26px))`;
|
||||
const gridRows = `repeat(${maxRows}, var(--all-day-event-height))`;
|
||||
(container as HTMLElement).style.gridTemplateRows = gridRows;
|
||||
});
|
||||
|
||||
console.log(`BaseEventRenderer: Set all-day height to ${calculatedHeight}px and grid-template-rows to ${maxRows} rows`);
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -778,10 +717,6 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
? container.querySelectorAll(selector)
|
||||
: document.querySelectorAll(selector);
|
||||
|
||||
if (existingEvents.length > 0) {
|
||||
console.log(`BaseEventRenderer: Clearing ${existingEvents.length} events`,
|
||||
container ? 'from container' : 'globally');
|
||||
}
|
||||
existingEvents.forEach(event => event.remove());
|
||||
}
|
||||
}
|
||||
|
|
@ -793,19 +728,16 @@ export class DateEventRenderer extends BaseEventRenderer {
|
|||
constructor(config: CalendarConfig) {
|
||||
super(config);
|
||||
this.setupDragEventListeners();
|
||||
console.log('DateEventRenderer: Drag event listeners setup');
|
||||
}
|
||||
|
||||
protected getColumns(container: HTMLElement): HTMLElement[] {
|
||||
const columns = container.querySelectorAll('swp-day-column');
|
||||
console.log('DateEventRenderer: Found', columns.length, 'day columns in container');
|
||||
return Array.from(columns) as HTMLElement[];
|
||||
}
|
||||
|
||||
protected getEventsForColumn(column: HTMLElement, events: CalendarEvent[]): CalendarEvent[] {
|
||||
const columnDate = column.dataset.date;
|
||||
if (!columnDate) {
|
||||
console.log(`DateEventRenderer: Column has no dataset.date`);
|
||||
return [];
|
||||
}
|
||||
|
||||
|
|
@ -814,15 +746,10 @@ export class DateEventRenderer extends BaseEventRenderer {
|
|||
const eventDateStr = this.dateCalculator.formatISODate(eventDate);
|
||||
const matches = eventDateStr === columnDate;
|
||||
|
||||
if (!matches) {
|
||||
if(event.title == 'Architecture Planning')
|
||||
console.log(`DateEventRenderer: Event ${event.title} (${eventDateStr}) does not match column (${columnDate})`);
|
||||
}
|
||||
|
||||
return matches;
|
||||
});
|
||||
|
||||
console.log(`DateEventRenderer: Column ${columnDate} has ${columnEvents.length} events from ${events.length} total`);
|
||||
return columnEvents;
|
||||
}
|
||||
}
|
||||
|
|
@ -833,7 +760,6 @@ export class DateEventRenderer extends BaseEventRenderer {
|
|||
export class ResourceEventRenderer extends BaseEventRenderer {
|
||||
protected getColumns(container: HTMLElement): HTMLElement[] {
|
||||
const columns = container.querySelectorAll('swp-resource-column');
|
||||
console.log('ResourceEventRenderer: Found', columns.length, 'resource columns in container');
|
||||
return Array.from(columns) as HTMLElement[];
|
||||
}
|
||||
|
||||
|
|
@ -845,7 +771,6 @@ export class ResourceEventRenderer extends BaseEventRenderer {
|
|||
return event.resource?.name === resourceName;
|
||||
});
|
||||
|
||||
console.log(`ResourceEventRenderer: Resource ${resourceName} has ${columnEvents.length} events`);
|
||||
return columnEvents;
|
||||
}
|
||||
}
|
||||
|
|
@ -30,11 +30,9 @@ export class EventRenderingService {
|
|||
* Render events in a specific container for a given period
|
||||
*/
|
||||
public renderEvents(context: RenderContext): void {
|
||||
console.log(` 📅 Getting events for ${context.startDate.toDateString()} - ${context.endDate.toDateString()}`);
|
||||
|
||||
// Clear existing events in the specific container first
|
||||
this.strategy.clearEvents(context.container);
|
||||
console.log(` 🧹 Cleared existing events in container`);
|
||||
|
||||
// Get events from EventManager for the period
|
||||
const events = this.eventManager.getEventsForPeriod(
|
||||
|
|
@ -42,16 +40,13 @@ export class EventRenderingService {
|
|||
context.endDate
|
||||
);
|
||||
|
||||
console.log(` 📊 Found ${events.length} events for period`);
|
||||
|
||||
if (events.length === 0) {
|
||||
console.log(' ⚠️ No events to render for this period');
|
||||
return;
|
||||
}
|
||||
|
||||
// Use cached strategy to render events in the specific container
|
||||
this.strategy.renderEvents(events, context.container, calendarConfig);
|
||||
console.log(` ✅ Rendered ${events.length} events successfully`);
|
||||
|
||||
// Emit EVENTS_RENDERED event for filtering system
|
||||
this.eventBus.emit(CoreEvents.EVENTS_RENDERED, {
|
||||
|
|
@ -63,18 +58,15 @@ export class EventRenderingService {
|
|||
private setupEventListeners(): void {
|
||||
// Event-driven rendering: React to grid and container events
|
||||
this.eventBus.on(CoreEvents.GRID_RENDERED, (event: Event) => {
|
||||
console.log('EventRenderer: Received GRID_RENDERED event');
|
||||
this.handleGridRendered(event as CustomEvent);
|
||||
});
|
||||
|
||||
// CONTAINER_READY_FOR_EVENTS removed - events are now pre-rendered synchronously
|
||||
// this.eventBus.on(EventTypes.CONTAINER_READY_FOR_EVENTS, (event: Event) => {
|
||||
// console.log('EventRenderer: Received CONTAINER_READY_FOR_EVENTS event');
|
||||
// this.handleContainerReady(event as CustomEvent);
|
||||
// });
|
||||
|
||||
this.eventBus.on(CoreEvents.VIEW_CHANGED, (event: Event) => {
|
||||
console.log('EventRenderer: Received VIEW_CHANGED event');
|
||||
this.handleViewChanged(event as CustomEvent);
|
||||
});
|
||||
}
|
||||
|
|
@ -87,7 +79,6 @@ export class EventRenderingService {
|
|||
const { container, startDate, endDate, currentDate } = event.detail;
|
||||
|
||||
if (!container) {
|
||||
console.error('EventRenderer: No container in GRID_RENDERED event', event.detail);
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -99,10 +90,8 @@ export class EventRenderingService {
|
|||
periodStart = startDate;
|
||||
periodEnd = endDate;
|
||||
} else if (currentDate) {
|
||||
console.error('EventRenderer: GRID_RENDERED events must include explicit startDate and endDate', event.detail);
|
||||
return;
|
||||
} else {
|
||||
console.error('EventRenderer: No date information in GRID_RENDERED event', event.detail);
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -120,7 +109,6 @@ export class EventRenderingService {
|
|||
const { container, startDate, endDate } = event.detail;
|
||||
|
||||
if (!container || !startDate || !endDate) {
|
||||
console.error('EventRenderer: Invalid CONTAINER_READY_FOR_EVENTS event data', event.detail);
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -139,10 +127,8 @@ export class EventRenderingService {
|
|||
this.clearEvents();
|
||||
|
||||
// New rendering will be triggered by subsequent GRID_RENDERED event
|
||||
console.log('EventRenderer: Cleared events for view change, waiting for GRID_RENDERED');
|
||||
}
|
||||
private clearEvents(container?: HTMLElement): void {
|
||||
console.log(`EventRenderer: Clearing events`, container ? 'in container' : 'globally');
|
||||
this.strategy.clearEvents(container);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -24,31 +24,22 @@ export class GridRenderer {
|
|||
currentWeek: Date,
|
||||
resourceData: ResourceCalendarData | null
|
||||
): void {
|
||||
console.log('GridRenderer: renderGrid called', {
|
||||
hasGrid: !!grid,
|
||||
hasCurrentWeek: !!currentWeek,
|
||||
currentWeek: currentWeek
|
||||
});
|
||||
|
||||
if (!grid || !currentWeek) {
|
||||
console.warn('GridRenderer: Cannot render - missing grid or currentWeek');
|
||||
return;
|
||||
}
|
||||
|
||||
// Only clear and rebuild if grid is empty (first render)
|
||||
if (grid.children.length === 0) {
|
||||
console.log('GridRenderer: First render - creating grid structure');
|
||||
// Create POC structure: header-spacer + time-axis + grid-container
|
||||
this.createHeaderSpacer(grid);
|
||||
this.createTimeAxis(grid);
|
||||
this.createGridContainer(grid, currentWeek, resourceData);
|
||||
} else {
|
||||
console.log('GridRenderer: Re-render - updating existing structure');
|
||||
// Just update the calendar header for all-day events
|
||||
this.updateCalendarHeader(grid, currentWeek, resourceData);
|
||||
}
|
||||
|
||||
console.log('GridRenderer: Grid rendered successfully with POC structure');
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -69,7 +60,6 @@ export class GridRenderer {
|
|||
const startHour = gridSettings.dayStartHour;
|
||||
const endHour = gridSettings.dayEndHour;
|
||||
|
||||
console.log('GridRenderer: Creating time axis - startHour:', startHour, 'endHour:', endHour);
|
||||
|
||||
for (let hour = startHour; hour < endHour; hour++) {
|
||||
const marker = document.createElement('swp-hour-marker');
|
||||
|
|
@ -151,7 +141,6 @@ export class GridRenderer {
|
|||
currentWeek: Date,
|
||||
resourceData: ResourceCalendarData | null
|
||||
): void {
|
||||
console.log('GridRenderer: renderColumnContainer called');
|
||||
const calendarType = this.config.getCalendarMode();
|
||||
const columnRenderer = CalendarTypeFactory.getColumnRenderer(calendarType);
|
||||
|
||||
|
|
@ -223,11 +212,6 @@ export class GridRenderer {
|
|||
return; // No valid element found
|
||||
}
|
||||
|
||||
console.log('GridRenderer: Detected hover over:', {
|
||||
elementType: dayHeader ? 'day-header' : 'all-day-container',
|
||||
targetDate,
|
||||
element: hoveredElement
|
||||
});
|
||||
|
||||
// Get the header renderer for addToAllDay functionality
|
||||
const calendarType = this.config.getCalendarMode();
|
||||
|
|
|
|||
|
|
@ -36,7 +36,6 @@ export class GridStyleManager {
|
|||
calendar.setAttribute('data-fit-to-width', gridSettings.fitToWidth.toString());
|
||||
}
|
||||
|
||||
console.log('GridStyleManager: Updated grid styles with', columnCount, 'columns for', calendarType, 'calendar');
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -99,7 +98,6 @@ export class GridStyleManager {
|
|||
// Set CSS variable for dynamic spacer height
|
||||
document.documentElement.style.setProperty('--all-day-row-height', `${allDayHeight}px`);
|
||||
|
||||
console.log('GridStyleManager: Updated --all-day-row-height to', `${allDayHeight}px`, 'for', allDayEventCount, 'events');
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
|||
|
|
@ -35,7 +35,6 @@ export abstract class BaseHeaderRenderer implements HeaderRenderer {
|
|||
this.createAllDayMainStructure(calendarHeader);
|
||||
this.animateHeaderExpansion(calendarHeader);
|
||||
}
|
||||
console.log('BaseHeaderRenderer: Header expanded for all-day row');
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -44,7 +43,6 @@ export abstract class BaseHeaderRenderer implements HeaderRenderer {
|
|||
*/
|
||||
ensureAllDayContainers(calendarHeader: HTMLElement): void {
|
||||
// Do nothing initially - containers will be created when first needed
|
||||
console.log('BaseHeaderRenderer: All-day containers will be created lazily when first event is dragged');
|
||||
}
|
||||
|
||||
private animateHeaderExpansion(calendarHeader: HTMLElement): void {
|
||||
|
|
@ -108,7 +106,6 @@ export abstract class BaseHeaderRenderer implements HeaderRenderer {
|
|||
// Notify ScrollManager about header height change
|
||||
eventBus.emit('header:height-changed');
|
||||
|
||||
console.log('HeaderRenderer: All-day container animated to visible');
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -120,9 +117,7 @@ export abstract class BaseHeaderRenderer implements HeaderRenderer {
|
|||
// Create simple all-day container (initially hidden)
|
||||
container = document.createElement('swp-allday-container');
|
||||
calendarHeader.appendChild(container);
|
||||
console.log('HeaderRenderer: Created swp-allday-container (initially hidden)');
|
||||
} else {
|
||||
console.log('HeaderRenderer: swp-allday-container already exists');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -179,7 +174,6 @@ export class ResourceHeaderRenderer extends BaseHeaderRenderer {
|
|||
const { resourceData } = context;
|
||||
|
||||
if (!resourceData) {
|
||||
console.warn('ResourceHeaderRenderer: No resource data available for resource headers');
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -198,6 +192,5 @@ export class ResourceHeaderRenderer extends BaseHeaderRenderer {
|
|||
calendarHeader.appendChild(header);
|
||||
});
|
||||
|
||||
console.log(`ResourceHeaderRenderer: Rendered ${resourceData.resources.length} resource headers`);
|
||||
}
|
||||
}
|
||||
|
|
@ -97,8 +97,6 @@ export class NavigationRenderer {
|
|||
public renderContainer(parentContainer: HTMLElement, weekStart: Date): HTMLElement {
|
||||
const weekEnd = this.dateCalculator.addDays(weekStart, 6);
|
||||
|
||||
console.group(`🎨 RENDERING CONTAINER: ${weekStart.toDateString()} - ${weekEnd.toDateString()}`);
|
||||
console.log('1. Creating grid structure...');
|
||||
|
||||
// Create new grid container
|
||||
const newGrid = document.createElement('swp-grid-container');
|
||||
|
|
@ -122,10 +120,8 @@ export class NavigationRenderer {
|
|||
// Add to parent container
|
||||
parentContainer.appendChild(newGrid);
|
||||
|
||||
console.log('2. Rendering headers and columns...');
|
||||
this.renderWeekContentInContainer(newGrid, weekStart);
|
||||
|
||||
console.log('3. Emitting GRID_RENDERED for navigation container...');
|
||||
this.eventBus.emit(CoreEvents.GRID_RENDERED, {
|
||||
container: newGrid, // Specific grid container, not parent
|
||||
currentDate: weekStart,
|
||||
|
|
@ -134,8 +130,6 @@ export class NavigationRenderer {
|
|||
isNavigation: true // Flag to indicate this is navigation rendering
|
||||
});
|
||||
|
||||
console.log('✅ Container ready with GRID_RENDERED event emitted');
|
||||
console.groupEnd();
|
||||
return newGrid;
|
||||
}
|
||||
|
||||
|
|
@ -227,11 +221,6 @@ export class NavigationRenderer {
|
|||
return; // No valid element found
|
||||
}
|
||||
|
||||
console.log('NavigationRenderer: Detected hover over:', {
|
||||
elementType: dayHeader ? 'day-header' : 'all-day-container',
|
||||
targetDate,
|
||||
element: hoveredElement
|
||||
});
|
||||
|
||||
// Get the header renderer for addToAllDay functionality
|
||||
const calendarType = this.config.getCalendarMode();
|
||||
|
|
|
|||
|
|
@ -24,16 +24,11 @@ export class MonthViewStrategy implements ViewStrategy {
|
|||
}
|
||||
|
||||
renderGrid(context: ViewContext): void {
|
||||
console.group(`📅 MONTH VIEW: Rendering grid for ${context.currentDate.toDateString()}`);
|
||||
|
||||
// Clear existing content
|
||||
context.container.innerHTML = '';
|
||||
|
||||
// Create month grid (completely different from week!)
|
||||
this.createMonthGrid(context);
|
||||
|
||||
console.log('Month grid rendered with 7x6 layout');
|
||||
console.groupEnd();
|
||||
}
|
||||
|
||||
private createMonthGrid(context: ViewContext): void {
|
||||
|
|
@ -120,7 +115,6 @@ export class MonthViewStrategy implements ViewStrategy {
|
|||
private renderMonthEvents(container: HTMLElement, events: any[]): void {
|
||||
// TODO: Implement month event rendering
|
||||
// Events will be small blocks in day cells
|
||||
console.log(`MonthViewStrategy: Would render ${events.length} events`);
|
||||
}
|
||||
|
||||
getNextPeriod(currentDate: Date): Date {
|
||||
|
|
@ -159,6 +153,5 @@ export class MonthViewStrategy implements ViewStrategy {
|
|||
}
|
||||
|
||||
destroy(): void {
|
||||
console.log('MonthViewStrategy: Cleaning up');
|
||||
}
|
||||
}
|
||||
|
|
@ -30,8 +30,6 @@ export class WeekViewStrategy implements ViewStrategy {
|
|||
}
|
||||
|
||||
renderGrid(context: ViewContext): void {
|
||||
console.group(`🗓️ WEEK VIEW: Rendering grid for ${context.currentDate.toDateString()}`);
|
||||
|
||||
// Update grid styles
|
||||
this.styleManager.updateGridStyles(context.resourceData);
|
||||
|
||||
|
|
@ -41,9 +39,6 @@ export class WeekViewStrategy implements ViewStrategy {
|
|||
context.currentDate,
|
||||
context.resourceData
|
||||
);
|
||||
|
||||
console.log(`Week grid rendered with ${this.getLayoutConfig().columnCount} columns`);
|
||||
console.groupEnd();
|
||||
}
|
||||
|
||||
getNextPeriod(currentDate: Date): Date {
|
||||
|
|
@ -78,7 +73,5 @@ export class WeekViewStrategy implements ViewStrategy {
|
|||
|
||||
destroy(): void {
|
||||
// Clean up any week-specific resources
|
||||
// For now, just log
|
||||
console.log('WeekViewStrategy: Cleaning up');
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue