0% found this document useful (0 votes)
75 views15 pages

Message

The document details the Genesis Bot, an advanced AI bot for Rocket League, highlighting its Grand Champion-level capabilities. It includes various design elements and features such as a responsive layout, animations, and interactive components to enhance user experience. The document also outlines the bot's functionalities and provides a visually appealing interface for users.

Uploaded by

lostydelamandown
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
75 views15 pages

Message

The document details the Genesis Bot, an advanced AI bot for Rocket League, highlighting its Grand Champion-level capabilities. It includes various design elements and features such as a responsive layout, animations, and interactive components to enhance user experience. The document also outlines the bot's functionalities and provides a visually appealing interface for users.

Uploaded by

lostydelamandown
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 15

<!

DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Genesis Bot - Le bot Rocket League ultime
avec des fonctionnalités avancées et une IA de niveau Grand Champion">
<meta name="keywords" content="Genesis Bot, Rocket League, Bot, AI, Gaming, RL,
RLBot">
<meta name="author" content="Genesis Bot Team">
<meta name="theme-color" content="#8400ff">
<meta property="og:title" content="Genesis Bot - Bot Rocket League
Intelligent">
<meta property="og:description" content="Le bot Rocket League ultime avec des
fonctionnalités avancées et une IA de niveau Grand Champion">
<meta property="og:type" content="website">
<title>Genesis Bot - Bot Rocket League Intelligent</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?
family=Orbitron:wght@400;500;600;700&family=Roboto:wght@300;400;500;700&display=swa
p" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/
css/all.min.css" rel="stylesheet">
<style>
:root {
--primary-color: #0a1929;
--secondary-color: #b71ee5;
--accent-color: #8400ff;
--background-color: #0d1117;
--text-color: #e0e0e0;
--card-bg: rgba(30, 41, 59, 0.85);
--button-gradient: linear-gradient(135deg, #b71ee5, #4400ff);
--button-gradient-hover: linear-gradient(135deg, #4c00ff, #851ee5);
--transition-speed: 0.3s;
--font-family-primary: 'Orbitron', sans-serif;
--font-family-secondary: 'Roboto', sans-serif;
--glow-color: rgba(132, 0, 255, 0.5);
}

* {
box-sizing: border-box;
margin: 0;
padding: 0;
scroll-behavior: smooth;
}

body {
font-family: var(--font-family-primary);
background: radial-gradient(circle at center, #1a1f2c, var(--
background-color));
color: var(--text-color);
line-height: 1.6;
overflow-x: hidden;
min-height: 100vh;
}

.header {
background: linear-gradient(to bottom, var(--primary-color), rgba(10,
25, 41, 0.95));
padding: 2rem 0;
position: relative;
overflow: hidden;
border-bottom: 2px solid var(--accent-color);
}

.header::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background:
radial-gradient(circle at 20% 50%, var(--secondary-color) 0%,
transparent 50%),
radial-gradient(circle at 80% 50%, var(--accent-color) 0%,
transparent 50%);
opacity: 0.1;
animation: headerGlow 10s infinite;
}

@keyframes headerGlow {
0%, 100% {
opacity: 0.1;
transform: scale(1);
}
50% {
opacity: 0.2;
transform: scale(1.1);
}
}

.header-content {
position: relative;
z-index: 1;
text-align: center;
padding: 2rem;
max-width: 1200px;
margin: 0 auto;
}

.logo {
font-size: 4.5rem;
font-weight: 700;
background: linear-gradient(45deg, var(--text-color) 30%, var(--
secondary-color) 50%, var(--accent-color) 70%);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
text-shadow: 0 0 20px var(--glow-color);
animation: logoFloat 4s ease-in-out infinite;
margin-bottom: 1.5rem;
}

@keyframes logoFloat {
0%, 100% {
transform: translateY(0) rotate(0deg);
text-shadow: 0 0 20px var(--glow-color);
}
25% {
transform: translateY(-10px) rotate(1deg);
text-shadow: 0 0 30px var(--glow-color);
}
75% {
transform: translateY(10px) rotate(-1deg);
text-shadow: 0 0 25px var(--glow-color);
}
}

.version-badge {
background: linear-gradient(135deg, var(--secondary-color), var(--
accent-color));
padding: 0.7rem 1.5rem;
border-radius: 25px;
display: inline-block;
margin: 1rem 0;
font-size: 1.1rem;
font-weight: 500;
box-shadow: 0 0 15px var(--glow-color);
animation: badgePulse 3s infinite;
}

@keyframes badgePulse {
0%, 100% {
transform: scale(1);
box-shadow: 0 0 15px var(--glow-color);
}
50% {
transform: scale(1.05);
box-shadow: 0 0 25px var(--glow-color);
}
}

.container {
max-width: 1200px;
margin: 0 auto;
padding: 2rem;
}

.card {
background: linear-gradient(135deg, rgba(30, 41, 59, 0.95), rgba(30,
41, 59, 0.85));
border-radius: 1.5rem;
padding: 2.5rem;
margin: 2rem 0;
transition: all 0.4s ease;
position: relative;
overflow: hidden;
border: 1px solid rgba(255, 255, 255, 0.1);
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.card::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(45deg, var(--secondary-color) 0%,
transparent 100%);
opacity: 0;
transition: opacity 0.4s ease;
}

.card:hover {
transform: translateY(-10px);
box-shadow: 0 15px 40px rgba(0, 0, 0, 0.4);
}

.card:hover::before {
opacity: 0.05;
}

.card h2 {
font-size: 2rem;
margin-bottom: 1.5rem;
color: var(--secondary-color);
text-shadow: 0 0 10px rgba(183, 30, 229, 0.3);
position: relative;
}

.card h2::after {
content: '';
position: absolute;
bottom: -10px;
left: 0;
width: 50px;
height: 3px;
background: var(--secondary-color);
box-shadow: 0 0 10px var(--secondary-color);
}

.features-list li {
background: rgba(255, 255, 255, 0.05);
margin: 0.8rem 0;
padding: 1.2rem;
border-radius: 1rem;
transition: all 0.3s ease;
display: flex;
align-items: center;
gap: 1rem;
border: 1px solid rgba(255, 255, 255, 0.05);
}

.features-list li:hover {
background: rgba(255, 255, 255, 0.1);
transform: translateX(15px);
border-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

.features-list i {
color: var(--secondary-color);
font-size: 1.4rem;
transition: all 0.3s ease;
}

.features-list li:hover i {
transform: scale(1.2) rotate(10deg);
color: var(--accent-color);
}

.download-button {
background: var(--button-gradient);
color: white;
padding: 1.2rem 2.5rem;
border: none;
border-radius: 50px;
font-size: 1.2rem;
cursor: pointer;
transition: all 0.4s ease;
display: inline-flex;
align-items: center;
gap: 0.8rem;
margin: 0.8rem;
position: relative;
overflow: hidden;
text-decoration: none;
font-weight: 500;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}

.download-button::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: rgba(255, 255, 255, 0.2);
transform: skewX(-30deg);
transition: 0.5s;
}

.download-button:hover::before {
left: 100%;
}

.download-button:hover {
transform: translateY(-5px);
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4);
background: var(--button-gradient-hover);
}

.versions-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 1.5rem;
padding: 1.5rem;
}

.fade-in {
opacity: 0;
transform: translateY(30px);
transition: opacity 0.8s ease, transform 0.8s ease;
}

.fade-in.visible {
opacity: 1;
transform: translateY(0);
}

@media (max-width: 768px) {


.logo {
font-size: 3rem;
}

.card {
padding: 1.5rem;
}

.download-button {
font-size: 1rem;
padding: 1rem 2rem;
}

.versions-grid {
grid-template-columns: 1fr;
}
}

.particles {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 0;
}

.particle {
position: absolute;
background: var(--accent-color);
border-radius: 50%;
opacity: 0.3;
animation: particleFloat 20s infinite linear;
}

@keyframes particleFloat {
0% {
transform: translateY(0) rotate(0deg);
}
100% {
transform: translateY(-100vh) rotate(360deg);
}
}

.scroll-progress {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 3px;
background: linear-gradient(to right, var(--secondary-color), var(--
accent-color));
transform-origin: 0 50%;
transform: scaleX(0);
z-index: 1000;
}

.floating-nav {
position: fixed;
right: 20px;
top: 50%;
transform: translateY(-50%);
z-index: 1000;
background: rgba(10, 25, 41, 0.9);
padding: 1rem;
border-radius: 30px;
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.1);
display: none;
}

.floating-nav.visible {
display: block;
animation: slideInRight 0.5s ease-out;
}

.floating-nav ul {
list-style: none;
padding: 0;
margin: 0;
}

.floating-nav li {
margin: 1rem 0;
}

.floating-nav a {
color: var(--text-color);
text-decoration: none;
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.5rem;
border-radius: 15px;
transition: all 0.3s ease;
}

.floating-nav a:hover {
background: rgba(255, 255, 255, 0.1);
transform: translateX(-5px);
}

@keyframes slideInRight {
from {
opacity: 0;
transform: translate(50px, -50%);
}
to {
opacity: 1;
transform: translate(0, -50%);
}
}

.download-counter {
background: rgba(255, 255, 255, 0.1);
padding: 0.5rem 1rem;
border-radius: 20px;
font-size: 0.9rem;
margin-top: 0.5rem;
display: inline-flex;
align-items: center;
gap: 0.5rem;
}

.gallery {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 1.5rem;
margin: 2rem 0;
}

.gallery-item {
position: relative;
border-radius: 1rem;
overflow: hidden;
aspect-ratio: 16/9;
cursor: pointer;
}

.gallery-item img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.5s ease;
}

.gallery-item:hover img {
transform: scale(1.1);
}

.gallery-item::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(to top, rgba(0,0,0,0.7), transparent);
}

.theme-toggle {
position: fixed;
top: 20px;
right: 20px;
z-index: 1001;
background: var(--card-bg);
border: none;
color: var(--text-color);
padding: 0.8rem;
border-radius: 50%;
cursor: pointer;
transition: all 0.3s ease;
box-shadow: 0 0 10px rgba(0,0,0,0.3);
}

.theme-toggle:hover {
transform: rotate(180deg);
}

.update-notification {
position: fixed;
bottom: 20px;
right: 20px;
background: var(--card-bg);
padding: 1rem 1.5rem;
border-radius: 10px;
box-shadow: 0 5px 15px rgba(0,0,0,0.3);
display: flex;
align-items: center;
gap: 1rem;
z-index: 1000;
transform: translateX(200%);
transition: transform 0.5s ease;
}

.update-notification.show {
transform: translateX(0);
}

.loader {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: var(--background-color);
display: flex;
justify-content: center;
align-items: center;
z-index: 2000;
transition: opacity 0.5s ease;
}

.loader.hidden {
opacity: 0;
pointer-events: none;
}

.loader-content {
text-align: center;
}

.loader-spinner {
width: 100px;
height: 100px;
border: 5px solid var(--secondary-color);
border-top-color: var(--accent-color);
border-radius: 50%;
animation: spin 1s infinite linear;
}

@keyframes spin {
to {
transform: rotate(360deg);
}
}

.back-to-top {
position: fixed;
bottom: 20px;
right: 20px;
background: var(--button-gradient);
color: white;
width: 50px;
height: 50px;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
opacity: 0;
transition: all 0.3s ease;
z-index: 999;
}

.back-to-top.visible {
opacity: 1;
}

.back-to-top:hover {
transform: translateY(-5px);
}
</style>
</head>
<body>
<div class="loader">
<div class="loader-content">
<div class="loader-spinner"></div>
<p>Chargement de Genesis Bot...</p>
</div>
</div>

<nav class="floating-nav">
<ul>
<li><a href="#features"><i class="fas fa-star"></i>
Fonctionnalités</a></li>
<li><a href="#advanced"><i class="fas fa-rocket"></i> Avancé</a></li>
<li><a href="#guide"><i class="fas fa-book"></i> Guide</a></li>
<li><a href="#versions"><i class="fas fa-code-branch"></i>
Versions</a></li>
</ul>
</nav>

<button class="theme-toggle">
<i class="fas fa-moon"></i>
</button>

<div class="update-notification">
<i class="fas fa-bell"></i>
<div>
<h4>Nouvelle version disponible!</h4>
<p>Version 1.5.2 - Cliquez pour télécharger</p>
</div>
</div>

<div class="back-to-top">
<i class="fas fa-arrow-up"></i>
</div>

<div class="scroll-progress"></div>
<div class="particles"></div>

<header class="header">
<div class="header-content">
<h1 class="logo">GENESIS BOT</h1>
<p class="version-badge">Version 1.5.2</p>
<a href="https://discord.gg/rlbot" class="download-button">
<i class="fab fa-discord"></i> Rejoindre le Discord
</a>
</div>
</header>

<main class="container">
<section class="card fade-in">
<h2>Fonctionnalités Principales</h2>
<ul class="features-list">
<li><i class="fas fa-robot"></i> Nexto (GC) - Intelligence
artificielle de niveau Grand Champion</li>
<li><i class="fas fa-robot"></i> NextMortal (GC) - Version
optimisée pour les performances</li>
<li><i class="fas fa-robot"></i> Necto (Champ) - Bot de niveau
Champion</li>
<li><i class="fas fa-robot"></i> Element (Diamond) - Parfait pour
l'entraînement Diamond</li>
<li><i class="fas fa-robot"></i> Seer (Gold) - Intelligence adaptée
au niveau Gold</li>
<li><i class="fas fa-robot"></i> Karma (Gold) - Bot polyvalent de
niveau Gold</li>
<li><i class="fas fa-robot"></i> Bumblebee (Platinum) - Spécialiste
des aerials</li>
</ul>
</section>

<section class="card fade-in">


<h2>Fonctionnalités Avancées</h2>
<ul class="features-list">
<li><i class="fas fa-gamepad"></i> Force Jump (Simple ou Double) -
Contrôle précis des sauts</li>
<li><i class="fas fa-trophy"></i> Goal Celebration personnalisée -
Célébrez avec style</li>
<li><i class="fas fa-camera"></i> Auto BallCam intelligent - Suivi
optimal de la balle</li>
<li><i class="fas fa-car-crash"></i> Dodge Demo optimisé -
Démolitions stratégiques</li>
</ul>
</section>

<section class="card fade-in">


<h2>Guide d'Utilisation</h2>
<ul class="features-list">
<li><i class="fas fa-keyboard"></i> BallCam: Touche "Espace"
(Configurable dans rlmarlbot/main.py)</li>
<li><i class="fas fa-keyboard"></i> Jump Force Simple: Touche "U"
(Modifiable dans marlbot/nexto/bot.py)</li>
<li><i class="fas fa-keyboard"></i> Jump Force Double: Touche "I"
(Modifiable dans marlbot/nexto/bot.py)</li>
</ul>
</section>

<section class="card fade-in">


<h2>Nouveautés Version 1.5.2</h2>
<ul class="features-list">
<li><i class="fas fa-star"></i> Performances optimisées pour une
meilleure réactivité</li>
<li><i class="fas fa-bug-slash"></i> Correction de bugs
majeurs</li>
<li><i class="fas fa-plus"></i> Nouvelles fonctionnalités d'IA</li>
</ul>
</section>

<section class="card fade-in">


<h2>Prochaine Mise à Jour (1.6.0)</h2>
<ul class="features-list">
<li><i class="fas fa-comments"></i> Auto Chat intelligent -
Communication automatique</li>
<li><i class="fas fa-car-side"></i> 15 nouveaux kickoffs réalistes
- Plus de variété</li>
<li><i class="fas fa-plus-circle"></i> Nouvelles surprises à
venir</li>
</ul>
</section>

<section class="card fade-in">


<h2>Historique des Versions</h2>
<div class="versions-grid">
<a
href="https://mega.nz/file/nqxiBabb#JcAvALB55hHaydBiwtzJQkAhhTVpFyHmT5VVXCjPGq8"
class="download-button">
<i class="fas fa-download"></i> v1.5.1
</a>
<a
href="https://mega.nz/file/7rxTiK6Q#LG33KgmbDgwagQFVAKMf4IsskjrD1paaTMcjCL9wfEA"
class="download-button">
<i class="fas fa-download"></i> v1.4.0
</a>
<a href="https://mega.nz/file/SnxDTC4a#cc-
PjJIX36ptzc5HE5VgW58WIITrB-YhHnfsXmmAdqs" class="download-button">
<i class="fas fa-download"></i> v1.3.0
</a>
<a
href="https://mega.nz/file/b3giHY4D#945yYTXiygyuHXta0JJuadX_b18yn7ipwnKS9-XliT0"
class="download-button">
<i class="fas fa-download"></i> v1.2.0
</a>
<a href="https://mega.nz/file/uro2xSRR#GVC_jHwrt3emva-
LYCryFKqmfGvhtHmG05noG84tuFc" class="download-button">
<i class="fas fa-download"></i> v1.1.0
</a>
<a
href="https://mega.nz/file/mj4HBJqT#8CY5oDKLWfvSkwSN_g7a2fZ3Gnnk-TIYUjMJPKX5J6U"
class="download-button">
<i class="fas fa-download"></i> v1.0.0
</a>
</div>
</section>
</main>

<script>
window.addEventListener('load', () => {
setTimeout(() => {
document.querySelector('.loader').classList.add('hidden');
}, 1500);
});

let lastScrollY = window.scrollY;


window.addEventListener('scroll', () => {
const floatingNav = document.querySelector('.floating-nav');
if (window.scrollY > 300) {
floatingNav.classList.add('visible');
} else {
floatingNav.classList.remove('visible');
}
});

const themeToggle = document.querySelector('.theme-toggle');


themeToggle.addEventListener('click', () => {
document.body.classList.toggle('light-theme');
const icon = themeToggle.querySelector('i');
icon.classList.toggle('fa-moon');
icon.classList.toggle('fa-sun');
});

setTimeout(() => {
document.querySelector('.update-notification').classList.add('show');
}, 3000);

const backToTop = document.querySelector('.back-to-top');


window.addEventListener('scroll', () => {
if (window.scrollY > 500) {
backToTop.classList.add('visible');
} else {
backToTop.classList.remove('visible');
}
});

backToTop.addEventListener('click', () => {
window.scrollTo({
top: 0,
behavior: 'smooth'
});
});
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function (e) {
e.preventDefault();
document.querySelector(this.getAttribute('href')).scrollIntoView({
behavior: 'smooth'
});
});
});

function animateCounter(element, target) {


let current = 0;
const increment = target / 100;
const timer = setInterval(() => {
current += increment;
element.textContent = Math.floor(current);
if (current >= target) {
element.textContent = target;
clearInterval(timer);
}
}, 20);
}

const counterObserver = new IntersectionObserver((entries) => {


entries.forEach(entry => {
if (entry.isIntersecting) {
const counter = entry.target;
const target = parseInt(counter.getAttribute('data-target'));
animateCounter(counter, target);
counterObserver.unobserve(counter);
}
});
});

document.querySelectorAll('.counter').forEach(counter => {
counterObserver.observe(counter);
});

const observerOptions = {
root: null,
rootMargin: '0px',
threshold: 0.1
};

const observer = new IntersectionObserver((entries) => {


entries.forEach(entry => {
if (entry.isIntersecting) {
entry.target.classList.add('visible');
}
});
}, observerOptions);

document.querySelectorAll('.fade-in').forEach(element => {
observer.observe(element);
});

function createParticles() {
const particlesContainer = document.querySelector('.particles');
for (let i = 0; i < 50; i++) {
const particle = document.createElement('div');
particle.className = 'particle';
particle.style.width = Math.random() * 3 + 'px';
particle.style.height = particle.style.width;
particle.style.left = Math.random() * 100 + 'vw';
particle.style.animationDuration = Math.random() * 20 + 10 + 's';
particle.style.opacity = Math.random() * 0.3;
particlesContainer.appendChild(particle);
}
}

function updateScrollProgress() {
const scrollProgress = document.querySelector('.scroll-progress');
const scrollPercent = (window.scrollY) /
(document.documentElement.scrollHeight - window.innerHeight);
scrollProgress.style.transform = `scaleX(${scrollPercent})`;
}

window.addEventListener('scroll', updateScrollProgress);
createParticles();
</script>
</body>
</html>

You might also like