// ==UserScript==
// @name         OKEX行情列表添加币种种类
// @namespace    https://greasyfork.org/zh-CN/users/177458-bd777
// @version      0.1
// @description  币币的币种种类
// @author       windeng
// @match        https://www.okex.com/markets/spot-list
// @icon         https://www.google.com/s2/favicons?domain=okex.com
// @grant        GM_xmlhttpRequest
// @grant        GM_setValue
// @grant        GM_getValue
// @downloadURL none
// ==/UserScript==

async function Sleep(sleepSecs) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve()
        }, sleepSecs * 1000)
    })
}

async function WaitUntil(conditionFunc, sleepSecs) {
    sleepSecs = sleepSecs || 1
    return new Promise((resolve, reject) => {
        if (conditionFunc()) resolve()
        let interval = setInterval(() => {
            if (conditionFunc()) {
                clearInterval(interval)
                resolve()
            }
        }, sleepSecs * 1000)
    })
}

// GM_xmlhttpRequest
function Request(url, opt={}) {
	Object.assign(opt, {
		url,
		timeout: 2000,
		responseType: 'json'
	})

	return new Promise((resolve, reject) => {
		/*
		for (let f of ['onerror', 'ontimeout'])
			opt[f] = reject
		*/

		opt.onerror = opt.ontimeout = reject
		opt.onload = resolve

        // console.log('Request', opt)

		GM_xmlhttpRequest(opt)
	}).then(res => {
        if (res.status === 200) return Promise.resolve(res.response)
        else return Promise.reject(res)
    }, err => {
        return Promise.reject(err)
    })
}

function showToast(msg, doNotFade) {
    let width = 300
    let left = document.body.clientWidth / 2 - width / 2
    let style = `position: fixed; left: ${left}px; top: 80px; width: ${width}px; text-align: center; background-color: rgba(255, 255, 255, 0.9); z-index: 99; padding: 10px 20px; border-radius: 5px; color: #222; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2); font-weight: bold;`

    let span = document.createElement('span')
    span.setAttribute('style', style)
    span.innerText = msg
    document.body.appendChild(span)
    if (!doNotFade) {
        setTimeout(() => {
            document.body.removeChild(span)
        }, 5000)
    }
}

function Get(url, opt={}) {
    Object.assign(opt, {
        method: 'GET'
    })
    return Request(url, opt)
}

function Post(url, opt={}) {
    Object.assign(opt, {
        method: 'POST'
    })
    return Request(url, opt)
}

async function getFeeCurrencies() {
    const now = parseInt(new Date().getTime())
    const url = `https://www.okex.com/v2/spot/fee/fee-currencies?t=${now}`
    return Get(url)
}

async function main() {
    await WaitUntil(() => {
        return !!document.querySelector('div.market-table-container')
    })

    let data = await getFeeCurrencies()
    console.log('currencies', data)

    let getCurrencyType = (currency) => {
        if (data.data.feeClass[0].indexOf(currency) != -1) return '1'
        else if (data.data.feeClass[1].indexOf(currency) != -1) return '2'
        else if (data.data.feeClass[2].indexOf(currency) != -1) return '3'
        else return '-'
    }

    let trList = document.querySelectorAll('tr[data-id]')
    for (let tr of trList) {
        const symbol = tr.getAttribute('data-id')
        const currency = symbol.split('-')[0]
        const typeName = getCurrencyType(currency)
        let div = tr.querySelector('td:first-of-type > div.coin-info')
        let span = document.createElement('span')
        span.innerText = typeName
        span.setAttribute('style', 'font-size: 0.7em;color: #bf2424;margin-left: 5px;font-family: consola;border: 2px solid #bf2424;padding: 0 5px;border-radius: 100%;font-weight: bold;')
        div.appendChild(span)
    }
}


(function() {
    'use strict';

    // Your code here...
    main()
})();