import { ref } from "vue";
import { autoSetModeCallback, createTemploraryID, isTemploraryID } from "./sys";
import {
  fetchAnimationActions,
  fetchAnimationModels,
  postDeleteAnimationModel,
  postInsertAnimationModel,
  postUpdateAnimationModel,
} from "@/api";
import {
  togetherCallback,
  deleteStoreItem,
  addStoreItem,
  updateStoreItem,
  saveStoreItems,
  recoverStoreItems,
} from "@/utils";

import type {
  AnimationModel,
  AnimationModels,
} from "@/api";
import { inRevise } from "bill/utils";
import { uuid } from "@/components/drawing/hook";
import { ui18n } from "@/lang";
export type {
  AnimationModelAction,
  AnimationModelFrame,
  AnimationModelPath,
  AnimationModelSubtitle,
} from '@/api'
export type { AnimationModel, AnimationModels };

export const ams = ref<AnimationModels>([]);

export const createAnimationModel = (
  am: Partial<AnimationModel> = {}
): AnimationModel => ({
  id: createTemploraryID(),
  title: ui18n.t("am.model"),
  url: "",
  showTitle: true,
  fontSize: 12,
  globalVisibility: true,
  visibilityRange: 12,
  key: uuid(),
  subtitles: [],
  actions: [],
  frames: [],
  paths: [],
  ...am,
});

let bcAms: AnimationModels = [];
export const getBackupAnimationModels = () => bcAms;
export const backupAnimationModels = () => {
  bcAms = JSON.parse(JSON.stringify(ams.value))
};
export const addAnimationModel = addStoreItem(ams, postInsertAnimationModel);
export const updateAnimationModels = updateStoreItem(
  ams,
  postUpdateAnimationModel
);
export const deleteAnimationModel = deleteStoreItem(ams, ({ id }) =>
  postDeleteAnimationModel(id)
);
export const initialAnimationModels = async () => {
  ams.value = await fetchAnimationModels();
  backupAnimationModels();
};

export const recoverAnimationModels = recoverStoreItems(
  ams,
  getBackupAnimationModels
);
export const saveAnimationModels = saveStoreItems(
  ams,
  getBackupAnimationModels,
  {
    add: addAnimationModel,
    update: updateAnimationModels,
    delete: deleteAnimationModel,
  }
);
export const autoSaveAnimationModel = autoSetModeCallback([ams], {
  backup: togetherCallback([backupAnimationModels]),
  recovery: togetherCallback([recoverAnimationModels]),
  isUpdate: (newv) => {
    return inRevise(newv, getBackupAnimationModels())
  },
  save: async () => {
    await saveAnimationModels();
  },
});