afi = {
    consts: {},
    params: {},
    elements: {},
    utils: {},
    rpc: {},
    uploader: {},
    interface: {},
    directcall: {},
}

afi.consts = {
    leftPageWarn: "确认放弃正在进行的传输?",
    ensureDrop: () => !confirm('确认移动此对象?')
}

afi.params = {
    readonly: readonly,
    extraPath: extraPath
}

afi.elements = {
    itemlinks: Array.from(document.querySelectorAll('a.item-links')),
    table: document.getElementById("index-table"),
    badge: document.getElementById("badge"),
    uploader: document.getElementById("clickupload"),
    path: document.getElementById("path"),
    nav: document.getElementById("nav"),
    title: document.head.querySelector("title"),
    dropGrid: document.getElementById("drop-grid"),
    barDisplay: document.getElementById("bar-display"),
    barProc: document.getElementById("bar-proc"),
    helpPanel: document.getElementById('help-panel'),
    helpToggle: document.getElementById('help-toggle'),
}

afi.pulsar = {
    pulseLeft: 0,
    pulseNotificator(text) {
        afi.elements.badge.innerText = text
        this.pulseEffect(afi.elements.badge)
    },
    pulseSuccess() {
        this.pulseNotificator("操作成功")
    },
    pulseFailure(error) {
        this.pulseNotificator("操作失败 " + error)
    },
    pulseEffect: function (element) {
        element.style.display = "block"
        afi.pulsar.pulseLeft += 1
        element.classList.remove('pulse');
        void element.offsetWidth;
        element.classList.add('pulse');
        setTimeout(function () {
            afi.pulsar.pulseLeft -= 1;
            if (afi.pulsar.pulseLeft > 0) {
                console.log("[AFI] Notification stack", afi.pulsar.pulseLeft, "left, skip clear")
            } else {
                console.log("[AFI] Notification stack", afi.pulsar.pulseLeft, "left, do clear")
                element.style.display = 'none';
            }
        }, 5000);
    },
}

afi.utils = {
    isDupe: function (itemname) {
        if (afi.elements.itemlinks.find(a => a.innerText.replace('/', '') === itemname)) {
            alert('名称 ' + itemname + ' 已被已存在的项目占用');
            return true
        }
        else {
            return false
        }
    },

    isFolder: function (element) {
        return element && element.href && element.innerText.endsWith('/');
    },

    encodeURIHash: function (e) {
        return encodeURI(e).replaceAll('#', '%23');
    },

    refresh: function () {
        afi.interface.browseTo(location.href, true);
    },

    prependPath: function (a) {
        return a.startsWith('/') ? a : decodeURI(location.pathname) + a;
    },
    cancelDefault(e) {
        e.preventDefault()
        e.stopPropagation()
    },
    setHighlight: function (t) {
        t.classList.add('highlight')
    },
    getHighlight: function () {
        return document.querySelector('.highlight') || {}
    },
    resetHighlight: function () {
        try {
            this.getHighlight().classList.remove('highlight')
        } catch (e) {
            /* */
        }
    },
    isHelpMode: () => afi.elements.helpPanel.style.display === 'block',
    helpOn: function () {
        afi.elements.helpPanel.style.display = 'block'
        afi.elements.table.style.display = 'none'
        afi.elements.helpToggle.innerText = "关闭帮助"
        afi.elements.helpToggle.onclick = afi.utils.helpOff
    },
    helpOff: function () {
        if (!afi.utils.isHelpMode()) return
        afi.elements.helpPanel.style.display = 'none'
        afi.elements.table.style.display = 'table'
        afi.elements.helpToggle.innerText = "帮助菜单"
        afi.elements.helpToggle.onclick = afi.utils.helpOn
    }
}

afi.rpc = {
    rpc: function (call, args, cb) {
        console.log('[AFI] RPC', call, args)
        const xhr = new XMLHttpRequest()
        xhr.open('POST', location.origin + afi.params.extraPath + '/rpc')
        xhr.setRequestHeader('Content-Type', 'application/json;charset=UTF-8')
        xhr.send(JSON.stringify({ call, args }))
        xhr.onload = cb
        xhr.onerror = () => afi.pulsar.pulseFailure()
    },

    mkdirCall: function (path, cb) {
        this.rpc('mkdirp', [afi.utils.prependPath(path)], cb);
    },

    rmCall: function (path1, cb) {
        this.rpc('rm', [afi.utils.prependPath(path1)], cb);
    },

    mvCall: function (path1, path2, cb) {
        this.rpc('mv', [path1, path2], cb);
    },

    sumCall: function (path, type, cb) {
        this.rpc('sum', [afi.utils.prependPath(path), type], cb);
    },

    touchCall: function (path, cb) {
        this.rpc('touch', [afi.utils.prependPath(path)], cb);
    }
}

afi.uploader = {
    totalUploads: 0,
    totalUploaded: 0,
    totalUploadsSize: 0,
    totalUploadedSize: [],

    shouldRefresh: function () {
        this.totalUploaded += 1
        console.log('[AFI] Have uploaded ' + this.totalUploaded + ' files')
        if (this.totalUploads === this.totalUploaded) {
            window.onbeforeunload = null
            console.log('[AFI] Finished after uploaded ' + this.totalUploaded + ' files')
            this.totalUploaded = 0
            this.totalUploads = 0
            this.totalUploadsSize = 0
            this.totalUploadedSize = []
            setTimeout(afi.utils.refresh, 200)
            afi.elements.barDisplay.style.display = 'none'
            //afi.elements.barProc.innerText = "传输: 就绪"
        }
    },

    updatePercent: function (event) {
        this.totalUploadedSize[event.target.id] = event.loaded
        const ttlDone = this.totalUploadedSize.reduce((s, x) => s + x)
        const percent = Math.min(Math.floor(100 * ttlDone / this.totalUploadsSize), 100) + '%' // 此处消除对小文件元数据上传带来的误差, 理论上是不准的
        afi.elements.barProc.innerText = "传输: " + percent
    },

    upload: function (id, what, path, cbDone, cbErr, cbUpdate) {
        const xhr = new XMLHttpRequest()
        xhr.open('POST', location.origin + afi.params.extraPath + '/post')
        xhr.setRequestHeader('afi-path', path)
        xhr.upload.addEventListener('load', cbDone)
        xhr.upload.addEventListener('progress', cbUpdate)
        xhr.upload.addEventListener('error', cbErr)
        xhr.upload.id = id
        xhr.send(what)
    },

    uploadFile: function (file, path) {
        if (afi.params.readonly) return
        path = decodeURI(location.pathname).slice(0, -1) + path
        window.onbeforeunload = afi.consts.leftPageWarn
        afi.elements.barProc.style.display = afi.elements.barDisplay.style.display = 'block'
        this.totalUploads += 1
        this.totalUploadsSize += file.size
        //this.totalUploadedSize[this.totalUploads] = file.size
        if (typeof upBarName !== 'undefined') {
            upBarName.innerText = this.totalUploads > 1 ? this.totalUploads + ' 个文件' : file.name
        }
        const formData = new FormData()
        formData.append(file.name, file)
        this.upload(this.totalUploads, formData, encodeURIComponent(path), this.shouldRefresh.bind(this), null, this.updatePercent.bind(this))
    }
}

afi.interface = {
    pushEntry: function (entry) {
        if (!entry.webkitGetAsEntry && !entry.getAsEntry) {
            return alert('不兼容此浏览器')
        } else {
            entry = entry.webkitGetAsEntry() || entry.getAsEntry()
        }
        this.parseDomItem.bind(this)(entry, true)
    },
    parseDomFolder: function (f) {
        f.createReader().readEntries(e => e.forEach(i => afi.interface.parseDomItem.bind(this)(i)))
    },
    parseDomItem: function (domFile, shouldCheckDupes) {
        if (shouldCheckDupes && afi.utils.isDupe(domFile.name)) {
            return
        }
        if (domFile.isFile) {
            domFile.file(f => afi.uploader.uploadFile(f, domFile.fullPath))
        } else {
            const f = domFile.fullPath.startsWith('/') ? domFile.fullPath.slice(1) : domFile.fullPath
            afi.rpc.mkdirCall(f, () => this.parseDomFolder.bind(this)(domFile))
        }
    },

    browseTo: async function (href, pulseEffectDone, skipHistory) {
        try {
            const r = await fetch(href, { credentials: 'include' })
            const t = await r.text()
            const parsed = new DOMParser().parseFromString(t, 'text/html')

            afi.elements.table.innerHTML = parsed.getElementById('index-table').innerHTML
            const nav = parsed.getElementById('nav').innerText
            const path = parsed.getElementById('path').innerText
            const title = parsed.head.querySelector('title').innerText

            if (afi.elements.path.innerText !== path) {
                if (!skipHistory) {
                    const escaped = afi.utils.encodeURIHash(afi.params.extraPath + path)
                    history.pushState({}, '', escaped)
                }
                afi.elements.title.innerText = title
                afi.elements.nav.innerText = nav
                afi.elements.path.innerText = path
                this.setBreadcrumbs()
            }
            init()
            if (pulseEffectDone) afi.pulsar.pulseSuccess()
        } catch (error) {
            afi.pulsar.pulseFailure(error)
        }
    },

    setBreadcrumbs: function () {
        const parent = afi.elements.nav.parentNode;
        afi.elements.nav.outerHTML = '<span id="nav" onclick="return afi.directcall.bread_click(event)"><span class="nav">' + afi.elements.path.innerText.split('/').join('/</span><span class="nav">') + '</span></span>'
        afi.elements.nav = parent.querySelector('#nav');
    }
}

afi.directcall = {
    exec_mkdir: function () {
        const folder = prompt('新建目录名称', '')
        if (folder && !afi.utils.isDupe(folder)) {
            afi.rpc.mkdirCall(folder, afi.utils.refresh)
        }
    },

    exec_touch: function () {
        const file = prompt('新建文件名称', '')
        if (file && !afi.utils.isDupe(file)) {
            afi.rpc.touchCall(file, afi.utils.refresh)
        }
    },

    exec_rm: function () {
        const file = prompt('删除对象名称', '')
        afi.rpc.rmCall(file, afi.utils.refresh)
    },

    exec_mv: function () {
        const orig = prompt('源地址', '')
        const dest = prompt('目标地址', '')
        if (orig && !afi.utils.isDupe(dest)) {
            afi.rpc.mvCall(afi.utils.prependPath(orig), afi.utils.prependPath(dest), afi.utils.refresh)
        }
    },
    bread_click: function (e) {
        const p = Array.from(document.getElementById('nav').childNodes).map(k => k.innerText)
        const i = p.findIndex(s => s === e.target.innerText)
        var dst = p.slice(0, i + 1).join('').slice(1)
        if (!dst.startsWith('/')) {
            dst = "/" + dst
        }
        const target = location.origin + afi.params.extraPath + afi.utils.encodeURIHash(dst)
        afi.interface.browseTo(target, false)
    }
}

afi.checksum = {
    getSum(type) {
        upBarPc.style.display = 'block'
        upBarPc.innerText = '远程求解校验和...'
        upBarPc.style.width = '100%'
        sumsOff()
        sumCall(getASelected().innerText, type, loaded => {
            navigator.clipboard.writeText(loaded.target.responseText)  // 复制到剪贴板
            upBarPc.style.display = 'none'
            flicker(okBadge)
        })
    },

    isSumsMode: () => sums.style.display === 'block',
    sumsToggle: () => isSumsMode() ? sumsOff() : sumsOn(),

    sumsOn() {
        if (isFolder(getASelected())) {
            alert('无法对目录求解校验和')
            return
        }
        sums.style.display = 'block'
        table.style.display = 'none'
    },
    sumsOff() {
        if (!isSumsMode()) return
        sums.style.display = 'none'
        table.style.display = 'table'
        return true
    }
}

function init() {
    afi.elements = {
        itemlinks: Array.from(document.querySelectorAll('a.item-links')),
        table: document.getElementById("index-table"),
        badge: document.getElementById("badge"),
        path: document.getElementById("path"),
        uploader: document.getElementById("clickupload"),
        nav: document.getElementById("nav"),
        title: document.head.querySelector("title"),
        dropGrid: document.getElementById("drop-grid"),
        barDisplay: document.getElementById("bar-display"),
        barProc: document.getElementById("bar-proc"),
        helpPanel: document.getElementById('help-panel'),
        helpToggle: document.getElementById('help-toggle'),
    }
    afi.interface.setBreadcrumbs()
    afi.elements.uploader.addEventListener('change', () => {
        const files = Array.from(afi.elements.uploader.files);

        files.forEach(file => {
            if (!afi.utils.isDupe(file.name)) {
                afi.uploader.uploadFile(file, '/' + file.name);
            }
        });
    }, false);
    afi.elements.dropGrid.ondragend = afi.elements.dropGrid.ondragexit = afi.elements.dropGrid.ondragleave = e => {
        afi.utils.cancelDefault(e)
        afi.elements.dropGrid.style.display = 'none'
    }
    let draggingSrc
    document.ondragenter = e => {
        if (afi.params.readonly) { return }
        afi.utils.cancelDefault(e)
        afi.utils.resetHighlight()
        if (!draggingSrc) {
            afi.elements.dropGrid.style.display = 'flex'
            e.dataTransfer.dropEffect = 'copy'
        } else if (draggingSrc) {
            const t = getClosestRow(e.target)
            afi.utils.isFolder(t.firstChild) && setHighlight(t)
        }
    }

    afi.elements.itemlinks.forEach(link => {
        const row = link.parentElement.parentElement.parentElement.querySelector('.item-icon');
        if (!row) return;

        let clickTimer = null;
        let isDoubleClick = false;

        row.addEventListener('click', (e) => {
            if (afi.params.readonly || link.innerText === '../') return;
            if (clickTimer) {
                clearTimeout(clickTimer);
                clickTimer = null;
            }

            clickTimer = setTimeout(() => {
                if (!isDoubleClick) {
                    e.stopPropagation();
                    if (confirm('确认删除此项目?')) {
                        afi.rpc.rmCall(afi.utils.prependPath(link.href), afi.utils.refresh);
                    }
                }
                isDoubleClick = false;
                clickTimer = null;
            }, 300);
        });

        row.addEventListener('dblclick', (e) => {
            e.stopPropagation();

            isDoubleClick = true;

            if (clickTimer) {
                clearTimeout(clickTimer);
                clickTimer = null;
            }

            if (afi.params.readonly) return;
            if (link.innerText === '../') return; // 不能操作上级

            const newName = prompt('新名称或目标地址', link.innerText);
            if (newName && !afi.utils.isDupe(newName)) {
                afi.rpc.mvCall(
                    afi.utils.prependPath(link.innerText),
                    afi.utils.prependPath(newName),
                    afi.utils.refresh
                );
            }

            setTimeout(() => {
                isDoubleClick = false;
            }, 100);
        });
    });
    document.ondragstart = e => { draggingSrc = e.target.innerHTML } // 记录拖拽源
    document.ondragend = e => resetHighlight() // 清理高亮
    document.ondragover = e => { afi.utils.cancelDefault(e); return false } // 允许拖拽

    document.ondrop = e => {
        if (afi.params.readonly) return

        afi.utils.cancelDefault(e)
        afi.elements.dropGrid.style.display = 'none'
        const t = afi.utils.getHighlight().firstChild

        if (draggingSrc && t) {
            const dest = t.innerHTML + draggingSrc
            afi.consts.ensureDrop() || afi.rpc.mvCall(afi.utils.prependPath(draggingSrc), afi.utils.prependPath(dest), afi.utils.refresh)
        } else if (e.dataTransfer.items.length) {
            Array.from(e.dataTransfer.items).forEach(afi.interface.pushEntry.bind(afi.interface))
        }

        afi.utils.resetHighlight()
        draggingSrc = null
        return false
    }
    if (!afi.params.readonly) {
        afi.elements.barProc.innerText = "传输: 就绪"
    }
    console.log('[AFI] Initialized')
}

window.onload = init