import { ref } from 'vue'
import { createTemploraryID, isTemploraryID } from './sys'
import { autoSetModeCallback } from './sys'
import { 
  fetchGuides, 
  postAddGuide, 
  postDeleteGuide,
  postUpdateGuide,
  uploadFile,
} from '@/api'
import { 
  deleteStoreItem, 
  addStoreItem, 
  updateStoreItem, 
  fetchStoreItems,
  saveStoreItems,
  recoverStoreItems
} from '@/utils'

import type { GuidePath as SGuidePath, Guide as SGuide } from '@/api'

export type GuidePath = LocalMode<SGuidePath, 'cover'>
export type GuidePaths = GuidePath[]
export type Guide = Omit<LocalMode<SGuide, 'cover'>, 'paths'> & { paths: GuidePaths }
export type Guides = Guide[]


export const guides = ref<Guides>([])

export const createGuide = (guide: Partial<Guide> = {}): Guide => ({
  id: createTemploraryID(),
  title: `路径${guides.value.length + 1}`,
  cover: '',
  paths: [],
  ...guide
})

export const createGuidePath = (path: Partial<GuidePath> = {}): GuidePath => ({
  id: createTemploraryID(),
  cover: '',
  time: 1,
  speed: 1,
  position: {x: 0, y: 0, z: 0},
  target: {x: 0, y: 0, z: 0},
  ...path
})


let bcGuides: Guides = []
export const getBackupGuides = () => bcGuides
export const backupGuides = () => {
  bcGuides = guides.value.map(guide => ({
    ...guide,
    paths: guide.paths.map(path => ({...path}))
  }))
}

export const transformGuide = async (guide: Guide): Promise<SGuide> => {
  let guideCover: string = ''
  const pathsCover: string[] = []

  const uploadGuideCover = uploadFile(guide.cover)
    .then(cover => guideCover = cover)
  const uploadPathsCver = guide.paths.map((path, index) => 
    uploadFile(path.cover)
      .then(cover => pathsCover[index] = cover)
  )

  await Promise.all([uploadGuideCover, ...uploadPathsCver])
  return {
    ...guide,
    paths: guide.paths.map((path, i) => ({...path, cover: pathsCover[i]})),
    cover: guideCover
  }
}

export const recoverGuides = recoverStoreItems(guides, getBackupGuides)
export const addGuide = addStoreItem(guides, postAddGuide, transformGuide)
export const updateGuide = updateStoreItem(guides, (guide) => {
  return postUpdateGuide({
    ...guide, 
    paths: guide.paths.map(path => ({...path, id: isTemploraryID(path.id) ? undefined : path.id})) as any
  })
}, transformGuide)
export const deleteGuide = deleteStoreItem(guides, guide => postDeleteGuide(guide.id))
export const initialGuides = fetchStoreItems(guides, fetchGuides, backupGuides)
export const saveGuides = saveStoreItems(
  guides,
  getBackupGuides,
  {
    add: addGuide,
    update: updateGuide,
    delete: deleteGuide,
  }
)
export const autoSaveGuides = autoSetModeCallback(guides, {
  backup: backupGuides,
  recovery: recoverGuides,
  save: saveGuides,
})