JAVASCRIPT set alarm clock javascript - Net-Raft.com

Welcome aboard! We are happy you are here and wish you good net-raft!




Just a Web Code Solution

set alarm clock using javascript


 880

Show ResultJAVASCRIPT


2

<!DOCTYPE html>
<html>
<head>
<style>

form
{
position: absolute;
top: 50%;
left: 50%;
margin-right:-50%;
transform: translate(-50%,-50%);
}

fieldset
{
border-radius: 5px;
background-color: yellow;
}

legend
{
color: #0026ff;
font-weight: bold;
}

#alarmclock_JS
{
font-family: 'Times New Roman';
font-weight: bold;
font-size: 15px;
}

#alarmclock_JS div
{
margin-bottom: 0.8em;
}

#alarmclock_JS div.clockText
{
float: left;
width: 150px;
font-size: 13px;
font-family: 'Times New Roman';
font-size: 15px;
clear: left;
}

#alarmclock_JS span
{
margin-right: 5px;
}

</style>

<script>
var triggerAlarm={
padfield:function(f){
return (f<10)? "0" + f : f
},
Currenttime:function(){
var getDate=new Date()
var ct=this.padfield(getDate.getHours()) + ":" + this.padfield(getDate.getMinutes()) + ":"
+ this.padfield(getDate.getSeconds())
this.ctref.innerHTML=ct
this.ctref.setAttribute("title", ct)
if (typeof this.hourwake!="undefined"){ // check if alarm is set
if (this.ctref.title==(this.padfield(this.hourwake) + ":" + this.padfield(this.minutewake) + ":"
+ this.padfield(this.secondwake))){
clearInterval(triggerAlarm.timer)
window.location=document.getElementById("setMusic").value
}
}
},
setAlarm:function(){
this.hourwake=this.hourselect.value
this.minutewake=this.minuteselect.value
this.secondwake=this.secondselect.value
this.hourselect.disabled=true
this.minuteselect.disabled=true
this.secondselect.disabled=true
},
alarmAction:function(){
var getDate=new Date()
this.ctref=document.getElementById("triggerAlarm_js")
this.submitref=document.getElementById("submitBtn")
this.submitref.onclick=function(){
triggerAlarm.setAlarm()
this.value="Alarm Set"
this.disabled=true
return false
}
this.resetref=document.getElementById("resetBtn")
this.resetref.onclick=function(){
triggerAlarm.submitref.disabled=false
triggerAlarm.hourwake=undefined
triggerAlarm.hourselect.disabled=false
triggerAlarm.minuteselect.disabled=false
triggerAlarm.secondselect.disabled=false
return false
}
var selections1=document.getElementById("aHour")
var selections2=document.getElementById("aMinutes")
var selections3=document.getElementById("aSeconds")

this.hourselect=selections1
this.minuteselect=selections2
this.secondselect=selections3

for (var i=0; i<60; i++){
if (i<24) // check if within range of hours field: 0-23
this.hourselect.value=getDate.getHours()
this.minuteselect.value=getDate.getMinutes()
this.secondselect.value=getDate.getSeconds()
}
triggerAlarm.Currenttime()
triggerAlarm.timer=setInterval(function(){triggerAlarm.Currenttime()}, 1000)
}
}
</script>
</head>
<body>

<form>
<fieldset>
<legend>Javascript Alarm Clock</legend>
<div id="alarmclock_JS">
<div>
<div class="clockText">Current Time:</div> <span id="triggerAlarm_js" style="letter-spacing: 3px"></span></div>
<div style="letter-spacing: 2px">
<div class="clockText">Your Alarm:</div>
<span><input id="aHour" type="number" min="0" max="23" /> Hour</span>
<span><input id="aMinutes" type="number" min="0" max="59" /> Minutes</span>
<span><input id="aSeconds" type="number" min="0" max="59" /> Seconds</span>
</div>
<input type="text" id="setMusic" size="56" value="https://www.freespecialeffects.co.uk/soundfx/sirens/alarm_01.wav" hidden/>
<input type="submit" value="Set Alarm!" id="submitBtn" /> <input type="reset" value="Reset" id="resetBtn" />
</div>
</fieldset>
</form>

<script>
triggerAlarm.alarmAction();
</script>

</body>
</html>


By     Created   
The power of the user (%)
5%



The most helpful JAVASCRIPT solutions

How to get client machine name or computer name with javascript ?How to get client machine name or computer name with javascript ?JAVASCRIPT

Click to see more ...

  4.7K     383

get client hostname javascriptget client hostname javascriptJAVASCRIPT

Click to see more ...

  2.5K     254

detect ie javascriptdetect ie javascriptJAVASCRIPT

Click to see more ...

  1.5K     159

Create fireworks using javascriptCreate fireworks using javascriptJAVASCRIPT

Click to see more ...

  1.4K     113

create 3d barrel using javascriptcreate 3d barrel using javascriptJAVASCRIPT

Click to see more ...

  1.3K     83

get ip address javascriptget ip address javascriptJAVASCRIPT

Click to see more ...

  768     74

how to create foreach class using javascript ?how to create foreach class using javascript ?JAVASCRIPT

Click to see more ...

  739     73

create qr code javascriptcreate qr code javascriptJAVASCRIPT

Click to see more ...

  536     71

how to create the connect to a database with ADODB using javascript ?how to create the connect to a database with ADODB using javascript ?JAVASCRIPT

Click to see more ...

  475     59

get filename using javascript get filename using javascript JAVASCRIPT

Click to see more ...

  446     56