-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
161 lines (139 loc) · 6.11 KB
/
index.html
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
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>AttendanceTracker</title>
</head>
<body>
<h1>12J Attendance Tracker</h1>
<table id="attendance-table" class="attendance-table"></table>
<input type="text" id="time-input" placeholder="8:00am to 8:40am">
<input type="text" id="teacher-input" placeholder="Milton Saha">
<input type="text" id="subject-input" placeholder="Maths">
<input type="text" id="topic-input" placeholder="Topics taught">
<div class="buttons">
<input type="submit" id='submit-button' value="Update details">
<input type="submit" id='copy-button' value="Copy details">
</div>
<div id="attendance-display"></div>
<script>
// Get current date and time
const today = new Date();
const date = `${today.getDate()}.${today.getMonth() + 1}.${today.getFullYear()}`;
// Fill in class and teacher information
const classAndSection = 'XII J';
let time = '';
let teacher = '';
let subject = '';
let topic = '';
// Initialize attendance counts
let total = 40;
let present = 0;
let absent = 0;
let absentees = [];
const rong = ['#81fc716e', '#ff4b4b6e']
// Add event listeners to attendance cells
const attendanceTable = document.getElementById('attendance-table');
attendanceTable.addEventListener('click', (event) => {
if (event.target.matches('.attendance-cell')) {
if (event.target.textContent === 'Absent') {
event.target.textContent = 'Present';
event.target.style.backgroundColor = rong[0];
present++;
absent--;
const index = absentees.indexOf(event.target.parentNode.firstChild.textContent);
if (index > -1) {
absentees.splice(index, 1);
}
} else {
event.target.textContent = 'Absent';
event.target.style.backgroundColor = rong[1];
present--;
absent++;
absentees.push(event.target.parentNode.firstChild.textContent);
}
updateAttendanceSummary();
}
});
const submitButton = document.getElementById('submit-button');
submitButton.addEventListener('click', updateClassDetails);
const copyButton = document.getElementById('copy-button');
copyButton.addEventListener('click', copyAttendanceDisplay);
function updateClassDetails() {
const teacherField = document.getElementById('teacher-input');
const subjectField = document.getElementById('subject-input');
const timeField = document.getElementById('time-input');
const topicField = document.getElementById('topic-input');
teacher = teacherField.value || '';
subject = subjectField.value || '';
time = timeField.value || '';
topic = topicField.value || '';
updateAttendanceSummary();
}
function copyAttendanceDisplay() {
// Get the attendance summary element
const summaryElement = document.getElementById('attendance-display');
// Create a range object for the summary element
const range = document.createRange();
range.selectNode(summaryElement);
// Select the contents of the range
const selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);
// Copy the selection to the clipboard
document.execCommand('copy');
// Deselect the range
selection.removeAllRanges();
}
// Update attendance summary
function updateAttendanceSummary() {
total = present + absent;
const attendanceSummary = `Date: ${date}\nTime: ${time}\nClass and section: ${classAndSection}\nTeacher: ${teacher}\nSubject: ${subject}\nTopic: ${topic}\nTotal: ${total}\nPresent: ${present}\nAbsent: ${absent}\n\nNames of absentees:\n${absentees.sort().join('\n')}`;
const attendanceDisplay = document.getElementById('attendance-display')
attendanceDisplay.textContent=attendanceSummary
console.log(attendanceSummary);
}
// Export attendance data to CSV file
function exportAttendanceData() {
const rows = attendanceTable.querySelectorAll('tr');
let csv = 'Name,Present/Absent\n';
for (let i = 1; i < rows.length; i++) {
const name = rows[i].firstChild.textContent;
const attendance = rows[i].querySelector('.attendance-cell').textContent;
csv += `${name},${attendance}\n`;
}
const csvBlob = new Blob([csv], { type: 'text/csv;charset=utf-8;' });
const url = URL.createObjectURL(csvBlob);
const downloadLink = document.createElement('a');
downloadLink.href = url;
downloadLink.download = `attendance-${date}.csv`;
downloadLink.click();
}
// Initialize attendance table
function initializeAttendanceTable() {
const attendanceTable = document.getElementById('attendance-table');
const names = ['Abhinaba Chowdhury', 'Abhinanda Chowdhury', 'Aditya Bothra', 'Ambarish Basu', 'Archisman Das', 'Aric Maji', 'Arin Biswas', 'Aritra Roy', 'Arkaprobho Sinha Roy', 'Aryan Mukherjee', 'Ayush Bhakta', 'Ayushmaan Chakravarty Bhattacharya', 'Dhanish Shah', 'Dibyadipan Bhattacharya', 'Hiya Samanta', 'Kairav Nandi', 'Lolit Bairiganjan', 'Muhammad Raza Khan', 'Naireet Sadhukhan', 'Partha Sarathi Malakar', 'Priyangshu Chakraborty', 'Pubali Dutta', 'Rajnandini Sen', 'Riddhi Shukla', 'Sagnik Mukherjee', 'Satyam Singh', 'Saunak Chanda', 'Sayan Das Dey', 'Shiven Thakker', 'Sneha Paul', 'Snehal Rakshit', 'Soham Ghosh', 'Soumyadeep Mukherjee', 'Sreeparni Bhowmik', 'Srijita Roychowdhury', 'Suchitrak Bandyopadhyay', 'Supratik Biswas', 'Trisha Chatterjee', 'Ved Chattopadhyay', 'Vritaant Bajaj', 'Zinnia Bag'];
for (let i = 0; i < names.length; i++) {
const row = document.createElement('tr');
const nameCell = document.createElement('td');
nameCell.textContent = names[i];
row.appendChild(nameCell);
const attendanceCell = document.createElement('td');
attendanceCell.classList.add('attendance-cell');
attendanceCell.textContent = 'Absent';
row.appendChild(attendanceCell);
attendanceTable.appendChild(row);
absentees.push(names[i])
absent++;
}
// updateClassDetails();
updateAttendanceSummary();
}
// Call the initializeAttendanceTable function to set up the table
initializeAttendanceTable();
</script>
</body>
</html>