123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385 |
- common={
- data:{
- baseurl:"http://183.234.61.252:8090/",
- getUserInfo:"Home/User/Info",
- WebSocket:"ws://183.234.61.252:8282",
- bdSocket:"Home/User/Bind",
- Join:"Home/User/Join",
- Answer:"Home/Game/Answer",
- Join:"Home/Game/Join",
- uid:"",
- option_id:0
- },userInfo:{
- },GET: function (name) {
- var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
- var r = window.location.search.substr(1).match(reg);
- if (r != null) return r[2];
- return null;
- },getUserInfo:function(fn){
- var _this=this;
- $.ajax({
- type: "GET",
- url: this.data.baseurl+this.data.getUserInfo,
- data: {user_id:this.data.uid , mt:this.data.mt },
- dataType: "json",
- success: function(data){
- fn&&fn(data);
- }
- });
- },bdSocket:function(fn){
- var _this=this;
- $.ajax({
- type: "POST",
- url: this.data.baseurl+this.data.bdSocket,
- data: {client_id:this.data.client_id },
- dataType: "json",
- success: function(data){
- fn&&fn(data);
- }
- });
- },Join:function(fn){
- var _this=this;
- $.ajax({
- type: "GET",
- url: this.data.baseurl+this.data.Join,
- dataType: "json",
- success: function(data){
- fn&&fn(data);
- }
- });
- },Answer:function(fn){
- var _this=this;
- $.ajax({
- type: "POST",
- url: this.data.baseurl+this.data.Answer,
- data:{question_id:_this.data.question_id,option_id:_this.data.option_id,anwser_time:_this.data.sum},
- dataType: "json",
- success: function(data){
- fn&&fn(data);
- }
- });
- },player_join:function(data){
- var _this=this;
- // if(responsedata.info.user){
- // $("#username").html(responsedata.info.user.name);
- // $("#avatar").html('<img src="' + responsedata.info.user.avatar + '" class="layui-circle">');
- // }
- // if(data.info.user.user_id){
- // $("#py1_avatar").html('<img src="' + data.info.user.avatar+ '" class="layui-circle">');
- // $("#py1_username").html(data.info.user.name + '(我)');
- // }
- // this.tips(data.info.user.name+"加入了房间")
- for (var i = 0; i < data.info.players.length; i++) {
- if(data.info.players[i].user_id!=_this.userInfo.user_id){
- $("#py2_avatar").html('<img src="' + data.info.players[i].avatar+ '" class="layui-circle">');
- $("#py2_username").html(data.info.players[i].name);
- _this.userInfo.playerId=data.info.players[i].user_id;
- $("#win_rate1").html("胜率:"+data.info.players[i].win_rate+"%");
- }else{
- $("#win_rate2").html("胜率:"+data.info.players[i].win_rate+"%");
- }
- }
-
- if(data.info.players.length>=2){
- $(".gstart").addClass("ready");
- $(".g-doc .g-inner").addClass("doing");
- $(".g-doc .g-inner").addClass("vsmov");
- }
-
-
- },round_end:function(data){
- var _this=this;
- // if(data.info.anwser==_this.data.option_id){
- // $(".cur_answer").addClass("cur_true");
- // }
-
- for (var i = 0; i < data.info.players_answer.length; i++) {
- if(data.info.players_answer[i].user_id==_this.userInfo.playerId){
- //对方的答案id
- _this.data.player_answerId=data.info.players_answer[i].option_id;
- }
- }
- $("#question .item").each(function(){
- if($(this).attr("data-option_id")==data.info.anwser){
- $(this).addClass("cur_true");
- }
- if($(this).attr("data-option_id")!=data.info.anwser&&$(this).hasClass("cur_answer")){
-
- $(this).addClass("cur_error");
- }
-
- if($(this).attr("data-option_id")==_this.data.player_answerId&&$(this).attr("data-option_id")==data.info.anwser){
- //对方答案
- $(this).addClass("player_true");
- }
- if($(this).attr("data-option_id")==_this.data.player_answerId&&$(this).attr("data-option_id")!=data.info.anwser){
- //对方答案
- $(this).addClass("player_error");
- }
-
- })
-
- clearInterval(this.data.ts);
-
- },game_end:function(){
- var _this=this;
- setTimeout(function(){
- var py1_score= parseInt($("#py1_score").text()) ;
- var py2_score=parseInt($("#py2_score").text());
- if(py1_score > py2_score){
-
- // _this.tips('恭喜你获得胜利');
- $("#Jresult").removeClass("faild");
- $("#Jresult").addClass("success");
- $("#Jlastmsg").html("恭喜你获得胜利")
- }else if(py1_score == py2_score){
-
- //_this.tips('打成平手');
- $("#Jlastmsg").html("打成平手")
- $("#Jresult").removeClass("success");
- $("#Jresult").removeClass("faild");
- $("#Jresult").html($("#avatar").html())
- }else{
- //_this.tips('您输了比赛');
- $("#Jlastmsg").html("您输了比赛")
- $("#Jresult").removeClass("success");
- $("#Jresult").addClass("faild");
- }
- $(".g-doc .g-inner").addClass("gstart");
- $(".g-doc .g-inner").addClass("doing");
- $(".g-doc .g-inner").addClass("end");
- $("#Jvs").hide();
- },3000)
- },onSocket:function(e){
- var data=JSON.parse(e.data);
- var _this=this;
- var type=data.type;
- switch(type){
- case 'init':
- _this.data.client_id=data.client_id;
- _this.bdSocket(function(res){
- _this.data.isReady=1;
- console.log(res.msg);
- });
- break;
- case 'player_join':
- _this.player_join(data);
- break;
- case 'question':
- _this.loadQuestion(data);
- break;
- case 'round_end':
- _this.round_end(data);
- console.log("答题结束");
- break;
- case "answer":
- if(_this.userInfo.user_id==data.user_id){
- if( parseInt($("#py1_score").html())==data.total_score){
- $("#question .cur_answer").addClass("cur_error");
- }else{
- $("#question .cur_answer").addClass("cur_true");
- }
- _this.increment($("#py1_score"),data.total_score);
- }else if(_this.userInfo.playerId==data.user_id){
- _this.increment($("#py2_score"),data.total_score);
- }
- break;
- case 'game_end':
- _this.game_end(data);
- console.log("游戏结束");
- break;
-
- }
- //_this.data.question_id
- },startGame:function(){
- if(this.data.isReady=="1")
- this.Join(function(res){
- $(".welcome").hide();
- $(".gstart").show();
- common.tips(res.msg);
- });
- else this.tips("正在登录");
- },initSocket:function(){
- var _this=this;
- var ws = new WebSocket(this.data.WebSocket);
- ws.onmessage=function(e){
- _this.onSocket(e);
- }
- },randomNum:function(minNum,maxNum){
- switch(arguments.length){
- case 1:
- return parseInt(Math.random()*minNum+1,10);
- break;
- case 2:
- return parseInt(Math.random()*(maxNum-minNum+1)+minNum,10);
- break;
- default:
- return 0;
- break;
- }
- },loadQuestion(responsedata) {
- console.log(responsedata);
-
- var _this=this;
- _this.data.isAnswer=false;
- _this.data.question_id= responsedata.info.question.question_id;
-
-
- $("#Jqtitle").html(responsedata.info.question.title );
-
-
- var question="";
- var answers = responsedata.info.options
- for(var i in answers){
- question += '<li class="btn-2 item item'+i+' answer layui-btn layui-btn-primary" data-option_id="'+answers[i].option_id+'"><em></em>'+answers[i].title+'</li>';
- }
- $("#question").html(question);
- $("#Jpage").html(responsedata.info.sequence+"/5");
- _this.data.sequence=responsedata.info.sequence;
- $(".g-doc .g-inner").addClass("doing");
- $(".g-doc .g-inner").removeClass("vsmov");
-
- // is_end = responsedata.info.question.is_end;
- this.daoshu();
- var animate=["zoomInDown","bounceIn","flash"];
- var r = _this.randomNum(0,2);
- $("#Jqtitle").addClass(animate[r]);
- $("#Jqtitle").addClass("animated");
- $("#question .item").on("touchend",function(){
- var l = $("#question .item.cur_answer").length;
- if(l>0)return;
- $(this).addClass("cur_answer");
- _this.data.option_id=$(this).attr("data-option_id");
- if(!_this.data.isAnswer){
- _this.data.isAnswer=true;
-
- _this.Answer(function(){
- });
- }
-
- })
- },listen:function(){
- var _this=this;
- $(".rulebtn").on("touchend",function(){
- $(".popwind,.popbg").fadeIn(200);
- })
- $(".close").on("touchend",function(){
- $(".popwind,.popbg").fadeOut(200);
- })
- $("#start_game").on("touchend",function(){
- _this.startGame();
- })
- $("#Jagain").on("touchend",function(){
- window.location.href=window.location.href;
- })
-
-
- },increment:function(obj,num){
- var text=obj.text();
- obj.prop('Counter',text).animate({
- Counter: num
- },{
- duration: 1500,
- easing: 'swing',
- step: function (now){
- $(this).text(Math.ceil(now));
- }
- });
-
- },daoshu:function(argument) {
- var _this=this;
- clearInterval(this.data.ts);
- $("#Jqtitle").attr("class","tit");
- this.data.sum = 9;
- this.data.angle = 0;
- var leftContent = document.querySelector(".left-content");
- var rightContent = document.querySelector(".right-content");
- var textCircle = document.querySelector(".text-circle");
- leftContent.setAttribute('style', 'transform: rotate(0deg)');
- rightContent.setAttribute('style', 'transform: rotate(0deg)');
- var html="<b class=''>"+_this.data.sum+"</b>";
- this.data.ts = setInterval(function() {
- if(_this.data.sum<4){
- html="<b class='daoshu tada animated'>"+_this.data.sum+"</b>";
- setTimeout(function(){
- $(".text-circle b").removeClass("daoshu");
- $(".text-circle b").removeClass("animated");
- },900)
- }else{
- html="<b class=''>"+_this.data.sum+"</b>";
- }
- if (_this.data.sum >= 0) textCircle.innerHTML = html;
- _this.data.sum = _this.data.sum - 1;
- $("#Jvs .con").show();
- $("#Jvs .tit").html("第"+_this.data.sequence+"题");
- _this.data.angle += 36;
- if (_this.data.angle <= 360) {
- if (_this.data.angle > 180) {
- rightContent.setAttribute('style', 'transform: rotate(' + (_this.data.angle - 180) + 'deg)')
- } else {
- leftContent.setAttribute('style', 'transform: rotate(' + _this.data.angle + 'deg)')
- }
- }
-
-
-
- if (_this.data.sum < 0) {
- if(!_this.data.isAnswer)
- _this.Answer();
-
- _this.data.sum = 9;
- _this.data.angle = 0;
- leftContent.setAttribute('style', 'transform: rotate(0deg)');
- rightContent.setAttribute('style', 'transform: rotate(0deg)');
- clearInterval(_this.data.ts);
- }
- }, 1000)
- }, tips: function (text, time) {
- //弹窗工具
- time = time ? time : 1500;
- var para = document.createElement("p"); //创建新的<p> 元素
- para.innerHTML = text;
- para.setAttribute("class", "poptis");
- document.body.appendChild(para);
- para.style.marginLeft = -para.offsetWidth / 2+"px";
- setTimeout(function () {
- document.body.removeChild(para);
- }, time);
- },init:function(){
- var _this=this;
- this.listen();
- var ycy =this.GET("ycy");
- if(ycy){
- var b64 = new Base64();
- ycy=b64.decode(ycy);
- ycy=decodeURIComponent(ycy);
- ycy= JSON.parse(ycy);
- this.data.uid=ycy.uid;
- this.data.mt=ycy.mt;
- }
- if( this.GET("user_id")){
- this.data.uid=this.GET("user_id");
- this.data.mt=this.GET("mt");
- }
- this.getUserInfo(function(res){
- _this.userInfo=res.info;
- $("#py1_username").html(res.info.name);
- $("#py1_avatar").html('<img src="' + res.info.avatar + '" class="layui-circle">');
- _this.initSocket();
- })
-
-
- }
- }
- window.common=common;
|