Skip to content

Commit fcfaed3

Browse files
B3noneB3none
committed
Ported alternative style for profile page
1 parent a906a3a commit fcfaed3

File tree

6 files changed

+113
-17
lines changed

6 files changed

+113
-17
lines changed

‎assets/scripts/listeners/index.js‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
11
import {listen as listenMatches} from "./matches";
22
import {listen as listenHover} from "./hover";
33
import {listen as listenSteamProfile} from "./steam-profile";
4+
import {listen as listenProfile} from "./profile";
45

56
export function listen() {
67
listenMatches();
78
listenHover();
89
listenSteamProfile();
10+
listenProfile();
911
}

‎assets/scripts/listeners/profile.js‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
function secondsToReadable(seconds) {
2+
seconds = Number(seconds);
3+
const h = Math.floor(seconds / 3600);
4+
5+
if (seconds < 60) {
6+
return "None";
7+
}
8+
9+
const hDisplay = h > 0 ? h + (h === 1 ? " h" : " h") : "";
10+
11+
if (hDisplay !== '') {
12+
return hDisplay
13+
}
14+
15+
const m = Math.floor(seconds % 3600 / 60);
16+
return m > 0 ? m + (m === 1 ? " m" : " m") : "";
17+
}
18+
19+
export function listen() {
20+
$('.seconds-to-readable').each((k, v) => {
21+
v = $(v);
22+
23+
v.html(secondsToReadable(v.html()));
24+
});
25+
}

‎assets/styles/general.scss‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -210,4 +210,9 @@ a:hover {
210210
-moz-box-shadow: 0 0 40px -5px rgba(0, 0, 0, .58);
211211
box-shadow: 0 0 40px -5px rgba(0, 0, 0, .58);
212212
border-radius: 25px !important;
213-
}
213+
}
214+
215+
.profile-stats i {
216+
font-size: 4.5rem;
217+
margin-bottom: 0;
218+
}

‎src/Helpers/MatchesHelper.php‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -156,7 +156,7 @@ public function getPlayerMatches(string $steamId, int $matches = 3): array
156156
{
157157
$query = $this->db->query('
158158
SELECT DISTINCT
159-
matches_maps.*
159+
matches_maps.*, matches_players.kills, matches_players.deaths
160160
FROM matches
161161
LEFT JOIN matches_maps ON matches_maps.matchid = matches.matchid
162162
LEFT JOIN matches_players ON matches_players.matchid = matches.matchid
@@ -170,7 +170,7 @@ public function getPlayerMatches(string $steamId, int $matches = 3): array
170170
$response = $query->fetchAll();
171171

172172
foreach ($response as $key => $match) {
173-
$response[$key]['map_image'] = $this->getMatchMapImage($match['map']);
173+
$response[$key]['map_image'] = $this->getMatchMapImage($match['mapname']);
174174
}
175175

176176
return $response;

‎src/Views/partials/scripts.twig‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
22
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.2/js/bootstrap.bundle.min.js"></script>
3-
<script src="/build/scripts.js?v=b3none"></script>
3+
<script src="/build/scripts.js?v=123"></script>

‎src/Views/profile.twig‎

Lines changed: 77 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -39,22 +39,86 @@
3939
</div>
4040
<hr>
4141
<div class="row">
42-
<div class="col-md-4">
43-
<h4><i class="fas fa-crosshairs"></i>&nbsp;Kills: {{ player.kills }}</h4>
44-
<h4><i class="fas fa-skull"></i>&nbsp;Deaths:&nbsp;<strong>{{ player.deaths }}</strong><br></h4>
45-
<h4><i class="fas fa-dot-circle"></i> KDR: {{ player.kdr|number_format(2, '.', ',') }}<br></h4>
42+
<div class="col-4 text-left col-centered">
43+
<div class="row profile-stats">
44+
<div class="col-9 text-right nopadding-right">
45+
<h4>Kills</h4>
46+
<h1>{{player.kills}}</h1>
47+
</div>
48+
<div class="col-3 nopadding-right">
49+
<i class="fas fa-crosshairs"></i>
50+
</div>
51+
</div>
52+
<div class="row profile-stats">
53+
<div class="col-9 text-right nopadding-right">
54+
<h4>Assists</h4>
55+
<h1>{{player.assists}}</h1>
56+
</div>
57+
<div class="col-3 nopadding-right">
58+
<i class="far fa-handshake"></i>
59+
</div>
60+
</div>
61+
<div class="row profile-stats">
62+
<div class="col-9 text-right nopadding-right">
63+
<h4>Deaths</h4>
64+
<h1>{{player.deaths}}</h1>
65+
</div>
66+
<div class="col-3 nopadding-right">
67+
<i class="fas fa-skull"></i>
68+
</div>
69+
</div>
4670
</div>
47-
<div class="col-md-4">
48-
<h4><i class="far fa-handshake" style="font-size:16px;"></i>&nbsp;Assists: {{ player.assists }}</h4>
49-
<h4><i class="fas fa-meh"></i>&nbsp;Shots: {{ player.shots }}</h4>
50-
<h4><i class="fas fa-chess-queen"></i>&nbsp;Damage: {{ player.damage }}</h4>
71+
<div class="col-4 text-center col-centered">
72+
<div class="row profile-stats">
73+
<div class="col-12">
74+
<h4>Elo</h4>
75+
<h1>{{player.score}}</h1>
76+
</div>
77+
</div>
78+
<div class="row profile-stats">
79+
<div class="col-12">
80+
<h4>K/D Ratio</h4>
81+
<h1>{{ player.kdr|number_format(2, '.', ',') }}</h1>
82+
</div>
83+
</div>
84+
<div class="row profile-stats">
85+
<div class="col-12">
86+
<h4>Played Matches</h4>
87+
<h1><span class="text-success">{{player.match_win}}</span> | <span class="text-warning">{{player.match_draw}}</span> | <span class="text-danger">{{player.match_lose}}</span></h1>
88+
</div>
89+
</div>
5190
</div>
52-
<div class="col-md-4">
53-
<h4><i class="fas fa-ruler-combined" style="font-size:18px;"></i>&nbsp;ADR: {{ player.adr|number_format(2, '.', ',') }}</h4>
54-
<h4><i class="fas fa-calculator"></i>&nbsp;Hits: {{ player.hits }}</h4>
55-
<h4><i class="fas fa-user-slash" style="font-size:16px;"></i>HS: {{ player.headshots }}</h4>
91+
<div class="col-4 text-right col-centered">
92+
<div class="row profile-stats">
93+
<div class="col-3 nopadding-left">
94+
<i class="fas fa-bullseye"></i>
95+
</div>
96+
<div class="col-9 text-left nopadding-left">
97+
<h4>ADR</h4>
98+
<h1>{{ player.adr|number_format(2, '.', ',') }}</h1>
99+
</div>
100+
</div>
101+
<div class="row profile-stats">
102+
<div class="col-3 nopadding-left">
103+
<i class="fas fa-user-slash"></i>
104+
</div>
105+
<div class="col-9 text-left nopadding-left">
106+
<h4>Headshots</h4>
107+
<h1>{{ player.headshots }}</h1>
108+
</div>
109+
</div>
110+
<div class="row profile-stats">
111+
<div class="col-3 nopadding-left">
112+
<i class="fas fa-history"></i>
113+
</div>
114+
<div class="col-9 text-left nopadding-left">
115+
<h4>Time Played</h4>
116+
<h1 class="seconds-to-readable">{{player.connected}}</h1>
117+
</div>
118+
</div>
56119
</div>
57120
</div>
121+
58122
{#<div class="social-icons-profile" style="margin-top:15px;">#}
59123
{#<a href="https://steamcommunity.com/profiles/{{ player.steam }}" style="margin-left:10px;color:#171A21;"><i class="fab fa-steam"></i></a>#}
60124
{#<a href="#" style="margin-left:10px;color:#6441a4;"><i class="fab fa-twitch"></i></a>#}
@@ -79,7 +143,7 @@
79143
</div>
80144
</div>
81145
<hr>
82-
<div class="row">
146+
<div class="row justify-content-center">
83147
{% for match in matches %}
84148
<div class="col-md-4" style="margin-top:15px;">
85149
{% include 'partials/match/profile-matches.twig' with match %}

0 commit comments

Comments
 (0)