<!-- 
                  ....,;;::;;,'.....                                                .....',;;:::;;'...                  
               ..':ok0KXNNNNXK0Okdl:,...                                        ...,:ldkO0KXNNNNNXK0ko:'..              
            ..'cxKNMMMMMMMMMMMMMMMWNXOdc,..                                  ..,cdOKNWHELLOMDIGGERSMMMMWNKxc'.            
          ..,o0NMMMMMMMMMMMMMMMMMMMMMMMNKx:..                             ..'cxKWMMMMMMMMMMMMMMMMMMMMMMMMN0l'.          
         .'l0WMMMMMMMMMMMMMMMMMMMMMMMMMMMWXx:..                          .'cONWMMMMMMMMMMMMMMMMMMMMMMMMMMMMWOc..        
        .;xNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMWKo,.                       ..;kNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMXd'.       
      ..:OWMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMNx,..                    ..c0WMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMNd'.      
      .;OWMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMNx,.                   ..:0WMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMXl..     
     .'dNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMXo..                  .,xWMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMO;.     
     .:0MMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMO;.                 ..cKMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMXc.     
    ..lXMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMKc..                ..lXMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMNo..    
    ..oNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMXl..                ..lXMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMNo..    
    ..lXMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMKc..                ..:0MMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMXc.     
     .cKMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMWk,.                  .,dNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMO;.     
     .,kWMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMKc..                  ..;kWMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMNo..     
     ..lXMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMWKl..                    ..;kNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMWO;.      
      .'dNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMNO:..                      ..,oKWMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMW0:..      
       .,xNMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMWKo,..                         ..:kXMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMW0c..       
        .,dXMMMMMMMMMMMMMMMMMMMMMMMMMMMMWKd;..                             .'ckXWMMMMMMMMMMMMMMMMMMMMMMMMMMNO:..        
         ..cONMMMMMMMMMMMMMMMMMMMMMMMMN0o;..                                ..':xKWMMMMMMMMMMMMMMMMMMMMMMWKo,.          
           .'ckKWMMMMMMMMMMMMMMMMMWN0d:'..                                     ..,lkKWMMMMMMMMMMMMMMMMWXOo,..           
             ..,cdk0KXNNNWWWNNXKOxo:'..                                           ..,cdk0XNNWWWWNNXKOxl;..              
                ....',;::::::;,'...                                                  ...',;::cc::;,'...                 
                                                                                                                        
                                                                                                                        
                                                                                                                        
                                                                                                                        
        .,ldxxxdo;.    .:odxxxoc'                   .lddl.     ,oo'    'od:.   .cdc.    ;odo;    .:oo,    .cdl.         
      .:0WN0xodxOl.  .cKWXOddxKWNx.                .xWNNWd.    :XMx.  .kMMX:   :XMx.   ;XWNWK;    ,0WK:  .xWNl.         
      lNMK:.         cNM0;    .xWWk.               lNNooNXc    .xMX;  cNNXWk. .xMX:   .OWOcOWO.    ,OWK:'xWXl           
     .OMNc  '::::;. .kMWo      ,KMX;              ;KWx..kW0,    :XWx..kWkoXNc ;XWx.  .dWX: :XWd.    'OWXXWXc            
     .OMX:  l0KNMK; .kMWl      ,0MX;             .kMNx;:kWWx;.  .xWK:cNX;.xWk,dWX;   cXMKl;lKMXc     .kWMX:             
     .dWWx.  .,OMX;  oWMO'    .oNMO.            .dWWNKKKKNWNXl   :XWO0Wx. :XXOKWx.  ,0MWXKKKXWM0,     cNMk.             
      .xNW0oc:oKMX;  .dNW0occlkNWO,  .lxl.      :XMO;....:0MMK;  .xWWWK;  .xWWMK;  .xWNd.....oNWx.    cNMx.    .cxo.    
       .;ok0000Okl.    ,ok0000Od:.   'x0d.     .lOk;      :kOOc.  ,xOOl.   ,xOOl.  ,xOo.     .oOx,    ,kOc.    .d0k'    
            ...            ...         .                                                                         .      
 -->



<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>help</title>
	<link rel="stylesheet" type="text/css" href="style/style.css">
	<link rel="icon" href="favicon.ico">
	<link rel="prefetch" href="medias/lights-on-wall.png" />
</head>
<body>
	<div id="lampe-torche"></div>

	<div class="neon"></div>

	<section class="switch" onclick="allum()"></section>

	<div class="loader">
		<img src="medias/eyes.png" alt="">
		
		<div class="howto">
			<article>
				<p>We recommand using headphones<br>for a better experience</p>
				<img class="howto-img" src="medias/headphones.png" alt="headphones">
			</article>
			<article>
				<p>Search for<br>interactive objects</p>
				<img class="howto-img" src="medias/mouse.png" alt="mouse">
			</article>
		</div>
		<p class="mobile">Please visit the website on a larger screen</p>
		<div id='loader'><span>L</span><span>O</span><span>A</span><span>D</span><span>I</span><span>N</span><span>G</span></div>
		<div class="buttons">
			<div class="btn-start"><p onclick="start();">JUMP IN</p></div>
			<div class="btn-about"><a href="https://www.disorders-release.com/">MINT</a></div>
			<div class="btn-about"><a href="project.html">ABOUT</a></div>
		</div>
	</div>
	
	<section class="landing">
		<div class="eyes">
			<img src="medias/left-eye.svg" class="left" alt="left eye">
			<img src="medias/right-eye.svg" class="right" alt="right eye">
		</div>
	</section>

	<section class="polaroids">
		<div class="polaroid note2">
			<img src="medias/note2.png" alt="???" />
		</div>

		<div class="polaroid note-welcome">
			<img src="medias/welcome-note.png" alt="?????" />
		</div>

		<div class="polaroid patient-zero">
			<img src="medias/note-patient-zero.png" alt="patient zero room 2301" />
		</div>

		<div class="polaroid polaroid2">
			<img src="medias/sneak-peek-2.png" alt="patient #2348" />
			<p>
				Patient #????
			</p>
		</div>
		
		<div class="polaroid">
			<img src="medias/sneak-peek-1.png" alt="patient #2348" />
			<p>
				Patient #????
			</p>
		</div>

		<div class="polaroid sept12news">
			<img src="medias/sept12newspaper.png" alt="september 12 ?????" />
		</div>

		<div class="polaroid polaroid3">
			<img src="medias/sneak-peek-3.png" alt="patient #2348" />
			<p>
				Patient #????
			</p>
		</div>

	</section>

	<section class="links1">
		<div>
			<div class="btn-mute" onclick="mute()"></div>
			<a href="https://twitter.com/disordersNFT" target="_blank"><img src="medias/twitter.png" alt="twitter link"></a>
			<a href="https://discord.gg/up6VtQMsxn" target="_blank"><img src="medias/discord.png" alt="discord link"></a>
			<a href="https://www.instagram.com/disordersnft/" target="_blank"><img src="medias/instagram.png" alt="instagram link"></a>
			<a href="https://www.muse.place/soldisorders" target="_blank"><img src="medias/muse.png" alt="muse link"></a>

		</div>
		<p>Music by <a href="https://www.youtube.com/watch?v=VagES3pxttQ" target="_blank">Lucas King</a></p>
		
	</section>

	<p class="scrolling-too-much" style="top: 3000px;">GO UP</p>
	<p class="scrolling-too-much" style="top: 5000px;">STOP</p>
	<p class="scrolling-too-much" style="top: 7000px;">JUST LISTEN OK</p>
	<p class="scrolling-too-much" style="top: 9000px;">YOU'RE LOOSING YOUR TIME</p>


	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
	<script type="text/javascript" src="https://www.google.com/jsapi"></script>

	<script src="script/polaroid.js"></script>
	<script>

		const ambiance = new Audio("sounds/ambiance.mp3");
		const whispers = new Audio("sounds/whispers.mp3");
		const clignsound = new Audio("sounds/clign.mp3");

		var isPlaying = true;
		$("#lampe").css("opacity","0");
		
		setTimeout(function() {
			$("#loader").remove();
			$(".btn-start").css("opacity", "1");
			$(".btn-about").css("opacity", "1");
		}, 6000);



		function start(){
			$(".loader").fadeOut(1000);
			$("#lampe").css("opacity","1");


			whispers.play();
			$(".loader").remove();
		}



		function update(e){
			var x = e.clientX || e.touches[0].clientX
			var y = e.clientY || e.touches[0].clientY

			document.getElementById('lampe-torche').style.setProperty('--cursorX', x + 'px')
			document.getElementById('lampe-torche').style.setProperty('--cursorY', y + 'px')
		}

		document.addEventListener('mousemove',update);
		document.addEventListener('touchmove',update);


		function allum(){
			$(".switch").remove();
			
			whispers.pause();
			ambiance.play();
			
			$(".neon").toggleClass("cligno")
			$("body").toggleClass("lights-on");

			setTimeout(function() {
				$(".neon").removeClass("cligno");
				
			}, 2000);
		}

		function mute(){
			$(".btn-mute").toggleClass("muted");
			if (!isPlaying) {
          // Not playing, let's play
          isPlaying = true;
          ambiance.play();
      } else {
          // Stop the music
          isPlaying = false;
          ambiance.pause();
      }
		}

		function randRange(data) {
			var newTime = data[Math.floor(data.length * Math.random())];
			return newTime;
		}

		function clignot() {
			var timeArray = new Array(8000, 12000, 15000, 23000);

			// do stuff, happens to use jQuery here (nothing else does)
			$(".neon").addClass("off");
			clignsound.play();
			setTimeout(function() {
				$(".neon").removeClass("off");
				
			}, 200);

			clearInterval(timer);
			timer = setInterval(clignot, randRange(timeArray));
		}

		var timer = setInterval(clignot, 1000);
		// 1000 = Initial timer when the page is first loaded

	</script>
</body>
</html>