refactoring and basic utplanner working
This commit is contained in:
Sriram Hariharan
@@ -31,6 +31,7 @@
|
||||
animation: spin 2s linear infinite;
|
||||
}
|
||||
|
||||
|
||||
@keyframes spin {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
@@ -73,10 +74,16 @@
|
||||
|
||||
.dateTimePlace {
|
||||
margin-left: 5px;
|
||||
margin-bottom: 0px;
|
||||
font-size: smaller;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#chartcontainer {
|
||||
max-width: 100%;
|
||||
height: 250px;
|
||||
}
|
||||
|
||||
#chart {
|
||||
min-width: auto;
|
||||
max-width: 100%;
|
||||
|
||||
2
js/config.js
Normal file
2
js/config.js
Normal file
@@ -0,0 +1,2 @@
|
||||
const fadetime = 150;
|
||||
const butdelay = 75;
|
||||
151
js/content.js
151
js/content.js
@@ -1,4 +1,3 @@
|
||||
var grades;
|
||||
var rmpLink;
|
||||
var next;
|
||||
var bottom;
|
||||
@@ -20,15 +19,7 @@ var semesterCode;
|
||||
var isIndividual = false;
|
||||
var done = true;
|
||||
|
||||
const days = new Map([
|
||||
["M", "Monday"],
|
||||
["T", "Tuesday"],
|
||||
["W", "Wednesday"],
|
||||
["TH", "Thursday"],
|
||||
["F", "Friday"]
|
||||
]);
|
||||
const fadetime = 150;
|
||||
const butdelay = 75;
|
||||
|
||||
//This extension may be super lit, but you know what's even more lit?
|
||||
//Matthew Tran's twitter and insta: @MATTHEWTRANN and @matthew.trann
|
||||
|
||||
@@ -209,7 +200,7 @@ function loadNextPages() {
|
||||
nextpage.find('tbody>tr').each(function () {
|
||||
let hasCourseHead = $(this).find('td').hasClass("course_header");
|
||||
if (!(hasCourseHead && $(this).has('th').length == 0)) {
|
||||
$(this).append(`<td data-th="Plus"><input type="image" class="distButton" id="distButton" style="vertical-align: bottom; display:block;" width="20" height="20" src='${chrome.extension.getURL('images/disticon.png')}'/></td>`);
|
||||
$(this).append(`<td data-th="Plus"><input type="image" class="distButton" id="distButton" style="vertical-align: bottom;" width="20" height="20" src='${chrome.extension.getURL('images/disticon.png')}'/></td>`);
|
||||
// if ($(this).find('td[data-th="Status"]').text().includes('waitlisted')) {
|
||||
// $(this).find('td').each(function () {
|
||||
// $(this).css('background-color', '#E0E0E0');
|
||||
@@ -456,7 +447,6 @@ function getDistribution(sem) {
|
||||
query += "and sem like '%" + sem + "%'";
|
||||
}
|
||||
query += "order by a1+a2+a3+b1+b2+b3+c1+c2+c3+d1+d2+d3+f desc";
|
||||
alert(query)
|
||||
chrome.runtime.sendMessage({
|
||||
command: "gradesQuery",
|
||||
query: query
|
||||
@@ -494,35 +484,11 @@ function openDialog(dep, cls, sem, professor, res) {
|
||||
var data;
|
||||
$("#semesters").empty();
|
||||
if (typeof res == 'undefined' || profname == "") {
|
||||
data = [];
|
||||
$("#semesters").append("<option>No Data</option>")
|
||||
data = [];
|
||||
} else {
|
||||
var semesters = res.values[0][18].split(",");
|
||||
semesters.sort(function (a, b) {
|
||||
var as = a.split(' ')[0];
|
||||
var ay = parseInt(a.split(' ')[1]);
|
||||
var bs = b.split(' ')[0];
|
||||
var by = parseInt(b.split(' ')[1]);
|
||||
if (ay < by) {
|
||||
return -1;
|
||||
}
|
||||
if (ay > by) {
|
||||
return 1;
|
||||
}
|
||||
var seas = {
|
||||
"Spring": 0,
|
||||
"Fall": 1,
|
||||
"Summer": 2,
|
||||
"Winter": 3
|
||||
}
|
||||
if (seas[as] < seas[bs]) {
|
||||
return -1;
|
||||
}
|
||||
if (seas[as] > seas[bs]) {
|
||||
return 1;
|
||||
}
|
||||
return 0;
|
||||
});
|
||||
semesters.sort(semesterSort);
|
||||
semesters.reverse().unshift('Aggregate');
|
||||
var sems = [];
|
||||
for (var i = 0; i < semesters.length; i++) {
|
||||
@@ -575,112 +541,7 @@ function close() {
|
||||
|
||||
function setChart(data) {
|
||||
//set up the chart
|
||||
chart = Highcharts.chart('chart', {
|
||||
chart: {
|
||||
type: 'column',
|
||||
backgroundColor: ' #fefefe',
|
||||
spacingLeft: 10
|
||||
},
|
||||
title: {
|
||||
text: null
|
||||
},
|
||||
subtitle: {
|
||||
text: null
|
||||
},
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
xAxis: {
|
||||
title: {
|
||||
text: 'Grades'
|
||||
},
|
||||
categories: [
|
||||
'A',
|
||||
'A-',
|
||||
'B+',
|
||||
'B',
|
||||
'B-',
|
||||
'C+',
|
||||
'C',
|
||||
'C-',
|
||||
'D+',
|
||||
'D',
|
||||
'D-',
|
||||
'F'
|
||||
],
|
||||
crosshair: true
|
||||
},
|
||||
yAxis: {
|
||||
min: 0,
|
||||
title: {
|
||||
text: 'Students'
|
||||
}
|
||||
},
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
lang: {
|
||||
noData: "The professor hasn't taught this class :("
|
||||
},
|
||||
tooltip: {
|
||||
headerFormat: '<span style="font-size:small; font-weight:bold">{point.key}</span><table>',
|
||||
pointFormat: '<td style="color:{black};padding:0;font-size:small; font-weight:bold;"><b>{point.y:.0f} Students</b></td>',
|
||||
footerFormat: '</table>',
|
||||
shared: true,
|
||||
useHTML: true
|
||||
},
|
||||
plotOptions: {
|
||||
bar: {
|
||||
pointPadding: 0.2,
|
||||
borderWidth: 0
|
||||
},
|
||||
series: {
|
||||
animation: {
|
||||
duration: 700
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'Grades',
|
||||
data: [{
|
||||
y: data[6],
|
||||
color: '#4CAF50'
|
||||
}, {
|
||||
y: data[7],
|
||||
color: '#8BC34A'
|
||||
}, {
|
||||
y: data[8],
|
||||
color: '#CDDC39'
|
||||
}, {
|
||||
y: data[9],
|
||||
color: '#FFEB3B'
|
||||
}, {
|
||||
y: data[10],
|
||||
color: '#FFC107'
|
||||
}, {
|
||||
y: data[11],
|
||||
color: '#FFA000'
|
||||
}, {
|
||||
y: data[12],
|
||||
color: '#F57C00'
|
||||
}, {
|
||||
y: data[13],
|
||||
color: '#FF5722'
|
||||
}, {
|
||||
y: data[14],
|
||||
color: '#FF5252'
|
||||
}, {
|
||||
y: data[15],
|
||||
color: '#E64A19'
|
||||
}, {
|
||||
y: data[16],
|
||||
color: '#F44336'
|
||||
}, {
|
||||
y: data[17],
|
||||
color: '#D32F2F'
|
||||
}]
|
||||
}]
|
||||
}, function (chart) { // on complete
|
||||
chart = Highcharts.chart('chart', buildChartConfig(data), function (chart) { // on complete
|
||||
if (data.length == 0) {
|
||||
//if no data, then show the message and hide the series
|
||||
chart.renderer.text('Could not find data for this Instructor teaching this Course.', 100, 120)
|
||||
@@ -746,7 +607,7 @@ function getDescription() {
|
||||
description = output;
|
||||
console.log(response);
|
||||
if (!description) {
|
||||
description = "<p style='color:red;font-style:bold'>You have been logged out. Please refresh the page and log back in using your UT EID and password.</p>"
|
||||
description = "<p style='color:red;font-style:bold'>There was an error. Please refresh the page and/or log back in using your UT EID and password.</p>"
|
||||
}
|
||||
$("#description").animate({
|
||||
'opacity': 0
|
||||
|
||||
152
js/util.js
Normal file
152
js/util.js
Normal file
@@ -0,0 +1,152 @@
|
||||
const days = new Map([
|
||||
["M", "Monday"],
|
||||
["T", "Tuesday"],
|
||||
["W", "Wednesday"],
|
||||
["TH", "Thursday"],
|
||||
["F", "Friday"]
|
||||
]);
|
||||
|
||||
const semOrder = {
|
||||
"Spring": 0,
|
||||
"Fall": 1,
|
||||
"Summer": 2,
|
||||
"Winter": 3
|
||||
}
|
||||
|
||||
|
||||
function buildQuery(course_data, sem) {
|
||||
let query = !sem ? "select * from agg" : "select * from grades";
|
||||
query += " where dept like '%" + course_data["department"] + "%'";
|
||||
query += " and prof like '%" + course_data["prof_name"].replace(/'/g, "") + "%'";
|
||||
query += " and course_nbr like '%" + course_data["number"] + "%'";
|
||||
if (sem) {
|
||||
query += "and sem like '%" + sem + "%'";
|
||||
}
|
||||
return query + "order by a1+a2+a3+b1+b2+b3+c1+c2+c3+d1+d2+d3+f desc";
|
||||
}
|
||||
|
||||
|
||||
function semesterSort(semA, semB) {
|
||||
let aName = semA.split(' ')[0];
|
||||
let aYear = parseInt(semA.split(' ')[1]);
|
||||
let bName = semB.split(' ')[0];
|
||||
let bYear = parseInt(semB.split(' ')[1]);
|
||||
if (aYear < bYear)
|
||||
return -1;
|
||||
if (aYear > bYear)
|
||||
return 1;
|
||||
if (semOrder[aName] < semOrder[bName])
|
||||
return -1;
|
||||
if (semOrder[aName] > semOrder[bName])
|
||||
return 1;
|
||||
return 0;
|
||||
}
|
||||
|
||||
function buildChartConfig(data) {
|
||||
return {
|
||||
chart: {
|
||||
type: 'column',
|
||||
backgroundColor: ' #fefefe',
|
||||
spacingLeft: 10
|
||||
},
|
||||
title: {
|
||||
text: null
|
||||
},
|
||||
subtitle: {
|
||||
text: null
|
||||
},
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
xAxis: {
|
||||
title: {
|
||||
text: 'Grades'
|
||||
},
|
||||
categories: [
|
||||
'A',
|
||||
'A-',
|
||||
'B+',
|
||||
'B',
|
||||
'B-',
|
||||
'C+',
|
||||
'C',
|
||||
'C-',
|
||||
'D+',
|
||||
'D',
|
||||
'D-',
|
||||
'F'
|
||||
],
|
||||
crosshair: true
|
||||
},
|
||||
yAxis: {
|
||||
min: 0,
|
||||
title: {
|
||||
text: 'Students'
|
||||
}
|
||||
},
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
lang: {
|
||||
noData: "The professor hasn't taught this class :("
|
||||
},
|
||||
tooltip: {
|
||||
headerFormat: '<span style="font-size:small; font-weight:bold">{point.key}</span><table>',
|
||||
pointFormat: '<td style="color:{black};padding:0;font-size:small; font-weight:bold;"><b>{point.y:.0f} Students</b></td>',
|
||||
footerFormat: '</table>',
|
||||
shared: true,
|
||||
useHTML: true
|
||||
},
|
||||
plotOptions: {
|
||||
bar: {
|
||||
pointPadding: 0.2,
|
||||
borderWidth: 0
|
||||
},
|
||||
series: {
|
||||
animation: {
|
||||
duration: 700
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'Grades',
|
||||
data: [{
|
||||
y: data[6],
|
||||
color: '#4CAF50'
|
||||
}, {
|
||||
y: data[7],
|
||||
color: '#8BC34A'
|
||||
}, {
|
||||
y: data[8],
|
||||
color: '#CDDC39'
|
||||
}, {
|
||||
y: data[9],
|
||||
color: '#FFEB3B'
|
||||
}, {
|
||||
y: data[10],
|
||||
color: '#FFC107'
|
||||
}, {
|
||||
y: data[11],
|
||||
color: '#FFA000'
|
||||
}, {
|
||||
y: data[12],
|
||||
color: '#F57C00'
|
||||
}, {
|
||||
y: data[13],
|
||||
color: '#FF5722'
|
||||
}, {
|
||||
y: data[14],
|
||||
color: '#FF5252'
|
||||
}, {
|
||||
y: data[15],
|
||||
color: '#E64A19'
|
||||
}, {
|
||||
y: data[16],
|
||||
color: '#F44336'
|
||||
}, {
|
||||
y: data[17],
|
||||
color: '#D32F2F'
|
||||
}]
|
||||
}]
|
||||
}
|
||||
}
|
||||
234
js/utplanner.js
234
js/utplanner.js
@@ -1,9 +1,241 @@
|
||||
if ($('html').hasClass('gr__utexas_collegescheduler_com')) {
|
||||
$.initialize("table.section-detail-grid", function () {
|
||||
console.log('hello')
|
||||
$(this).find('thead>tr').append('<th> Plus</th')
|
||||
$(this).find('tbody>tr').each(function () {
|
||||
$(this).append(`<td data-th="Plus"><input type="image" class="distButton" id="distButton" style="vertical-align: bottom;" width="20" height="20" src='${chrome.extension.getURL('images/disticon.png')}'/></td>`);
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
curr_course = {}
|
||||
var modhtml = `<div class=modal id=myModal>
|
||||
<div class=modal-content>
|
||||
<span class=close>×</span>
|
||||
<div class=card>
|
||||
<div class=cardcontainer>
|
||||
<h2 class=title id="title">Computer Fluency (C S 302)</h2>
|
||||
<h2 class=profname id="profname">with Bruce Porter</h2>
|
||||
<div id="topbuttons" class=topbuttons>
|
||||
<button class=matbut id="rateMyProf" style="background: #4CAF50;"> RMP </button>
|
||||
<button class=matbut id="eCIS" style="background: #CDDC39;"> eCIS </button>
|
||||
<button class=matbut id="Syllabi"> Past Syllabi </button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class=card style='text-align:center'>
|
||||
<select id="semesters" style='text-align-last:center;color:#666666;fill:#666666;'></select>
|
||||
<div class="loader" id='loader' style="position:absolute;"></div>
|
||||
<div id="chartcontainer" class=cardcontainer>
|
||||
<div id=chart></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>`;
|
||||
$("body").prepend(modhtml);
|
||||
|
||||
$("body").on('click', '#distButton', function () {
|
||||
var row = $(this).closest('tr');
|
||||
console.log(row.text())
|
||||
$('.modal-content').stop().animate({
|
||||
scrollTop: 0
|
||||
}, 500);
|
||||
$(this).blur();
|
||||
getCourseInfo(row)
|
||||
});
|
||||
|
||||
|
||||
function getCourseInfo(row) {
|
||||
let rowdata = $(row).find('td').slice(3).toArray().map(x => $(x).text().trim());
|
||||
let [uniquenum, department, coursenum, coursename, profname, notes, rawtime] = rowdata
|
||||
let profinit = ""
|
||||
if (profname !== undefined && profname != "Staff") {
|
||||
profinit = profname.split(',')[1].trim();
|
||||
profname = profname.split(',')[0].trim();
|
||||
}
|
||||
let times = rawtime.split('\n').map(x => x.trim());
|
||||
var course_data = {
|
||||
"unique": uniquenum,
|
||||
"department": department,
|
||||
"number": coursenum,
|
||||
"name": coursename,
|
||||
"prof_name": profname,
|
||||
"initial": profinit,
|
||||
"notes": notes,
|
||||
"times": times,
|
||||
}
|
||||
curr_course = course_data;
|
||||
getDistribution(course_data);
|
||||
var modal = document.getElementById('myModal');
|
||||
window.onclick = function (event) {
|
||||
if (event.target == modal) {
|
||||
close();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function badData(course_data, res) {
|
||||
return typeof res == 'undefined' || course_data["prof_name"] == "Staff";
|
||||
}
|
||||
|
||||
$("#semesters").on('change', function () {
|
||||
var sem = $(this).val();
|
||||
sem = sem == "Aggregate" ? undefined : sem;
|
||||
getDistribution(curr_course, sem);
|
||||
});
|
||||
|
||||
|
||||
function showLoading(loading) {
|
||||
if (loading) {
|
||||
$('#loader').css('display', 'inline-block');
|
||||
$("#chart").hide();
|
||||
} else {
|
||||
$('#loader').hide();
|
||||
$("#chart").show();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
function openDialog(course_data, res) {
|
||||
$("#title").text(buildTitle(course_data))
|
||||
$("#topbuttons").before(buildTimeTitle(course_data["times"]));
|
||||
$("#profname").text(buildProfTitle(course_data));
|
||||
$("#myModal").fadeIn(fadetime);
|
||||
buildSemestersDropdown(course_data, res)
|
||||
var data;
|
||||
if (badData(course_data, res)) {
|
||||
data = [];
|
||||
} else {
|
||||
data = res.values[0];
|
||||
}
|
||||
setChart(data);
|
||||
}
|
||||
|
||||
function buildProfTitle(course_data) {
|
||||
const {
|
||||
initial,
|
||||
prof_name
|
||||
} = course_data;
|
||||
return `with ${initial?initial+". ":""}${prof_name}`;
|
||||
}
|
||||
|
||||
function buildSemestersDropdown(course_data, res) {
|
||||
$("#semesters").empty();
|
||||
if (badData(course_data, res)) {
|
||||
$("#semesters").append("<option>No Data</option>")
|
||||
} else {
|
||||
var semesters = res.values[0][18].split(",");
|
||||
semesters.sort(semesterSort);
|
||||
semesters.reverse().unshift('Aggregate');
|
||||
var sems = [];
|
||||
for (var i = 0; i < semesters.length; i++) {
|
||||
sems.push($(`<option value="${semesters[i]}">${semesters[i]}</option>`));
|
||||
}
|
||||
$("#semesters").append(sems);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*Query the grades database*/
|
||||
function getDistribution(course_data, sem) {
|
||||
showLoading(true);
|
||||
let query = buildQuery(course_data, sem);
|
||||
chrome.runtime.sendMessage({
|
||||
command: "gradesQuery",
|
||||
query: query
|
||||
}, function (response) {
|
||||
var res = response.data;
|
||||
if (!sem) {
|
||||
openDialog(course_data, res);
|
||||
} else {
|
||||
var data = badData(course_data, res) ? [] : res.values[0];
|
||||
setChart(data);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
function buildTitle(course_data) {
|
||||
return `${course_data["name"]} (${course_data["department"]} ${course_data["number"]})`
|
||||
}
|
||||
|
||||
|
||||
function buildTimeTitle(times) {
|
||||
$("h2.dateTimePlace").remove();
|
||||
var lines = []
|
||||
for (var i = 0; i < times.length; i++) {
|
||||
date = times[i].substring(0, times[i].indexOf(' ')).toUpperCase();
|
||||
time = times[i].substring(times[i].indexOf(' ') + 1, times[i].lastIndexOf('-')).trim();
|
||||
place = times[i].substring(times[i].lastIndexOf('-') + 1).trim();
|
||||
lines.push($(`<h2 class="dateTimePlace">${makeLine(date, time, place)}</th>`));
|
||||
}
|
||||
return lines
|
||||
}
|
||||
|
||||
function close() {
|
||||
$("#myModal").fadeOut(fadetime);
|
||||
}
|
||||
|
||||
function makeLine(date, time, place) {
|
||||
var arr = seperateDays(date)
|
||||
var output = prettifyDaysText(arr)
|
||||
var building = place.substring(0, place.search(/\d/) - 1);
|
||||
building = building == "" ? "Undecided Location" : building;
|
||||
return `${output} at ${time.replace(/\./g, '').replace(/\-/g, ' to ')} in <a style='font-size:medium' target='_blank' href='https://maps.utexas.edu/buildings/UTM/${building}'>${building}</>`;
|
||||
}
|
||||
|
||||
|
||||
function seperateDays(date) {
|
||||
let arr = [];
|
||||
for (var i = 0; i < date.length; i++) {
|
||||
let letter = date.charAt(i);
|
||||
if (letter == "T" && i < date.length - 1 && date.charAt(i + 1) == "H") {
|
||||
arr.push(days.get("TH"));
|
||||
} else {
|
||||
if (letter != "H") {
|
||||
arr.push(days.get(letter));
|
||||
}
|
||||
}
|
||||
}
|
||||
return arr;
|
||||
}
|
||||
|
||||
function prettifyDaysText(arr) {
|
||||
var output = "";
|
||||
if (arr.length > 2) {
|
||||
for (var i = 0; i < arr.length; i++) {
|
||||
if (i < arr.length - 1)
|
||||
output += arr[i] + ", "
|
||||
if (i == arr.length - 2)
|
||||
output += "and ";
|
||||
if (i == arr.length - 1)
|
||||
output += arr[i];
|
||||
}
|
||||
} else if (arr.length == 2) {
|
||||
output = arr[0] + " and " + arr[1];
|
||||
} else {
|
||||
output = arr[0];
|
||||
}
|
||||
return output
|
||||
}
|
||||
|
||||
function setChart(data) {
|
||||
//set up the chart
|
||||
showLoading(false);
|
||||
chart = Highcharts.chart('chart', buildChartConfig(data), function (chart) { // on complete
|
||||
if (data.length == 0) {
|
||||
//if no data, then show the message and hide the series
|
||||
chart.renderer.text('Could not find data for this Instructor teaching this Course.', 100, 120)
|
||||
.css({
|
||||
fontSize: '20px',
|
||||
width: '300px',
|
||||
align: 'center',
|
||||
left: '160px'
|
||||
})
|
||||
.add();
|
||||
$.each(chart.series, function (i, ser) {
|
||||
ser.hide();
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
@@ -16,11 +16,13 @@
|
||||
],
|
||||
"content_scripts": [{
|
||||
"css": ["css/styles.css"],
|
||||
"js": ["js/moment.min.js", "js/highcharts.js", "js/jquery-3.3.1.min.js", "js/jquery.initialize.min.js", "js/content.js"],
|
||||
"js": ["js/moment.min.js", "js/highcharts.js", "js/jquery-3.3.1.min.js", "js/jquery.initialize.min.js", "js/config.js", "js/util.js",
|
||||
"js/content.js"
|
||||
],
|
||||
"matches": ["https://utdirect.utexas.edu/apps/registrar/course_schedule/*"]
|
||||
}, {
|
||||
"css": ["css/styles.css"],
|
||||
"js": ["js/moment.min.js", "js/highcharts.js", "js/jquery-3.3.1.min.js", "js/jquery.initialize.min.js", "js/utplanner.js"],
|
||||
"js": ["js/moment.min.js", "js/highcharts.js", "js/jquery-3.3.1.min.js", "js/jquery.initialize.min.js", "js/config.js", "js/util.js", "js/utplanner.js"],
|
||||
"matches": ["https://utexas.collegescheduler.com/*"]
|
||||
}, {
|
||||
"css": ["css/styles.css"],
|
||||
|
||||
Reference in New Issue
Block a user