Skip to content

Commit

Permalink
Feature/issue-1157/player-stats (#1290) (#1292)
Browse files Browse the repository at this point in the history
* Feature/issue-1157/player-stats (#1290)

* Googlebot fix apply (#1291)

* test: #1231;

* test: #1231; layout reorder;

* test: #1231; single column;

* test: #1231; splash;

* test: #1231; splash google-vot check;

* test: #1231; splash google-bot check;

* test: #1231; splash google-bot check;

* test: #1231; splash google-bot check;

* test: #1231; splash google-bot check (revert);

* test: #1231; splash google-bot check (cont);

* test: #1231; splash google-bot check (cont);

* test: #1231; splash google-bot check (cont);

* test: #1231; splash google-bot check (cont);

* test: #1231; splash google-bot check (cont);

* test: #1231; splash google-bot check (cont);

* test: #1231; splash google-bot check (cont);

* test: #1231; splash google-bot check (cont);

* test: #1231; splash google-bot check (cont);

* test: #1231; splash google-bot check (cont);
  • Loading branch information
migbash authored May 10, 2023
1 parent 1051d83 commit bcf634a
Show file tree
Hide file tree
Showing 28 changed files with 2,209 additions and 49 deletions.
14 changes: 7 additions & 7 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@
},
"type": "module",
"dependencies": {
"@betarena/scores-lib": "^0.11.1",
"@betarena/scores-lib": "^0.12.4",
"@lukeed/uuid": "^2.0.1",
"@metamask/sdk": "^0.1.0",
"@moralisweb3/client-firebase-auth-utils": "^2.18.4",
Expand Down
20 changes: 17 additions & 3 deletions src/app.html
Original file line number Diff line number Diff line change
Expand Up @@ -18,12 +18,18 @@
/>
<!--
IMPORTANT
mobile usability override
[GOOGLEBOT] mobile usability override/hack
-->
<style>
body.googlebot-override * {
all: unset;
}
html {
overflow-x: hidden !important;
}
body.googlebot-override,
body.googlebot-override main {
overflow: hidden;
overflow-x: hidden !important;
}
body.googlebot-override p,
body.googlebot-override span,
Expand All @@ -37,11 +43,19 @@
body.googlebot-override img,
body.googlebot-override td { */
body.googlebot-override * {
margin: 12px;
margin: 10px;
display: grid;
overflow-x: hidden !important;
max-width: inherit;
text-overflow: ellipsis;
flex-wrap: wrap;
}
body.googlebot-override div#splash-screen {
margin: 0;
}
body.googlebot-override section#home-page {
grid-template-columns: 1fr !important;
}
</style>
<!--
[ℹ] Website Icons & Favicons
Expand Down
54 changes: 47 additions & 7 deletions src/lib/components/page/player/Layout.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@ COMPONENT JS (w/ TS)
import Breadcrumb from './Breadcrumb.svelte';
import FixturesWidget from './fixtures/Fixtures-Widget.svelte';
import ProfileWidget from './profile/Profile-Widget.svelte';
import StatisticsWidget from './statistics/Statistics-Widget.svelte';
//#endregion ➤ [MAIN] Package Imports
Expand Down Expand Up @@ -264,12 +265,51 @@ NOTE: [HINT] use (CTRL+SPACE) to select a (class) (id) style
<Breadcrumb />
<ProfileWidget/>

<div id="widget-grid-display">
<div
class="grid-display-column">
<FixturesWidget />
<!--
[ℹ] widgets
[ℹ] MOBILE
FIXME: update to have a single dynamic layout
-->
{#if mobileExclusive || tabletExclusive}

<div
id="widget-grid-display"
>
<!--
Column Num.1
-->
<div
class="grid-display-column"
>
<StatisticsWidget />
<FixturesWidget />
</div>
</div>
</div>

{:else}

<div
id="widget-grid-display"
>
<!--
Column Num.1
-->
<div
class="grid-display-column"
>
<FixturesWidget />
</div>
<!--
Column Num.2
-->
<div
class="grid-display-column"
>
<StatisticsWidget />
</div>
</div>

{/if}

</section>

Expand Down Expand Up @@ -324,7 +364,7 @@ NOTE: [HINT] auto-fill/auto-complete iniside <style> for var() values by typing/
div#widget-grid-display {
gap: 20px;
grid-template-columns:
minmax(850px, 850px)
minmax(auto, 850px)
minmax(auto, 502px)
;
}
Expand All @@ -337,7 +377,7 @@ NOTE: [HINT] auto-fill/auto-complete iniside <style> for var() values by typing/
align-items: start;
gap: 20px;
grid-template-columns:
minmax(850px, 850px)
minmax(auto, 850px)
minmax(auto, 502px)
;
}
Expand Down
6 changes: 2 additions & 4 deletions src/lib/components/page/player/fixtures/Fixtures-Main.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -37,12 +37,11 @@ COMPONENT JS (w/ TS)
export let WIDGET_DATA: B_PFIX_D
let PAGE_DATA: B_SAP_PP_D = $page.data?.PAGE_DATA
let WIDGET_T_DATA: B_PFIX_T = $page.data?.B_PFIX_T
$: WIDGET_T_DATA = $page.data?.B_PFIX_T
let PAGE_DATA: B_SAP_PP_D = $page.data?.PAGE_DATA
$: WIDGET_T_DATA = $page.data?.B_PFIX_T
$: PAGE_DATA = $page.data?.PAGE_DATA
$: WIDGET_TITLE = WIDGET_T_DATA != undefined ? WIDGET_T_DATA?.fixtures || 'Fixtures' : 'Fixtures'
let pageFixtureMap: Map <number, Map <string, PFIX_C_Fixture[]>> = new Map();
Expand Down Expand Up @@ -417,7 +416,6 @@ NOTE: [HINT] use (CTRL+SPACE) to select a (class) (id) style

<WidgetTitle
{WIDGET_TITLE}
OVERRIDE_COLOR={mobileExclusive || tabletExclusive}
/>

<div
Expand Down
15 changes: 9 additions & 6 deletions src/lib/components/page/player/fixtures/Fixtures-Widget.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ COMPONENT JS (w/ TS)
import { get } from '$lib/api/utils';
import SeoBox from '$lib/components/SEO-Box.svelte';
import { platfrom_lang_ssr, viewport_change } from '$lib/utils/platform-functions';
import type { B_PFIX_D, PFIX_C_Fixture, PFIX_C_League } from '@betarena/scores-lib/types/player-fixtures';
import type { B_PFIX_D, B_PFIX_T, PFIX_C_Fixture, PFIX_C_League } from '@betarena/scores-lib/types/player-fixtures';
import type { B_SAP_PP_D } from '@betarena/scores-lib/types/seo-pages.js';
import { onMount } from 'svelte';
import FixturesLoader from './Fixtures-Loader.svelte';
Expand All @@ -40,13 +40,13 @@ COMPONENT JS (w/ TS)
// ~~~~~~~~~~~~~~~~~~~~~
let PAGE_DATA: B_SAP_PP_D = $page.data?.PAGE_DATA
$: PAGE_DATA = $page.data?.PAGE_DATA
// let WIDGET_T_DATA: B_LS2_T = $page.data?.LIVESCORES_V2_T_DATA
// $: WIDGET_T_DATA = $page.data?.LIVESCORES_V2_T_DATA
let WIDGET_T_DATA: B_PFIX_T = $page.data?.B_PFIX_T
let WIDGET_S_DATA: B_PFIX_D = $page.data?.B_PFIX_D
$: PAGE_DATA = $page.data?.PAGE_DATA
$: WIDGET_T_DATA = $page.data?.B_PFIX_T
$: WIDGET_S_DATA = $page.data?.B_PFIX_D
$: WIDGET_TITLE = WIDGET_T_DATA != undefined ? WIDGET_T_DATA?.fixtures || 'Fixtures' : 'Fixtures'
const fixtureMap: Map <string, PFIX_C_Fixture[]> = new Map(Object.entries(WIDGET_S_DATA?.data?.past_fixtures)) as Map <string, PFIX_C_Fixture[]>;
const leagueMap: Map <string, PFIX_C_League> = new Map(Object.entries(WIDGET_S_DATA?.data?.leagues)) as unknown as Map <string, PFIX_C_League>;
Expand Down Expand Up @@ -144,6 +144,9 @@ NOTE: [HINT] use (CTRL+SPACE) to select a (class) (id) style
=================-->

<SeoBox>
<h2>
{WIDGET_TITLE}
</h2>
<!--
[] Fixture Links
-->
Expand Down
166 changes: 166 additions & 0 deletions src/lib/components/page/player/statistics/Statistics-Loader.svelte
Original file line number Diff line number Diff line change
@@ -0,0 +1,166 @@
<!-- ===============
COMPONENT JS (w/ TS)
=================-->

<script lang="ts">
//#region ➤ [MAIN] Package Imports
// IMPORTS GO HERE
import PstatBLoaderRatingGrid from "./loaders/PSTAT-BLoader-RatingGrid.svelte";
import PstatLoaderLeftMBoxRow from "./loaders/PSTAT-Loader-Left-M-Box-Row.svelte";
import PstatLoaderLeftTBoxRow from "./loaders/PSTAT-Loader-Left-T-Box-Row.svelte";
import PstatLoaderLeftMainBox from "./loaders/PSTAT-Loader-LeftMainBox.svelte";
import PstatLoaderRightMBoxRow from "./loaders/PSTAT-Loader-Right-M-Box-Row.svelte";
import PstatLoaderRightTBoxRow from "./loaders/PSTAT-Loader-Right-T-Box-Row.svelte";
import PstatLoaderRightMainBox from "./loaders/PSTAT-Loader-RightMainBox.svelte";
//#endregion ➤ [MAIN] Package Imports
//#region ➤ [VARIABLES]
// ~~~~~~~~~~~~~~~~~~~~~
// COMPONENT VARIABLES
// ~~~~~~~~~~~~~~~~~~~~~
//#endregion ➤ [VARIABLES]
//#region ➤ [METHODS]
// ~~~~~~~~~~~~~~~~~~~~~
// COMPONENT METHODS
// ~~~~~~~~~~~~~~~~~~~~~
// ~~~~~~~~~~~~~~~~~~~~~
// VIEWPORT CHANGES
// ~~~~~~~~~~~~~~~~~~~~~
//#endregion ➤ [METHODS]
//#region ➤ [ONE-OFF] [METHODS] [IF]
//#endregion ➤ [ONE-OFF] [METHODS] [IF]
//#region ➤ [REACTIVIY] [METHODS]
//#endregion ➤ [REACTIVIY] [METHODS]
//#region ➤ SvelteJS/SvelteKit [LIFECYCLE]
//#endregion ➤ SvelteJS/SvelteKit [LIFECYCLE]
</script>

<!-- ===============
COMPONENT HTML
NOTE: [HINT] use (CTRL+SPACE) to select a (class) (id) style
=================-->

<div
id="player-fixture-loader"
class="widget-component">
<!--
Top Main Loader Row
-->
<div
class="
row-space-out
m-b-20
">
<div
class="
m-r-16
"
>
<PstatLoaderLeftMainBox />
</div>
<PstatLoaderRightMainBox />
</div>
<!--
Avg. Rating
Fixtures Icons
Fixtures Grid Ratings
-->
<div
class="
m-b-25
">
<PstatBLoaderRatingGrid/>
</div>
<!--
Rows loaders
-->
<div>
{#each { length: 6 } as _, i}
<div
class="
loader-box
m-t-15
m-b-16
row-space-out
"
style="
border-top: 1px solid #E6E6E6;
padding-top: 14px;
"
>
<PstatLoaderLeftTBoxRow />
<PstatLoaderRightTBoxRow />
</div>
{#each { length: 4 } as _, i}
<div
class="
m-b-16
row-space-out
"
>
<PstatLoaderLeftMBoxRow />
<PstatLoaderRightMBoxRow />
</div>
{/each}
{/each}
</div>
</div>

<!-- ===============
COMPONENT STYLE
NOTE: [HINT] auto-fill/auto-complete iniside <style> for var() values by typing/(CTRL+SPACE)
=================-->

<style>
.widget-component {
padding: 20px;
}
:global(div.livescores-fixture-row-loader) {
border-top: 1px solid var(--grey-color);
padding-top: 20px;
padding-bottom: 10px;
padding: 20px;
text-align: center;
}
/*
=============
RESPONSIVNESS
=============
*/
@media only screen and (min-width: 768px) {
.widget-component {
margin-top: 40px;
}
}
/*
=============
DARK-THEME
=============
*/
:global(.dark-background div.livescores-fixture-row-loader) {
border-top: 1px solid var(--dark-theme-1-shade);
}
</style>
Loading

0 comments on commit bcf634a

Please sign in to comment.