import i18n from '@/util/lang/lang'

let dom = null

async function asyncConstructor (Vue, comp) {
  if (!comp) {
    let component = await import('./index.vue')
    comp = Vue.extend(component.default)

    return comp
  }

  return comp
}

let Avatar = {}
Avatar.install = function (Vue, store) {
  let instance

  Vue.prototype.$editUserAvatar = async (imageUrl = '') => {
    let Constructor = await asyncConstructor(Vue, dom)

    if (instance) {
      instance.visible = true
      instance.imageUrl = imageUrl
      instance.isMe = true
    } else {
      instance = new Constructor({
        el: document.createElement('div'),
        computed: {
          $store () {
            return store
          }
        },
        i18n,
        data () {
          return {
            visible: true,
            imageUrl,
            isMe: true
          }
        }
      })

      document.body.appendChild(instance.$el)
    }
  }

  Vue.prototype.$editGroupAvatar = async (imageUrl = '') => {
    let Constructor = await asyncConstructor(Vue, dom)

    if (instance) {
      instance.visible = true
      instance.imageUrl = imageUrl
      instance.isMe = false
    } else {
      instance = new Constructor({
        el: document.createElement('div'),
        computed: {
          $store () {
            return store
          }
        },
        i18n,
        data () {
          return {
            visible: true,
            imageUrl,
            isMe: false
          }
        }
      })

      document.body.appendChild(instance.$el)
    }
  }
}

export default Avatar
