class Info {
    title = ""
    defaultArr = []
    allArr = []

    // 收藏的数据，本地有收藏就读取本地之前的收藏数据，没有就给默认值
    // likeArr = JSON.parse(localStorage.getItem("like")) || []

    likeArr = getItem("like")

    constructor() {
        this.getInfoListData()
            .then(() => {

                util.header(
                    `<div class="header_title flex1 ellipsis">${this.title}</div>`,
                    `
                    <div class="ilist">
                        <i class="iconfont icon-wujiaoxing"></i>
                        <i class="iconfont icon-fenxiang"></i>
                    </div>
                    `
                )

                this.event()
            })
    }


    async getInfoListData() {
        let { title, src_list, recommend } = await infoServe.infoList({ id: query("id") })

        this.title = title
        // 手动实现 懒加载
        this.allArr = src_list
        this.defaultArr = [ this.allArr[0], this.allArr[1] ]

        $(".info_img_list .img_list").innerHTML = this.defaultArr.maps(v => `<img src="${v}" alt="">`)

        item(".recommend-model ul", recommend)
    }


    event() {
        $(".view_all").onclick = () => {
            $(".img_list").style.height = "auto"
            $(".view_all").style.display = "none"

            $(".info_img_list .img_list").innerHTML = this.allArr.maps(v => `<img src="${v}" alt="">`)

        }


        // TODO 找一个合适分享
        $(".icon-fenxiang").onclick = async () => {
            await navigator.clipboard.writeText(`
我这有个好看的，快来看看 ${this.title}
${location.href}
            `)
            alert("内容已复制")
            // await navShare({
            //     title: this.title,
            //     text: `我这有个好看的，快来看看 ${this.title}`,
            //     url: location.href
            // })
        }

        let sc = $(".icon-wujiaoxing")

        console.log("this.likeArr: ", this.likeArr);

        let isHave = this.likeArr.filter(v => v.id == query("id"))
        if (isHave.length != 0) {
            sc.classList.add("icon-wujiaoxing1")
        }

        $(".icon-wujiaoxing").onclick = async () => {
            // 已收藏，应该变成未收藏
            if (sc.classList.contains("icon-wujiaoxing1")) {
                sc.classList.remove("icon-wujiaoxing1")
                this.likeArr = this.likeArr.filter(v => v.id != query("id"))
                setItem("like", this.likeArr)

                // 未收藏，应该变成已收藏  
            } else {
                this.likeArr.push({
                    id: query("id"),
                    thumbnail: this.allArr[0],
                    title: this.title,
                    time: query("time"),
                    // TODO 这个浏览量需要后端提供
                    view: "42"
                })
                setItem("like", this.likeArr)
                sc.classList.add("icon-wujiaoxing1")
            }
            // await navShare({
            //     title: this.title,
            //     text: `我这有个好看的，快来看看 ${this.title}`,
            //     url: location.href
            // })
        }

    }
}

new Info