function setOnline() {
    var span = document.getElementById("ws-status")
    span.style = "background: green"
    span.innerHTML = '在线'
}

function setOffline() {
    var span = document.getElementById("ws-status")
    span.style = "background: red"
    span.innerHTML = '离线'
}

function process(payload) {
    var app = '<span style="color: yellowgreen">' +  payload.app + '</span>'
    var concat = '<span style="color: red">' +  '@' + '</span>'
    var host = '<span style="color: yellowgreen">' +  payload.host + ' ' + '</span>'
    var timestamp = '<span style="color: peachpuff">' +  payload.dateTimeStr + ' ' + '</span>'
    var thread = '<span style="color: peachpuff">' +  payload.thread + ' ' + '</span>'
    var level
    if (payload.level === 'INFO') {
        level = '<span style="color: green">' +  payload.level + ' ' + '</span>'
    } else if (payload.level === 'ERROR') {
        level = '<span style="color: red">' +  payload.level + ' ' + '</span>'
    } else {
        level = '<span style="color: yellow">' +  payload.level + ' ' + '</span>'
    }

    var logger = '<span style="color: wheat">' +  payload.logger + ' ' + '</span>'
    var message = '<span style="color: white">' +  payload.message + ' ' + '</span>'

    var text = app + concat +  host + ' ' + timestamp + ' ' + thread + ' ' + level + ' ' + logger + ' ' + message + '<br>'
    add(text)
}

function process2(payload) {
    var app = '<span style="color: yellowgreen">' +  payload.requestId + '</span>'
    var concat = '<span style="color: red">' +  '@' + '</span>'
    var host = '<span style="color: yellowgreen">' +  payload.requestMethod + ' ' + '</span>'
    var timestamp = '<span style="color: peachpuff">' +  payload.requestUrl + ' ' + '</span>'
    var thread = '<span style="color: peachpuff">' +  payload.requestTime + ' ' + '</span>'
    var level = '<span style="color: green">' +  payload.executeTime + ' ' + '</span>'
    var logger = '<span style="color: wheat">' +  payload.statusCode + ' ' + '</span>'
    var message = '<span style="color: white">' +  payload.targetRoute + ' ' + '</span>'
    var targetService = '<span style="color: white">' +  payload.targetService + ' ' + '</span>'
    var remoteAddr = '<span style="color: white">' +  payload.remoteAddr + ' ' + '</span>'

    var text = remoteAddr + ' ' + app + ' ' +  host + ' ' + timestamp + ' ' + thread + ' '
        + level + ' ' + logger + ' ' + message + ' ' + targetService + '<br>'
    add(text)
}

function add(text) {
    var p = document.createElement("p");
    p.innerHTML = text + '<br>'

    var div = document.createElement("div");
    div.appendChild(p)

    var li = document.createElement("li");
    li.appendChild(div)

    var ul = document.getElementById("applog");
    ul.appendChild(li);
}

function getUrl() {
    var token = '0123456789'
    var app = 'bntweb'
    var host = 'localhost'
    var params = 'token=' + token + '&app=' + app + '&host=' + host;

    let protocol = location.protocol
    let hostname = location.hostname
    let port = location.port
    let prefix;
    if (protocol === 'https') {
        if (port === 443) {
            prefix = 'wss://' + hostname;
        } else {
            prefix = 'wss://' + hostname + ':' + port;
        }
    } else {
        if (port === 80) {
            prefix = 'ws://' + hostname;
        } else {
            prefix = 'ws://' + hostname + ':' + port;
        }
    }

    return  prefix + '/bgws/log/pull?' + params
}

function getUrl1(app, host) {
    var token = '0123456789'
    var params = 'token=' + token + '&app=' + app + '&host=' + host;

    let protocol = location.protocol
    let hostname = location.hostname
    let port = location.port
    let prefix;
    if (protocol === 'https') {
        if (port === 443) {
            prefix = 'wss://' + hostname;
        } else {
            prefix = 'wss://' + hostname + ':' + port;
        }
    } else {
        if (port === 80) {
            prefix = 'ws://' + hostname;
        } else {
            prefix = 'ws://' + hostname + ':' + port;
        }
    }

    return  prefix + '/bgws/log/pull?' + params
}

var ws
var reconnectLock = false
function initWebSocket() {
    if ("WebSocket" in window) {
        var url = getUrl()
        ws = new WebSocket(url);
        ws.onopen = function() {
            setOnline()
            console.log("websocket connected...");
        };
        ws.onclose = function() {
            setOffline()
            console.log("websocket connection closed...");
            reconnect()
        };
        ws.onerror = function () {
            setOffline()
            console.log("websocket connection error...");
            reconnect()
        };
        ws.onmessage = function (evt) {
            var payload = JSON.parse(evt.data)
            process(payload)
        }
    } else {
        // 浏览器不支持 WebSocket
        alert("您的浏览器不支持 WebSocket!");
    }
}

var app1=''
var host1=''
function initWebSocket1() {
    if ("WebSocket" in window) {
        var wsUrl = 'ws://localhost:4030/bgws/log/pull?app=tnb&host=localhost'
        ws = new WebSocket(wsUrl);
        ws.onopen = function() {
            setOnline()
            console.log("websocket connected...");
        };
        ws.onclose = function() {
            setOffline()
            console.log("websocket connection closed...");
            reconnect()
        };
        ws.onerror = function () {
            setOffline()
            console.log("websocket connection error...");
            reconnect()
        };
        ws.onmessage = function (evt) {
            var payload = JSON.parse(evt.data)
            process(payload)
        }
    } else {
        // 浏览器不支持 WebSocket
        alert("您的浏览器不支持 WebSocket!");
    }
}

function initWebSocket2(wsUrl) {
    if ("WebSocket" in window) {
        ws = new WebSocket(wsUrl);
        ws.onopen = function() {
            setOnline()
            console.log("websocket connected...");
        };
        ws.onclose = function() {
            setOffline()
            console.log("websocket connection closed...");
            reconnect()
        };
        ws.onerror = function () {
            setOffline()
            console.log("websocket connection error...");
            reconnect()
        };
        ws.onmessage = function (evt) {
            var payload = JSON.parse(evt.data)
            process2(payload)
        }
    } else {
        // 浏览器不支持 WebSocket
        alert("您的浏览器不支持 WebSocket!");
    }
}

function reconnect() {
    if (reconnectLock) return

    reconnectLock = true
    setTimeout(function () {
        console.log('websocket reconnecting...')
        initWebSocket1(app1, host1)
        reconnectLock = false
    }, 5000)
}

function send(payload) {
    ws.send(payload)
}