/**
 * 항적 Deck.gl 레이어
 * 참조: mda-react-front/src/tracking/layers/trackQueryLayer.ts
 *
 * 정적 레이어 (tracks 변경 시만 재생성):
 *   - PathLayer: 항적 경로 라인 (전체)
 *   - ScatterplotLayer: 항적 포인트 (간인 적용)
 *
 * 동적 레이어 (currentTime 변경 시 재생성, 경량):
 *   - IconLayer: 가상 선박 아이콘
 *   - TextLayer: 선명 라벨
 */
import { PathLayer, ScatterplotLayer, IconLayer, TextLayer } from '@deck.gl/layers';
import { getShipKindTrackColor } from '../../stores/trackStore';
import { useMapStore, THEME_COLORS, THEME_TYPES } from '../../stores/mapStore';
import {
  ICON_ATLAS_MAPPING,
  ICON_MAPPING_KIND_MOVING,
} from '../../types/constants';
import atlasImg from '../../assets/img/icon/atlas.png';

/** 현재 테마 색상 가져오기 */
function getCurrentThemeColors() {
  const { getTheme } = useMapStore.getState();
  const theme = getTheme();
  return THEME_COLORS[theme] || THEME_COLORS[THEME_TYPES.LIGHT];
}

/** 포인트 최대 표시 개수 (초과 시 간인) */
const MAX_POINTS_PER_TRACK = 800;

/**
 * 정적 항적 레이어 생성
 * tracks, showPoints, disabledVesselIds가 변경될 때만 호출
 * currentTime과 무관 - 전체 항적 데이터를 항상 표시
 *
 * @param {Object} params
 * @param {Array} params.tracks - 항적 데이터 배열
 * @param {boolean} params.showPoints - 포인트 표시 여부
 * @param {string} [params.highlightedVesselId] - 하이라이트할 선박 ID
 * @param {Function} [params.onPathHover] - 항적 호버 콜백
 */
export function createStaticTrackLayers({ tracks, showPoints, highlightedVesselId, onPathHover }) {
  const layers = [];
  if (!tracks || tracks.length === 0) return layers;

  // 1. PathLayer - 전체 경로 (시간 무관)
  const pathData = tracks.map((track) => ({
    path: track.geometry,
    color: getShipKindTrackColor(track.shipKindCode),
    vesselId: track.vesselId,
  }));

  layers.push(
    new PathLayer({
      id: 'track-path-layer',
      data: pathData,
      getPath: (d) => d.path,
      getColor: (d) => {
        // 하이라이트된 선박이면 노란색
        if (highlightedVesselId && highlightedVesselId === d.vesselId) {
          return [255, 255, 0, 255];
        }
        return d.color;
      },
      getWidth: (d) => {
        // 하이라이트된 선박이면 더 두껍게
        if (highlightedVesselId && highlightedVesselId === d.vesselId) {
          return 4;
        }
        return 2;
      },
      widthUnits: 'pixels',
      widthMinPixels: 1,
      widthMaxPixels: 8,
      jointRounded: true,
      capRounded: true,
      pickable: true,
      autoHighlight: true,
      highlightColor: [255, 255, 0, 220],
      onHover: (info) => {
        if (onPathHover) {
          onPathHover(info.object?.vesselId ?? null);
        }
      },
      updateTriggers: {
        getColor: [highlightedVesselId],
        getWidth: [highlightedVesselId],
      },
    })
  );

  // 2. ScatterplotLayer - 포인트 (간인 적용)
  if (showPoints) {
    const pointData = [];

    tracks.forEach((track) => {
      const color = getShipKindTrackColor(track.shipKindCode);
      const len = track.geometry.length;

      // 간인: 포인트가 MAX_POINTS_PER_TRACK 초과 시 균등 샘플링
      if (len <= MAX_POINTS_PER_TRACK) {
        // 전부 표시
        for (let i = 0; i < len; i++) {
          pointData.push({ position: track.geometry[i], color });
        }
      } else {
        // 균등 간인 + 시작/끝 포인트 보장
        const step = len / MAX_POINTS_PER_TRACK;
        for (let i = 0; i < MAX_POINTS_PER_TRACK; i++) {
          const idx = Math.min(Math.floor(i * step), len - 1);
          pointData.push({ position: track.geometry[idx], color });
        }
        // 마지막 포인트
        pointData.push({ position: track.geometry[len - 1], color });
      }
    });

    layers.push(
      new ScatterplotLayer({
        id: 'track-point-layer',
        data: pointData,
        getPosition: (d) => d.position,
        getFillColor: (d) => d.color,
        getRadius: 3,
        radiusUnits: 'pixels',
        radiusMinPixels: 2,
        radiusMaxPixels: 5,
        pickable: false,
      })
    );
  }

  return layers;
}

/**
 * 동적 가상선박 레이어 생성
 * currentTime 변경 시마다 호출 (경량 - 데이터 수 = 선박 수)
 *
 * @param {Object} params
 * @param {Array} params.currentPositions - 보간된 현재 위치 배열
 * @param {boolean} params.showVirtualShip - 아이콘 표시
 * @param {boolean} params.showLabels - 선명 라벨 표시
 * @param {Function} [params.onIconHover] - 아이콘 호버 콜백
 * @param {Function} [params.onPathHover] - 하이라이트 설정용 콜백
 * @returns {Array} Deck.gl Layer 배열
 */
export function createVirtualShipLayers({ currentPositions, showVirtualShip, showLabels, onIconHover, onPathHover }) {
  const layers = [];

  if (!currentPositions || currentPositions.length === 0) return layers;

  // 1. IconLayer - 가상 선박 아이콘
  if (showVirtualShip) {
    layers.push(
      new IconLayer({
        id: 'track-virtual-ship-layer',
        data: currentPositions,
        iconAtlas: atlasImg,
        iconMapping: ICON_ATLAS_MAPPING,
        getIcon: (d) => ICON_MAPPING_KIND_MOVING[d.shipKindCode] || 'etcImg',
        getPosition: (d) => [d.lon, d.lat],
        getSize: 24,
        sizeUnits: 'pixels',
        getAngle: (d) => -(d.heading || 0),
        pickable: true,
        onHover: (info) => {
          if (info.object) {
            // 하이라이트 설정
            if (onPathHover) {
              onPathHover(info.object.vesselId);
            }
            // 툴팁 콜백
            if (onIconHover) {
              onIconHover(info.object, info.x, info.y);
            }
          } else {
            if (onPathHover) {
              onPathHover(null);
            }
            if (onIconHover) {
              onIconHover(null, 0, 0);
            }
          }
        },
      })
    );
  }

  // 2. TextLayer - 선명 라벨 (가상선박 위치 기준)
  if (showLabels) {
    const labelData = currentPositions.filter((p) => p.shipName);

    if (labelData.length > 0) {
      const themeColors = getCurrentThemeColors();

      layers.push(
        new TextLayer({
          id: 'track-label-layer',
          data: labelData,
          getPosition: (d) => [d.lon, d.lat],
          getText: (d) => d.shipName,
          getColor: themeColors.shipLabel,
          getSize: 11,
          getTextAnchor: 'start',
          getAlignmentBaseline: 'center',
          getPixelOffset: [14, 0],
          fontFamily: 'NanumSquare, Malgun Gothic, 맑은 고딕, Arial, sans-serif',
          fontWeight: 'bold',
          outlineColor: themeColors.shipLabelOutline,
          outlineWidth: 2,
          pickable: false,
        })
      );
    }
  }

  return layers;
}
