From ad8c88531d1b2986f71a100fefd232b740acab9d Mon Sep 17 00:00:00 2001
From: gsd <mamu@ebal.net>
Date: Wed, 9 Nov 2022 10:40:52 +0000
Subject: [PATCH] players list

---
 index.html                            |  94 +++++++++++++
 site_content/css/shit_style.css       |   6 +
 site_content/images/logo/download.svg |   8 ++
 site_content/images/logo/report.svg   |  53 +++++++
 site_content/images/logo/steam.svg    |  48 +++++++
 site_content/images/logo/terminal.svg |   3 +
 site_content/js/API.js                | 192 +++++++++++++++++++++++++-
 site_content/js/Player_API.js         |  50 +++++--
 8 files changed, 445 insertions(+), 9 deletions(-)
 create mode 100644 site_content/images/logo/download.svg
 create mode 100644 site_content/images/logo/report.svg
 create mode 100644 site_content/images/logo/steam.svg
 create mode 100644 site_content/images/logo/terminal.svg

diff --git a/index.html b/index.html
index 46f2718..9510de6 100644
--- a/index.html
+++ b/index.html
@@ -375,6 +375,100 @@ transition: background-image 1s;" id="main_container">
     </div>
 </footer>
 
+<div class="modal fade" id="Modal_ServerAboutReportPlayer" role="dialog" aria-hidden="true" aria-labelledby="Modal_ServerAboutReportPlayer_Label" tabindex="-1">
+    <div class="modal-dialog modal-dialog-centered" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="Modal_ServerAboutReportPlayer_Label">Репорт</h5>
+                <button type="button" class="btn-close" data-dismiss="modal" aria-label="Close" id="Modal_ServerAboutReportPlayer_Close"></button>
+            </div>
+            <div class="modal-body" id="Modal_ServerAboutReportPlayer_Body">
+                <div class="row justify-content-center row-cols-1">
+                    <div class="col">
+                        <h2 style="text-align: center;" id="Modal_ServerAboutReportPlayer_name">Игрок</h2>
+                    </div>
+                    <div class="col">
+                        <textarea class="form-control" id="Modal_ServerAboutReportPlayer_reason" rows="3"></textarea>
+                        <label class="form-label" for="Modal_ServerAboutReportPlayer_reason">Причина жалобы</label>
+                    </div>
+                </div>
+                <div class="row justify-content-center">
+                    <div class="col">
+                        <h6 style="font-family: tf2secondary; color:red; text-align: center;" id="Modal_ServerAboutReportPlayer_error"></h6>
+                        <a href="#" style="text-align: center;" id="Modal_ServerAboutReportPlayer_send"><h5>Отправить</h5></a>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<div class="modal fade" id="Modal_ServerAbout" role="dialog" aria-hidden="true" aria-labelledby="Modal_ServerAbout_Label" tabindex="-1">
+    <div class="modal-dialog modal-dialog-centered" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="Modal_ServerAbout_Label">Server Name</h5>
+                <button type="button" class="btn-close" data-dismiss="modal" aria-label="Close" id="Modal_ServerAbout_Close"></button>
+            </div>
+            <div class="modal-body" id="Modal_ServerAboutBody">
+                <div class="row justify-content-center pb-3 row-cols-1">
+                    <div class="col">
+                        <img class="img-fluid" src="" alt="server preview">
+                    </div>
+                    <div class="col text-center">
+                        <h6>Описание сервера</h6>
+                    </div>
+                </div>
+                <hr>
+                <!---->
+                <div class="row justify-content-center pb-3" id="Modal_ServerAbout_SelectButtons">
+                    <div class="col">
+                        <div class="card">
+                            <img class="card-img" src="" alt="connect">
+                            <div class="card-img-overlay d-flex flex-column" style="background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.02), rgba(0, 0, 0, 0.7))">
+                                <a href="#" class="stretched-link"></a>
+                                <div class="mt-auto">
+                                    <h5>Подключиться к серверу</h5>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <!---->
+                </div>
+                <hr>
+                <div class="row justify-content-center pb-3" id="Modal_ServerAbout_Players_Current">
+                    <div class="col">
+                        <h5>Сейчас играет 25/32</h5>
+                    </div>
+                </div>
+                <hr>
+                <div class="row justify-content-center pb-3" id="Modal_ServerAbout_Players_list">
+                    <div class="col">
+                        <table class="table">
+                            <thead>
+                                <tr>
+                                    <th scope="col">Имя игрока</th>
+                                    <th scope="col">Очки</th>
+                                    <th scope="col">Время игры</th>
+                                    <th scope="col">Пожаловаться</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <th scope="row"><a href="https://steamcommunity.com/id/ca">Долбаеб</a></th>
+                                    <td>228</td>
+                                    <td>23:43</td>
+                                    <td><a href="#"></a></td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
 <div class="modal fade" id="Modal_SelectPayMethod" role="dialog" aria-hidden="true" aria-labelledby="Modal_SelectPayMethod_Label" tabindex="-1">
     <div class="modal-dialog modal-dialog-centered" role="document">
         <div class="modal-content">
diff --git a/site_content/css/shit_style.css b/site_content/css/shit_style.css
index 6224369..c64f837 100644
--- a/site_content/css/shit_style.css
+++ b/site_content/css/shit_style.css
@@ -71,4 +71,10 @@ a {
 .vip-card-text {
     color: whitesmoke; 
     text-align: right;
+}
+
+.player-in-list {
+    font-family: tf2secondary;
+    text-decoration: none;
+    color: black;
 }
\ No newline at end of file
diff --git a/site_content/images/logo/download.svg b/site_content/images/logo/download.svg
new file mode 100644
index 0000000..6b269b7
--- /dev/null
+++ b/site_content/images/logo/download.svg
@@ -0,0 +1,8 @@
+<?xml version="1.0" ?><!DOCTYPE svg  PUBLIC '-//W3C//DTD SVG 1.1//EN'  'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'><svg height="132px" style="enable-background:new 0 0 124 132;" version="1.1" viewBox="0 0 124 132" width="124px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><style type="text/css">
+<![CDATA[
+	.st0{fill:#EF3E42;}
+	.st1{fill:#FFFFFF;}
+	.st2{fill:none;}
+	.st3{fill-rule:evenodd;clip-rule:evenodd;fill:#FFFFFF;}
+]]>
+</style><defs/><path d="M99.1,113.7c2.6,0,4.7-2.1,4.7-4.7V79.9h11.2v29.8c0,8.4-6.8,15.2-15.2,15.2H18.5c-8.4,0-15.2-6.8-15.2-15.2V79.9h11.2V109  c0,2.6,2.1,4.7,4.7,4.7H99.1L99.1,113.7z M37.1,17.7h43.9V57h16.8L59.1,94.8L20.4,57h16.8V17.7L37.1,17.7z"/><rect class="st2" height="132" id="_x3C_Slice_x3E__100_" width="124"/></svg>
\ No newline at end of file
diff --git a/site_content/images/logo/report.svg b/site_content/images/logo/report.svg
new file mode 100644
index 0000000..f4e0298
--- /dev/null
+++ b/site_content/images/logo/report.svg
@@ -0,0 +1,53 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="79.536px" height="79.536px" viewBox="0 0 79.536 79.536" style="enable-background:new 0 0 79.536 79.536;"
+	 xml:space="preserve">
+<g>
+	<path style="fill:#010002;" d="M29.974,23.999c-0.536,0-1.043-0.287-1.315-0.79c-0.391-0.732-0.117-1.633,0.616-2.024l13.559-7.265
+		c0.714-0.404,1.626-0.122,2.014,0.608c0.394,0.728,0.119,1.634-0.61,2.022l-13.557,7.262
+		C30.458,23.939,30.215,23.999,29.974,23.999z M44.848,37.006c0.394-0.725,0.119-1.631-0.61-2.019l-13.557-7.265
+		c-0.723-0.404-1.628-0.122-2.022,0.608c-0.391,0.728-0.117,1.633,0.616,2.019l13.559,7.268c0.217,0.119,0.461,0.182,0.698,0.182
+		C44.066,37.799,44.579,37.509,44.848,37.006z M48.188,25.892c0-0.821-0.673-1.497-1.491-1.497H34.82
+		c-0.82,0-1.494,0.676-1.494,1.497c0,0.823,0.673,1.497,1.494,1.497h11.866C47.515,27.388,48.188,26.715,48.188,25.892z
+		 M16.92,36.261c4.8,0,8.691-3.884,8.691-8.694c0-4.808-3.886-8.701-8.691-8.701c-4.813,0-8.723,3.889-8.723,8.701
+		C8.202,32.377,12.106,36.261,16.92,36.261z M17.753,38.301H16.92h-0.842c-8.114,0-11.412,2.646-13.554,7.012
+		C1.862,46.664,0.749,57.646,0,65.802h5.955l1.367-14.136l0.43,14.136h18.336l0.43-14.136l1.367,14.136h5.955
+		c-0.759-8.155-1.862-19.138-2.535-20.489C29.179,40.947,25.865,38.301,17.753,38.301z M62.624,36.261
+		c4.785,0,8.689-3.884,8.689-8.694c0-4.808-3.899-8.701-8.689-8.701c-4.805,0-8.709,3.889-8.709,8.701
+		C53.915,32.377,57.809,36.261,62.624,36.261z M77.009,45.312c-2.144-4.365-5.441-7.012-13.561-7.012h-0.834h-0.829
+		c-8.113,0-11.428,2.646-13.566,7.012c-0.652,1.352-1.761,12.334-2.521,20.489h5.949l1.372-14.136l0.431,14.136h18.335l0.43-14.136
+		l1.367,14.136h5.955C78.78,57.646,77.672,46.664,77.009,45.312z"/>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>
diff --git a/site_content/images/logo/steam.svg b/site_content/images/logo/steam.svg
new file mode 100644
index 0000000..135c29f
--- /dev/null
+++ b/site_content/images/logo/steam.svg
@@ -0,0 +1,48 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="512px" height="512px" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
+<g>
+	<path d="M151.961,418.005c13.572,0,26.893-6.567,34.986-18.708c12.867-19.301,7.651-45.377-11.649-58.244l-33.037-22.022
+		c5.654-1.54,11.597-2.38,17.739-2.38c37.196,0,67.348,30.152,67.348,67.351s-30.153,67.349-67.349,67.349
+		c-36.202,0-65.722-28.564-67.274-64.387l35.977,23.984C135.863,415.721,143.955,418.005,151.961,418.005z M426.67,0
+		C473.607,0,512,38.406,512,85.344v341.314C512,473.626,473.607,512,426.67,512H85.344C38.406,512,0,473.625,0,426.659V325.145
+		l60.667,40.444c-5.826,31.587,3.469,65.415,27.899,89.845c39.452,39.452,103.415,39.452,142.868,0
+		c24.234-24.231,33.575-57.715,28.039-89.082L384,254.858v-0.001c23.123-3.319,45.408-13.872,63.197-31.661
+		c43.736-43.738,43.736-114.653,0-158.392c-43.74-43.739-114.654-43.739-158.393,0c-17.789,17.789-28.344,40.073-31.662,63.196l0,0
+		L154.796,283.115c-15.924,0.816-31.689,5.382-45.863,13.695L0,224.189V85.344C0,38.406,38.405,0,85.343,0H426.67z M448,144
+		c0-44.183-35.816-80-80-80s-80,35.817-80,80s35.816,80,80,80S448,188.183,448,144z M320,144c0-26.51,21.49-48,48-48s48,21.49,48,48
+		s-21.49,48-48,48S320,170.51,320,144z"/>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>
diff --git a/site_content/images/logo/terminal.svg b/site_content/images/logo/terminal.svg
new file mode 100644
index 0000000..debac04
--- /dev/null
+++ b/site_content/images/logo/terminal.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" focusable="false" viewBox="0 0 12 12">
+  <path fill="currentColor" d="M11 1H1c-.55 0-1 .45-1 1v8c0 .55.45 1 1 1h10c.55 0 1-.45 1-1V2c0-.55-.45-1-1-1zM2.5 9.12a.62.62 0 01-.44-.18.628.628 0 010-.88L4.12 6 2.06 3.94c-.24-.24-.24-.64 0-.88s.64-.24.88 0L5.09 5.2c.44.44.44 1.15 0 1.59L2.94 8.94a.62.62 0 01-.44.18zm7-.12h-4c-.28 0-.5-.22-.5-.5s.22-.5.5-.5h4c.28 0 .5.22.5.5s-.22.5-.5.5z"/>
+</svg>
diff --git a/site_content/js/API.js b/site_content/js/API.js
index 633fe54..fbde86c 100644
--- a/site_content/js/API.js
+++ b/site_content/js/API.js
@@ -19,7 +19,25 @@
                     </div>
                 </div>
 */
+//https://icon-icons.com
 const Keys = { Enter: 13 };
+var api_response;
+
+function Steam3to64(steam3) {
+    var SID64_1 = "7656"
+    var SID64_S = Number(1197960265728);
+    var PatternSteam3ID = /^\[([Ug]):([0-9]):([0-9]+)\]$/;
+    var Steam3ID = PatternSteam3ID.exec(steam3);
+    var S3ID_3 = Number(Steam3ID[3]);
+    var SID64_2 = S3ID_3 + SID64_S;
+    return SID64_1+SID64_2;
+}
+
+function check_cookie_name(name) {
+    var match = document.cookie.match(new RegExp('(^| )' + name + '=([^;]+)'));
+    if (match && match[2] != "None") { return true; }
+    else { return false; }
+}
 
 $(async function() {
     $(document).on("keypress", "input", function (e) {
@@ -77,12 +95,13 @@ let invalid_captcha = `
 `
 // use templates
 function generate_server_card_div(data){
+    //////////////////////////////////////////
     return `
 <div class="col-auto justify-content-center align-self-center" style="padding: 1rem;">
     <div class="card text-right" style="width: 15rem; height: 15rem;">
         <img class="card-img" src="${data.preview}" alt="${data.name}" style="filter: blur(1px); height: 100%;">
         <div class="card-img-overlay" style="background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.02), rgba(0, 0, 0, 0.7))"><!--background-color: rgba(0, 0, 0, 0.205);-->
-            <a href="steam://connect/${data.address}" class="stretched-link" ${data.status ? "" : "disabled"}></a>
+            <a href="#" class="stretched-link" ${data.status ? "" : "disabled"} id="ChoiceServerButton_${data.selfname.replaceAll(".","_")}" data-id="${data.selfname.replaceAll(".","_")}"></a>
             <h4 class="card-title" style="color: whitesmoke;">${data.name}</h4>
             <p class="card-text" style="color: whitesmoke; font-family: tf2build; font-size: 3rem; text-align: center;">${data.player_count}/${data.max_players}</p>
             <h4 class="card-title" style="color: whitesmoke; text-align: right;">${data.human_name}</h4>
@@ -92,6 +111,169 @@ function generate_server_card_div(data){
 `
 }
 
+function bind_ServerAboutClose(){
+    $('#Modal_ServerAbout_Close').click(async function (ev) {
+        ev.preventDefault();
+        $('#Modal_ServerAbout').modal('hide');
+    });
+}
+
+function bind_ServerAboutReportPlayer_Close(){
+    $('#Modal_ServerAboutReportPlayer_Close').click(async function (ev) {
+        ev.preventDefault();
+        $('#Modal_ServerAboutReportPlayer').modal('hide');
+    });
+
+    $("#Modal_ServerAboutReportPlayer_send").click(async function (ev) {
+        ev.preventDefault();
+        $("#Modal_ServerAboutReportPlayer_error").html("");
+        if($('#Modal_ServerAboutReportPlayer_reason').val().length < 32){
+            $("#Modal_ServerAboutReportPlayer_error").html("У тебя причина говно, сделай ее более красочной. Опиши подробнее где тебя трогали.");
+        }
+        //$("#Modal_ServerAboutReportPlayer_error").html("ЛОХ");
+    });
+}
+
+function bind_ServerAboutReportPlayerButton(id){
+    console.log(id);
+    $(id).click(async function (ev) {
+        ev.preventDefault();
+        $('#Modal_ServerAbout').modal('hide');
+        let data = ev.currentTarget.dataset.id.replaceAll("_",".").split("|", 2);
+        console.log(data);
+        Modal_Fill_Report(data[0], data[1]);
+        $('#Modal_ServerAboutReportPlayer').modal('show');
+    });
+}
+
+function Modal_Fill_Report(srv, player_id){
+    $(`#Modal_ServerAboutReportPlayer_name`).html(api_response.servers[srv].players[player_id].name);
+}
+
+function bind_ServerAboutButton(srv_name){
+    $(`#ChoiceServerButton_${srv_name.replaceAll(".","_")}`).click(async function (ev) {
+        ev.preventDefault();
+        let srv = ev.currentTarget.dataset.id.replaceAll("_",".");
+        Modal_Fill_Choiced(srv);
+        $('#Modal_ServerAbout').modal('show');
+    });
+}
+
+function Modal_Fill_Choiced(srv){
+    $("#Modal_ServerAboutBody").empty();
+    $("#Modal_ServerAbout_Label").html(api_response.servers[srv].name);
+    let modal_body = `
+<div class="row justify-content-center">
+    <div class="col text-center">
+        <!--<img class="w-100 h-50 rounded-5" src="${api_response.servers[srv].preview}" alt="server preview">-->
+        <h6>${api_response.servers[srv].description}</h6>
+    </div>
+</div>
+<hr>
+<div class="row justify-content-center" id="Modal_ServerAbout_SelectButtons">`;
+
+    if (api_response.servers[srv].status) {
+        modal_body += `
+<div class="col">
+    <div class="card">
+        <img class="card-img" src="site_content/images/logo/terminal.svg" alt="connect">
+        <div class="card-img-overlay d-flex flex-column">
+            <a href="steam://connect/${api_response.servers[srv].address}" class="stretched-link"></a>
+        </div>
+    </div>
+    <h5 style="text-align:center">Подключиться</h5>
+</div>
+`;
+        if (api_response.servers[srv].workshop.length != 0) {
+            modal_body += `
+    <div class="col">
+        <div class="card">
+            <img class="card-img" src="site_content/images/logo/steam.svg" alt="workshop">
+            <div class="card-img-overlay d-flex flex-column">
+                <a href="${api_response.servers[srv].workshop}" class="stretched-link"></a>
+            </div>
+        </div>
+        <h5 style="text-align:center">Workshop</h5>
+    </div>
+    `;} else {
+            modal_body += `
+    <div class="col">
+        <div class="card">
+            <img class="card-img" src="site_content/images/logo/steam.svg" alt="workshop">
+            <div class="card-img-overlay d-flex flex-column">
+                <a href="https://tf2.pblr-nyk.pro/tf/maps/${api_response.servers[srv].map}.bsp.bz2" class="stretched-link"></a>
+            </div>
+        </div>
+        <h5 style="text-align:center">Скачать карту</h5>
+    </div>`
+    }
+} else {
+    modal_body += `<div class="col"><h5 style="text-align:center">Сервер в отключке...</h5></div>`
+}
+    modal_body += "</div><hr>";
+  
+    let allow_report = check_cookie_name("steam64");
+    if (api_response.servers[srv].status) {
+        if(api_response.servers[srv].player_count > 0) {
+            modal_body += `
+            <div class="row justify-content-center" id="Modal_ServerAbout_Players_Current">
+                <div class="col">
+                    <h3 style="text-align:center">Сейчас играет ${api_response.servers[srv].player_count}/${api_response.servers[srv].max_players}</h3>
+                </div>
+            </div>`;
+            modal_body += `
+            <div class="row justify-content-center" id="Modal_ServerAbout_Players_list">
+                <div class="col">
+                    <table class="table">
+                        <thead>
+                            <tr>
+                                <th scope="col">Имя игрока</th>
+                                <th scope="col">Очки</th>
+                                <th scope="col">Время игры</th>
+                                ${allow_report?'<th scope="col">Репорт</th>':''}
+                            </tr>
+                        </thead>
+                        <tbody>`;
+            ///////////////////////////////////////////////////////////
+            let sorted_players = Object.keys(api_response.servers[srv].players).sort((a, b) => {
+                return api_response.servers[srv].players[b].score - api_response.servers[srv].players[a].score;
+            });
+            for (const player_id in sorted_players) {
+                let player = api_response.servers[srv].players[sorted_players[player_id]];
+                modal_body += `
+                <tr>
+                    <th scope="row"><a href="https://steamcommunity.com/profiles/${Steam3to64(player.steam2)}" target="_blank" class="player-in-list">${player.name}</a></th>
+                    <td>${player.score ? player.score : 0}</td>
+                    <td>${player.duration}</td>
+                    ${allow_report?`<td><a href="#" id="Modal_ReportButton_${srv.replaceAll(".","_")}_${player.id}" data-id="${srv.replaceAll(".","_")}|${sorted_players[player_id]}"><img style="height:1rem" src="site_content/images/logo/report.svg" alt="report"></td>`:''}
+                </tr>
+                `;
+            }
+            ///////////////////////////////////////////////////////////
+            modal_body += `</tbody>
+                    </table>
+                </div>
+            </div>`
+        } else {
+            modal_body += `
+            <div class="row justify-content-center" id="Modal_ServerAbout_Players_Current">
+                <div class="col">
+                    <h3 style="text-align:center">Сейчас никто не играет</h3>
+                </div>
+            </div>`;
+        }
+}
+
+    $(modal_body).appendTo("#Modal_ServerAboutBody");
+
+    if(allow_report && api_response.servers[srv].status && api_response.servers[srv].player_count > 0) {
+        for (const player_id in api_response.servers[srv].players) {
+            player = api_response.servers[srv].players[player_id];
+            bind_ServerAboutReportPlayerButton(`#Modal_ReportButton_${srv.replaceAll(".","_")}_${player.id}`);
+        }
+    }
+}
+
 async function CheckApi() {
     let api_request_time = (new Date).getTime();
     await fetch("https://tf2.pblr-nyk.pro/api", {headers: {'Cache-Control':'no-cache'}})
@@ -114,6 +296,7 @@ async function RequestAPI() {
     await fetch("https://tf2.pblr-nyk.pro/api/stats", {headers: {'Cache-Control':'no-cache'}})
         .then(res => res.json())
         .then(res => {
+            api_response = res;
             FillServices(res);
             // $('#current_players').text(res.servers.statistic.player_now)
             $("#current_players").html(res.servers.statistic.player_now);
@@ -139,6 +322,7 @@ async function RequestAPI() {
             for (let sort_id in sorted_servers) {
                 let server = sorted_servers[sort_id];
                 if (server == `statistic`) {continue;}
+                res.servers[server].selfname = server;
                 if(res.servers[server].status == true && res.servers[server].player_count > 0) {
                     if(!active) {
                         $(servers_active).appendTo("#servers_list_v2");
@@ -152,6 +336,7 @@ async function RequestAPI() {
                     }
                 }
                 $(generate_server_card_div(res.servers[server])).appendTo("#servers_list_v2");
+                bind_ServerAboutButton(server);
             }
 
             for (let sort_id in sorted_servers) {
@@ -162,8 +347,12 @@ async function RequestAPI() {
                         dead = true;
                     }
                     $(generate_server_card_div(res.servers[server])).appendTo("#servers_list_v2");
+                    bind_ServerAboutButton(server);
                 }
             }
+            ////////////////
+            bind_ServerAboutClose();
+            bind_ServerAboutReportPlayer_Close();
         }).catch((err) => {
             console.log(err);
             //FillFooter("", 0, 0);
@@ -273,4 +462,5 @@ function FillRules() {
     }
 }
 
+
     
\ No newline at end of file
diff --git a/site_content/js/Player_API.js b/site_content/js/Player_API.js
index 7cd32d6..d6524c4 100644
--- a/site_content/js/Player_API.js
+++ b/site_content/js/Player_API.js
@@ -1,11 +1,45 @@
-$(async function () {
-    await CheckCurrentUser();
-})
+class CurrentUser {
+    constructor() {
+        document.getElementById("Header_CurrentUser").innerHTML = `Получение данных профиля с сервера... ПОДОЖДИ`;
+        this.fill_user();
+    }
+
+    fill_user() {
+        fetch("https://tf2.pblr-nyk.pro/player_api/v1/current_user", { credentials: "same-origin", headers: { 'Cache-Control': 'no-cache' } })
+        .then(response => response.json())
+        .then(response => {
+            if ("error" in response) {
+                console.log("Cannot fetch current user");
+                return;
+            }
+            document.getElementById("Header_CurrentUser").href = "#";
+            this.check_ban_in_header(response);
+            document.getElementById("Header_Logout").innerHTML = " (нажми чтоб выйти)";
+            //
+            document.getElementById("profile_list").remove();
+            document.getElementById("profile_stats").insertAdjacentHTML("beforeend", FillPlayerInfo(response));
+            ReconstructVipSection(response);
+        });
+    }
 
+    check_ban_in_header(response) {
+        if (response.ban) {
+            document.getElementById("Header_CurrentUser").innerHTML = `Привет ${response.steam_data.nickname}! У меня хорошие новости!`;
+            document.getElementById("Header_CurrentBan").innerHTML = "У тебя БАН! (нажми чтоб посмотреть его)";
+        } else {
+            document.getElementById("Header_CurrentUser").innerHTML = `Привет ${response.steam_data.nickname}!`;
+        }
+    }
+}
+
+if (check_cookie_name("steam64")) { 
+    var current_user = new CurrentUser();
+}
+/*
 async function CheckCurrentUser() {
     if (!check_cookie_name("steam64")) { return; }
-    $("#Header_CurrentUser").html(`Получение данных профиля с сервера... ПОДОЖДИ`);
-    await fetch("https://tf2.pblr-nyk.pro/player_api/v1/current_user", { credentials: "same-origin", headers: { 'Cache-Control': 'no-cache' } })
+    //$("#Header_CurrentUser").html(`Получение данных профиля с сервера... ПОДОЖДИ`);
+    /*await fetch("https://tf2.pblr-nyk.pro/player_api/v1/current_user", { credentials: "same-origin", headers: { 'Cache-Control': 'no-cache' } })
         .then(response => response.json())
         .then(response => {
             if ("error" in response) {
@@ -24,7 +58,7 @@ async function CheckCurrentUser() {
                 ReconstructVipSection(response);
             }
         })
-}
+}*/
 
 function check_cookie_name(name) {
     var match = document.cookie.match(new RegExp('(^| )' + name + '=([^;]+)'));
@@ -313,8 +347,8 @@ let konami_code = "";
 let activated = false;
 //$().keypress(function (event) { 
 
-//document.addEventListener('keypress', (event) => {
-$(":root").keypress(function (event) {     
+document.addEventListener('keypress', (event) => {
+//$(":root").keypress(function (event) {     
     if (activated) { return; }
 
     konami_code += event.key;