import { stackFactory, flatStacksValue, strToParams } from "@/utils";
import { reactive, ref } from "vue";

import type { FuseModel, Path, TaggingPosition, View } from "@/store";
export const namespace = "/fusion";
export const viewModeStack = stackFactory(ref<"full" | "auto">("auto"));
export const recordIngStack = stackFactory(ref(false));
export const showToolbarStack = stackFactory(ref<boolean>(false));
export const showHeadBarStack = stackFactory(ref<boolean>(true));
export const showRightPanoStack = stackFactory(ref<boolean>(true));
export const showLeftPanoStack = stackFactory(ref<boolean>(false));
export const moundLeftPanoStack = stackFactory(ref<boolean>(true));
export const showLeftCtrlPanoStack = stackFactory(ref<boolean>(true));
export const showAMsStack = stackFactory(ref<boolean>(false));
export const showModeStack = stackFactory(ref<"pano" | "fuse">("fuse"));
export const showRightCtrlPanoStack = stackFactory(ref<boolean>(true));
export const showBottomBarStack = stackFactory(ref<boolean>(false), true);
export const bottomBarHeightStack = stackFactory(ref<string>("60px"));
export const showTaggingsStack = stackFactory(ref<boolean>(true));
export const showMonitorsStack = stackFactory(ref<boolean>(true));
export const showPathsStack = stackFactory(ref<boolean>(true));
export const showSearchStack = stackFactory(ref<boolean>(true));
export const showPathStack = stackFactory(ref<Path["id"]>());
export const showModeTabStack = stackFactory(ref<boolean>(true));

export const showMeasuresStack = stackFactory(ref<boolean>(true));
export const showViewSettingStack = stackFactory(ref<boolean>(true));
export const currentModelStack = stackFactory(ref<FuseModel | null>(null));
export const showModelsMapStack = stackFactory(
  ref<WeakMap<FuseModel, boolean>>(new Map()),
  true
);
export const modelsChangeStoreStack = stackFactory(ref<boolean>(false));
export const showTaggingPositionsStack = stackFactory(
  ref<WeakSet<TaggingPosition>>(new WeakSet())
);
export const currentViewStack = stackFactory(ref<View>());

export const custom = flatStacksValue({
  recordIng: recordIngStack,
  viewMode: viewModeStack,
  showToolbar: showToolbarStack,
  showRightPano: showRightPanoStack,
  showLeftPano: showLeftPanoStack,
  showModeTab: showModeTabStack,
  moundLeftPano: moundLeftPanoStack,
  showLeftCtrlPano: showLeftCtrlPanoStack,
  shwoRightCtrlPano: showRightCtrlPanoStack,
  showTaggings: showTaggingsStack,
  showMonitors: showMonitorsStack,
  showPaths: showPathsStack,
  showPath: showPathStack,
  showMeasures: showMeasuresStack,
  currentModel: currentModelStack,
  showModelsMap: showModelsMapStack,
  modelsChangeStore: modelsChangeStoreStack,
  showTaggingPositions: showTaggingPositionsStack,
  showBottomBar: showBottomBarStack,
  bottomBarHeight: bottomBarHeightStack,
  showHeadBar: showHeadBarStack,
  showAMs: showAMsStack,
  currentView: currentViewStack,
  showMode: showModeStack,
  showSearch: showSearchStack,
  showViewSetting: showViewSettingStack
});
export enum appType {
  fire = '1',
  criminal = '2',
  xmfire = '3',
  police = '4'
}
export const appBackRoot = {
  [appType.fire]: "/fire",
  [appType.xmfire]: "/xmfire",
  [appType.criminal]: "/criminal",
  [appType.police]: "/criminal"
}
export const params = reactive(
  strToParams(location.search)
) as unknown as Params;
params.caseId = Number(params.caseId);
params.share = Boolean(Number(params.share));
params.single = Boolean(Number(params.single));

export type Params = {
  caseId: number;
  baseURL?: string;
  modelId?: string;
  mapKey?: string;
  mapPlatform?: string;
  fileUrl?: string;
  sign?: string;
  type?: string;
  testMap?: boolean;
  title?: string;
  m?: string;
  share?: boolean;
  single?: boolean;
  token?: string;
};

export const baseURL = params.baseURL ? params.baseURL : "";

export const getResource = (uri: string) => {
  if (~uri.indexOf("base64") || ~uri.indexOf("bolb") || ~uri.indexOf("//"))
    return uri;

  if (uri[0] === "/") {
    return `${baseURL}${uri}`;
  } else {
    return `${baseURL}/${uri}`;
  }
};