import { diffArrayChange, mount, shallowWatchArray } from "@/utils";
import TaggingComponent from "@/components/path/list.vue";
import { Path as PathData, paths, selectPaths } from "@/store/path";
import { sdk, Path, SDK } from "../sdk";
import { nextTick, reactive, ref, watch, watchEffect } from "vue";
import { groupProxy } from "@/store/group";
import { isScenePlayRun, pauseScene, playScene } from "@/utils/full";
import { analysisPose, setPose } from ".";
import { custom, showPathsStack, showPathStack, showSearchStack, showViewSettingStack } from "@/env";
import { Message } from "bill/expose-common";
import { mergeFuns } from "@/components/drawing/hook";

// -----------------导览线关联--------------------
export type PathNode = Path;
export type PathsNode = { node: PathNode; id: PathData["id"] }[];

const pathNodes = reactive(new Map<PathData, PathNode>());

export const getPathNode = (
  path: PathData | PathData["id"]
): undefined | PathNode => {
  if (typeof path !== "object") {
    path = paths.value.find((item) => item.id === path)!;
    if (!path) return void 0;
  }
  return pathNodes.get(path);
};

export const pathsGroup = groupProxy(() => {
  const nodes = [] as PathNode[];
  for (const path of paths.value) {
    const node = getPathNode(path);
    if (node) {
      nodes.push(node);
    }
  }
  return nodes;
});

watchEffect(() => {
  pathsGroup.visibility(custom.showPaths);
  if (custom.showPath) {
    const node = getPathNode(custom.showPath);
    node?.visibility(true);
    // node?.fly()
  }
})

export const playScenePath = async (
  path: PathData,
  forceFull = false,
) => {
  const node = getPathNode(path)
  if (!node) {
    console.error('un', path.id)
    return Message.error('路径所在模型被隐藏活删除，无法播放');
  }

  showPathsStack.push(ref(false))
  showPathStack.push(ref(path.id))

  
  let initPose: any;
  let pop: null | (() => void) = null
  await playScene({
    create: () => {
      const cleanups = [showSearchStack.push(ref(false))]
      if (forceFull) {
        cleanups.push(showViewSettingStack.push(ref(false)))
      }
      pop = mergeFuns(cleanups)

    },
    play: () => {
      return new Promise(resolve => {
        initPose = analysisPose(sdk.getPose());
        node.play(resolve)
      })
    },
    pause: () => {
      setPose(initPose)
      node.pause();
    },
    clear: () => {
      pop && pop()
    }
  }, forceFull)

  showPathsStack.pop()
  showPathStack.pop()
}

export const pauseScenePath = pauseScene
export const isScenePathPlayIng = isScenePlayRun


export const associationPaths = (sdk: SDK, el: HTMLDivElement) => {
  mount<PathsNode>(el, TaggingComponent, { paths }, (pathsNode) => {
    watch(
      () => {
        if (!pathsNode) return []
        pathsNode.forEach(i => !!i?.id)
        return pathsNode
      },
      (nodes, oldNodes = []) => {
        watchEffect(() => {
          pathNodes.clear()
          nodes.forEach(node => {
            const path = paths.value.find((item) => item.id === node.id)!;
            pathNodes.set(path, node.node);
          })
        })
      },
      {immediate: true}
    );
  });

  watchEffect(() => {
    selectPaths.selects.value.forEach(item => {
      pathNodes.get(item)?.visibility(true)
    })
    selectPaths.unSelects.value.forEach(item => {
      pathNodes.get(item)?.visibility(false)
    })
  })
  
};