Aller au contenu

Modifications pour le document Home

Modifié par Admin le 2026/05/11 09:26
Depuis la version 9.1
modifié par Admin
sur 2026/05/11 09:26
Commentaire de modification : Il n'y a aucun commentaire pour cette version
À la version 5.1
modifié par Admin
sur 2026/05/11 09:19
Commentaire de modification : Il n'y a aucun commentaire pour cette version

Résumé

Détails

Propriétés de la Page
Contenu
... ... @@ -22,15 +22,6 @@
22 22   z-index: 10;
23 23  }
24 24  
25 -.bouton-guide-multicolore.falling {
26 - animation: fall-and-bounce 1.2s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards,
27 - gradient-shift 1s ease infinite,
28 - pulse-glow 0.5s ease-in-out infinite,
29 - flash-extreme 0.3s linear infinite,
30 - rotate-fall 1.2s ease-in forwards;
31 - box-shadow: 0 0 100px rgba(102, 126, 234, 1), 0 0 200px rgba(118, 75, 162, 0.8);
32 -}
33 -
34 34  .bouton-guide-multicolore::before {
35 35   content: '';
36 36   position: absolute;
... ... @@ -42,7 +42,7 @@
42 42   animation: shine 2s linear infinite;
43 43  }
44 44  
45 -.bouton-guide-multicolore:hover:not(.falling) {
36 +.bouton-guide-multicolore:hover {
46 46   transform: translateY(-8px) scale(1.15) rotate(2deg);
47 47   box-shadow: 0 0 60px rgba(102, 126, 234, 1), 0 0 120px rgba(118, 75, 162, 0.8), 0 20px 40px rgba(0, 0, 0, 0.5);
48 48   animation: gradient-shift 1s ease infinite, pulse-glow 0.5s ease-in-out infinite, flash-extreme 0.3s linear infinite, shake 0.5s ease infinite;
... ... @@ -52,43 +52,6 @@
52 52   transform: translateY(-3px) scale(1.1);
53 53  }
54 54  
55 -/* Animation de chute */
56 -@keyframes fall-and-bounce {
57 - 0% {
58 - transform: translateY(0) scale(1);
59 - }
60 - 40% {
61 - transform: translateY(calc(100vh - 200px)) scale(1.1, 0.9);
62 - }
63 - 50% {
64 - transform: translateY(calc(100vh - 200px)) scale(1.1, 0.9);
65 - }
66 - 65% {
67 - transform: translateY(calc(100vh - 350px)) scale(0.95, 1.05);
68 - }
69 - 75% {
70 - transform: translateY(calc(100vh - 200px)) scale(1.05, 0.95);
71 - }
72 - 85% {
73 - transform: translateY(calc(100vh - 250px)) scale(0.98, 1.02);
74 - }
75 - 95% {
76 - transform: translateY(calc(100vh - 200px)) scale(1.02, 0.98);
77 - }
78 - 100% {
79 - transform: translateY(calc(100vh - 200px)) scale(1);
80 - }
81 -}
82 -
83 -@keyframes rotate-fall {
84 - 0% {
85 - transform: rotate(0deg);
86 - }
87 - 100% {
88 - transform: rotate(720deg);
89 - }
90 -}
91 -
92 92  /* Cercles hypnotiques */
93 93  .hypnotic-circle {
94 94   position: absolute;
... ... @@ -239,25 +239,6 @@
239 239   align-items: center;
240 240   justify-content: center;
241 241  }
242 -
243 -.sound-control {
244 - position: fixed;
245 - bottom: 20px;
246 - right: 20px;
247 - background: rgba(102, 126, 234, 0.8);
248 - color: white;
249 - border: none;
250 - padding: 10px 20px;
251 - border-radius: 30px;
252 - cursor: pointer;
253 - font-size: 16px;
254 - z-index: 1000;
255 - box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
256 -}
257 -
258 -.sound-control:hover {
259 - background: rgba(118, 75, 162, 0.9);
260 -}
261 261  </style>
262 262  
263 263  <div class="bouton-container">
... ... @@ -272,126 +272,8 @@
272 272   <div class="ray"></div>
273 273   </div>
274 274  
275 - <a href="https://epn.doc.decalog.net/wiki/epn/view/Guide%20administrateur%20%26%20utilisateur/" class="bouton-guide-multicolore" id="hypnoticButton">
210 + <a href="https://epn.doc.decalog.net/wiki/epn/view/Guide%20administrateur%20%26%20utilisateur/" class="bouton-guide-multicolore">
276 276   Guide Administrateur & Utilisateur
277 277   </a>
278 -
279 - <button class="sound-control" id="soundToggle">🔊 Son ON</button>
280 280  </div>
281 -
282 -<script>
283 -// Création du contexte audio
284 -const audioContext = new (window.AudioContext || window.webkitAudioContext)();
285 -let oscillator = null;
286 -let gainNode = null;
287 -let isPlaying = false;
288 -let currentDuration = 0.1; // Durée normale de chaque "tu"
289 -let patternTimeout = null;
290 -
291 -function playTututu() {
292 - if (oscillator) return; // Déjà en train de jouer
293 -
294 - oscillator = audioContext.createOscillator();
295 - gainNode = audioContext.createGain();
296 -
297 - oscillator.connect(gainNode);
298 - gainNode.connect(audioContext.destination);
299 -
300 - // Fréquence pour le son "tu"
301 - oscillator.frequency.value = 800;
302 - oscillator.type = 'square'; // Son électronique
303 -
304 - // Volume
305 - gainNode.gain.value = 0.1;
306 -
307 - oscillator.start();
308 - isPlaying = true;
309 -
310 - // Créer l'effet tututututu en modulant la fréquence
311 - schedulePattern();
312 -}
313 -
314 -function schedulePattern() {
315 - if (!isPlaying) return;
316 -
317 - const pattern = [800, 900, 800, 950, 800, 900, 800, 1000];
318 - let time = audioContext.currentTime;
319 -
320 - pattern.forEach((freq, index) => {
321 - if (oscillator) {
322 - oscillator.frequency.setValueAtTime(freq, time + (index * currentDuration));
323 - }
324 - });
325 -
326 - patternTimeout = setTimeout(schedulePattern, pattern.length * currentDuration * 1000);
327 -}
328 -
329 -function stopSound() {
330 - if (oscillator) {
331 - isPlaying = false;
332 - oscillator.stop();
333 - oscillator.disconnect();
334 - oscillator = null;
335 - gainNode.disconnect();
336 - gainNode = null;
337 - }
338 - if (patternTimeout) {
339 - clearTimeout(patternTimeout);
340 - patternTimeout = null;
341 - }
342 -}
343 -
344 -function speedUpSound() {
345 - currentDuration = 0.03; // Super rapide au survol !
346 -}
347 -
348 -function normalizeSound() {
349 - currentDuration = 0.1; // Vitesse normale
350 -}
351 -
352 -// Contrôle du bouton
353 -const soundToggle = document.getElementById('soundToggle');
354 -const hypnoticButton = document.getElementById('hypnoticButton');
355 -let soundEnabled = true;
356 -let hasFallen = false;
357 -
358 -soundToggle.addEventListener('click', function() {
359 - soundEnabled = !soundEnabled;
360 - if (soundEnabled) {
361 - playTututu();
362 - soundToggle.textContent = '🔊 Son ON';
363 - } else {
364 - stopSound();
365 - soundToggle.textContent = '🔇 Son OFF';
366 - }
367 -});
368 -
369 -// Événements de survol pour accélérer le son ET faire tomber le bouton
370 -hypnoticButton.addEventListener('mouseenter', function() {
371 - if (soundEnabled && isPlaying) {
372 - speedUpSound();
373 - }
374 -
375 - // Faire tomber le bouton !
376 - if (!hasFallen) {
377 - hypnoticButton.classList.add('falling');
378 - hasFallen = true;
379 -
380 - // Réinitialiser après l'animation
381 - setTimeout(() => {
382 - hypnoticButton.classList.remove('falling');
383 - hasFallen = false;
384 - }, 1200);
385 - }
386 -});
387 -
388 -hypnoticButton.addEventListener('mouseleave', function() {
389 - if (soundEnabled && isPlaying) {
390 - normalizeSound();
391 - }
392 -});
393 -
394 -// Démarrer automatiquement le son
395 -playTututu();
396 -</script>
397 397  {{/html}}