-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
162 lines (141 loc) · 5.9 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
162
<!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">
<title>Compare Timetables!</title>
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="base.css">
</head>
<body>
<main>
<header>
<h1>Compare Timetables</h1>
<blockquote>Now compare timetables with your classmates with ease!</blockquote>
<p>
<h2>How to use?</h2>
<ol>
<li>Copy your timetable from Vtop and paste it in the first textbox</li>
<li>Have someone send over their time table and paste in the second textbox</li>
<li>Hit submit!</li>
</ol>
<p>Check out the <a href="https://github.com/lem0n4id/compare-tt/">Github repo</a> for a visual
representation</p>
</p>
</header>
<div id="inputs">
<textarea type="text" class="inputbox" placeholder="enter your time table" id="tt1"></textarea>
<textarea type="text" class="inputbox" placeholder="enter your friend's time table" id="tt2"></textarea>
</div>
<div class="buttons">
<input type="button" value="submit" onclick="main()" />
<input type="button" value="reset" onclick="reset()" />
</div>
<div id="outputs">
<h2 id="messageHeader">
</h1>
<h3 id="messageBody"></h3>
<div>
<div id="commonClasses">
</div>
</div>
</div>
</main>
<script>
function getInputs() {
// returns the inputs given by the user
let tt1 = document.querySelector("#tt1");
let tt2 = document.querySelector("#tt2");
let table1 = tt1.value;
let table2 = tt2.value;
if (!table1 | !table2) {
alert("invalid inputs")
return
}
return [table1, table2];
}
function getTimetables(table1, table2) {
// returns 2 arrays of coursecode-venue from the given input
regexp = /([A-Z]{1,3}\d{1,2})-([A-Z])([A-Z]{3})(\d{3,4})([A-Z])-([A-Z]{2,3})-([A-Z]{2}\d)-(\d{3}[A-Z]|\d{3})-([A-Z]{3})/g;
let result1 = table1.match(regexp);
let result2 = table2.match(regexp);
var courseCodes1 = result1.map(function (e, i) {
var slotDetails = result1[i].split('-')
return slotDetails[1] + '-' + slotDetails[3] + '-' + slotDetails[4];
})
var courseCodes2 = result2.map(function (e, i) {
var slotDetails = result2[i].split('-')
return slotDetails[1] + '-' + slotDetails[3] + '-' + slotDetails[4];
})
a = [... new Set(courseCodes1)]
b = [... new Set(courseCodes2)]
return [a, b]
}
function printCommonClasses(classes) {
// uses DOM to show the output
const numberOfClasses = classes.length
// show how many classes match
var messageHeader = document.getElementById('messageHeader')
var messageHeaderText = document.createTextNode(`${numberOfClasses} classes matched`)
messageHeader.appendChild(messageHeaderText)
// longer message displayed
var messageBody = document.getElementById('messageBody')
var messageBodyText = document.createTextNode(`We found you have ${numberOfClasses} classes common with the other person`)
messageBody.appendChild(messageBodyText)
// if no common class
if (numberOfClasses == 0) return
var commonClassesDiv = document.getElementById('commonClasses')
// heading for the list
var header = document.createElement("h4").appendChild(document.createTextNode('Common classess'))
commonClassesDiv.appendChild(header)
// create ordered list element
var commonClassesList = document.createElement("ol")
commonClassesList.setAttribute("id", "commonClassesList");
commonClassesDiv.appendChild(commonClassesList);
// set list items
classes.forEach(element => {
var commonClass = document.createElement("li")
var t = document.createTextNode(element)
commonClass.appendChild(t)
document.getElementById("commonClassesList").appendChild(commonClass)
});
}
function getCommonClasses(a, b) {
// returns an array of common classes
let commonClasses = []
a.forEach(element => {
if (b.find(x => x == element)) {
classcode = element.split("-")[0]
commonClasses.push(classcode)
}
});
return commonClasses
}
function reset() {
document.getElementById('messageHeader').innerHTML = ''
document.getElementById('messageBody').innerHTML = ''
document.getElementById('commonClasses').innerHTML = ''
try {
// Something that throws exception
document.getElementById('commonClassesList').innerHTML = ''
}
catch (e) { }
}
function main() {
reset()
inputs = getInputs()
try {
// if invalid input
timetables = getTimetables(inputs[0], inputs[1])
} catch (e) {
alert('Enter proper timetable!!')
return
}
console.log(timetables)
commonClasses = getCommonClasses(timetables[0], timetables[1])
printCommonClasses(commonClasses)
}
</script>
</body>
</html>