Batch update, WIP

src/configurations/CalendarConfig.ts

@@ -0,0 +1,119 @@
+import { ICalendarConfig } from './ICalendarConfig';
+import { IGridSettings } from './GridSettings';
+import { IDateViewSettings } from './DateViewSettings';
+import { ITimeFormatConfig } from './TimeFormatConfig';
+import { IWorkWeekSettings } from './WorkWeekSettings';
+
+/**
+ * All-day event layout constants
+ */
+export const ALL_DAY_CONSTANTS = {
+  EVENT_HEIGHT: 22,
+  EVENT_GAP: 2,
+  CONTAINER_PADDING: 4,
+  MAX_COLLAPSED_ROWS: 4,
+  get SINGLE_ROW_HEIGHT() {
+    return this.EVENT_HEIGHT + this.EVENT_GAP; // 28px
+  }
+} as const;
+
+/**
+ * Work week presets
+ */
+export const WORK_WEEK_PRESETS: { [key: string]: IWorkWeekSettings } = {
+  'standard': {
+    id: 'standard',
+    workDays: [1, 2, 3, 4, 5],
+    totalDays: 5,
+    firstWorkDay: 1
+  },
+  'compressed': {
+    id: 'compressed',
+    workDays: [1, 2, 3, 4],
+    totalDays: 4,
+    firstWorkDay: 1
+  },
+  'midweek': {
+    id: 'midweek',
+    workDays: [3, 4, 5],
+    totalDays: 3,
+    firstWorkDay: 3
+  },
+  'weekend': {
+    id: 'weekend',
+    workDays: [6, 7],
+    totalDays: 2,
+    firstWorkDay: 6
+  },
+  'fullweek': {
+    id: 'fullweek',
+    workDays: [1, 2, 3, 4, 5, 6, 7],
+    totalDays: 7,
+    firstWorkDay: 1
+  }
+};
+
+/**
+ * Configuration - DTO container for all configuration
+ * Pure data object loaded from JSON via ConfigManager
+ */
+export class Configuration {
+  private static _instance: Configuration | null = null;
+
+  public config: ICalendarConfig;
+  public gridSettings: IGridSettings;
+  public dateViewSettings: IDateViewSettings;
+  public timeFormatConfig: ITimeFormatConfig;
+  public currentWorkWeek: string;
+  public selectedDate: Date;
+
+  constructor(
+    config: ICalendarConfig,
+    gridSettings: IGridSettings,
+    dateViewSettings: IDateViewSettings,
+    timeFormatConfig: ITimeFormatConfig,
+    currentWorkWeek: string,
+    selectedDate: Date = new Date()
+  ) {
+    this.config = config;
+    this.gridSettings = gridSettings;
+    this.dateViewSettings = dateViewSettings;
+    this.timeFormatConfig = timeFormatConfig;
+    this.currentWorkWeek = currentWorkWeek;
+    this.selectedDate = selectedDate;
+
+    // Store as singleton instance for web components
+    Configuration._instance = this;
+  }
+
+  /**
+   * Get the current Configuration instance
+   * Used by web components that can't use dependency injection
+   */
+  public static getInstance(): Configuration {
+    if (!Configuration._instance) {
+      throw new Error('Configuration has not been initialized. Call ConfigManager.load() first.');
+    }
+    return Configuration._instance;
+  }
+
+
+  // Helper methods
+  getWorkWeekSettings(): IWorkWeekSettings {
+    return WORK_WEEK_PRESETS[this.currentWorkWeek] || WORK_WEEK_PRESETS['standard'];
+  }
+
+  setWorkWeek(workWeekId: string): void {
+    if (WORK_WEEK_PRESETS[workWeekId]) {
+      this.currentWorkWeek = workWeekId;
+      this.dateViewSettings.weekDays = WORK_WEEK_PRESETS[workWeekId].totalDays;
+    }
+  }
+
+  setSelectedDate(date: Date): void {
+    this.selectedDate = date;
+  }
+}
+
+// Backward compatibility alias
+export { Configuration as CalendarConfig };

src/configurations/ConfigManager.ts

@@ -0,0 +1,55 @@
+import { Configuration } from './CalendarConfig';
+import { ICalendarConfig } from './ICalendarConfig';
+import { TimeFormatter } from '../utils/TimeFormatter';
+
+/**
+ * ConfigManager - Static configuration loader
+ * Loads JSON and creates Configuration instance
+ */
+export class ConfigManager {
+  /**
+   * Load configuration from JSON and create Configuration instance
+   */
+  static async load(): Promise<Configuration> {
+    const response = await fetch('/wwwroot/data/calendar-config.json');
+    if (!response.ok) {
+      throw new Error(`Failed to load config: ${response.statusText}`);
+    }
+
+    const data = await response.json();
+
+    // Build main config
+    const mainConfig: ICalendarConfig = {
+      scrollbarWidth: data.scrollbar.width,
+      scrollbarColor: data.scrollbar.color,
+      scrollbarTrackColor: data.scrollbar.trackColor,
+      scrollbarHoverColor: data.scrollbar.hoverColor,
+      scrollbarBorderRadius: data.scrollbar.borderRadius,
+      allowDrag: data.interaction.allowDrag,
+      allowResize: data.interaction.allowResize,
+      allowCreate: data.interaction.allowCreate,
+      apiEndpoint: data.api.endpoint,
+      dateFormat: data.api.dateFormat,
+      timeFormat: data.api.timeFormat,
+      enableSearch: data.features.enableSearch,
+      enableTouch: data.features.enableTouch,
+      defaultEventDuration: data.eventDefaults.defaultEventDuration,
+      minEventDuration: data.gridSettings.snapInterval,
+      maxEventDuration: data.eventDefaults.maxEventDuration
+    };
+
+    // Create Configuration instance
+    const config = new Configuration(
+      mainConfig,
+      data.gridSettings,
+      data.dateViewSettings,
+      data.timeFormatConfig,
+      data.currentWorkWeek
+    );
+
+    // Configure TimeFormatter
+    TimeFormatter.configure(config.timeFormatConfig);
+
+    return config;
+  }
+}

src/configurations/DateViewSettings.ts

@@ -0,0 +1,11 @@
+import { ViewPeriod } from '../types/CalendarTypes';
+
+/**
+ * View settings for date-based calendar mode
+ */
+export interface IDateViewSettings {
+  period: ViewPeriod;
+  weekDays: number;
+  firstDayOfWeek: number;
+  showAllDay: boolean;
+}

src/configurations/GridSettings.ts

@@ -0,0 +1,25 @@
+/**
+ * Grid display settings interface
+ */
+export interface IGridSettings {
+  dayStartHour: number;
+  dayEndHour: number;
+  workStartHour: number;
+  workEndHour: number;
+  hourHeight: number;
+  snapInterval: number;
+  fitToWidth: boolean;
+  scrollToHour: number | null;
+  gridStartThresholdMinutes: number;
+  showCurrentTime: boolean;
+  showWorkHours: boolean;
+}
+
+/**
+ * Grid settings utility functions
+ */
+export namespace GridSettingsUtils {
+  export function isValidSnapInterval(interval: number): boolean {
+    return [5, 10, 15, 30, 60].includes(interval);
+  }
+}

src/configurations/ICalendarConfig.ts

@@ -0,0 +1,30 @@
+/**
+ * Main calendar configuration interface
+ */
+export interface ICalendarConfig {
+  // Scrollbar styling
+  scrollbarWidth: number;
+  scrollbarColor: string;
+  scrollbarTrackColor: string;
+  scrollbarHoverColor: string;
+  scrollbarBorderRadius: number;
+
+  // Interaction settings
+  allowDrag: boolean;
+  allowResize: boolean;
+  allowCreate: boolean;
+
+  // API settings
+  apiEndpoint: string;
+  dateFormat: string;
+  timeFormat: string;
+
+  // Feature flags
+  enableSearch: boolean;
+  enableTouch: boolean;
+
+  // Event defaults
+  defaultEventDuration: number;
+  minEventDuration: number;
+  maxEventDuration: number;
+}

src/configurations/TimeFormatConfig.ts

@@ -0,0 +1,10 @@
+/**
+ * Time format configuration settings
+ */
+export interface ITimeFormatConfig {
+  timezone: string;
+  use24HourFormat: boolean;
+  locale: string;
+  dateFormat: 'locale' | 'technical';
+  showSeconds: boolean;
+}

src/configurations/WorkWeekSettings.ts

@@ -0,0 +1,9 @@
+/**
+ * Work week configuration settings
+ */
+export interface IWorkWeekSettings {
+  id: string;
+  workDays: number[];
+  totalDays: number;
+  firstWorkDay: number;
+}