From 52360b9fb4e23a584e13e600d479228f779fc02e Mon Sep 17 00:00:00 2001
From: root <root@debian.lan>
Date: Thu, 22 May 2025 21:53:48 +0200
Subject: [PATCH] add video session

---
 src/app/components/Session.tsx | 23 +++++++++++++++--------
 src/app/globals.css            |  4 ++++
 src/app/lib/utils.ts           |  6 ++++++
 3 files changed, 25 insertions(+), 8 deletions(-)

diff --git a/src/app/components/Session.tsx b/src/app/components/Session.tsx
index bcad434..ef96b26 100644
--- a/src/app/components/Session.tsx
+++ b/src/app/components/Session.tsx
@@ -6,6 +6,7 @@ interface SessionData
 {
 	profileIcon: string;
 	rankedIcon?: string;
+	rankedVideo?: string;
 	kills: string;
 	deaths: string;
 	assists: string;
@@ -45,18 +46,24 @@ export default function Session ( { name, tag }: { name: string; tag: string } )
 		<div className="font-sans font-bold tracking-wide">
 			<div className="profile scaler-50 mx-[17rem] -mb-12 relative">
 				<div className="profile-picture w-64 h-64 floating-box relative">
+					{ ( data.rankedIcon && data.rankedVideo ) && (
+						<>
+							<video autoPlay muted loop
+								className="absolute inset-0 w-full h-full object-cover scaler-200"
+								src={ data.rankedVideo }>
+							</video>
+							<img
+								className="absolute inset-0 w-full h-full object-cover scaler-200"
+								src={ data.rankedIcon }
+								alt="Ranked Icon"
+							/>
+						</>
+					) }
 					<img
-						className="absolute inset-0 w-full h-full object-cover rounded-full scaler-75 mt-16"
+						className="absolute inset-0 w-full h-full object-cover rounded-full scaler-70 mt-16"
 						src={ data.profileIcon }
 						alt="Summoner Icon"
 					/>
-					{ data.rankedIcon && (
-						<img
-							className="absolute inset-0 w-full h-full object-cover scaler-200"
-							src={ data.rankedIcon }
-							alt="Ranked Icon"
-						/>
-					) }
 				</div>
 			</div>
 
diff --git a/src/app/globals.css b/src/app/globals.css
index 0c1f945..3ef8188 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -75,6 +75,10 @@ body {
 	transform: scale(0.75);
 }
 
+.scaler-70 {
+	transform: scale(0.7);
+}
+
 .scaler-50 {
 	transform: scale(0.5);
 }
diff --git a/src/app/lib/utils.ts b/src/app/lib/utils.ts
index ee62736..2c911b8 100644
--- a/src/app/lib/utils.ts
+++ b/src/app/lib/utils.ts
@@ -42,6 +42,11 @@ export function getRankedIcon ( rankedTier: string )
 	return `https://raw.communitydragon.org/latest/plugins/rcp-fe-lol-static-assets/global/default/ranked-emblem/wings/wings_${ rankedTier.toLowerCase() }.png`;
 }
 
+export function getRankedVideo ( rankedTier: string )
+{
+	return `https://raw.communitydragon.org/latest/plugins/rcp-fe-lol-static-assets/global/default/videos/ranked/emblem-wings-magic-${ rankedTier.toLowerCase() }.webm`;
+}
+
 export function getCountryFlag ( countryCode: string )
 {
 	return `https://flagcdn.com/160x120/${ countryCode.toLowerCase() }.png`;
@@ -251,6 +256,7 @@ export async function getSessionData ( name: string, tag: string )
 	return {
 		profileIcon: getSummonerIcon( summoner.profileIconId ),
 		rankedIcon: getRankedIcon( rankedStats.tier ),
+		rankedVideo: getRankedVideo( rankedStats.tier ),
 		kills: avgKills,
 		deaths: avgDeaths,
 		assists: avgAssists,