options button, styling changes, bug fixes

This commit is contained in:
10001shh
2018-08-28 17:17:17 -05:00
parent cd5c1193a2
commit c7317d4a0c
6 changed files with 136 additions and 75 deletions

View File

@@ -9,7 +9,7 @@
</head> </head>
<body> <body>
<div id='calendar' style=" width: 67%; margin-left:auto; margin-right:auto;"></div> <div id='calendar' style=" width: 75%; margin-left:auto; margin-right:auto;"></div>
</body> </body>
<script src='js/calendar.js'></script> <script src='js/calendar.js'></script>

View File

@@ -1,11 +1,11 @@
.card { .card {
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2); box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
transition: 0.3s; transition: 0.3s;
margin: 5px; margin: 5px;
} }
.card:hover { .card:hover {
box-shadow: 0 8px 12px 0 rgba(0, 0, 0, 0.2); box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2), 0 4px 20px 0 rgba(0, 0, 0, 0.19);
} }
.container { .container {
@@ -25,6 +25,15 @@ body {
min-height: 400px; min-height: 400px;
} }
.settingsbut {
position: absolute;
bottom: 0;
right: 0;
float: right;
margin-right: 5px;
border: 0px
}
.matbut { .matbut {
border: none; border: none;
outline: none; outline: none;
@@ -84,10 +93,12 @@ body {
transform: scale(0, 0); transform: scale(0, 0);
opacity: 1; opacity: 1;
} }
20% { 20% {
transform: scale(25, 25); transform: scale(25, 25);
opacity: 1; opacity: 1;
} }
100% { 100% {
opacity: 0; opacity: 0;
transform: scale(40, 40); transform: scale(40, 40);

View File

@@ -1,23 +1,19 @@
/* Handle messages and their commands from content and popup scripts*/ /* Handle messages and their commands from content and popup scripts*/
chrome.runtime.onMessage.addListener(function(request, sender, response) { chrome.runtime.onMessage.addListener(function (request, sender, response) {
if(request.command == "courseStorage") { if (request.command == "courseStorage") {
if(request.action == "add"){ if (request.action == "add") {
add(request,sender,response); add(request, sender, response);
} }
if(request.action == "remove"){ if (request.action == "remove") {
remove(request,sender,response); remove(request, sender, response);
} }
} } else if (request.command == "isSingleConflict") {
else if(request.command == "isSingleConflict"){ isSingleConflict(request.dtarr, request.unique, response);
isSingleConflict(request.dtarr,request.unique,response); } else if (request.command == "checkConflicts") {
}
else if(request.command == "checkConflicts"){
checkConflicts(response); checkConflicts(response);
} } else if (request.command == "alreadyContains") {
else if(request.command == "alreadyContains"){ alreadyContains(request.unique, response);
alreadyContains(request.unique,response); } else {
}
else{
const xhr = new XMLHttpRequest(); const xhr = new XMLHttpRequest();
const method = request.method ? request.method.toUpperCase() : "GET"; const method = request.method ? request.method.toUpperCase() : "GET";
xhr.open(method, request.url, true); xhr.open(method, request.url, true);
@@ -32,71 +28,83 @@ chrome.runtime.onMessage.addListener(function(request, sender, response) {
}); });
/* Initially set the course data in storage */ /* Initially set the course data in storage */
chrome.runtime.onInstalled.addListener(function() { chrome.runtime.onInstalled.addListener(function () {
var arr = new Array(); var arr = new Array();
chrome.storage.sync.set({savedCourses: arr}, function() { chrome.storage.sync.set({
console.log('initial course list'); savedCourses: arr
}); }, function () {
chrome.storage.sync.set({courseConflictHighlight: true}, function() { console.log('initial course list');
console.log('initial highlighting: true'); });
}); chrome.storage.sync.set({
courseConflictHighlight: true
}, function () {
console.log('initial highlighting: true');
});
}); });
/* Find all the conflicts in the courses and send them out/ if there is even a conflict*/ /* Find all the conflicts in the courses and send them out/ if there is even a conflict*/
function checkConflicts(sendResponse) { function checkConflicts(sendResponse) {
chrome.storage.sync.get('savedCourses', function(data) { chrome.storage.sync.get('savedCourses', function (data) {
var conflicts = []; var conflicts = [];
var courses = data.savedCourses; var courses = data.savedCourses;
for(var i = 0; i<courses.length;i++){ for (var i = 0; i < courses.length; i++) {
for(var j=i+1; j<courses.length; j++){ for (var j = i + 1; j < courses.length; j++) {
if(isConflict(courses[i].datetimearr,courses[j].datetimearr)){ if (isConflict(courses[i].datetimearr, courses[j].datetimearr)) {
console.log("conflict"); console.log("conflict");
conflicts.push([courses[i],courses[j]]); conflicts.push([courses[i], courses[j]]);
} }
} }
} }
if(conflicts.length == 0){ if (conflicts.length == 0) {
sendResponse({isConflict:false}); sendResponse({
isConflict: false
});
} else { } else {
console.log(conflicts); console.log(conflicts);
sendResponse({isConflict:true,between: conflicts}); sendResponse({
isConflict: true,
between: conflicts
});
} }
}); });
} }
/* Find if the course at unique and with currdatearr is contained in the saved courses and if it conflicts with any other courses*/ /* Find if the course at unique and with currdatearr is contained in the saved courses and if it conflicts with any other courses*/
function isSingleConflict(currdatearr, unique, sendResponse){ function isSingleConflict(currdatearr, unique, sendResponse) {
chrome.storage.sync.get('savedCourses', function(data) { chrome.storage.sync.get('savedCourses', function (data) {
var courses = data.savedCourses; var courses = data.savedCourses;
var conflict = false; var conflict = false;
for(var i = 0; i<courses.length;i++){ for (var i = 0; i < courses.length; i++) {
if(isConflict(currdatearr,courses[i].datetimearr)){ if (isConflict(currdatearr, courses[i].datetimearr)) {
conflict = true; conflict = true;
break; break;
} }
} }
var contains = false; var contains = false;
var i = 0; var i = 0;
while(i < courses.length && !contains){ while (i < courses.length && !contains) {
if(courses[i].unique == unique){ if (courses[i].unique == unique) {
contains = true; contains = true;
} }
i++; i++;
} }
sendResponse({isConflict:conflict,alreadyContains:contains}); sendResponse({
isConflict: conflict,
alreadyContains: contains
});
}); });
} }
/* Check if conflict between two date-time-arrs*/ /* Check if conflict between two date-time-arrs*/
function isConflict(adtarr, bdtarr){ function isConflict(adtarr, bdtarr) {
for(var i = 0; i<adtarr.length;i++){ for (var i = 0; i < adtarr.length; i++) {
var currday = adtarr[i][0]; var currday = adtarr[i][0];
var currtimes = adtarr[i][1]; var currtimes = adtarr[i][1];
for(var j = 0; j<bdtarr.length;j++){ for (var j = 0; j < bdtarr.length; j++) {
var nextday = bdtarr[j][0]; var nextday = bdtarr[j][0];
var nextimes = bdtarr[j][1]; var nextimes = bdtarr[j][1];
if(nextday == currday){ if (nextday == currday) {
if(currtimes[0] < nextimes[1] && currtimes[1] > nextimes[0]){ if (currtimes[0] < nextimes[1] && currtimes[1] > nextimes[0]) {
return true; return true;
} }
} }
@@ -107,42 +115,54 @@ function isConflict(adtarr, bdtarr){
/* Add the requested course to the storage*/ /* Add the requested course to the storage*/
function add(request, sender, sendResponse) { function add(request, sender, sendResponse) {
chrome.storage.sync.get('savedCourses', function(data) { chrome.storage.sync.get('savedCourses', function (data) {
var courses = data.savedCourses; var courses = data.savedCourses;
courses.push(request.course) courses.push(request.course)
console.log(courses); console.log(courses);
chrome.storage.sync.set({savedCourses: courses}); chrome.storage.sync.set({
sendResponse({done:"Added: ("+request.course.unique+") "+request.course.coursename,label:"Remove Course -"}); savedCourses: courses
});
sendResponse({
done: "Added: (" + request.course.unique + ") " + request.course.coursename,
label: "Remove Course -"
});
}); });
} }
/* Find and Remove the requested course from the storage*/ /* Find and Remove the requested course from the storage*/
function remove(request, sender, sendResponse) { function remove(request, sender, sendResponse) {
chrome.storage.sync.get('savedCourses', function(data) { chrome.storage.sync.get('savedCourses', function (data) {
var courses = data.savedCourses; var courses = data.savedCourses;
console.log(courses); console.log(courses);
var index = 0; var index = 0;
while(index<courses.length && courses[index].unique != request.course.unique){ while (index < courses.length && courses[index].unique != request.course.unique) {
index++; index++;
} }
courses.splice(index,1); courses.splice(index, 1);
chrome.storage.sync.set({savedCourses: courses}); chrome.storage.sync.set({
sendResponse({done:"Removed: ("+request.course.unique+") "+request.course.coursename,label:"Add Course +"}); savedCourses: courses
});
sendResponse({
done: "Removed: (" + request.course.unique + ") " + request.course.coursename,
label: "Add Course +"
});
}); });
} }
/* Find if the unique is already contained within the storage*/ /* Find if the unique is already contained within the storage*/
function alreadyContains(unique,sendResponse){ function alreadyContains(unique, sendResponse) {
chrome.storage.sync.get('savedCourses', function(data) { chrome.storage.sync.get('savedCourses', function (data) {
var courses = data.savedCourses; var courses = data.savedCourses;
var contains = false; var contains = false;
var i = 0; var i = 0;
while(i < courses.length && !contains){ while (i < courses.length && !contains) {
if(courses[i].unique == unique){ if (courses[i].unique == unique) {
contains = true; contains = true;
} }
i++; i++;
} }
sendResponse({alreadyContains: contains}); sendResponse({
alreadyContains: contains
});
}); });
} }

View File

@@ -61,8 +61,10 @@ $(function () {
$("#classname").html(`${savedCourses[currindex].coursename} <span style='font-size:small'>(${savedCourses[currindex].unique})</span>`); $("#classname").html(`${savedCourses[currindex].coursename} <span style='font-size:small'>(${savedCourses[currindex].unique})</span>`);
$("#timelines").append(makeLine(savedCourses[currindex].datetimearr)); $("#timelines").append(makeLine(savedCourses[currindex].datetimearr));
var uncapProf = savedCourses[currindex].profname var uncapProf = prettifyName(savedCourses[currindex].profname);
uncapProf = uncapProf.charAt(0) + uncapProf.substring(1).toLowerCase(); if (uncapProf == "") {
uncapProf = "Undecided";
}
$("#prof").html(`with <span style='font-weight:bold;'>${uncapProf}</span>`); $("#prof").html(`with <span style='font-weight:bold;'>${uncapProf}</span>`);
} }
}); });
@@ -186,8 +188,10 @@ $(function () {
var classInfo = savedCourses[i]; var classInfo = savedCourses[i];
var department = classInfo.coursename.substring(0, classInfo.coursename.search(/\d/) - 2); var department = classInfo.coursename.substring(0, classInfo.coursename.search(/\d/) - 2);
var course_nbr = classInfo.coursename.substring(classInfo.coursename.search(/\d/), classInfo.coursename.indexOf(" ", classInfo.coursename.search(/\d/))); var course_nbr = classInfo.coursename.substring(classInfo.coursename.search(/\d/), classInfo.coursename.indexOf(" ", classInfo.coursename.search(/\d/)));
var uncapProf = classInfo.profname; var uncapProf = prettifyName(classInfo.profname);
uncapProf = uncapProf.charAt(0) + uncapProf.substring(1).toLowerCase(); if (uncapProf == "") {
uncapProf = "Undecided";
}
classSchedules.push({ classSchedules.push({
title: `${department}-${course_nbr} with ${uncapProf}`, title: `${department}-${course_nbr} with ${uncapProf}`,
start: moment().format("YYYY-MM-") + start: moment().format("YYYY-MM-") +
@@ -227,4 +231,10 @@ $(function () {
$("#calendar").fullCalendar('addEventSource', classSchedules, true); $("#calendar").fullCalendar('addEventSource', classSchedules, true);
}); });
} }
/* Format the Professor Name */
function prettifyName(profname) {
return profname.replace(/\w\S*/g, function (txt) {
return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
});
}
}); });

View File

@@ -37,7 +37,10 @@ chrome.storage.sync.get('savedCourses', function (data) {
} }
var department = courses[i].coursename.substring(0, courses[i].coursename.search(/\d/) - 2); var department = courses[i].coursename.substring(0, courses[i].coursename.search(/\d/) - 2);
var course_nbr = courses[i].coursename.substring(courses[i].coursename.search(/\d/), courses[i].coursename.indexOf(" ", courses[i].coursename.search(/\d/))); var course_nbr = courses[i].coursename.substring(courses[i].coursename.search(/\d/), courses[i].coursename.indexOf(" ", courses[i].coursename.search(/\d/)));
var profname = courses[i].profname.substring(0, 1) + courses[i].profname.substring(1).toLowerCase(); var profname = prettifyName(courses[i].profname);
if (profname == "") {
profname = "Undecided Professor";
}
var listhtml = "<li id='" + i + "'style='padding: 0px 5px 5px 5px; overflow-y: auto;max-height:400px;'><div class='card'><div class='container' style='background:" + color + "''><h4 class='truncate' style='color:white;margin:5px; display:inline-block;font-size:large;'><b>" + department + " " + course_nbr + "<span style='font-size:medium'>" + " with </span><span style='font-size:medium'>" + profname + " (" + courses[i].unique + ")" + "</span></b></h4><p style='float:right;font-size:small;display:inline-block;margin-top:10px;color:white;'>&#9660;</p></div></div><div id='moreInfo' style='display: none;'><p style='font-weight:bold;padding:10px;margin:0px;font-size:small;background-color:#FFCDD2;'>" + makeLine(i) + "</p><div id='infoButtons' style='border-radius:0px;'><button class='matbut' id='listRemove'style='float:right;background:#F44336; margin:5px;'>Remove</button><button class='matbut' id='listMoreInfo' style='float:right;background:#2196F3; margin:5px;'>More Info</button></div></div></li>"; var listhtml = "<li id='" + i + "'style='padding: 0px 5px 5px 5px; overflow-y: auto;max-height:400px;'><div class='card'><div class='container' style='background:" + color + "''><h4 class='truncate' style='color:white;margin:5px; display:inline-block;font-size:large;'><b>" + department + " " + course_nbr + "<span style='font-size:medium'>" + " with </span><span style='font-size:medium'>" + profname + " (" + courses[i].unique + ")" + "</span></b></h4><p style='float:right;font-size:small;display:inline-block;margin-top:10px;color:white;'>&#9660;</p></div></div><div id='moreInfo' style='display: none;'><p style='font-weight:bold;padding:10px;margin:0px;font-size:small;background-color:#FFCDD2;'>" + makeLine(i) + "</p><div id='infoButtons' style='border-radius:0px;'><button class='matbut' id='listRemove'style='float:right;background:#F44336; margin:5px;'>Remove</button><button class='matbut' id='listMoreInfo' style='float:right;background:#2196F3; margin:5px;'>More Info</button></div></div></li>";
$("#courseList").append(listhtml); $("#courseList").append(listhtml);
} }
@@ -50,6 +53,13 @@ function getSimpleName(coursename, unique) {
return department + " " + course_nbr + " (" + unique + ")"; return department + " " + course_nbr + " (" + unique + ")";
} }
/* Format the Professor Name */
function prettifyName(profname) {
return profname.replace(/\w\S*/g, function (txt) {
return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
});
}
/* Update the conflict messages */ /* Update the conflict messages */
function updateConflicts() { function updateConflicts() {
chrome.runtime.sendMessage({ chrome.runtime.sendMessage({
@@ -67,7 +77,7 @@ function updateConflicts() {
text += "<br>"; text += "<br>";
} }
} }
$("#courseList").prepend("<p style='font-size:small; font-weight:bold; color:red; margin:5px;'>" + text + "</>"); $("#courseList").prepend("<p style='font-size:small;font-weight:bold; color:red; margin:5px;'>" + text + "</>");
} }
}); });
} }

View File

@@ -4,9 +4,10 @@
<head> <head>
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/popup.css"> <link rel="stylesheet" href="css/popup.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
</head> </head>
<body> <body style="position:relative;">
<div class="card" id="header"> <div class="card" id="header">
<div id="buttons" style="padding: 5px 10px 5px 10px;display: flex;justify-content: space-between;"> <div id="buttons" style="padding: 5px 10px 5px 10px;display: flex;justify-content: space-between;">
<button id="clear" class="matbut" style="font-size:medium; background:#4CAF50;margin: 10px;">Clear All</button> <button id="clear" class="matbut" style="font-size:medium; background:#4CAF50;margin: 10px;">Clear All</button>
@@ -16,14 +17,23 @@
</div> </div>
<ul id="courseList" style="list-style-type: none;padding: 5px;"></ul> <div>
<h2 id="empty" style="font-weight: normal;font-size: large;margin: 60px 30px 40px 30px ;">Doesn't Look Like Anything To Me. <ul id="courseList" style="list-style-type: none;padding: 5px;"></ul>
<br> <h2 id="empty" style="font-weight: normal;font-size: large;margin: 60px 30px 40px 30px ;">Doesn't Look Like
<span style="font-size: small;display:table;margin:0 auto;font-weight: bold">(No Courses Saved)</span> Anything
<h2> To Me.
<script src="js/jquery-3.3.1.min.js"></script> <br>
<script src="js/moment.min.js"></script> <span style="font-size: small;display:table;margin:0 auto;font-weight: bold">(No Courses Saved)</span>
<script src="js/popup.js"></script> </h2>
<div id="spacer" style=" margin-bottom: 0px; display:inline-block"></div>
<button title='Options' class="settingsbut" id='open'><i class="material-icons">
settings
</i></button>
</div>
<script src="js/jquery-3.3.1.min.js"></script>
<script src="js/moment.min.js"></script>
<script src="js/popup.js"></script>
</body> </body>
</html> </html>