API tools faq
paste
Advertisement
codergautamyt

Untitled

codergautamyt
May 16th, 2023
215
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 19.13 KB | None | 0 0
raw download clone embed print report
  1. <%
  2. function msToTime(duration) {
  3. const portions = [];
  4.  
  5. const msInHour = 1000 * 60 * 60;
  6. const hours = Math.trunc(duration / msInHour);
  7. if (hours > 0) {
  8. portions.push(hours + 'h');
  9. duration = duration - (hours * msInHour);
  10. }
  11.  
  12. const msInMinute = 1000 * 60;
  13. const minutes = Math.trunc(duration / msInMinute);
  14. if (minutes > 0) {
  15. portions.push(minutes + 'm');
  16. duration = duration - (minutes * msInMinute);
  17. }
  18.  
  19. const seconds = Math.trunc(duration / 1000);
  20. if (seconds > 0) {
  21. portions.push(seconds + 's');
  22. }
  23.  
  24. return portions.join(' ');
  25. }
  26.  
  27. function numberWithCommas(x) {
  28. return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
  29. }
  30.  
  31. function niceifyType(d) {
  32. var table = {
  33. 'coins': 'Coins',
  34. 'kills': 'Kills',
  35. 'time': 'Survived',
  36. }
  37. var arr = [table[d]]
  38.  
  39. arr = arr.concat(Object.values(table).filter(x => x != table[d]));
  40.  
  41. return arr;
  42. }
  43. function niceifyDur(d) {
  44. var table = {
  45. 'all': 'All-Time',
  46. 'day': 'Past Day',
  47. 'week': 'Past Week',
  48. }
  49. var arr = [table[d]]
  50.  
  51. arr = arr.concat(Object.values(table).filter(x => x != table[d]));
  52.  
  53. return arr;
  54. }
  55. function tableDur(d) {
  56. var table = ["all", "day", "week"];
  57. //remove d from table
  58. table.splice(table.indexOf(d), 1);
  59.  
  60. return table;
  61. }
  62. function tableType(d) {
  63. var table = ["coins", "kills", "time"];
  64. //remove d from table
  65. table.splice(table.indexOf(d), 1);
  66.  
  67. return table;
  68. }
  69. function forHumans ( seconds ) {
  70. var levels = [
  71. [Math.floor(seconds / 31536000), 'years'],
  72. [Math.floor((seconds % 31536000) / 86400), 'days'],
  73. [Math.floor(((seconds % 31536000) % 86400) / 3600), 'hours'],
  74. [Math.floor((((seconds % 31536000) % 86400) % 3600) / 60), 'minutes'],
  75. [(((seconds % 31536000) % 86400) % 3600) % 60, 'seconds'],
  76. ];
  77. var returntext = '';
  78.  
  79. for (var i = 0, max = levels.length; i < max; i++) {
  80. if ( levels[i][0] === 0 ) continue;
  81. returntext += ' ' + levels[i][0] + ' ' + (levels[i][0] === 1 ? levels[i][1].substr(0, levels[i][1].length-1): levels[i][1]);
  82. break;
  83. };
  84. return returntext.trim();
  85. }
  86.  
  87. function go() {
  88.  
  89. var date = new Date(user.created_at);
  90.  
  91. //time since Date
  92. var timeSince =(new Date(new Date().toUTCString().slice(0, -3)))- date;
  93. //time since in seconds
  94. timeSince = timeSince / 1000;
  95. //convert to readable format
  96. return forHumans(timeSince);
  97. }
  98. function br() {
  99. var recent = games.sort(function(a, b) {
  100. return new Date(b.game_date) - new Date(a.game_date);
  101. })[0];
  102. if(recent) {
  103. var date = new Date(recent.game_date);
  104. var today = new Date();
  105. var diff = today - date;
  106. var days = Math.floor(diff / 86400000);
  107. if(days == 0) {
  108. return "today";
  109. } else if( days-1 == 0) {
  110. return "yesterday";
  111. } else {
  112. return days + " days ago";
  113. }
  114. } else return false
  115. }
  116. %>
  117. <!DOCTYPE html>
  118. <html lang="en">
  119. <head>
  120. <meta charset="UTF-8" />
  121. <title><%= user.username %></title>
  122. <meta
  123. content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
  124. name="viewport"
  125. />
  126. <link
  127. rel="stylesheet"
  128. href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"
  129. />
  130. <link rel="stylesheet" type="text/css" href="css/style.css" />
  131. <link
  132. href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
  133. rel="stylesheet"
  134. integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3"
  135. crossorigin="anonymous"
  136. />
  137. <script
  138. src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
  139. integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p"
  140. crossorigin="anonymous"
  141. ></script>
  142. <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
  143. <script>
  144. function updateQueryStringParameter(uri, key, value) {
  145. var re = new RegExp("([?&])" + key + "=.*?(&|$)", "i");
  146. var separator = uri.indexOf("?") !== -1 ? "&" : "?";
  147. if (uri.match(re)) {
  148. return uri.replace(re, "$1" + key + "=" + value + "$2");
  149. } else {
  150. return uri + separator + key + "=" + value;
  151. }
  152. }
  153. </script>
  154. <style>
  155. @import url("https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap");
  156. body {
  157. background: #f9f9f9;
  158. font-family: "Roboto", sans-serif;
  159. }
  160.  
  161. .main-content {
  162. padding-top: 100px;
  163. padding-bottom: 100px;
  164. }
  165.  
  166. .leaderboard-card {
  167. background: #fff;
  168. margin-bottom: 30px;
  169. border-radius: 5px;
  170. overflow: hidden;
  171. box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  172. }
  173. .leaderboard-card.leaderboard-card--first {
  174. transform: scale(1.05);
  175. }
  176. .leaderboard-card.leaderboard-card--first .leaderboard-card__top {
  177. background: linear-gradient(45deg, #7e57c2, #ab47bc);
  178. color: #fff;
  179. }
  180. .leaderboard-card__top {
  181. background: #f9f6ff;
  182. padding: 20px 0 10px 0;
  183. }
  184. .leaderboard-card__body {
  185. padding: 15px;
  186. margin-top: -40px;
  187. z-index: inherit;
  188. }
  189.  
  190. img.circle-img {
  191. height: 70px;
  192. width: 70px;
  193. border-radius: 70px;
  194. border: 3px solid #fff;
  195. box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  196. }
  197. img.circle-img.circle-img--small {
  198. height: 55px;
  199. width: 55px;
  200. border-radius: 55px;
  201. }
  202.  
  203. .table {
  204. border-spacing: 0 15px;
  205. border-collapse: separate;
  206. }
  207. .table thead tr th,
  208. .table thead tr td,
  209. .table tbody tr th,
  210. .table tbody tr td {
  211. vertical-align: middle;
  212. border: none;
  213. }
  214. .table thead tr th:nth-last-child(1),
  215. .table thead tr td:nth-last-child(1),
  216. .table tbody tr th:nth-last-child(1),
  217. .table tbody tr td:nth-last-child(1) {
  218. text-align: center;
  219. }
  220. .table tbody tr {
  221. box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  222. border-radius: 5px;
  223. }
  224. .table tbody tr td {
  225. background: #fff;
  226. }
  227. .table tbody tr td:nth-child(1) {
  228. border-radius: 5px 0 0 5px;
  229. }
  230. .table tbody tr td:nth-last-child(1) {
  231. border-radius: 0 5px 5px 0;
  232. }
  233.  
  234. .tooltipy {
  235. position: relative;
  236. display: inline-block;
  237. border-bottom: 1px dotted black;
  238. }
  239.  
  240. .tooltipy .tooltiptexty {
  241. visibility: hidden;
  242. width: 120px;
  243. background-color: black;
  244. color: #fff;
  245. text-align: center;
  246. border-radius: 6px;
  247. padding: 5px 0;
  248.  
  249. /* Position the tooltip */
  250. position: absolute;
  251. z-index: 9999;
  252. top: -30px;
  253. left: 20%;
  254. }
  255.  
  256. .tooltipy:hover .tooltiptexty {
  257. visibility: visible;
  258. }
  259. </style>
  260. </head>
  261. <body>
  262. <section class="main-content">
  263. <div class="container">
  264. <h1><%= user.username %></h1>
  265. <br />
  266. <h3>Joined <%=go()%> ago<% if(br()) { %> <br> Last seen <%=br()%> <% } %>
  267. <br /> <br>
  268. <% var arank =(lb.findIndex((l)=>l.username==user.username)+1); %>
  269.  
  270. <%= (arank==0?"":`#${arank} all time`) %>
  271. <br>
  272. <% var brank =(lb2.findIndex((l)=>l.username==user.username)+1); %>
  273. <%= (brank==0?"":`#${brank} today`) %>
  274. <br/>
  275. <br/>
  276. <% function conv(num) {
  277. return num>999?parseFloat((num/1000).toFixed(num<10000?2:1))+"k":num;
  278. } %>
  279. <%= conv(user.views+1) %> profile views
  280. </h3>
  281. <br />
  282. <div class="row">
  283. <div class="col-sm-4">
  284. <div class="leaderboard-card">
  285. <div class="leaderboard-card__top">
  286. <h3 class="text-center"><%= numberWithCommas(games.reduce((a,b)=>a+b.game_count,0)) %></h3>
  287. </div>
  288. <div class="leaderboard-card__body">
  289. <div class="text-center">
  290. <br /><br />
  291. <h5 class="mb-0">Games Played</h5>
  292. <p class="text-muted mb-0"></p>
  293. </div>
  294. </div>
  295. </div>
  296. </div>
  297. <div class="col-sm-4">
  298. <div class="leaderboard-card">
  299. <div class="leaderboard-card__top">
  300. <h3 class="text-center">
  301. <% var e = 0; games.forEach((x)=>e+=(x.stabs*300)+x.coins ) %>
  302. <%= numberWithCommas(e) %>
  303. </h3>
  304. </div>
  305. <div class="leaderboard-card__body">
  306. <div class="text-center">
  307. <br /><br />
  308.  
  309. <div class="tooltipy">
  310. <h5 class="mb-0">XP</h5>
  311. <span class="tooltiptexty"
  312. >1 coin = 1 XP<br />1 stab = 300 XP</span
  313. >
  314. </div>
  315. <p class="text-muted mb-0"></p>
  316. </div>
  317. </div>
  318. </div>
  319. </div>
  320. <div class="col-sm-4">
  321. <div class="leaderboard-card">
  322. <div class="leaderboard-card__top">
  323. <h3 class="text-center">
  324. <% var e = 0; games.forEach((x)=>e+=x.game_time ) %>
  325. <%= msToTime(e)==""?"0s":msToTime(e) %>
  326. </h3>
  327. </div>
  328. <div class="leaderboard-card__body">
  329. <div class="text-center">
  330. <br /><br />
  331. <h5 class="mb-0">Total Playtime</h5>
  332. <p class="text-muted mb-0"></p>
  333. </div>
  334. </div>
  335. </div>
  336. </div>
  337. <br/>
  338. <div class="col-sm-4">
  339. <div class="leaderboard-card">
  340. <div class="leaderboard-card__top">
  341. <h3 class="text-center">
  342. <% var e = 0; games.forEach((x)=>e+=x.stabs ) %>
  343. <%= numberWithCommas(e) %>
  344. </h3>
  345. </div>
  346. <div class="leaderboard-card__body">
  347. <div class="text-center">
  348. <br /><br />
  349. <h5 class="mb-0">Stabs</h5>
  350. <p class="text-muted mb-0"></p>
  351. </div>
  352. </div>
  353. </div>
  354. </div>
  355. <div class="col-sm-4">
  356. <div class="leaderboard-card">
  357. <div class="leaderboard-card__top">
  358. <h3 class="text-center">
  359. <% var e = 0; games.forEach((x)=>e+=(x.kills*300)+x.coins ) %>
  360. <%= user.skins.collected.length +" / "+ cosmetics.skins.length %>
  361. </h3>
  362. </div>
  363. <div class="leaderboard-card__body">
  364. <div class="text-center">
  365. <br /><br />
  366. <h5 class="mb-0">Skins Owned</h5>
  367. <p class="text-muted mb-0"></p>
  368. </div>
  369. </div>
  370. </div>
  371. </div>
  372. </div>
  373. <style>
  374. .dropdown {
  375. display:inline-block;
  376. /* additional code */
  377. }
  378. </style>
  379. <div>
  380. <div class="dropdown">
  381. <button
  382. class="btn btn-secondary dropdown-toggle"
  383. type="button"
  384. id="total"
  385. data-toggle="dropdown"
  386. aria-haspopup="true"
  387. aria-expanded="false"
  388. >
  389. Total
  390. </button>
  391. <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
  392. <button
  393. class="dropdown-item"
  394. id="totalClick"
  395. onclick="changeTotal()"
  396. >Gained</a
  397. >
  398. </div>
  399. </div>
  400. <div class="dropdown">
  401. <button
  402. class="btn btn-secondary dropdown-toggle"
  403. type="button"
  404. data-toggle="dropdown"
  405. aria-haspopup="true"
  406. aria-expanded="false"
  407. id="selected"
  408. >
  409. XP
  410. </button>
  411. <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
  412. <button
  413. class="dropdown-item"
  414. id="op1"
  415. >Coins</button>
  416. <button
  417. class="dropdown-item"
  418. id="op2"
  419. >Kills</button
  420. >
  421. <button
  422. class="dropdown-item"
  423. id="op3"
  424. >Time</button
  425. >
  426.  
  427. </div>
  428.  
  429. </div>
  430. <canvas id="myChart"></canvas>
  431. </div>
  432. <script>
  433.  
  434. function msToTime(duration) {
  435. const portions = [];
  436.  
  437. const msInHour = 1000 * 60 * 60;
  438. const hours = Math.trunc(duration / msInHour);
  439. if (hours > 0) {
  440. portions.push(hours + 'h');
  441. duration = duration - (hours * msInHour);
  442. }
  443.  
  444. const msInMinute = 1000 * 60;
  445. const minutes = Math.trunc(duration / msInMinute);
  446. if (minutes > 0) {
  447. portions.push(minutes + 'm');
  448. duration = duration - (minutes * msInMinute);
  449. }
  450.  
  451. const seconds = Math.trunc(duration / 1000);
  452. if (seconds > 0) {
  453. portions.push(seconds + 's');
  454. }
  455.  
  456.  
  457.  
  458. return portions.join(' ') ? portions.join(' ') : "0s";
  459. }
  460.  
  461. const labels = <%- "["+stats.map((e) => `"${e.dt.toString().split(" ").slice(0,3).join(" ")}"`).join(",")+"]" %>
  462.  
  463. function runningTotal(nums) {
  464. let psum = 0;
  465. return nums.map(x => psum += x);
  466. };
  467. var xpData = <%- "["+stats.map((e) => `"${e.xp?e.xp:0}"`).join(",")+"]" %>
  468. var coinsData = <%- "["+stats.map((e) => `"${e.coins?e.coins:0}"`).join(",")+"]" %>
  469. var killsData = <%- "["+stats.map((e) => `"${e.kills?e.kills:0}"`).join(",")+"]" %>
  470. var timeData = <%- "["+stats.map((e) => `"${e.time?e.time:0}"`).join(",")+"]" %>
  471. function numberWithCommas(x) {
  472. return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
  473. }
  474. var selected = "xp"
  475. function changeSelector(obj) {
  476. var list = ["XP", "Coins", "Kills", "Time"];
  477. selected = obj.innerHTML.toLowerCase();
  478. list = list.filter((o)=>o.toLowerCase()!=selected)
  479. document.getElementById("selected").innerHTML = obj.innerHTML;
  480. document.getElementById("op1").innerHTML = list[0];
  481. document.getElementById("op2").innerHTML = list[1];
  482. document.getElementById("op3").innerHTML = list[2];
  483. changeTotal(true);
  484.  
  485. }
  486.  
  487.  
  488. document.getElementById("op1").addEventListener("click", () => {
  489. changeSelector(document.getElementById("op1"))
  490. })
  491. document.getElementById("op2").addEventListener("click", () => {
  492. changeSelector(document.getElementById("op2"))
  493. })
  494. document.getElementById("op3").addEventListener("click", () => {
  495. changeSelector(document.getElementById("op3"))
  496. })
  497.  
  498.  
  499. function getSelector() {
  500. if (selected == "xp") {
  501. return xpData
  502. } else if (selected == "coins") {
  503. return coinsData
  504. } else if (selected == "kills") {
  505. return killsData
  506. } else if(selected == "time") {
  507. return timeData
  508. }
  509. }
  510.  
  511.  
  512. var data = {
  513. labels: labels,
  514. datasets: [{
  515. label: 'Total xp',
  516. backgroundColor: 'rgb(255, 99, 132)',
  517. borderColor: 'rgb(255, 99, 132)',
  518. data: runningTotal(getSelector().map(Number)),
  519. }]
  520. };
  521.  
  522. var config = {
  523. type: 'line',
  524. data: data,
  525. options: {
  526.  
  527. plugins: {
  528. tooltip: {
  529. callbacks: {
  530. label: function(context) {
  531.  
  532. return context.dataset.label+": "+(selected=="time"?msToTime(context.parsed.y):numberWithCommas(context.parsed.y));
  533. }
  534. }
  535. }
  536. },
  537.  
  538. scales: {
  539. y: {
  540. ticks: {
  541. // Include a dollar sign in the ticks
  542. callback: function(value, index, ticks) {
  543. return selected=="time"?msToTime(value):numberWithCommas(value)
  544. }
  545. }
  546. }
  547. }
  548.  
  549. }
  550. }
  551.  
  552. var myChart = new Chart(
  553. document.getElementById('myChart'),
  554. config
  555. );
  556. document.getElementById("total").innerHTML = "Total"
  557. function changeTotal(e=false) {
  558.  
  559. if(e) {
  560. if(document.getElementById("total").innerHTML == "Total") {
  561. data.datasets[0].data = runningTotal(getSelector(selected).map(Number))
  562. data.datasets[0].label = "Total "+selected
  563. } else {
  564. data.datasets[0].label = selected+" Gained"
  565. data.datasets[0].data = (getSelector().map(Number))
  566. }
  567. uh();
  568. return false;
  569. } else { if(document.getElementById("total").innerHTML == "Total") {
  570. document.getElementById("total").innerHTML = "Gained"
  571. document.getElementById("totalClick").innerHTML = "Total"
  572. data.datasets[0].label = selected+" Gained"
  573. data.datasets[0].data = (getSelector().map(Number))
  574. } else {
  575. document.getElementById("total").innerHTML = "Total"
  576. document.getElementById("totalClick").innerHTML = "Gained"
  577. data.datasets[0].data = runningTotal(getSelector(selected).map(Number))
  578. data.datasets[0].label = "Total "+selected
  579. }
  580. uh()
  581. return false;
  582. }
  583. }
  584.  
  585. function uh() {
  586. myChart.destroy()
  587. myChart = new Chart(
  588. document.getElementById('myChart'),
  589. config
  590. );
  591. }
  592. </script>
  593. </div>
  594. </section>
  595.  
  596. <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
  597. <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
  598. <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
  599. </body>
  600. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!