User Interactions

/**
 * Base interaction class for handling user input
 * @param options - Interaction configuration
 */
class Interaction {
  constructor(options?: InteractionOptions);
  
  /** Get whether the interaction is active */
  getActive(): boolean;
  /** Set whether the interaction is active */
  setActive(active: boolean): void;
  
  /** Get the map associated with this interaction */
  getMap(): Map;
}

interface InteractionOptions {
  /** Function to test if interaction should handle event */
  handleEvent?: (event: MapBrowserEvent) => boolean;
}

/**
 * Double-click zoom interaction
 * @param options - Double-click zoom configuration
 */
class DoubleClickZoom extends Interaction {
  constructor(options?: DoubleClickZoomOptions);
}

interface DoubleClickZoomOptions {
  /** Animation duration in milliseconds */
  duration?: number;
  /** Zoom delta */
  delta?: number;
}

/**
 * Drag pan interaction for moving the map
 * @param options - Drag pan configuration
 */
class DragPan extends Interaction {
  constructor(options?: DragPanOptions);
}

interface DragPanOptions {
  /** Condition for activating pan */
  condition?: EventCondition;
  /** Kinetic scrolling */
  kinetic?: Kinetic;
}

/**
 * Drag rotate interaction for rotating the map
 * @param options - Drag rotate configuration
 */
class DragRotate extends Interaction {
  constructor(options?: DragRotateOptions);
}

interface DragRotateOptions {
  /** Condition for activating rotation */
  condition?: EventCondition;
  /** Animation duration */
  duration?: number;
}

/**
 * Mouse wheel zoom interaction
 * @param options - Mouse wheel zoom configuration
 */
class MouseWheelZoom extends Interaction {
  constructor(options?: MouseWheelZoomOptions);
  
  /** Set whether mouse wheel zoom is active */
  setMouseAnchor(useAnchor: boolean): void;
}

interface MouseWheelZoomOptions {
  /** Condition for activating zoom */
  condition?: EventCondition;
  /** Maximum zoom delta per wheel event */
  maxDelta?: number;
  /** Animation duration */
  duration?: number;
  /** Timeout for ending zoom */
  timeout?: number;
  /** Use mouse position as anchor */
  useAnchor?: boolean;
  /** Constrain resolution */
  constrainResolution?: boolean;
}

/**
 * Keyboard pan interaction
 * @param options - Keyboard pan configuration
 */
class KeyboardPan extends Interaction {
  constructor(options?: KeyboardPanOptions);
}

interface KeyboardPanOptions {
  /** Condition for activating pan */
  condition?: EventCondition;
  /** Animation duration */
  duration?: number;
  /** Pixel delta per key press */
  pixelDelta?: number;
}

/**
 * Keyboard zoom interaction
 * @param options - Keyboard zoom configuration
 */
class KeyboardZoom extends Interaction {
  constructor(options?: KeyboardZoomOptions);
}

interface KeyboardZoomOptions {
  /** Animation duration */
  duration?: number;
  /** Condition for activating zoom */
  condition?: EventCondition;
  /** Zoom delta per key press */
  delta?: number;
}

import { DragPan, MouseWheelZoom, DoubleClickZoom } from 'ol/interaction';
import { platformModifierKeyOnly } from 'ol/events/condition';

// Create custom navigation interactions
const dragPan = new DragPan({
  condition: platformModifierKeyOnly
});

const mouseWheelZoom = new MouseWheelZoom({
  duration: 250,
  useAnchor: true,
  constrainResolution: true
});

const doubleClickZoom = new DoubleClickZoom({
  duration: 500,
  delta: 1
});

// Add to map
map.addInteraction(dragPan);
map.addInteraction(mouseWheelZoom);
map.addInteraction(doubleClickZoom);

/**
 * Pinch zoom interaction for touch devices
 * @param options - Pinch zoom configuration
 */
class PinchZoom extends Interaction {
  constructor(options?: PinchZoomOptions);
}

interface PinchZoomOptions {
  /** Animation duration */
  duration?: number;
  /** Constrain resolution */
  constrainResolution?: boolean;
}

/**
 * Pinch rotate interaction for touch devices
 * @param options - Pinch rotate configuration
 */
class PinchRotate extends Interaction {
  constructor(options?: PinchRotateOptions);
}

interface PinchRotateOptions {
  /** Animation duration */
  duration?: number;
  /** Rotation threshold in radians */
  threshold?: number;
}

/**
 * Feature selection interaction
 * @param options - Select configuration
 */
class Select extends Interaction {
  constructor(options?: SelectOptions);
  
  /** Get selected features */
  getFeatures(): Collection<Feature>;
  /** Set selected features */
  setMap(map: Map): void;
  /** Get layer filter function */
  getLayer(): LayerFilter;
  /** Set hit tolerance */
  setHitTolerance(hitTolerance: number): void;
}

interface SelectOptions {
  /** Condition for selection */
  condition?: EventCondition;
  /** Function to filter selectable layers */
  layers?: Layer[] | ((layer: Layer) => boolean);
  /** Style for selected features */
  style?: StyleLike;
  /** Features collection to sync with */
  features?: Collection<Feature>;
  /** Function to filter selectable features */
  filter?: (feature: Feature, layer: Layer) => boolean;
  /** Hit tolerance in pixels */
  hitTolerance?: number;
  /** Multi-select with toggle */
  multi?: boolean;
  /** Wrap around for multi-world */
  wrapX?: boolean;
}

/**
 * Drawing interaction for creating new geometries
 * @param options - Draw configuration
 */
class Draw extends Interaction {
  constructor(options: DrawOptions);
  
  /** Start drawing */
  setActive(active: boolean): void;
  /** Extend the current drawing */
  extend(feature: Feature): void;
  /** Finish the current drawing */
  finishDrawing(): void;
  /** Remove the last point */
  removeLastPoint(): void;
}

interface DrawOptions {
  /** Geometry type to draw */
  type: GeometryType;
  /** Click tolerance in pixels */
  clickTolerance?: number;
  /** Features collection to add drawn features */
  features?: Collection<Feature>;
  /** Source to add drawn features */
  source?: VectorSource;
  /** Drag vertexes during draw */
  dragVertexDelay?: number;
  /** Snap tolerance */
  snapTolerance?: number;
  /** Stop click propagation */
  stopClick?: boolean;
  /** Maximum points for polygon/linestring */
  maxPoints?: number;
  /** Minimum points for polygon/linestring */
  minPoints?: number;
  /** Finish drawing condition */
  finishCondition?: EventCondition;
  /** Style for drawing */
  style?: StyleLike;
  /** Free-hand drawing */
  freehand?: boolean;
  /** Freehand condition */
  freehandCondition?: EventCondition;
  /** Wrap around for multi-world */
  wrapX?: boolean;
}

/**
 * Feature modification interaction
 * @param options - Modify configuration
 */
class Modify extends Interaction {
  constructor(options: ModifyOptions);
  
  /** Get overlay for vertex styling */
  getOverlay(): VectorSource;
  /** Remove point at pixel */
  removePoint(): boolean;
}

interface ModifyOptions {
  /** Condition for modification */
  condition?: EventCondition;
  /** Features to modify */
  features?: Collection<Feature>;
  /** Delete condition */
  deleteCondition?: EventCondition;
  /** Insert vertex condition */
  insertVertexCondition?: EventCondition;
  /** Pixel tolerance */
  pixelTolerance?: number;
  /** Style for modification handles */
  style?: StyleLike;
  /** Source to modify */
  source?: VectorSource;
  /** Hit detection */
  hitDetection?: Layer | Layer[];
  /** Wrap around for multi-world */
  wrapX?: boolean;
}

/**
 * Feature translation (drag) interaction
 * @param options - Translate configuration
 */
class Translate extends Interaction {
  constructor(options?: TranslateOptions);
}

interface TranslateOptions {
  /** Features to translate */
  features?: Collection<Feature>;
  /** Layers to consider for translation */
  layers?: Layer[] | ((layer: Layer) => boolean);
  /** Hit tolerance */
  hitTolerance?: number;
}

/**
 * Geometry snapping interaction
 * @param options - Snap configuration
 */
class Snap extends Interaction {
  constructor(options: SnapOptions);
  
  /** Add feature for snapping */
  addFeature(feature: Feature, opt_listen?: boolean): void;
  /** Remove feature from snapping */
  removeFeature(feature: Feature, opt_unlisten?: boolean): void;
}

interface SnapOptions {
  /** Features to snap to */
  features?: Collection<Feature>;
  /** Edge snapping */
  edge?: boolean;
  /** Vertex snapping */
  vertex?: boolean;
  /** Pixel tolerance */
  pixelTolerance?: number;
  /** Source to snap to */
  source?: VectorSource;
}

import { Select, Draw, Modify, Snap } from 'ol/interaction';
import { Vector as VectorLayer } from 'ol/layer';
import { Vector as VectorSource } from 'ol/source';
import { click } from 'ol/events/condition';

// Vector source for features
const source = new VectorSource();

// Selection interaction
const select = new Select({
  condition: click,
  layers: [vectorLayer],
  style: highlightStyle
});

// Drawing interaction
const draw = new Draw({
  source: source,
  type: 'Polygon',
  style: drawStyle
});

// Modification interaction
const modify = new Modify({
  features: select.getFeatures(),
  style: modifyStyle
});

// Snapping interaction
const snap = new Snap({
  source: source,
  pixelTolerance: 10,
  vertex: true,
  edge: true
});

// Add interactions to map
map.addInteraction(select);
map.addInteraction(draw);
map.addInteraction(modify);
map.addInteraction(snap);

// Listen for draw end
draw.on('drawend', (event) => {
  const feature = event.feature;
  console.log('Drew feature:', feature.getGeometry());
});

/** Always activate */
const always: EventCondition;

/** Never activate */
const never: EventCondition;

/** Single click condition */
const click: EventCondition;

/** Single click condition */
const singleClick: EventCondition;

/** Double click condition */
const doubleClick: EventCondition;

/** No modifier keys pressed */
const noModifierKeys: EventCondition;

/** Platform-specific modifier key only (Cmd on Mac, Ctrl on others) */
const platformModifierKeyOnly: EventCondition;

/** Shift key only */
const shiftKeyOnly: EventCondition;

/** Alt key only */
const altKeyOnly: EventCondition;

/** Alt and shift keys only */
const altShiftKeysOnly: EventCondition;

/** Primary action (left click or touch) */
const primaryAction: EventCondition;

/** Pointer move condition */
const pointerMove: EventCondition;

/** Target element is not editable */
const targetNotEditable: EventCondition;

/**
 * Create default map interactions
 * @param options - Configuration for default interactions
 */
function defaults(options?: DefaultsOptions): Collection<Interaction>;

interface DefaultsOptions {
  /** Include alt+shift+drag for rotate and zoom */
  altShiftDragRotate?: boolean;
  /** Include double-click zoom */
  doubleClickZoom?: boolean;
  /** Include keyboard interactions */
  keyboard?: boolean;
  /** Include mouse wheel zoom */
  mouseWheelZoom?: boolean;
  /** Include shift+drag for zoom */
  shiftDragZoom?: boolean;
  /** Include drag pan */
  dragPan?: boolean;
  /** Include pinch rotate (touch) */
  pinchRotate?: boolean;
  /** Include pinch zoom (touch) */
  pinchZoom?: boolean;
  /** Zoom delta */
  zoomDelta?: number;
  /** Zoom duration */
  zoomDuration?: number;
}

import { defaults as defaultInteractions } from 'ol/interaction';

// Use default interactions
const interactions = defaultInteractions({
  doubleClickZoom: false, // Disable double-click zoom
  mouseWheelZoom: true,   // Enable mouse wheel zoom
  dragPan: true,          // Enable drag to pan
  zoomDuration: 250       // Animation duration
});

// Create map with custom interactions
const map = new Map({
  target: 'map',
  interactions: interactions,
  layers: [layer],
  view: view
});

type EventCondition = (event: MapBrowserEvent) => boolean;
type GeometryType = 'Point' | 'LineString' | 'Polygon' | 'MultiPoint' | 'MultiLineString' | 'MultiPolygon' | 'Circle';
type LayerFilter = (layer: Layer) => boolean;