import { createGeoJSONLayer, createLabelAndFillStyle } from '@/utils/mapUtils';
import TileLayer from 'ol/layer/Tile';
import { XYZ } from 'ol/source';
import shipAlarmIcon from '../../assets/ship_alarm.png';
import shipAlarmFishingIcon from '../../assets/ship_alarm_fishing.png';
import shipOnlineIcon from '../../assets/ship_online.png';
import shipOnlineFishingIcon from '../../assets/ship_online_fishing.png';
import shipUndefineIcon from '../../assets/ship_undefine.png';
import shipWarningIcon from '../../assets/ship_warning.png';
import shipWarningFishingIcon from '../../assets/ship_warning_fishing.png';
import shipSosIcon from '../../assets/sos_icon.png';
export const BASEMAP_URL =
  'https://cartodb-basemaps-a.global.ssl.fastly.net/light_nolabels/{z}/{x}/{y}.png';
export const BASEMAP_ATTRIBUTIONS = '© OpenStreetMap contributors, © CartoDB';

export const INITIAL_VIEW_CONFIG = {
  // Dịch tâm bản đồ ra phía biển và zoom ra xa hơn để thấy bao quát
  center: [109.5, 16.0],
  zoom: 5.5,
  minZoom: 5,
  maxZoom: 12,
  minScale: 0.1,
  maxScale: 0.4,
};

export const osmLayer = new TileLayer({
  source: new XYZ({
    url: BASEMAP_URL,
    attributions: BASEMAP_ATTRIBUTIONS,
  }),
});

// const layerVN = await getLayer('base-vn');

export const tinhGeoLayer = createGeoJSONLayer({
  data: '',
  style: createLabelAndFillStyle('#77BEF0', '#000000'), // vừa màu vừa label
  properties: {
    name: 'tenTinh',
    popupProperties: { 'Dân số': 'danSo', 'Diện tích (km²)': 'dienTich' },
  },
});

export const getShipIcon = (type: number, isFishing: boolean) => {
  console.log('type, isFishing', type, isFishing);

  if (type === 1 && !isFishing) {
    return shipWarningIcon;
  } else if (type === 2 && !isFishing) {
    return shipAlarmIcon;
  } else if (type === 0 && !isFishing) {
    return shipOnlineIcon;
  } else if (type === 1 && isFishing) {
    return shipWarningFishingIcon;
  } else if (type === 2 && isFishing) {
    return shipAlarmFishingIcon;
  } else if (type === 0 && isFishing) {
    return shipOnlineFishingIcon;
  } else if (type === 3) {
    return shipSosIcon;
  } else {
    return shipUndefineIcon;
  }
};
