var baseUrl = "gj.100t.com"; var baseUrl2 = "gj.100t.com"; var registUrl = "http://" + baseUrl2 + "/api/quepass/regist"; var ansPostUrl = "http://" + baseUrl2 + "/api/quepass/anspost"; var wsCountUrl = "ws://" + baseUrl + "/ws/quepass/onlinecounter"; var wsWaitUrl = "ws://" + baseUrl + "/ws/quepass/onlinewaiting"; var $box = $("#figureBox"), people = 0; var me = { row: 1, col: 1 }; var $go = $("#go"), $countDown = $("#countDown"), $ques = $("#ques"), $trap = $("#trapID"), $num = $("#num"), $fail = $("#fail"), $success = $("#success"), $endBox = $("#endBox"), $ren = $("#ren"); var quesData, quesLen = 0, quesFlag = 0, quesHtml, quesTimer, quesInter, quesCount = quesEnd = 10, isQuesEnd = false; function getQueryString(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); var r = decodeURI(window.location.search.substr(1)).match(reg); if (r != null) return unescape(r[2]); return null; } var uid = getQueryString('uid'); var uname = getQueryString('uname'); var round_id = getQueryString('round_id'); var peopleArr = []; var questionUrl = "question.json"; if (round_id == 2) { questionUrl = "question2.json"; } else if (round_id == 3) { questionUrl = "question3.json"; } $.getJSON(questionUrl, function(res) { quesData = res.ques; quesLen = quesData.length; $("#allQues").html(quesLen); }); var ansArr = ["A", -1, "B"] // 预加载 var $load = $("#load"), images = new Array(); function preload(imgs, callback) { var iCur = 0, i = 0; for (i = 0; i < imgs.length; i++) { images[i] = new Image(); images[i].src = "img/" + imgs[i]; images[i].onload = function() { iCur++; if (iCur == imgs.length) { console.log("加载完成"); callback(); } } } } if (!uid || !uname) { window.location.href = "http://gjnh.100t.com/gjnh/index.php/Index/"; } else { registUrl = registUrl + "/"+uid $.post(registUrl, JSON.stringify({ uid, uname }), function(res) {}) preload(["bg.png", "figure.png", "img1.png", "img2.png", "img3.png", "line.png", "qus-top.png", "text-bg.png", "time-box.png", "trap1.png", "trap2.png", "trap3.png", "trap4.png","mute.png" ], function() {}) waiting(function() { $load.fadeOut(function() { $(this).remove(); init(); }); }) } // 初始化 function init() { var html = "", figure = ""; for (var i = 0; i < 108; i++) { var left = Math.floor(Math.random() * 30) + 35 + "vw"; figure = 'figure f' + Math.floor(Math.random() * 20 + 1); html += "
"; if (i == 1) { continue; } peopleArr.push("#ren" + i); } $box.append(html); me.$id = $("#ren1"); var timer1 = setTimeout(function() { for (var j = 0; j < 36; j++) { if (peopleArr[j]) { var delay = j * 10 + "ms"; me.$id.addClass("me"); getIn(peopleArr[j], 1, j, delay); } } getIn(me.$id, 1, 1, "20ms"); clearTimeout(timer1); }, 100); setTimeout(function() { startQues(); }, 1000); } function getIn(str, i, j, delay) { var $ren = $(str); removePos($ren).addClass("d" + i + "-" + j).addClass("row" + i); $ren.removeAttr("style"); if (delay) { $ren.css("transition-delay", delay); } } function startQues() { if (!me.$id.hasClass('row1')) { postAns(-1, 0, 30); fail(); isQuesEnd = true; window.clearInterval(timer); return false; } resetGame(); console.log(quesLen); if(!quesLen){ alert("题目出现错误"); return false; } if (quesLen != 0 && quesFlag < quesLen && !isQuesEnd) { $num.html(quesFlag + 1); var ques = quesData[quesFlag]; quesHtml = ques.text; $ques.html(quesHtml); $go.fadeIn(); getRandAns(); quesInter = setInterval(function() { if (quesCount == 1) { clearInterval(quesInter); $go.fadeOut(); quesFlag++; var tt = setTimeout(function() { nextGame(ques); clearTimeout(tt); }, 2000); } quesCount--; $countDown.html(quesCount); }, 1000); } else { isQuesEnd = true; clearTimeout(quesTimer); window.clearInterval(timer); success(); } } function nextGame(ques) { var trapHtml = ""; trapHtml += emptyRow(1); $(".row1").removeClass("row1"); if (ques.right == "A") { trapHtml += emptyRow(2); $(".row2").removeClass("row2"); $(".row0").removeClass("row0").addClass("row1"); } else { trapHtml += emptyRow(0); $(".row0").removeClass("row0"); $(".row2").removeClass("row2").addClass("row1"); } $trap.html(trapHtml).show(); setTimeout(function() { var $rows = $(".row1"), rowsLen = $rows.length; for (var i = 0; i < rowsLen; i++) { var $k = $rows.eq(i); removePos($k).removeAttr("style").addClass("d1-" + i).addClass("row1"); } }, 2000); quesTimer = setTimeout(startQues, 3000); } function emptyRow(i) { $(".row" + i).removeAttr("style").transition({ y: "-100vh" }, 2000, "linear", function() { removePos($(this)).css("left", 40 + "vw"); }) if (i == 1) { var rand = 4; } else { var rand = Math.floor(Math.random() * 3) + 1; } return '
'; } function resetGame() { isAns = false; quesCount = quesEnd; $countDown.html(quesCount); $trap.html("").hide(); $("#ansBox .ans").show().removeClass("active"); } function fail() { window.location.href = "fail.html?uid="+uid; } function success() { window.location.href = "success.html"; console.log("success"); } // 获取随机答案 function getRandAns() { var tempPeople = peopleArr.concat(); for (var i = 0; i < 3; i++) { for (var j = 0; j < 36; j++) { if (i == 1) { continue; } if (j == 1) { continue; } var rand = Math.floor(Math.random() * tempPeople.length); var id = tempPeople.splice(rand, 1)[0]; delay = Math.floor(Math.random() * 8000) + "ms"; if (id) { getIn(id, i, j, delay); } else { console.log(id); } } } } // 清除原来位置 function removePos($obj) { if ($obj) { var c = $obj.attr("class"); var match = c.match(/d\d\-\d{0,2}/); var m2 = c.match(/row\d{1}/); if (match) { $obj.removeClass(function() { return match[0]; }) } if (m2) { $obj.removeClass(function() { return m2[0]; }) } return $obj; } } // 选择答案 var isAns = false; $("#ansBox").on("click", ".ans", function() { if (quesCount >= 0 && quesCount <= quesEnd) { if (!isAns) { var $this = $(this); var dataId = $this.attr("data-id"); isAns = true; $this.addClass("active").siblings().fadeOut(); removePos(me.$id).removeAttr("style").addClass("d" + dataId + "-" + 1).addClass("row" + dataId); me.row = dataId; var ans = -1, time = quesEnd - quesCount, iscorrect = 0; if (quesData[quesFlag].right == "A") { ans = dataId == 0 ? 1 : 0; iscorrect = dataId == 0 ? 1 : 0; } else if (quesData[quesFlag].right == "B") { ans = dataId == 2 ? 0 : 1; iscorrect = dataId == 2 ? 1 : 0; } postAns(ans, iscorrect, time); } } }); function postAns(ans, iscorrect, time) { $.post(ansPostUrl, JSON.stringify({ round_id, uid, uname, qno: (quesFlag + 1), ans, iscorrect, time })); } // 重连 var limitConnect = 10; // 断线重连次数 var timeConnect = 0; function reconnect(service) { // lockReconnect加锁,防止onclose、onerror两次重连 if (limitConnect > 0) { if (localStorage.getItem('lockReconnect') != true) { localStorage.setItem("lockReconnect", 1); limitConnect--; timeConnect++; console.log("第" + timeConnect + "次重连"); // 进行重连 setTimeout(function() { webSocketInit(service); localStorage.removeItem("lockReconnect"); }, 2000); } } else { console.log("TCP连接已超时"); } } var isWait = true; var timer = null; var limit=getQueryString("limit")||0; function waiting(callback) { wsWaitUrl = wsWaitUrl +"/"+uid; var ws = new WebSocket(wsWaitUrl); ws.onopen = function() { console.log("open success"); localStorage.removeItem("lockReconnect"); //定时发送 timer = window.setInterval(function() { console.log(uid,uname) ws.send(uid + "_" + uname) }, 2000) } ws.onmessage = function(e) { var res = JSON.parse(e.data); isWait = true console.log(res) //if (res.status == 1 && isWait && res.game_status == 1) { // window.location.href = "gameready.html"; //} //if (res.status == 1 && isWait && res.game_status != 1) { if (res.status == 1 && isWait) { isWait = false; callback(); } if (res.status == 2 && !isWait && res.game_status == 1) { isQuesEnd = true; clearTimeout(quesTimer); success(); } if(res.status == 1 && !isWait && res.data.length<=limit){ isQuesEnd = true; clearTimeout(quesTimer); window.clearInterval(timer); success(); } $ren.html(res.data.length); } ws.onclose = function() { console.log("closed...") window.clearInterval(timer) //这里仿照page.html、 ws.onerror = function(err) { window.clearInterval(timer) }; } ws.onerror = function (err) { window.clearInterval(timer) }; }