BJ_Casino_Rank/src/script/BJ_Casino_Rank.ts

export class BJ_Casino_Rank {

    //#region private

    private _client: any;

    private _ws: any;

    //#endregion

    //#region Lifecycle

    /**
     *
     */
    constructor(client: any) {
        this._client = client;
        this.onLoad();
    }

    public onLoad() {
        let self: this = this;
        try {
            // const URL = document.getElementById("URL").value;
            // const Port = document.getElementById("Port").value;

            const URL = "wss://game.online-bj.com";
            const Port = "9005";
            const Account = { "p": 0, "device_info": ["Windows", "Windows"], "fcm_token": "", "a": "ct00000691", "pw": "4lsAyoalajm7", "ver": "1.3.0" };

            // const URL = "ws://192.168.5.12";
            // const Port = "9487";

            // const URL = "ws://220.134.195.1";
            // const Port = "19005";
            // const Account = { "p": 0, "device_info": ["Windows", "Windows"], "fcm_token": "", "a": "ct00002242", "pw": "n0tfHlVuEhpO", "ver": "1.3.0" };
            if (this._ws) {
                this.AddLog("中斷上一個連線");
                this._ws.close();
            }
            this._ws = new WebSocket(`${URL}:${Port}`);//连接服务器

            //连接websocket
            this._ws.onopen = function (event: any, AlarmMessage: any) {
                self.AddLog("已經與服務器建立了連接，當前連接狀態：" + this.readyState);
                self.SendData("account.login", Account);
            };

            //websocket传输数据
            this._ws.onmessage = this.OnWebSocketMessage.bind(this);

            //websocket关闭连接
            this._ws.onclose = function (event: any) {
                self.AddLog("已經與服務器斷開連接，當前連接狀態：" + this.readyState);
                // let document = parent ? parent.document : document;
                // document.title = `已斷線`;
            };

            //websocket连接异常
            this._ws.onerror = function (event: any) {
                // alert("WebSocket异常！");
                self.AddLog("WebSocket異常！");
            };
        } catch (ex) {
            // alert(ex.message);
            this.AddLog(ex);
        }
    };

    //#endregion

    //#region Custom

    public SendData(Method: string, Data: any) {
        let json = [Method];
        if (Data != null && Data != undefined) {
            json[1] = Data;
        }

        let str = JSON.stringify(json);
        if (str.length > 65535) {
            this.AddLog("要傳的資料太大囉");
            throw new Error('要傳的資料太大囉');
        }

        if (Data != null && Data != undefined) {
            this.AddLog(`[RPC] 傳送server資料: ${Method}(${JSON.stringify(Data).replace(/\\/g, "")})`);
        } else {
            this.AddLog(`[RPC] 傳送server資料: ${Method}()`);
        }

        let strary = this.GetBytes(str);
        let buffer = new Uint8Array(4 + strary.byteLength);
        let u16ary = new Uint16Array(buffer.buffer, 0, 3);
        u16ary[0] = strary.byteLength;
        buffer[3] = 0x01;
        buffer.set(strary, 4);
        this._ws.send(buffer);
    }

    public ResData(Status: any, Method: any, Data: any = null) {
        // let document = parent ? parent.document : document;
        switch (Method) {
            case "account.login": {
                this.SendData("rank.info", { "t": 12, "p": 2 });
                break;
            }

            case "rank.info": {
                this.SetData(Data);
                this._ws.close();
                break;
            }

            default:
                break;
        }
    }

    public SetData(data: any) {
        let rankdata = data["rank"];
        // let div_Main = document.getElementById("div_Main");
        let div_Main = this._client.div_Main;
        let div_main_s = "";
        div_main_s += `
        <table class="table table-striped table-info table-hover">
        <thead>
        `;
        div_main_s += `<th>排名</th>`;
        div_main_s += `<th>名稱</th>`;
        div_main_s += `<th>倍率</th>`;
        div_main_s += `<th>機台</th>`;
        div_main_s += `<th>桌號</th>`;
        div_main_s += `</thead><tbody>`;
        for (let i = 0; i < rankdata.length; i++) {
            const data = rankdata[i];
            const rank = data[0];
            const magnification = Math.floor(data[1]);
            const name = data[2][1];
            const slot = data[3][0];
            const table = data[3][1];
            div_main_s += `
                    <tr>
                    <td><font size="5"><b>${rank}</b></font></td>
                    <td align="left"><font size="5"><b>${name}</b></font></td>
                    <td align="left"><font size="5"><b>${magnification}</b></font></td>
                    <td align="left"><font size="5"><b>${slot}</b></font></td>
                    <td align="left"><font size="5"><b>${table}</b></font></td>
                    </tr>
                    `;
        }
        div_main_s += `</tbody></table>`;
        div_Main.value.innerHTML = div_main_s;
    }

    //#region WebSocke

    public OnWebSocketMessage(e: any) {
        let self: this = this;
        if (e.data instanceof ArrayBuffer) {
            this.ParseRpcMessage(e.data);
        } else if (e.data instanceof Blob) {
            let reader = new FileReader();
            reader.onload = (e) => {
                self.ParseRpcMessage(reader.result); reader.onload = null;
            }
            reader.readAsArrayBuffer(e.data);
        } else {
            this.AddLog(`未知的OnWebSocketMessage(e.data)類型: ${e.data}`);
            throw new Error(`未知的OnWebSocketMessage(e.data)類型: ${e.data}`);
        }
    }


    public ParseRpcMessage(buffer: any) {
        let startIndex = 0, byteLength = buffer.byteLength;
        while (startIndex + 4 < byteLength) {
            let strlen = new DataView(buffer, startIndex, 3).getUint16(0, true);
            let str = this.GetString(new Uint8Array(buffer, startIndex + 4, strlen));
            startIndex += strlen + 4;

            try {
                let json = JSON.parse(str);
                let method = json[0];
                let status = json[1][0];
                let data = json[1][1];

                let resp = {
                    Method: method,
                    Status: status,
                    Data: data,
                    IsValid: method && status === 0
                };

                if (data) {
                    this.AddLog(`[RPC] 收到server呼叫:(${resp.Status}): ${resp.Method}(${JSON.stringify(resp.Data)})`);
                    this.ResData(resp.Status, resp.Method, resp.Data);
                } else {
                    this.AddLog(`[RPC] 收到server呼叫:(${resp.Status}): ${resp.Method}()`);
                    this.ResData(resp.Status, resp.Method);
                }
            }
            catch
            {
                this.AddLog(`[RPC] 無法解析Server回應: ${str}`);
                throw new Error(`[RPC] 無法解析Server回應: ${str}`);
            }
        }
    }

    public seestate() {
        // alert(ws.readyState);
        this.AddLog(this._ws.readyState);
    }

    public AddLog(log: any) {
        console.log(log);
        // var textarea = document.getElementById("Log");
        // textarea.value += log + "\n";
        // textarea.scrollTop = textarea.scrollHeight;
    }

    public GetBytes(str: any) {
        let len = str.length, resPos = -1;
        let resArr = new Uint8Array(len * 3);
        for (let point = 0, nextcode = 0, i = 0; i !== len;) {
            point = str.charCodeAt(i), i += 1;
            if (point >= 0xD800 && point <= 0xDBFF) {
                if (i === len) {
                    resArr[resPos += 1] = 0xef;
                    resArr[resPos += 1] = 0xbf;
                    resArr[resPos += 1] = 0xbd;
                    break;
                }

                nextcode = str.charCodeAt(i);
                if (nextcode >= 0xDC00 && nextcode <= 0xDFFF) {
                    point = (point - 0xD800) * 0x400 + nextcode - 0xDC00 + 0x10000;
                    i += 1;
                    if (point > 0xffff) {
                        resArr[resPos += 1] = (0x1e << 3) | (point >>> 18);
                        resArr[resPos += 1] = (0x2 << 6) | ((point >>> 12) & 0x3f);
                        resArr[resPos += 1] = (0x2 << 6) | ((point >>> 6) & 0x3f);
                        resArr[resPos += 1] = (0x2 << 6) | (point & 0x3f);
                        continue;
                    }
                } else {
                    resArr[resPos += 1] = 0xef;
                    resArr[resPos += 1] = 0xbf;
                    resArr[resPos += 1] = 0xbd;
                    continue;
                }
            }
            if (point <= 0x007f) {
                resArr[resPos += 1] = (0x0 << 7) | point;
            } else if (point <= 0x07ff) {
                resArr[resPos += 1] = (0x6 << 5) | (point >>> 6);
                resArr[resPos += 1] = (0x2 << 6) | (point & 0x3f);
            } else {
                resArr[resPos += 1] = (0xe << 4) | (point >>> 12);
                resArr[resPos += 1] = (0x2 << 6) | ((point >>> 6) & 0x3f);
                resArr[resPos += 1] = (0x2 << 6) | (point & 0x3f);
            }
        }
        return resArr.subarray(0, resPos + 1);
    }

    public GetString(array: any) {
        let str = "";
        let i = 0, len = array.length;
        while (i < len) {
            let c = array[i++];
            switch (c >> 4) {
                case 0: case 1: case 2: case 3: case 4: case 5: case 6: case 7:
                    str += String.fromCharCode(c);
                    break;
                case 12: case 13:
                    str += String.fromCharCode(((c & 0x1F) << 6) | (array[i++] & 0x3F));
                    break;
                case 14:
                    str += String.fromCharCode(((c & 0x0F) << 12) | ((array[i++] & 0x3F) << 6) | ((array[i++] & 0x3F) << 0));
                    break;
            }
        }
        return str;
    }

    //#endregion
}