(function () {
    if (navigator.userAgent.toLowerCase().includes('sinafinance')) {
        // 端内不显示
        return
    }
    const CONFIG = Object.assign({
        maxWidth: null,  // number，非必须，允许的banner最大宽度，默认为100vw，如页面宽度超出此值，banner会居中显示
        position: 'top',  // 非必须，出现位置，默认为页面顶部
        static: null, // string，非必须，统计字段定制
        basePadding: '0px', // string，非必须，body的原始padding值，用以定位时动态累加
    }, typeof FIXED_APPBANNER_CONFIG === 'object' ? FIXED_APPBANNER_CONFIG : {})
    initDom()
    initHQ()
    initEvent()

    function initEvent() {
        if (!!CONFIG.maxWidth) {
            const docEl = document.documentElement
            const resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize'
            const recalc = function () {
                const clientWidth = docEl.clientWidth
                if (clientWidth > CONFIG.maxWidth) {
                    document.body.style.setProperty('--base-appbanner-width', `${CONFIG.maxWidth}px`)
                } else {
                    document.body.style.setProperty('--base-appbanner-width', '100vw')
                }
            }
            window.addEventListener(resizeEvt, recalc, false)
            recalc()
        }
    }

    function initDom() {
        addCSSByStyleSheet(`
            body {
                --base-appbanner-width: 100vw;
                margin: 0;
                padding-${CONFIG.position === 'bottom' ? 'bottom' : 'top'}: calc(${CONFIG.basePadding} + 0.150 * var(--base-appbanner-width));
            }

            .fixed_appbanner_wrap,
            .fixed_appbanner_wrap * {
                margin: 0;
                padding: 0;
                font-family: PingFangSC-Medium;
            }

            .fixed_appbanner_wrap {
                position: fixed;
                left: 0;
                ${CONFIG.position === 'bottom' ? 'bottom' : 'top'}: 0;
                z-index: 100;
                width: 100%;
            }

            .fixed_appbanner{
                width: var(--base-appbanner-width);
                margin: 0 auto;
                padding: 0;
                display: flex;
                justify-content: space-between;
                align-items: center;
                background-color: #fff;
            }

            .fixed_appbanner_logo {
                margin: calc(0.025 * var(--base-appbanner-width)) 0 calc(0.025 * var(--base-appbanner-width)) calc(0.035 * var(--base-appbanner-width));
                width: calc(0.105 * var(--base-appbanner-width));
                height: calc(0.105 * var(--base-appbanner-width));
                background: url(https://n.sinaimg.cn/finance/cj/kandian/images/logo.png) no-repeat;
                background-size: 100% auto;
                /* aspect-ratio: 1; */
            }

            .fixed_appbanner_cont {
                margin-left: calc(0.02 * var(--base-appbanner-width));
                display: flex;
                flex-direction: column;
                align-items: flex-start;
                justify-content: center;
                flex-grow: 1;
                user-select: none;
            }

            .fixed_appbanner_cont h5 {
                margin-bottom: calc(0.008 * var(--base-appbanner-width));
                font-size: calc(0.04 * var(--base-appbanner-width));
                line-height: calc(0.052 * var(--base-appbanner-width));
                font-weight: 500;
                font-family: PingFangSC-Medium;
                color: #333;
            }

            .fixed_appbanner_cont .fixed_appbanner_subtitle {
                font-size: calc(0.038 * var(--base-appbanner-width));
                line-height: calc(0.052 * var(--base-appbanner-width));
                font-weight: normal;
                display: flex;
                justify-content: flex-start;
                align-items: center;
                color: #333;
                font-family: PingFangSC-Regular;
            }

            .fixed_appbanner_btn {
                /* width: calc(0.12 * var(--base-appbanner-width)); */
                margin-right: calc(0.035 * var(--base-appbanner-width));
                padding: calc(0.02 * var(--base-appbanner-width)) calc(0.03 * var(--base-appbanner-width));
                background: #ed4f3d;
                color: #fff;
                font-size: calc(0.035 * var(--base-appbanner-width));
                border-radius: 999px;
            }

            .fixed_appbanner_stock_w {
                position: relative;
                z-index: 1;
                height: calc(0.052 * var(--base-appbanner-width));
                overflow: hidden;
            }

            .fixed_appbanner_stock{
                position: relative;
                top: 0;
                z-index: 2;
                display: flex;
                flex-direction: column;
                transition: top 600ms ease-in-out;
                will-change: top;
            }

            .hot_hq_data{
                padding-left: .3em;
            }
        `)

        document.body.insertAdjacentHTML('beforeend', `
            <section class="fixed_appbanner_wrap">
                <div class="fixed_appbanner">
                    <div class="fixed_appbanner_logo"></div>
                    <div class="fixed_appbanner_cont">
                        <h5>新浪财经客户端</h5>
                        <p class="fixed_appbanner_subtitle">
                            <span>热搜舆情：</span>
                            <span class="fixed_appbanner_stock_w">
                                <span class="fixed_appbanner_stock"></span>
                            </span>
                        </p>
                    </div>
                    <div class="fixed_appbanner_btn">打开APP</div>
                </div>
            </section>
        `)
    }

    function initHQ() {
        let hqCodeList
        getJSONP('https://quotes.sina.cn/cn/api/openapi.php/StockSelectionService.getHotStocks', {
            num: 4,
        }).then((data) => {
            hqCodeList = data.result.data.map(item => 's_' + item.symbol)
            return loadScript('https://hq.sinajs.cn/rn=' + Date.now() + '&list=' + hqCodeList.join(','), hqCodeList)
        }).then(() => {
            let htmlStr = ''
            let hqDataList
            for (let i = 0; i <= hqCodeList.length; i++) {
                // 为确保循环播放，需要多放一个
                let index = i === hqCodeList.length ? 0 : i
                hqDataList = window['hq_str_' + hqCodeList[index]].split(',')
                htmlStr += '<span class="fixed_appbanner_stock_i"><span class="hot_hq_name">' + hqDataList[0] + '</span><span class="hot_hq_data" style="color: ' + getRedOrGreen(hqDataList[3]) + '">' + fixed(hqDataList[3]) + '</span></span>'
            }
            const wrapElement = document.querySelector('.fixed_appbanner_stock')
            wrapElement.innerHTML = htmlStr
            let currentIndex = 0
            setInterval(() => {
                currentIndex++
                if (currentIndex > hqCodeList.length) {
                    // 播放到了最后一个，需要循环，则调整位置
                    currentIndex = 1
                    const transitionValue = getComputedStyle(wrapElement)['transition']
                    wrapElement.style.transition = 'none'
                    const eachHeight = wrapElement.parentNode.offsetHeight
                    wrapElement.style.top = '0px'
                    setTimeout(() => {
                        wrapElement.style.transition = transitionValue
                        wrapElement.style.top = '-' + (currentIndex * eachHeight) + 'px'
                    }, 16)
                } else {
                    const eachHeight = wrapElement.parentNode.offsetHeight
                    wrapElement.style.top = '-' + (currentIndex * eachHeight) + 'px'
                }
            }, 3000)
            document.querySelector('.fixed_appbanner_btn').addEventListener('click', () => {
                if (!window.SinaFinanceCallUp) {
                    loadScript('https://finance.sina.com.cn/other/src/app/build.callUpApp.min.js').then(() => {
                        openAPP()
                    })
                } else {
                    openAPP()
                }
            })
        })
    }

    function openAPP() {
        var sfc = new SinaFinanceCallUp.CallUpSinaFinance({
            eventid: 'wap_fixedbar_callup', //sima key
        })
        /* sfc.tryDirectCall({
            callpagetype: '20',
            position: 'wap_fixedbar_app', // suda value
            url: location.href
        }) */
        sfc.tryDirectCall({
            position: `wap_fixedbar_app${CONFIG.static ? ('_' + CONFIG.static) : ''}`,
            newSchemaParams: {
                client_path: "/rankUnion/rank-union",
                mainTab: "stock",
                tab: "stockSearch",
                subTab: "cn",
            }
        });
    }

    function getJSONP(url, data, callbackName) {
        const finalCallbackName = callbackName || `callback${(Math.random() * 1e12).toFixed(0)}`
        return new Promise((resolve) => {
            var script = document.createElement('script')
            url += `?callback=${finalCallbackName}`
            if (data) {
                Object.keys(data).forEach(key => {
                    url += `&${key}=${data[key]}`
                })
            }
            script.src = url
            document.head.appendChild(script)
            window[finalCallbackName] = function (data) {
                resolve(data)
            }
            script.parentNode.removeChild(script)
        })
    }

    function loadScript(url, successData) {
        return new Promise((resolve, reject) => {
            var script = document.createElement('script')
            script.src = url
            script.onload = () => {
                resolve(successData)
                setTimeout(() => {
                    document.head.removeChild(script)
                    script.onload = null
                    script = null
                }, 200)
            }
            script.onerror = (e) => {
                reject(e)
            }
            document.head.appendChild(script)
        })
    }

    function getRedOrGreen(changeRate) {
        const changeRateNum = parseFloat(changeRate)
        if (changeRateNum > 0) {
            return '#f00'
        } else if (changeRateNum < 0) {
            return '#008000'
        } else {
            return '#666'
        }
    }

    function fixed(changeRate) {
        const changeRateNum = parseFloat(changeRate)
        if (changeRateNum > 0) {
            return '+' + changeRateNum.toFixed(2) + '%'
        } else if (changeRateNum < 0) {
            return changeRateNum.toFixed(2) + '%'
        } else {
            return '0.00%'
        }
    }

    function addCSSByStyleSheet(cssText) {
        const style = document.createElement('style')
        style.appendChild(document.createTextNode(cssText))
        document.head.appendChild(style)
    }
})()