diff --git a/effect.js b/effect.js
index 8c7bdf2..1b5a51f 100644
--- a/effect.js
+++ b/effect.js
@@ -1,4 +1,60 @@
+const disk = document.getElementById('profile');
+const audio = document.getElementById('disk-audio');
+
+let hovering = false;
+let startTime = 0;
+let speedInterval = null;
+
+// On page load, try to prime the audio.
+window.addEventListener('load', () => {
+ // Start playing the audio muted to force loading and decoding.
+ audio.muted = true;
+ audio.play().then(() => {
+ // Immediately pause so it doesn't actually play muted.
+ audio.pause();
+ audio.muted = false;
+ audio.currentTime = 0; // Reset to start if desired.
+ console.log("Audio primed and ready.");
+ }).catch(err => {
+ // If this fails (due to browser policies), we'll still try on hover.
+ console.log("Could not prime audio:", err);
+ });
+});
+
+disk.addEventListener('mouseenter', () => {
+ hovering = true;
+ startTime = Date.now();
+
+ // Play the audio if not already playing
+ if (audio.paused) {
+ audio.currentTime = 0; // Start from beginning if desired
+ audio.play().catch(err => {
+ console.log('Playback blocked:', err);
+ });
+ }
+
+ speedInterval = setInterval(() => {
+ if (!hovering) return;
+ const elapsedSeconds = (Date.now() - startTime) / 1000;
+ const newDuration = Math.max(0.2, 2 - 0.2 * elapsedSeconds);
+ disk.style.animationDuration = newDuration + 's';
+ }, 100);
+});
+
+disk.addEventListener('mouseleave', () => {
+ hovering = false;
+ clearInterval(speedInterval);
+ disk.style.animationDuration = '2s';
+
+ // Pause the audio when the mouse leaves
+ audio.pause();
+});
+
+
+
+
// Get the theme switch checkbox
+
const themeSwitch = document.getElementById('theme-switch');
// Function to set the theme
@@ -27,4 +83,8 @@ themeSwitch.addEventListener('change', (e) => {
const isDark = !e.target.checked; // Light mode when checked
setTheme(isDark);
localStorage.setItem('theme', isDark ? 'dark' : 'light'); // Save preference
-});
\ No newline at end of file
+});
+
+
+
+
diff --git a/index.html b/index.html
index 4f70d8b..36e0e7b 100644
--- a/index.html
+++ b/index.html
@@ -3,7 +3,7 @@
-v
+
Corentin
-
Caillot Corentin
-
+
-
@@ -171,4 +167,4 @@ v
+
\ No newline at end of file
diff --git a/music/still_standing.mp3 b/music/still_standing.mp3
new file mode 100644
index 0000000..168ac08
Binary files /dev/null and b/music/still_standing.mp3 differ
diff --git a/style.css b/style.css
index 8d10c11..f185bfe 100644
--- a/style.css
+++ b/style.css
@@ -31,6 +31,22 @@ aside {
border: 3px solid #fff; /* Dark line around the profile */
}
+@keyframes spin {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+}
+
+/* Initial spin: 2 seconds per rotation */
+#profile:hover {
+ animation: spin 2s linear infinite;
+ transition: animation-duration 0.2s linear;
+ transform-origin: center center;
+}
+