2016-11-09

Nov 9 Let's Build Something.

Please post your answers tot he November 9, "Let's Build Something" in this thread.
Best, Chris
Please post your answers tot he November 9, "Let's Build Something" in this thread. Best, Chris

-- Nov 9 Let's Build Something
<!DOCTYPE html>
<html>
<head>
    <title>09 Nov Build Something</title>
    <meta charset="utf-8" />
</head>
<body>
    <h1>Enter Email For Grand Prize Drawing</h1>
    <form>
        <label>Email
            <input type="text" id="email" />
        </label>
        <button onclick="return checkForm()">Enter</button>
    </form>
    <div id="timeMessage"></div>
    <div id="buttonMessage"></div>
    <script type="text/javascript">
        function checkForm() {
            var email = document.getElementById("email").value;
            if(email.length !== 0 && timeLeft !== 0) {
                stopTimeMessage();
                document.getElementById("buttonMessage").innerHTML = "You won the grand prize!";
                document.getElementById("timeMessage").innerHTML = "";
            }
            else if(timeLeft !== 0) {
                document.getElementById("buttonMessage").innerHTML = "Please Enter Your Email";
            }
            return false;
        }
        
        function decrementTime() {
            timeLeft = Math.max(timeLeft - 5, 0);
            document.getElementById("timeMessage").innerHTML = timeLeft + " Seconds Left!";
            if(timeLeft === 0) {
                document.getElementById("timeMessage").innerHTML = "You missed the drawing!";
                document.getElementById("buttonMessage").innerHTML = "";
                stopTimeMessage();
            }
        }
        
        function stopTimeMessage() {
            clearInterval(timeout);
        }
        
        timeLeft = 30;
        document.getElementById("timeMessage").innerHTML = timeLeft + " Seconds Left!";
        timeout = setInterval(function(){ decrementTime(); }, 5000);
    </script>
</body>
</html>
(Edited: 2016-11-09)
<pre> <!DOCTYPE html> <html> <head> <title>09 Nov Build Something</title> <meta charset="utf-8" /> </head> <body> <h1>Enter Email For Grand Prize Drawing</h1> <form> <label>Email <input type="text" id="email" /> </label> <button onclick="return checkForm()">Enter</button> </form> <div id="timeMessage"></div> <div id="buttonMessage"></div> <script type="text/javascript"> function checkForm() { var email = document.getElementById("email").value; if(email.length !== 0 && timeLeft !== 0) { stopTimeMessage(); document.getElementById("buttonMessage").innerHTML = "You won the grand prize!"; document.getElementById("timeMessage").innerHTML = ""; } else if(timeLeft !== 0) { document.getElementById("buttonMessage").innerHTML = "Please Enter Your Email"; } return false; } function decrementTime() { timeLeft = Math.max(timeLeft - 5, 0); document.getElementById("timeMessage").innerHTML = timeLeft + " Seconds Left!"; if(timeLeft === 0) { document.getElementById("timeMessage").innerHTML = "You missed the drawing!"; document.getElementById("buttonMessage").innerHTML = ""; stopTimeMessage(); } } function stopTimeMessage() { clearInterval(timeout); } timeLeft = 30; document.getElementById("timeMessage").innerHTML = timeLeft + " Seconds Left!"; timeout = setInterval(function(){ decrementTime(); }, 5000); </script> </body> </html> </pre>

-- Nov 9 Let's Build Something
<!DOCTYPE html> <html>
	<head>
		<title>Grand Prize</title>
        <meta charset="UTF-8"/>
	</head>
	
	<body>
		<h1>Enter Email for Grand Prize Drawing</h1>
		<form>
			E-mail:
			<input type="text"></input>
<input type="button" value="Enter" onclick="enterDrawing()"></input>
</form>
<div id="timeRemaining">30</div> <div id="ExtraWords"> seconds left</div> <script> var prizeTimer = setInterval(drawingUpdate, 5000); var timer = document.getElementById("timeRemaining"); function drawingUpdate(){ var timeleft = timer.innerHTML; if(timeleft <= 5) { timer.innerHTML = timeleft - 5; timer.innerHTML = "You Missed The Drawing!"; document.getElementById("ExtraWords").innerHTML = ""; clearInterval(prizeTimer); } else { timer.innerHTML = timeleft - 5; } } function enterDrawing(){ clearInterval(prizeTimer); if(timer.innerHTML > 0) { timer.innerHTML = ""; document.getElementById("ExtraWords").innerHTML = "You Won the Grand Prize"; } } </script> </body>
</html>
<!DOCTYPE html> <html> <head> <title>Grand Prize</title> <meta charset="UTF-8"/> </head> <body> <h1>Enter Email for Grand Prize Drawing</h1> <form> E-mail: <input type="text"></input><br> <input type="button" value="Enter" onclick="enterDrawing()"></input><br> </form> <br> <div id="timeRemaining">30</div> <div id="ExtraWords"> seconds left</div> <script> var prizeTimer = setInterval(drawingUpdate, 5000); var timer = document.getElementById("timeRemaining"); function drawingUpdate(){ var timeleft = timer.innerHTML; if(timeleft <= 5) { timer.innerHTML = timeleft - 5; timer.innerHTML = "You Missed The Drawing!"; document.getElementById("ExtraWords").innerHTML = ""; clearInterval(prizeTimer); } else { timer.innerHTML = timeleft - 5; } } function enterDrawing(){ clearInterval(prizeTimer); if(timer.innerHTML > 0) { timer.innerHTML = ""; document.getElementById("ExtraWords").innerHTML = "You Won the Grand Prize"; } } </script> </body> </html>

-- Nov 9 Let's Build Something
<!DOCTYPE html> <html> <head>
	<meta charset="UTF-8">
	<title>Grand Prize Drawing</title>
	<script type="text/javascript">
	var timer = setInterval(function(){
		document.getElementById("clock").innerHTML= parseInt(document.getElementById("clock").innerHTML)-5;
		if(parseInt(document.getElementById("clock").innerHTML)===0){
			clearInterval(timer);
			document.getElementById("message").innerHTML="You missed the drawing!";
		}
	},5000);
	function checkWin(){
		var clock=document.getElementById("clock");
		if(parseInt(clock.innerHTML)>0 && document.getElementById("email").value.length>0){
			document.getElementById("message").innerHTML="You won the grand prize!";
			clearInterval(timer);
			return false;
		}
		else{
			alert("Please enter your email.");
			return false;
		}
	}
	</script>
</head> <body> <h1>
	Enter Email For Grand Prize Drawing
</h1> <form>
	<label>Email<input type="text" id="email" name = "email"></label>
	<button name ="enter" onclick="return checkWin()">Enter</button>
</form> <div id="message"><span id = "clock">30</span><span>&nbspSeconds Left!</span></div> </body> </html>
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Grand Prize Drawing</title> <script type="text/javascript"> var timer = setInterval(function(){ document.getElementById("clock").innerHTML= parseInt(document.getElementById("clock").innerHTML)-5; if(parseInt(document.getElementById("clock").innerHTML)===0){ clearInterval(timer); document.getElementById("message").innerHTML="You missed the drawing!"; } },5000); function checkWin(){ var clock=document.getElementById("clock"); if(parseInt(clock.innerHTML)>0 && document.getElementById("email").value.length>0){ document.getElementById("message").innerHTML="You won the grand prize!"; clearInterval(timer); return false; } else{ alert("Please enter your email."); return false; } } </script> </head> <body> <h1> Enter Email For Grand Prize Drawing </h1> <form> <label>Email<input type="text" id="email" name = "email"></label> <button name ="enter" onclick="return checkWin()">Enter</button> </form> <div id="message"><span id = "clock">30</span><span>&nbspSeconds Left!</span></div> </body> </html>

-- Nov 9 Let's Build Something
<!DOCTYPE html> <html> <head>
	<title>Build Something</title>
</head> <body>
<h1>Enter Email For Grand Prize Drawing</h1> <label>Email:</label> <input type="textfield" id="Email" placeholder="Enter your email"> <button name="Enter" onclick="check()">Enter</button> <div id="timer"> </div> <div id="resultfield"> </div> <script type="text/javascript">
	var field = document.getElementById('resultfield');	
	var count = 30; // 30 seconds
	var timeout=setInterval(timer, 1000);
	function timer()
	{
	  count=count-1 //count down 
	   if( (count % 5) == 0){ 
	 	document.getElementById("timer").innerHTML=count + " seconds left";
		}
	  if (count <= 0)
	  {
	     clearInterval(timeout);
	     var msg= 'You missed the drawing!';
    		field.innerHTML = msg;
	     return;
	  }
	   
	}  
	function check() {
		var namefield = document.getElementById('Email').value;
		if(count < 30 && count > 0 && namefield != "") {
			
    		var msg= 'You won the grand prize!';
    		field.innerHTML = msg;
		}
		else if(namefield == ""){
			alert("Please Enter Your Email");
		}
						
	}
</script>
</body> </html>
(Edited: 2016-11-09)
<!DOCTYPE html> <html> <head> <title>Build Something</title> </head> <body> <h1>Enter Email For Grand Prize Drawing</h1> <label>Email:</label> <input type="textfield" id="Email" placeholder="Enter your email"> <button name="Enter" onclick="check()">Enter</button> <div id="timer"> </div> <div id="resultfield"> </div> <script type="text/javascript"> var field = document.getElementById('resultfield'); var count = 30; // 30 seconds var timeout=setInterval(timer, 1000); function timer() { count=count-1 //count down if( (count % 5) == 0){ document.getElementById("timer").innerHTML=count + " seconds left"; } if (count <= 0) { clearInterval(timeout); var msg= 'You missed the drawing!'; field.innerHTML = msg; return; } } function check() { var namefield = document.getElementById('Email').value; if(count < 30 && count > 0 && namefield != "") { var msg= 'You won the grand prize!'; field.innerHTML = msg; } else if(namefield == ""){ alert("Please Enter Your Email"); } } </script> </body> </html>

-- Nov 9 Let's Build Something
<!DOCTYPE html>
 <html><head><title>experiment javascript</title></head>
 <body>
 <h1>Enter Email For Grand Prize Drawing</h1>
 <label for="emailid">Email</label>
 <input type="text" name="emailid" id="emailid" />
<input type="submit" value="Enter" name="enterbutton" onclick='clockexample("clock")'/> <div id="clock" style="visibility:visible">30 Seconds Left!</div> <p id="msgid"></p> <script> var expired=false; setTimeout(clockvalidate, 30); function clockexample(clockid) { if(expired) { document.getElementId(clockid).style.visibility="hidden"; document.getElementId("msgid").innerHTML="You missed the drawing!"; } if(!expired && document.getElementById('emailid').value!=null) { document.getElementId(clockid).innerHTML="You won the grand prize!"; } else if(!expired && document.getElementById('emailid').value==null) { document.getElementId(clockid).innerHTML="Please Enter Your Email"; }
 }
 function clockvalidate()
 {
   expired=true;
 }
 </script>
 
(Edited: 2016-11-09)
<!DOCTYPE html> <html><head><title>experiment javascript</title></head> <body> <h1>Enter Email For Grand Prize Drawing</h1> <label for="emailid">Email</label> <input type="text" name="emailid" id="emailid" /><br/> <input type="submit" value="Enter" name="enterbutton" onclick='clockexample("clock")'/> <div id="clock" style="visibility:visible">30 Seconds Left!</div> <p id="msgid"></p> <script> var expired=false; setTimeout(clockvalidate, 30); function clockexample(clockid) { if(expired) { document.getElementId(clockid).style.visibility="hidden"; document.getElementId("msgid").innerHTML="You missed the drawing!"; } if(!expired && document.getElementById('emailid').value!=null) { document.getElementId(clockid).innerHTML="You won the grand prize!"; } else if(!expired && document.getElementById('emailid').value==null) { document.getElementId(clockid).innerHTML="Please Enter Your Email"; } } function clockvalidate() { expired=true; } </script>

-- Nov 9 Let's Build Something
<!DOCTYPE html> <html>
	<head><title>Let's build Something</title>
	</head>
	<script>
		$time = 30;		
		$timer = setInterval(timer, 5000);
		function checkTimer(){
			$email = document.getElementById('email');
			if($email!=""){
				divText = document.getElementById('text');
				divText.innerHTML = "You Won a Grand Prize";
				clearInterval($timer);				
			}
		}
		function timer(){
			$time =  $time-5;
			if($time != 0){
				divText = document.getElementById('text');
				divText.innerHTML = $time + " Seconds Left";
			}
			else{
				divText = document.getElementById('text');
				divText.innerHTML = " You Missed the Drawing"
			}
		}
			
	</script>
	<body>
		<h1> Enter Email For Grand Prize Drawing</h1>
		<input type="text" id ="email" placeholder ="Email">
		<button onclick="checkTimer()">Enter</button>
		<div id="text">30 Seconds left</div>
	</body>
</html>
<!DOCTYPE html> <html> <head><title>Let's build Something</title> </head> <script> $time = 30; $timer = setInterval(timer, 5000); function checkTimer(){ $email = document.getElementById('email'); if($email!=""){ divText = document.getElementById('text'); divText.innerHTML = "You Won a Grand Prize"; clearInterval($timer); } } function timer(){ $time = $time-5; if($time != 0){ divText = document.getElementById('text'); divText.innerHTML = $time + " Seconds Left"; } else{ divText = document.getElementById('text'); divText.innerHTML = " You Missed the Drawing" } } </script> <body> <h1> Enter Email For Grand Prize Drawing</h1> <input type="text" id ="email" placeholder ="Email"> <button onclick="checkTimer()">Enter</button> <div id="text">30 Seconds left</div> </body> </html>

-- Nov 9 Let's Build Something
<!DOCTYPE html> <html>
	<head>
		<title>Countdown</title>
	</head>
	<body>
		<h1>Enter Email For Grand Prize Drawing</h1>
		<label for="email">Email:</label>
		<input type="text" id="email"/>
		<button type="submit" onclick="draw()">Enter</button>
		<div id="counter"><span id="time">30</span> Seconds Left!</div>
		<script type="text/javascript">
			var time = 30;
			setInterval(function() {
				if (time <= 0) return;
				time -= 5;
				document.getElementById("time").innerHTML = time;
			}, 5000);
			function draw() {
				var email = document.getElementById("email");
				var div = document.getElementById("counter")
				if (time <= 0) {
					div.innerHTML = "You missed the drawing!";
				}
				else if (email.value == '') {
					alert("Please Enter Your Email");
				}
				else {
					div.innerHTML = "You won the grand prize!";
				}
			}
		</script>
	</body>
</html>
(Edited: 2016-11-09)
<!DOCTYPE html> <html> <head> <title>Countdown</title> </head> <body> <h1>Enter Email For Grand Prize Drawing</h1> <label for="email">Email:</label> <input type="text" id="email"/> <button type="submit" onclick="draw()">Enter</button> <div id="counter"><span id="time">30</span> Seconds Left!</div> <script type="text/javascript"> var time = 30; setInterval(function() { if (time <= 0) return; time -= 5; document.getElementById("time").innerHTML = time; }, 5000); function draw() { var email = document.getElementById("email"); var div = document.getElementById("counter") if (time <= 0) { div.innerHTML = "You missed the drawing!"; } else if (email.value == '') { alert("Please Enter Your Email"); } else { div.innerHTML = "You won the grand prize!"; } } </script> </body> </html>

-- Nov 9 Let's Build Something
<!DOCTYPE html> <html> <head>
    <script>
        var TimeLeft = 30;
        var timeout = setInterval(divPrint, 5000);
        function checkWon()
        {
            if(document.getElementById("email").value=="")
            {
                alert("Please Enter Your Email");
            }
            else
                alert("You won the grand prize!");
        }
        function divPrint()
        {
            if(TimeLeft>0)
            {
                document.getElementById('div').innerHTML= TimeLeft+"Seconds Left!";
                TimeLeft=TimeLeft-5;
            }
            else
            {
                clearInterval(timeout);
                document.getElementById('div').innerHTML="You missed the draw";
            }
        }
    </script>
</head> <body>
<h1>Enter Email For Grand Prize Drawing</h1> <label for="email">Email</label> <input type="text" id="email" value=""/> <button type="button" onclick="checkWon()">CheckWOn</button> <div id="div">
</div>
</body> </html>
<!DOCTYPE html> <html> <head> <script> var TimeLeft = 30; var timeout = setInterval(divPrint, 5000); function checkWon() { if(document.getElementById("email").value=="") { alert("Please Enter Your Email"); } else alert("You won the grand prize!"); } function divPrint() { if(TimeLeft>0) { document.getElementById('div').innerHTML= TimeLeft+"Seconds Left!"; TimeLeft=TimeLeft-5; } else { clearInterval(timeout); document.getElementById('div').innerHTML="You missed the draw"; } } </script> </head> <body> <h1>Enter Email For Grand Prize Drawing</h1> <label for="email">Email</label> <input type="text" id="email" value=""/> <button type="button" onclick="checkWon()">CheckWOn</button> <div id="div"> </div> </body> </html>

-- Nov 9 Let's Build Something
<!DOCTYPE html> <html> <head>
	<meta charset="utf-8">
</head> <body>
	<h1>Enter Email For Grand Prize Drawing</h1>
	<label for="email">Email</label>
	<input type="text" name="email" id="email">
	<button onclick="respond()">Enter</button>
	
<div id="message"> </div>
</body> <script type="text/javascript">
var secs = 30;
    setTimeout(function () {
    	if(document.getElementById("message").innerHTML != "You won the grand prize!"){
        document.getElementById("message").innerHTML = "You missed the drawing!";
    	}
    }, secs*1000);
function respond(){
	if(document.getElementById("email").value != null){
		document.getElementById("message").innerHTML = "You won the grand prize!";
	}
} </script> </html>
(Edited: 2016-11-09)
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> </head> <body> <h1>Enter Email For Grand Prize Drawing</h1> <label for="email">Email</label> <input type="text" name="email" id="email"> <button onclick="respond()">Enter</button> <br> <div id="message"> </div> </body> <script type="text/javascript"> var secs = 30; setTimeout(function () { if(document.getElementById("message").innerHTML != "You won the grand prize!"){ document.getElementById("message").innerHTML = "You missed the drawing!"; } }, secs*1000); function respond(){ if(document.getElementById("email").value != null){ document.getElementById("message").innerHTML = "You won the grand prize!"; } } </script> </html>
[ Next ]
X