common.js 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238
  1. common={
  2. data:{
  3. baseurl:"http://183.234.61.252:8090/",
  4. getUserInfo:"Home/User/Info",
  5. register:"",
  6. WebSocket:"",
  7. bdSocket:"Home/User/Bind",
  8. Join:"Home/User/Join",
  9. Answer:"Home/User/Answer",
  10. Join:"Home/Game/Join",
  11. uid:"",
  12. },userInfo:{
  13. },GET: function (name) {
  14. var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
  15. var r = window.location.search.substr(1).match(reg);
  16. if (r != null) return unescape(r[2]);
  17. return null;
  18. },getUserInfo:function(fn){
  19. var _this=this;
  20. $.ajax({
  21. type: "GET",
  22. url: this.data.baseurl+this.data.getUserInfo,
  23. data: {user_id:this.data.uid , mt:this.data.mt },
  24. dataType: "json",
  25. success: function(data){
  26. fn&&fn(data);
  27. }
  28. });
  29. },bdSocket:function(fn){
  30. var _this=this;
  31. $.ajax({
  32. type: "POST",
  33. url: this.data.baseurl+this.data.bdSocket,
  34. data: {client_id:this.data.client_id },
  35. dataType: "json",
  36. success: function(data){
  37. fn&&fn(data);
  38. }
  39. });
  40. },Join:function(fn){
  41. var _this=this;
  42. $.ajax({
  43. type: "GET",
  44. url: this.data.baseurl+this.data.Join,
  45. dataType: "json",
  46. success: function(data){
  47. fn&&fn(data);
  48. }
  49. });
  50. },Answer:function(fn){
  51. var _this=this;
  52. $.ajax({
  53. type: "GET",
  54. url: this.data.baseurl+this.data.Answer,
  55. data:{question_id:_this.data.question_id,option_id:_this.data.option_id},
  56. dataType: "json",
  57. success: function(data){
  58. fn&&fn(data);
  59. }
  60. });
  61. },player_join:function(data){
  62. // if(responsedata.info.user){
  63. // $("#username").html(responsedata.info.user.name);
  64. // $("#avatar").html('<img src="' + responsedata.info.user.avatar + '" class="layui-circle">');
  65. // }
  66. // if(data.info.user.user_id){
  67. // $("#py1_avatar").html('<img src="' + data.info.user.avatar+ '" class="layui-circle">');
  68. // $("#py1_username").html(data.info.user.name + '(我)');
  69. // }
  70. this.tips(data.info.user.name+"加入了房间")
  71. if(data.info.user.user_id!=this.userInfo.user_id){
  72. $("#py2_avatar").html('<img src="' + data.info.user.avatar+ '" class="layui-circle">');
  73. $("#py2_username").html(data.info.user.name);
  74. }
  75. },onSocket:function(e){
  76. var data=JSON.parse(e.data);
  77. var _this=this;
  78. var type=data.type;
  79. switch(type){
  80. case 'init':
  81. _this.data.client_id=data.client_id;
  82. _this.bdSocket(function(res){
  83. _this.data.isReady=1;
  84. console.log(res.msg);
  85. });
  86. break;
  87. case 'player_join':
  88. _this.player_join(data);
  89. break;
  90. case 'question':
  91. _this.loadQuestion(data);
  92. break;
  93. case 'round_end':
  94. break;
  95. case 'game_end':
  96. $(".g-doc .g-inner").addClass("end");
  97. $("#Jvs").hide();
  98. break;
  99. }
  100. //_this.data.question_id
  101. },startGame:function(){
  102. if(this.data.isReady=="1")
  103. this.Join(function(res){
  104. $(".welcome").hide();
  105. $(".gstart").show();
  106. common.tips(res.msg);
  107. });
  108. else this.tips("登录失败");
  109. },initSocket:function(){
  110. var _this=this;
  111. var ws = new WebSocket("ws://183.234.61.252:8282");
  112. ws.onmessage=function(e){
  113. _this.onSocket(e);
  114. }
  115. },loadQuestion(responsedata) {
  116. console.log(responsedata);
  117. var _this=this;
  118. _this.data.isAnswer=false;
  119. _this.data.question_id= responsedata.info.question.question_id;
  120. $("#Jqtitle").html(responsedata.info.question.title );
  121. var question="";
  122. var answers = responsedata.info.options
  123. for(var i in answers){
  124. question += '<li class="btn-2 item item'+i+' answer layui-btn layui-btn-primary" data-option_id="'+answers[i].option_id+'">'+answers[i].title+'</li>';
  125. }
  126. $("#question").html(question);
  127. $("#Jpage").html(responsedata.info.questions_count+"/5");
  128. $(".g-doc .g-inner").addClass("doing");
  129. // is_end = responsedata.info.question.is_end;
  130. this.daoshu();
  131. },listen:function(){
  132. var _this=this;
  133. $(".rulebtn").on("touchend",function(){
  134. $(".popwind,.popbg").fadeIn(200);
  135. })
  136. $(".close").on("touchend",function(){
  137. $(".popwind,.popbg").fadeOut(200);
  138. })
  139. $("#start_game").on("touchend",function(){
  140. _this.startGame();
  141. })
  142. $("#question .item").on("touchend",function(){
  143. var l = $("#question .item.cur_answer").length;
  144. if(l>0)return;
  145. this.addClass("cur_answer");
  146. _this.data.option_id=this.attr("data-option_id");
  147. _this.Answer(function(){
  148. _this.data.isAnswer=true;
  149. });
  150. })
  151. },daoshu:function(argument) {
  152. var _this=this;
  153. clearInterval(this.data.ts);
  154. this.data.sum = 9;
  155. this.data.angle = 0;
  156. var leftContent = document.querySelector(".left-content");
  157. var rightContent = document.querySelector(".right-content");
  158. var textCircle = document.querySelector(".text-circle");
  159. leftContent.setAttribute('style', 'transform: rotate(0deg)');
  160. rightContent.setAttribute('style', 'transform: rotate(0deg)');
  161. this.data.ts = setInterval(function() {
  162. if (_this.data.sum >= 0) textCircle.innerHTML = _this.data.sum;
  163. _this.data.sum = _this.data.sum - 1;
  164. $("#Jvs .con").show();
  165. $("#Jvs .tit").html("抢答中");
  166. _this.data.angle += 36;
  167. if (_this.data.angle <= 360) {
  168. if (_this.data.angle > 180) {
  169. rightContent.setAttribute('style', 'transform: rotate(' + (_this.data.angle - 180) + 'deg)')
  170. } else {
  171. leftContent.setAttribute('style', 'transform: rotate(' + _this.data.angle + 'deg)')
  172. }
  173. }
  174. if (_this.data.sum < -1) {
  175. if(!_this.data.isAnswer)
  176. _this.Answer();
  177. _this.data.sum = 9;
  178. _this.data.angle = 0;
  179. leftContent.setAttribute('style', 'transform: rotate(0deg)');
  180. rightContent.setAttribute('style', 'transform: rotate(0deg)')
  181. }
  182. }, 1000)
  183. }, tips: function (text, time) {
  184. //弹窗工具
  185. time = time ? time : 1500;
  186. var para = document.createElement("p"); //创建新的<p> 元素
  187. para.innerHTML = text;
  188. para.setAttribute("class", "poptis");
  189. document.body.appendChild(para);
  190. para.style.marginLeft = -para.offsetWidth / 2+"px";
  191. setTimeout(function () {
  192. document.body.removeChild(para);
  193. }, time);
  194. },init:function(){
  195. var _this=this;
  196. this.listen();
  197. var ycy =this.GET("ycy");
  198. if(ycy){
  199. var b64 = new Base64();
  200. ycy=b64.decode(ycy);
  201. ycy=decodeURIComponent(ycy);
  202. ycy= JSON.parse(ycy);
  203. this.data.uid=ycy.uid;
  204. this.data.mt=ycy.mt;
  205. }
  206. if( this.GET("user_id")){
  207. this.data.uid=this.GET("user_id");
  208. this.data.mt=this.GET("mt");
  209. }
  210. this.getUserInfo(function(res){
  211. _this.userInfo=res.info;
  212. $("#py1_username").html(res.info.name);
  213. $("#py1_avatar").html('<img src="' + res.info.avatar + '" class="layui-circle">');
  214. _this.initSocket();
  215. })
  216. }
  217. }
  218. window.common=common;