playerDetail.html 33 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8" />
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  6. <title>个人信息</title>
  7. <meta name="description" content="" />
  8. <meta name="keywords" content="" />
  9. <link rel="stylesheet" href="css/morris.css" />
  10. <link rel="stylesheet" href="css/global.css" />
  11. <style>
  12. .button_qzone span, .button_tqq span, .button_tsina span{
  13. background:none;
  14. }
  15. .col-3{width:33.3%!important;}
  16. .col-2{width:50%!important;}
  17. </style>
  18. <!--[if gt IE 6]><!-->
  19. <script type="text/javascript">
  20. !function(t){t.loadScript(["http://szhuodong.duowan.com/feq/lolbox/yy-f2e-header-lolbox.min"])}(function(){function t(t){var e=n(t);document.write(e)}function n(t){for(var n,r="",c=0;n=t[c];c++)r+=e(n);return r}function e(t){var n=[unescape("%3Cscript%20type%3D%22text/javascript%22%20src%3D%22"),"",unescape("%22%3E%3C/script%3E")],e=new Date;return e.setSeconds(0),e.setMilliseconds(0),e=e.getTime(),t+="?t_="+e,n[1]=t,n.join("")}return{loadScript:function(n){n&&n.length&&n instanceof Array&&t(n)}}}())
  21. </script>
  22. <!--<![endif]-->
  23. <script src="js/jquery-1.11.1.min.js"></script>
  24. <script src="js/jquery-migrate-1.2.1.min.js"></script>
  25. <script src="js/raphael-min.js"></script>
  26. <script src="js/morris.min.js"></script>
  27. <script src="js/jquery.nicescroll.min.js"></script>
  28. <script src="js/jquery.cookie.js"></script>
  29. <script src="js/underscore.js"></script>
  30. <script type="text/javascript" src="http://sz.duowan.com/s/ya/ya.1.3.1-min.js"></script>
  31. <!--[if IE 7]>
  32. <style>
  33. .personal .box-bd .com-hero .more{margin-top:-20px;}
  34. .huya-ad-v2{margin-top:-25px;}
  35. .personal-tabs{margin-top:-18px;}
  36. .top-message .more-info .refresh i, .personal-top .more-info .refresh i{margin-top:2px;}
  37. .top-message .more-info, .personal-top .more-info{margin-top:-30px;}
  38. .hero-nav{behavior: url(js/PIE.htc);}
  39. .personal .box-bd .intro{height:100px!important;margin-top:-10px;}
  40. .da-ye-bd LI P{position:relative;}
  41. .mod-top{z-index:9;}
  42. .nav-top-bottom I{vertical-align:8px!important;}
  43. .ad-wrap{top:260px;bottom:auto!important;}
  44. .col-2{width:49%!important;}
  45. .top-message{
  46. clear:both;z-index:999;
  47. }
  48. .more-info{
  49. clear:both;z-index:999;
  50. }
  51. </style>
  52. <![endif]-->
  53. </head>
  54. <body style="overflow:hidden;" scroll="no">
  55. <div class="top-message personal-top">
  56. <a href="playerSearch.html">玩家查询</a>
  57. <i>&gt;</i>&nbsp; <a id="currentNav"></a>
  58. <i>&gt;</i>&nbsp;<span>玩家详情</span>
  59. <div class="more-info">
  60. <a class="icons refresh" href="javascript:location.reload();"><i></i></a>
  61. <div class="share">
  62. <a class="icons" href="javascript:void(0);"><i></i></a>
  63. </div>
  64. <div class="links">
  65. <a class="button_tsina" href="#"><i class="sina"></i><span>新浪微博</span></a>
  66. <a class="button_tqq" href="#"><i class="tencent"></i><span>腾讯微博</span></a>
  67. <a class="button_qzone" href="#"><i class="qq"></i><span>QQ空间</span></a>
  68. <a href="javascript:window.clipboardData.setData('Text',window.location.href);alert('链接复制成功');" style="color:#408bcb;"><i class="copy-link"></i><span>复制链接</span></a>
  69. </div>
  70. <script>
  71. var hoverTimeout = null, leaveTimeout = null, mode = 'hide';
  72. $('.more-info .share').on('mouseenter', function(e) {
  73. clearTimeout(hoverTimeout);
  74. clearTimeout(leaveTimeout);
  75. hoverTimeout = setTimeout(function() {
  76. $('.links').show();
  77. }, 150);
  78. }).on('mouseleave', function(e) {
  79. clearTimeout(hoverTimeout);
  80. clearTimeout(leaveTimeout);
  81. leaveTimeout = setTimeout(function() {
  82. if(mode == 'hide') $('.links').hide();
  83. }, 200);
  84. $('.links').on('mouseenter', function(e) {
  85. mode = 'show';
  86. }).on('mouseleave', function(e) {
  87. mode = 'hide';
  88. clearTimeout(leaveTimeout);
  89. leaveTimeout = setTimeout(function() {
  90. $('.links').hide();
  91. }, 200);
  92. });
  93. });
  94. </script>
  95. </div>
  96. </div>
  97. <div class="box personal" style="width:600px;padding:15px;overflow:hidden;">
  98. <div class="no-data-tip hide">
  99. <img src="img/clothes-commit-fail.png">
  100. <p></p>
  101. </div>
  102. <div class="box-bd clearfix hide">
  103. <div class="intro" id="personalInfo">
  104. </div>
  105. <script>
  106. $("body").delegate("#fightingQuestion", "mouseenter", function(e) {
  107. e.preventDefault();
  108. $(".rank-ul").toggle();
  109. });
  110. $("body").delegate("#fightingQuestion", "mouseleave", function(e) {
  111. e.preventDefault();
  112. $(".rank-ul").hide();
  113. });
  114. </script>
  115. <div class="mod-tabs clearfix personal-tabs">
  116. <div class="mod-tabs-hd">
  117. <ul class="mod-tabs-trigger J_nav" id="modeTabs">
  118. <li class="selected stat-sign" data-type="mode-1" stat-sign="zonghe" stat-desc="综合统计">综合统计</li>
  119. <li class="stat-sign" data-type="mode-2" stat-sign="common" stat-desc="常规模式">常规模式</li>
  120. <li class="stat-sign" data-type="mode-3" stat-sign="2015" stat-desc="stat-desc">排位模式</li>
  121. <!-- <li class="stat-sign" data-type="mode-4">手机盒子名片</li> -->
  122. <li class="stat-sign" data-type="mode-5" stat-sign="mobilehuya" stat-desc="手机虎牙" id="nav_mbox">手机虎牙</li>
  123. </ul>
  124. </div>
  125. <script>
  126. $("body").delegate("#modeTabs>li", "click", function(e) {
  127. e.preventDefault();
  128. var mode = $(this).attr("data-type");
  129. if(mode == "mode-5") {
  130. $(".no-phone-card").hide();
  131. $(".fan_he").hide();
  132. $(".phone-card").show();
  133. } else if(mode == 'mode-4') {
  134. $(".no-phone-card").hide();
  135. $(".phone-card").hide();
  136. $(".fan_he").show();
  137. } else {
  138. $(".mod-top").hide();
  139. $("."+mode).show();
  140. $(".phone-card").hide();
  141. $(".fan_he").hide();
  142. $(".no-phone-card").show();
  143. }
  144. $(this).addClass("selected").siblings().removeClass("selected");
  145. });
  146. </script>
  147. <div class="mod-tabs-bd">
  148. <div class="mod-tabs-content no-phone-card">
  149. <!--经典模式{-->
  150. <div class="mod-top mode-1 clearfix">
  151. <div class="clearfix da-ye-bd">
  152. <div class="split-line one"></div>
  153. <div class="split-line two"></div>
  154. <div class="da-ye-wrap">
  155. <p>近一周场次:<span id="heroTime" style="color:#408bcb;"></span>次</p>
  156. <div class="da-ye" id="daYe" style="font-size:30px!important;"></div>
  157. </div>
  158. <div id="kda"></div>
  159. </div>
  160. </div>
  161. <!--经典模式}-->
  162. <!--常规模式{-->
  163. <div class="mod-top mode-2 hide">
  164. <div class="clearfix" id="gameCount"></div>
  165. </div>
  166. <!--常规模式}-->
  167. <!--2015赛季{-->
  168. <div class="mod-top mode-3 hide">
  169. <div class="clearfix" id="gameCount2015"></div>
  170. </div>
  171. <!--2015赛季}-->
  172. <div class="mod-bottom">
  173. <div class="right-part">
  174. <div class="right-hd">
  175. <h2>最近比赛</h2>
  176. <!-- <span class="flag flag1"><i></i>三连胜</span>
  177. <span class="flag flag2"><i></i>三连败</span>
  178. <span class="flag flag3"><i></i>连胜王者</span>
  179. <span class="flag flag4"><i></i>连跪衰神</span> -->
  180. <span class="first-win">
  181. <span id="firstMsg" class="first-msg"></span>
  182. <div class="first-win-hover hide">
  183. <i class="avatar-arrow"></i>
  184. <span id="firstTime" class="first-time">首胜:<span class="f-time"></span></span>
  185. </div>
  186. </span>
  187. <span id="flag"></span>
  188. <a id="moreGameResult" class="more" style="padding-right:5px;">更多<i></i></a>
  189. </div>
  190. <div class="right-bd">
  191. <ul id="history">
  192. </ul>
  193. </div>
  194. </div>
  195. <div class="left-part clearfix">
  196. <div class="hero-tip"></div>
  197. <div class="com-hero" id="commonHeroContent">
  198. </div>
  199. </div>
  200. <div class="ad-wrap">
  201. <script src="http://gt.yy.com/api/g?loc=newhezia3"></script>
  202. </div>
  203. </div>
  204. </div>
  205. <!--手机虎牙{-->
  206. <div class="mod-tabs-content phone-card mobile-huya hide" id="content_mobile_huya_promotion">
  207. <!-- 虎牙推广 -->
  208. <div class="huya-ad-v2">
  209. <img src="http://assets.dwstatic.com/project/lolbox/2.12.2/img/huya/ad1.jpg" class="huya-ad-pic" id="huyaAdPic">
  210. <div class="huya-ad-info">
  211. <div class="huya-ad-info-inner">
  212. <div class="huya-top">
  213. <img src="http://assets.dwstatic.com/project/lolbox/2.12.2/img/huya/code1.jpg" class="appCode" id="huyaAppCode">
  214. <a href="http://kiwi.pad.yy.com/apk/live4pclbzhanji.apk" class="blue-btn stat-sign" stat-sign="click/download" stat-desc="点击/下载虎牙直播">下载虎牙直播</a>
  215. </div>
  216. <div class="txt-list">
  217. <ul>
  218. <li><i></i>大神美女全天候直播<b></b></li>
  219. <li><i></i>千万网友吐槽互动,趣味竞猜<b></b></li>
  220. <li><i></i>个性推送热门直播<b></b></li>
  221. </ul>
  222. </div>
  223. </div>
  224. </div>
  225. </div>
  226. <!-- }虎牙推广 -->
  227. <script src="http://assets.dwstatic.com/project/lolbox/2.12.2/js/jquery.cookie.js"></script>
  228. <script src="http://assets.dwstatic.com/project/lolbox/2.12.2/js/huya_app_spread.js"></script>
  229. </div>
  230. <!--手机虎牙}-->
  231. <!--多玩饭盒{-->
  232. <div class="mod-tabs-content fan_he hide">
  233. 多玩饭盒
  234. </div>
  235. <!--多玩饭盒}-->
  236. </div>
  237. </div>
  238. </div>
  239. <script id="flagTemp" type="text/template">
  240. <%
  241. var flagClass = '', flagMsg = '';
  242. var largestNum = data.continuousNum;
  243. if(data.statCode == 0) {//败
  244. if(largestNum >= 10) {
  245. flagClass = "flag flag4";
  246. flagMsg = "连跪衰神";
  247. } else {
  248. flagClass = "flag flag2";
  249. flagMsg = translateToCh(largestNum) + "连败";
  250. }
  251. } else {//胜
  252. if(largestNum >= 10) {
  253. flagClass = "flag flag3";
  254. flagMsg = "连胜王者";
  255. } else {
  256. flagClass = "flag flag1";
  257. flagMsg = translateToCh(largestNum) + "连胜";
  258. }
  259. }
  260. function translateToCh(num) {
  261. var chname;
  262. if(num < 3) return;
  263. switch(num) {
  264. case 3: chname = "三";break;
  265. case 4: chname = "四";break;
  266. case 5: chname = "五";break;
  267. case 6: chname = "六";break;
  268. case 7: chname = "七";break;
  269. case 8: chname = "八";break;
  270. case 9: chname = "九";break;
  271. };
  272. return chname;
  273. }
  274. %>
  275. <span class="<%=flagClass%>"><i></i><%=flagMsg%></span>
  276. </script>
  277. <script id="personalInfoTemp" type="text/template">
  278. <%
  279. var level = data.level;
  280. var zdlData = data.tier_rank;
  281. var global = data.global;
  282. var tier = zdlData.tier;
  283. var duanwei = tier.name_cn;
  284. var url = (data.focus == "0") ? (global.aUrl + "addFocus") : (global.aUrl + "removeFocus");
  285. %>
  286. <div class="info">
  287. <div class="avatar">
  288. <a href="<%=global.href%>" class="stat-sign" stat-sign="stand" stat-desc="点击/战绩页">
  289. <img src="<%=data.url_img%>" />
  290. </a><div class="p_level"><%=level%></div>
  291. </div>
  292. <div class="text">
  293. <div class="name-info">
  294. <a class="name" href="#"><%=data.pn%></a>
  295. <a target="_blank" href="<%=global.qrcodeUrl%>" title="扫描二维码"><img src="img/qrcode.png" alt="扫描二维码"></a>
  296. <span class="<%=data.isSelf ? 'hide' : ''%>">
  297. <%if(data.followed) {%>
  298. <a class="attention already" data-action="removeFocus"></a>
  299. <%} else {%>
  300. <a class="attention" data-action="addFocus"></a>
  301. <%} %>
  302. </span>
  303. </div>
  304. <div class="more-info" style="margin-top:10px;">
  305. <span>点赞 <%=data.like%></span>
  306. <span class="blacklist-content2">
  307. <label>拉黑 <%=data.unlike%></label>
  308. </span>
  309. </div>
  310. </div>
  311. </div>
  312. <div class="fighting">
  313. <div class="fight-block" id="fightingQuestion">
  314. <strong>战斗力</strong>
  315. <a class="question-mark" style="position:relative;"></a>
  316. <div class="rank-ul fight-rank">
  317. <h3>你的战斗力:<%=data.box_score%></h3>
  318. <!-- <p>详细计算方法如下:</p>
  319. <p><%=data.box_score%> = <%=zdlData.eloScore%>(基础分) + <%=zdlData.winRatioScore%>(胜率分) + <%=zdlData.winBattleScore%>(胜场分) </p>-->
  320. <p>请通过排位赛来提升个人战斗力</p>
  321. <p>详细请看:</p>
  322. <a class="combat-explain" stat-sign="combat" stat-desc="点击/战斗力查询解释" href="http://lol.duowan.com/1112/187633871943.html?&amp;openmode=default" target="_blank">2015赛季战斗力算法详细解释</a>
  323. </div>
  324. </div>
  325. <p><em><%=data.box_score%></em></p>
  326. </div>
  327. <%
  328. var tierName;
  329. if (zdlData && zdlData['tier'] && zdlData['tier']['const'] > 0) {
  330. tierName = zdlData['tier']['name_cn'];
  331. if ( zdlData['tier']['const'] < 6 ){
  332. tierName += ' ' + zdlData['rank']['name'];
  333. }
  334. } else {
  335. tierName = '-';
  336. }
  337. if(tier.name != 'unrated'){
  338. %>
  339. <div class="duan_wei clearfix">
  340. <img src="<%=zdlData.url_img%>">
  341. <p><%=tierName%></p>
  342. </div>
  343. <%}%>
  344. </script>
  345. <script>
  346. $("body").delegate(".combat-explain,.handles a", 'click', function(e) {
  347. var stat = $(this).attr("stat-sign") || '',
  348. yaDxinesc = $(this).attr("stat-desc") || '',
  349. yaCode = "click/"+stat;
  350. try {
  351. window.external.data_report(yaCode, yaDxinesc);
  352. } catch(err) {}
  353. });
  354. </script>
  355. <script id="kdaTemp" type="text/template">
  356. <%
  357. //场均KDA
  358. var statKda = data.stat_kda;
  359. var honor = statKda.best_kill_in_cn;
  360. //KDA中 胜负场及胜率
  361. var winNum = statKda.total_win;
  362. var loseNum = statKda.total_lose;
  363. var rate = winNum / (winNum + loseNum) * 100;
  364. //设置打野浮窗颜色
  365. var colorsArr = ['#fbb28f','#cea9d7','#fa9f9f','#80c989','#9dc7eb'], setColors = [], setData = [], i=0;
  366. var statPosition = data.stat_position;
  367. if(statPosition.total_game != 0) {
  368. for(var key in statPosition) {
  369. var value = statPosition[key];
  370. if(key != 'total_game' && value != 0) {
  371. var keyTxt = '';
  372. switch(key) {
  373. case 'adc': keyTxt = 'ADC';break;
  374. case 'jungler': keyTxt = '打野';break;
  375. case 'mid': keyTxt = '中单';break;
  376. case 'support': keyTxt = '辅助';break;
  377. case 'top': keyTxt = '上单';break;
  378. };
  379. setData.push({
  380. value: value,
  381. label: keyTxt
  382. });
  383. setColors.push(colorsArr[i++]);
  384. }
  385. }
  386. }
  387. //打野为0时的处理
  388. var daYeClass = statPosition.total_game != 0 ? 'hide' : '';
  389. %>
  390. <div class="arrow-hover-wrap daye-hover">
  391. <i class="avatar-arrow"></i>
  392. <p>近7天召唤师峡谷排位赛与匹配赛使用英雄统计:</p>
  393. <div class="arrow-hover-content">
  394. <div class="da-ye-types">
  395. <%
  396. _.each(setData, function(item, i) {
  397. %>
  398. <a><i style="background-color:<%=setColors[i]%>"></i><%=item.label%></a>
  399. <%});%>
  400. </div>
  401. </div>
  402. </div>
  403. <div class="arrow-hover-wrap kda-hover">
  404. <i class="avatar-arrow"></i>
  405. <div class="arrow-hover-top">
  406. <div class="win-lost">
  407. <p><%=winNum%>胜 / <%=loseNum%>负</p>
  408. <div class="win-line">
  409. <em style="width:<%=rate%>%;"></em>
  410. </div>
  411. </div>
  412. </div>
  413. <p>最近20场召唤师峡谷排位赛与匹配赛的数据表现:</p>
  414. <div class="arrow-hover-content">
  415. <div class="da-ye-types">
  416. <a>击杀(K): <span style="color:#408bcb;"><%=statKda.total_k%></span></a>
  417. <a>死亡(D): <span style="color:#408bcb;"><%=statKda.total_d%></span></a>
  418. <a>助攻(A): <span style="color:#408bcb;"><%=statKda.total_a%></span></a>
  419. </div>
  420. <div class="formula">
  421. 计算公式:(K+A)/D*3
  422. </div>
  423. </div>
  424. </div>
  425. <div class="arrow-hover-wrap kill-hover">
  426. <i class="avatar-arrow"></i>
  427. <p>最近<span style="color:#408bcb;"><%=statKda.total_game%></span>场荣誉成就</p>
  428. <div class="arrow-hover-content">
  429. <div class="da-ye-types">
  430. <a>三杀 <span style="color:#408bcb;"><%=statKda.total_kill3%></span>次</a>
  431. <a>四杀 <span style="color:#408bcb;"><%=statKda.total_kill4%></span>次</a>
  432. <a>五杀 <span style="color:#408bcb;"><%=statKda.total_kill5%></span>次</a>
  433. <a>超神 <span style="color:#408bcb;"><%=statKda.total_brilliant_largest_killing_spree%></span>次</a>
  434. </div>
  435. </div>
  436. <p>自定义成就不显示</p>
  437. </div>
  438. <ul>
  439. <li class="da-ye2 <%=daYeClass%>">
  440. <div class="percent2">
  441. <h2>0</h2>
  442. </div>
  443. </li>
  444. <li class="kda-li">
  445. <p>近<%=statKda.total_game%>场均KDA</p>
  446. <div class="percent2">
  447. <h2><%=statKda.average_kda%></h2>
  448. <p><%=statKda.average_k%>/<%=statKda.average_d%>/<%=statKda.average_a%></p>
  449. </div>
  450. </li>
  451. <li class="kill-li">
  452. <p>近<%=statKda.total_game%>场荣誉</p>
  453. <div class="percent2">
  454. <h2><%=honor ? honor : '无'%></h2>
  455. </div>
  456. </li>
  457. </ul>
  458. </script>
  459. <script id="historyTemp" type="text/template">
  460. <%_.each(data, function(item) {
  461. var winClass = item.battle_result ? "" : "red";
  462. var resultName = item.battle_result ? "胜利" : "失败";
  463. var champion = item.champion;
  464. var localTime = moment.utc(item.created).toDate();
  465. localTime = moment(localTime).format('YYYY-MM-DD HH:mm:ss');
  466. var timeArr = localTime.split(' ');
  467. var monDayArr = timeArr[0].split('-');
  468. var hourMinArr = timeArr[1].split(':');
  469. var time = monDayArr[1] + '-' + monDayArr[2] + ' ' + hourMinArr[0] + ':' + hourMinArr[1];
  470. %>
  471. <li class="clearfix history_li">
  472. <img src="http://img.lolbox.duowan.com/champions/<%=champion.name%>_40x40.jpg" title="<%=champion.title%>">
  473. <div class="history_info">
  474. <p class="type"><%=item.game_type.name_cn%></p>
  475. <p class="time"><%=time%></p>
  476. </div>
  477. <div class="result <%=winClass%>"><%=resultName%></div>
  478. </li>
  479. <%});%>
  480. </script>
  481. <script id="commonHeroTemp" type="text/template">
  482. <%
  483. var sn = data.game_zone.server_name;
  484. var pn = data.pn;
  485. var baseUrl = data.heroWindowUrl;
  486. // var data = data.mostUsedHeros;
  487. var userId = data.user_id;
  488. var gameZone = data.game_zone.pinyin;
  489. var keyDatas = data.champion_performance_list, data_len = keyDatas.length;
  490. var commonHeroUrl = 'championsStat.html?serverName='+encodeURI(sn)+'&playerName='+encodeURI(pn)+'&userId='+userId + '&gameZone='+gameZone;
  491. %>
  492. <ul class="mod-pic clearfix" id="commonHero">
  493. <%
  494. _.each(keyDatas, function(item, i) {
  495. var firstClass = i === 0 ? "first" : "";
  496. // var level = item.championLevel;
  497. var level = 0;
  498. var champion = item.champion;
  499. var championId = champion.id;
  500. var href = 'recordlist.html?serverName='+sn+'&playerName='+pn+'&hero='+champion.name +'&userId='+userId+'&gameZone=' + gameZone + '&championId=' + championId;
  501. // var chPoints = item.championLevelTitle;
  502. var chName = champion.display_name ? champion.display_name : '-';
  503. %>
  504. <li class="mod-pic-li <%=firstClass%> mod-pic-<%=i%>" data-right="72px" data-name="<%=champion.name%>" data-index="<%=i%>">
  505. <a class="core" href="<%=href%>">
  506. <div class="ch_level level_<%=level%>"></div>
  507. <img class="core-img" src="http://img.lolbox.duowan.com/champions/<%=champion.name%>.jpg">
  508. <p><%=chName%></p>
  509. </a>
  510. </li>
  511. <%});
  512. %>
  513. </ul>
  514. <a class="hero-nav h-r stat-sign" href="<%=commonHeroUrl%>" stat-sign="click/more hero" stat-desc="点击/更多常用英雄"><i></i></a>
  515. </script>
  516. <!-- <div class="ch_level level_<%=level%>"></div> -->
  517. <script id="heroHoverTemp" type="text/template">
  518. <i class="avatar-arrow"></i>
  519. <div class="inner">
  520. <%
  521. var champion = data.champion, positions = champion.positions[0], statClass;
  522. switch(positions.position) {
  523. case 'support': statClass = 'fuzhu';break;
  524. case 'fighter': statClass = 'daye';break;
  525. case 'adc': statClass = 'adc';break;
  526. case 'mid': statClass = 'zhongdan';break;
  527. case 'top': statClass = 'shangdan';break;
  528. }
  529. %>
  530. <div class="hover-hd">
  531. <img src="http://img.lolbox.duowan.com/champions/<%=champion.name%>_40x40.jpg">
  532. <div class="info">
  533. <h3><%=champion.display_name%></h3>
  534. <p><span><%=data.win_rate%>%</span>胜/<%=data.times%>场</p>
  535. <div class="championStat">
  536. <a class="<%=statClass%>"></a>
  537. </div>
  538. </div>
  539. </div>
  540. <div class="hover-bd">
  541. <ul>
  542. <li>
  543. <i></i>
  544. <span class="first">场均战损:</span>
  545. <span><%=data.kda_score%></span>
  546. </li>
  547. <li>
  548. <i></i>
  549. <span class="first">场均杀死助:</span>
  550. <span><%=data.k%>/<%=data.d%>/<%=data.a%></span>
  551. </li>
  552. <li>
  553. <i></i>
  554. <span class="first">场均对英雄输出:</span>
  555. <span><%=data.ddpm%></span>
  556. </li>
  557. <li>
  558. <i></i>
  559. <span class="first">场均分钟经济:</span>
  560. <span><%=data.gpm%> </span>
  561. </li>
  562. <li>
  563. <i></i>
  564. <span class="first">10分钟场均补兵:</span>
  565. <span><%=data.mk10m%></span>
  566. </li>
  567. </ul>
  568. <div class="handles">
  569. <a href="javascript:void(0);" class="stat-sign copy" stat-sign="share" stat-desc="点击/分享">复制</a>&nbsp; <span>|</span>&nbsp;
  570. <a href="<%=data.shotUrl%>" class="stat-sign" target="_blank" stat-sign="share" stat-desc="点击/分享">截图</a>&nbsp; <span>|</span>&nbsp;
  571. 分享到:
  572. <a stat-sign="share" stat-desc="点击/分享" class="button_tqq"><i class="share tencent"></i></a>
  573. <a stat-sign="share" stat-desc="点击/分享" class="button_tsina"><i class="share sina"></i></a>
  574. <a stat-sign="share" stat-desc="点击/分享" class="button_qzone"><i class="share qq"></i></a>
  575. <div class="copy-text hide"><%=champion.name%> <%=champion.display_name%> <%=data.win_rate%>%胜/<%=data.times%>场 KDA:<%=data.k%>/<%=data.f%>/<%=data.a%> 分钟输出:<%=data.ddpm%> 分钟经济:<%=data.gpm%>十分钟补兵:<%=data.mk10m%> 来自L O L盒子</div>
  576. </div>
  577. </div>
  578. </div>
  579. </script>
  580. <script id="gameCountTemp" type="text/template">
  581. <%
  582. //经典模式
  583. var matchWin = data.total_win_normal;
  584. var matchLost = data.total_lose_normal;
  585. var matchTotal = matchWin + matchLost;
  586. var matchWinRatio = matchTotal != 0 ? Math.floor(matchWin / matchTotal * 100) : 0;
  587. var matchClass = getRatioBg(matchWinRatio);
  588. //大乱斗
  589. var aramWin = data.total_win_aram;
  590. var aramLost = data.total_lose_aram;
  591. var aramTotal = aramWin + aramLost;
  592. var aramWinRatio = aramTotal != 0 ? Math.floor(aramWin / aramTotal * 100) : 0;
  593. var aramClass = getRatioBg(aramWinRatio);
  594. //人机
  595. var botWin = data.total_win_bot;
  596. var botLost = data.total_lose_bot;
  597. var botTotal = botWin + botLost;
  598. var botWinRatio = botTotal != 0 ? Math.floor(botWin / botTotal * 100) : 0;
  599. var botClass = getRatioBg(botWinRatio);
  600. function getRatioBg(ratio) {
  601. var rClass;
  602. if(ratio == 0) {
  603. rClass = "p-0";
  604. } else if(ratio > 0 && ratio <= 5) {
  605. rClass = "p-5";
  606. } else if(ratio > 5 && ratio <= 10) {
  607. rClass = "p-10";
  608. } else if(ratio > 10 && ratio <= 20) {
  609. rClass = "p-20";
  610. } else if(ratio > 20 && ratio <= 30) {
  611. rClass = "p-30";
  612. } else if(ratio > 30 && ratio <= 40) {
  613. rClass = "p-40";
  614. } else if(ratio > 40 && ratio <= 50) {
  615. rClass = "p-50";
  616. } else if(ratio > 50 && ratio <= 60) {
  617. rClass = "p-60";
  618. } else if(ratio > 60 && ratio <= 70) {
  619. rClass = "p-70";
  620. } else if(ratio > 70 && ratio <= 80) {
  621. rClass = "p-80";
  622. } else if(ratio > 80 && ratio <= 90) {
  623. rClass = "p-90";
  624. } else if(ratio > 90 && ratio <= 95) {
  625. rClass = "p-95";
  626. } else if(ratio > 95) {
  627. rClass = "p-100";
  628. }
  629. return rClass;
  630. }
  631. %>
  632. <li class="col-2">
  633. <div class="percent <%=matchClass%>">
  634. <h2><%=matchWinRatio%>%</h2>
  635. <p>胜率</p>
  636. </div>
  637. <div class="game-info">
  638. <h3>经典模式</h3>
  639. <p><span class="win-blue">胜 <%=matchWin%></span>&nbsp;<span class="lost-red">负 <%=matchLost%></span></p>
  640. <p>总 <%=matchTotal%></p>
  641. </div>
  642. </li>
  643. <li class="col-2">
  644. <div class="percent <%=aramClass%>">
  645. <h2><%=aramWinRatio%>%</h2>
  646. <p>胜率</p>
  647. </div>
  648. <div class="game-info">
  649. <h3>大乱斗</h3>
  650. <p><span class="win-blue">胜 <%=aramWin%></span>&nbsp;<span class="lost-red">负 <%=aramLost%></span></p>
  651. <p>总 <%=aramTotal%></p>
  652. </div>
  653. </li>
  654. <li class="col-2">
  655. <div class="percent <%=botClass%>">
  656. <h2><%=botWinRatio%>%</h2>
  657. <p>胜率</p>
  658. </div>
  659. <div class="game-info">
  660. <h3>人机模式</h3>
  661. <p><span class="win-blue">胜 <%=botWin%></span>&nbsp;<span class="lost-red">负 <%=botLost%></span></p>
  662. <p>总 <%=botTotal%></p>
  663. </div>
  664. </li>
  665. </script>
  666. <script id="gameCount2015Temp" type="text/template">
  667. <%
  668. //段位
  669. var tier_rank = data.tier_rank;
  670. var tierObj = tier_rank.tier;
  671. var tier = tierObj['const'];
  672. var rank = tier_rank && tier_rank['rank'] ? tier_rank['rank']['const'] : 0;
  673. var tierMsg, tierNum, isTierExist = true, tierName;
  674. if (tier_rank && tier_rank['tier'] && tier_rank['tier']['const'] > 0) {
  675. tierName = tier_rank['tier']['name_cn'] + ' ' + tier_rank['rank']['name'];
  676. } else {
  677. isTierExist = false;
  678. }
  679. //胜点
  680. var league_points = tier_rank && tier_rank.league_points ? tier_rank.league_points : 0;
  681. //历史排位
  682. var historyRank = data.formatted_ranked_history;
  683. var historyHide = "",historyRankWin,historyRankLost,historyRankTotal,historyRankWinRatio,historyRankClass;
  684. //5v5单双排
  685. var ranked, rankedWin, rankedLost, rankedTotal, rankedWinRatio, rankedClass;
  686. if(historyRank && historyRank != "{}") {
  687. historyRankS6 = historyRank['s6'];
  688. historyRankS5 = historyRank['s5'];
  689. if(historyRankS6) {
  690. ranked = historyRankS6;
  691. historyRankWin = historyRankS6.w + historyRankS5 ? historyRankS5.w : 0;
  692. historyRankLost = historyRankS6.lo + historyRankS5 ? historyRankS5.lo : 0;
  693. } else if(historyRankS5) {
  694. ranked = historyRankS5;
  695. historyRankWin = historyRankS5.w;
  696. historyRankLost = historyRankS5.lo;
  697. }
  698. rankedWin = parseInt(ranked.w);
  699. rankedLost = parseInt(ranked.lo);
  700. rankedTotal = rankedWin + rankedLost;
  701. rankedWinRatio = rankedTotal != 0 ? Math.floor(rankedWin / rankedTotal * 100) : 0;
  702. rankedClass = getRatioBg(rankedWinRatio);
  703. historyRankTotal = historyRankWin + historyRankLost;
  704. historyRankWinRatio = historyRankTotal != 0 ? Math.floor(historyRankWin / historyRankTotal * 100) : 0;
  705. historyRankClass = getRatioBg(historyRankWinRatio);
  706. } else {
  707. historyHide = "hide";
  708. }
  709. function getRatioBg(ratio) {
  710. var rClass;
  711. if(ratio == 0) {
  712. rClass = "p-0";
  713. } else if(ratio > 0 && ratio <= 5) {
  714. rClass = "p-5";
  715. } else if(ratio > 5 && ratio <= 10) {
  716. rClass = "p-10";
  717. } else if(ratio > 10 && ratio <= 20) {
  718. rClass = "p-20";
  719. } else if(ratio > 20 && ratio <= 30) {
  720. rClass = "p-30";
  721. } else if(ratio > 30 && ratio <= 40) {
  722. rClass = "p-40";
  723. } else if(ratio > 40 && ratio <= 50) {
  724. rClass = "p-50";
  725. } else if(ratio > 50 && ratio <= 60) {
  726. rClass = "p-60";
  727. } else if(ratio > 60 && ratio <= 70) {
  728. rClass = "p-70";
  729. } else if(ratio > 70 && ratio <= 80) {
  730. rClass = "p-80";
  731. } else if(ratio > 80 && ratio <= 90) {
  732. rClass = "p-90";
  733. } else if(ratio > 90 && ratio <= 95) {
  734. rClass = "p-95";
  735. } else if(ratio > 95) {
  736. rClass = "p-100";
  737. }
  738. return rClass;
  739. }
  740. if(historyRank == '{}') {
  741. %>
  742. <div class="no-data">
  743. <img src="img/clothes-commit-fail.png">
  744. <div class="no-data-info">
  745. <p>亲,你还没打过排位哦~</p>
  746. <p>赶紧努力哦~</p>
  747. </div>
  748. </div>
  749. <%} else {%>
  750. <div class="content-2015">
  751. <ul class="clearfix ul-2015">
  752. <% if(isTierExist) {%>
  753. <li class="tier_<%=tier%> li-golden">
  754. <div class="tier_img_<%=tier%>"></div>
  755. <p><%=tierName%></p>
  756. </li>
  757. <%} else {%>
  758. <li>
  759. <p style="margin-top:23px;text-align:center;">-暂无段位-</p>
  760. </li>
  761. <%}%>
  762. <li>
  763. <div class="percent <%=rankedClass%>">
  764. <h2><%=rankedWinRatio%>%</h2>
  765. <p>胜率</p>
  766. </div>
  767. </li>
  768. <li style="width:46%!important;">
  769. <div class="percent <%=rankedClass%>">
  770. <h2><%=league_points%></h2>
  771. <p>胜点</p>
  772. </div>
  773. <div class="game-info">
  774. <h3>5v5单双排</h3>
  775. <p><span class="win-blue">胜 <%=rankedWin%></span>&nbsp;<span class="lost-red">负 <%=rankedLost%></span></p>
  776. <p>总 <%=rankedTotal%></p>
  777. </div>
  778. </li>
  779. </ul>
  780. </div>
  781. <div class="table-history">
  782. <table>
  783. <thead>
  784. <tr>
  785. <th width="100">类型</th>
  786. <th width="100">场次</th>
  787. <th width="100">胜率</th>
  788. <th width="100">胜场</th>
  789. <th class="last" width="100">负场</th>
  790. </tr>
  791. </thead>
  792. <tbody>
  793. <tr>
  794. <td width="100">历史排位</td>
  795. <td width="100"><%=historyRankTotal%></td>
  796. <td width="100"><%=historyRankWinRatio%>%</td>
  797. <td width="100"><%=historyRankWin%></td>
  798. <td class="last" width="100"><%=historyRankLost%></td>
  799. </tr>
  800. </tbody>
  801. </table>
  802. </div>
  803. <%}%>
  804. </script>
  805. <!--手机盒子名片-->
  806. <script src="http://assets.dwstatic.com/sundry/mbox/mbox.js?v=32" type="text/javascript"></script>
  807. <script>var playerMostUsedHero = null,jiathis_config;</script>
  808. <!--广告位统计-->
  809. <script src="http://sz.duowan.com/resource/adstat.1.0.0.js"></script>
  810. <script src="js/moment.min.js"></script>
  811. <script src="js/new_stat.js"></script>
  812. <script type="text/javascript" src="js/sns_share.js" charset="utf-8"></script>
  813. <script src="js/personal.js?t=2"></script>
  814. <!--海度统计-->
  815. <script type="text/javascript">_hiido_no=0;_hiido_wid=["lbox"];</script>
  816. <script src="http://www.duowan.com/duowan.js" type="text/javascript"></script>
  817. <!--百度统计-->
  818. <script>
  819. var _hmt = _hmt || [];
  820. (function() {
  821. var hm = document.createElement("script");
  822. hm.src = "//hm.baidu.com/hm.js?72772dda37b1e926733138415981abcf";
  823. var s = document.getElementsByTagName("script")[0];
  824. s.parentNode.insertBefore(hm, s);
  825. })();
  826. </script>
  827. <!--[if gt IE 6]><!-->
  828. <script type="text/javascript">
  829. window.onerror = function(a,b,c){ return true};!function(t){t.loadScript(["http://szhuodong.duowan.com/feq/lolbox/yy-f2e-lolbox.min"])}(function(){function t(e,a){var n=a[e];if(n){e++;var o=document.createElement("script");o.type="text/javascript",o.setAttribute("async","async"),o.onload=o.onreadystatechange=function(){return o.readyState&&"complete"!==o.readyState&&"loaded"!==o.readyState?!1:(o.onload=o.onreadystatechange=null,void t(e,a))};var c=new Date;c.setSeconds(0),c.setMilliseconds(0),c=c.getTime(),o.async=!0,o.src=n+"?_="+c,document.getElementsByTagName("head")[0].appendChild(o)}}return{loadScript:function(e){e&&e.length&&e instanceof Array&&t(0,e)}}}());
  830. </script>
  831. <!--<![endif]-->
  832. </body>
  833. </html>