-
Notifications
You must be signed in to change notification settings - Fork 0
/
alarms.js
129 lines (103 loc) · 4.04 KB
/
alarms.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
// variables
let alarmListArr = [];
const selectMenu = document.querySelectorAll("select");
const setAlarmBtn = document.querySelector("#btn-setAlarm");
let alarmCount = 0;
let alarmTime;
let ring = document.querySelector("#ring");
// Script for Time and Date
console.log("alarmTime");
function updateClock(){
var now = new Date();
var dname = now.getDay(),
mo = now.getMonth(),
dnum = now.getDate(),
yr = now.getFullYear(),
hou = now.getHours(),
min = now.getMinutes(),
sec = now.getSeconds(),
pe = "AM";
//console.log(now.getDate());
// console.log(now.getMonth());
// console.log(now.getFullYear());
//console.log(now.getMinutes());
// console.log(now.getTime());
// console.log(now.setTime());
// console.log(now.toLocaleTimeString());
if(hou==0){
hou = 12;
}
if(hou>12){
hou -=12;
pe = "PM";
}
Number.prototype.pad = function(digits){
for(var n = this.toString(); n.length<digits; n=0+n);
return n;
}
var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
var week = ["Sunday", "Monday", "Tusday", "Wednesday", "Thursday", "Friday", "Saturday"];
var ids =["dayName", "month", "dayNum", "year", "hour", "minutes", "seconds", "period"];
var values = [week[dname], months[mo], dnum.pad(2),yr,hou.pad(2),min.pad(2),sec.pad(2),pe];
// console.log(week[3]);
for(var i=0; i<ids.length;i++){
document.getElementById(ids[i]).firstChild.nodeValue = values[i];
}
for(let i=0; i<alarmListArr.length;i++){
if(alarmListArr[i]==`${hou.pad(2)}:${min.pad(2)}:${sec.pad(2)} ${pe}`){
console.log("Alarm ringing...");
ring.load();
ring.play();
document.querySelector("#stopAlarm").style.visibility= "visible";
}
}
}
function initClock() {
updateClock();
window.setInterval("updateClock()",1000);
}
for(let i=12; i>0;i--){
i=i<10 ? "0"+i :i;
let option = `<option value="${i}">${i}</option>`;
selectMenu[0].firstElementChild.insertAdjacentHTML("afterend", option);
}
for(let i=59; i>=0;i--){
i=i<10 ? "0"+i :i;
let option = `<option value="${i}">${i}</option>`;
selectMenu[1].firstElementChild.insertAdjacentHTML("afterend", option);
}
for(let i=2; i>0;i--){
let ampm = i== 1? "AM":"PM";
let option = `<option value="${ampm}">${ampm}</option>`;
selectMenu[2].firstElementChild.insertAdjacentHTML("afterend", option);
}
//add alarm
function setAlarm(){
document.querySelector("#alarm-h3").innerText = "Alarms";
let time = `${selectMenu[0].value}:${selectMenu[1].value}:00 ${selectMenu[2].value}`;
if(time.includes("setHour") || time.includes("setMinute") || time.includes("AM/PM")){
alert("Please, Select Valide Input");
}else{
alarmCount++;
document.querySelector(".alarmList").innerHTML += `
<div class="alarmLog" id="alarm${alarmCount}">
<span id="span${alarmCount}">${time}</span>
<button class="btn-delete" id="${alarmCount}" onClick="deleteAlarm(this.id)">Delete</button>
</div>`;
alarmTime = `${selectMenu[0].value}:${selectMenu[1].value}:00 ${selectMenu[2].value}`;
alarmListArr.push(alarmTime);
console.log(document.querySelector(".btn-delete").value);
}
}
setAlarmBtn.addEventListener("click",setAlarm);
//delete alarm
function deleteAlarm(click_id){
var element = document.getElementById("alarm"+click_id);
var deleteIndex = alarmListArr.indexOf(document.querySelector("#span"+click_id).innerText);
alarmListArr.splice(deleteIndex,1);
element.remove();
}
function stopAlarm(){
ring.pause();
document.querySelector("#stopAlarm").style.visibility= "hidden";
}