$(function() {

    var websocket;

    // 首先判断是否 支持 WebSocket
    if('WebSocket' in window || 'MozWebSocket' in window) {
        websocket = new WebSocket("ws://localhost:8080/trade/websocket");
    } /*else if() {
        websocket = new MozWebSocket("ws://localhost:8080/trade/websocket");
    } */else {
        websocket = new SockJS("http://localhost:8080/trade/sockjs/websocket");
    }

    var userId = '40288244643c23af01643c2bef230000';
    var toId = '';
    // 打开时
    websocket.onopen = function(evnt) {
        console.log("  websocket.onopen  ");
        var loginMsg = {
            from:'trader',
            to:'',
            action:'login',
            cnt:'',
            uid:userId
        };
        websocket.send(JSON.stringify(loginMsg));
    };

    var wsDialogShow = 0;
    // 处理消息时
    websocket.onmessage = function(evnt) {
        var data = eval('('+evnt.data+')');
        var tipNote = '小菜鸡，你有新消息!';
        if(data.action == 'broadcast'){
            toId = data.targetId;
            tipNote = '新用户上线了!';
        }else if(data.action == 'accept'){
            if(data.targetId == userId){//是本人操作接收服务
                layer.closeAll();
                wsDialogShow = 1;
                openWSDialog();
            }else{
                layer.msg("服务已被处理!");
            }
        }else{
            $("#ws-msg-bx").append("<p>(<font color='red'>" + data.content + "</font>)</p>");
            console.log("  websocket.onmessage   " + wsDialogShow);
        }

        console.log(data);
        //if(wsDialogShow == 0){
            layer.open({
                type: 1
                ,offset: 'b'
                //,time:50000
                ,anim: 6
                ,id: 'layerDemob' //防止重复弹出
                ,content: '<div style="padding: 10px 40px;background-color: cadetblue;">'+tipNote+'</div>'
                ,btn: '打开'
                ,btnAlign: 'c' //按钮居中
                ,shade: 0 //不显示遮罩
                ,yes: function(){
                    var acceptMsg = {
                        from:'trader',
                        to:toId,
                        cnt: '',
                        action:'accept',
                        uid:userId
                    };
                    websocket.send(JSON.stringify(acceptMsg));
                }
            });
        //}
    };

    function openWSDialog(){
        layer.open({
            type: 1
            ,offset: 'rb'
            ,id: 'wslayerDemob' //防止重复弹出
            ,content: $("#wsDialog")
            ,closeBtn: 1
            ,btnAlign: 'c' //按钮居中
            ,shade: 0 //不显示遮罩
            ,end:function(){
                wsDialogShow = 0;
            }
        });
    }


    websocket.onerror = function(evnt) {
        console.log("  websocket.onerror  ");
    };

    websocket.onclose = function(evnt) {
        console.log("  websocket.onclose  ");
    };


    // 点击了发送消息按钮的响应事件
    $("#TXBTN").click(function(){

        // 获取消息内容
        var text = $("#tx").val();

        // 判断
        if(text == null || text == ""){
            alert(" content  can not empty!!");
            return false;
        }

        var msg = {
            from:'trader',
            to:toId,
            cnt: text,
            action:'msg',
            uid:userId
        };

        console.log(" ready send msg to :" + toId);
        // 发送消息
        if(toId != ''){
            websocket.send(JSON.stringify(msg));
        }

    });


});
