diff --git a/hourglass/client/menus/menus.html b/hourglass/client/menus/menus.html
index 6b6c2b4..712531e 100644
--- a/hourglass/client/menus/menus.html
+++ b/hourglass/client/menus/menus.html
@@ -485,6 +485,14 @@
{{/if}}
+
+ {{name}}
+ {{teacher}}
+ {{hour}}
+ {{subscribers}}
+ {{_id}}
+
+
{{name}}
diff --git a/hourglass/client/menus/menus.js b/hourglass/client/menus/menus.js
index f8c8e91..e50b401 100644
--- a/hourglass/client/menus/menus.js
+++ b/hourglass/client/menus/menus.js
@@ -367,7 +367,7 @@ Template.joinClass.helpers({
rules: [{
token: '',
collection: classes,
- template: Template.classDisplay,
+ template: Template.classAutoList,
filter: {
privacy: false,
status: true
@@ -421,27 +421,32 @@ Template.joinClass.events({
Session.set("autocompleteDivs", null);
var divs = [];
try {
- var items = document.getElementsByClassName("-autocomplete-container")[0].childNodes[3].childNodes;
- if (items.length === 0) { // If no results.
+ var items = document.getElementsByClassName("-autocomplete-container")[0].children;
+ if(items[0].tagName === "I") {
Session.set("notfound", true);
+ return;
} else {
+ items = items[0].children;
+ for(var i = 0; i < items.length; i++) {
+ var item = items[i].children;
+ var id = item[4].textContent;
+ if(Session.get("user").classes.indexOf(id) !== -1) continue;
+ divs.push({
+ name: item[0].textContent,
+ teachershort: item[1].textContent.split(" ")[1],
+ hour: item[2].textContent,
+ subscribers: (item[3].textContent.match(new RegExp(",","g")) || []).length+1,
+ _id: id,
+ join: true
+ })
+ }
+ Session.set("autocompleteDivs", divs.sort(function(a, b) {
+ return b.subscribers - a.subscribers;
+ }));
Session.set("notfound", false);
+ return;
}
- for (var i = 2; i < items.length; i += 3) { // Iterate through autocomplete div.
- var item = items[i].childNodes[3];
- if (Meteor.user().profile.classes.indexOf(item.getAttribute("classid")) !== -1) continue;
- divs.push({
- name: item.childNodes[1].childNodes[0].nodeValue,
- teacher: item.childNodes[3].childNodes[0].nodeValue,
- hour: item.childNodes[5].childNodes[0].nodeValue,
- subscribers: Math.floor(item.childNodes[7].childNodes[0].nodeValue.replace(",", "").length / 17),
- _id: item.getAttribute("classid")
- });
- }
- Session.set("autocompleteDivs", divs.sort(function(a, b) {
- return b.subscribers - a.subscribers;
- }));
- } catch (err) {}
+ } catch(err) {}
},
'click .classBox .fa-plus' (event) {
serverData = [event.target.parentNode.getAttribute("classid"), ""];
diff --git a/hourglass/client/profile/profile.css b/hourglass/client/profile/profile.css
index 381bf12..d962527 100644
--- a/hourglass/client/profile/profile.css
+++ b/hourglass/client/profile/profile.css
@@ -38,6 +38,10 @@
border: 1px solid #FCF0F0 !important;
}
+#profPageWrapper #createWrapper {
+
+}
+
#basicInfo {
width: 100%;
position: absolute;
@@ -138,7 +142,119 @@
#enrollUserWrapper {
width: 60%;
+ height: 42vh;
margin: auto;
padding: 1%;
background-color: rgba(255,255,255,0.2);
+ overflow-y: auto;
+}
+
+#enrollClassList {
+ width: 10%;
+ height: 100%;
+
+ background-color: rgba(0,0,0,0.2);
+
+ display: none;
+ position: absolute;
+ top: 0;
+ left: 0;
+}
+
+#enrollClassList h3 {
+ font-weight: 300;
+ margin: 0;
+ padding: 10%;
+
+ background-color: rgba(0,0,0,0.4);
+ border: 0;
+
+ text-align: center;
+}
+
+#enrollClassList h4 {
+ font-weight: 300;
+ margin: 0;
+ width: 90%;
+ padding: 10%;
+
+ display: table-cell;
+ cursor: pointer;
+
+ -webkit-transition: background-color 0.5s ease;
+ -moz-transition: background-color 0.5s ease;
+ -ms-transition: background-color 0.5s ease;
+ transition: background-color 0.5s ease;
+}
+
+#enrollClassList i {
+ font-size: 2vh;
+ width: 20%;
+ display: table-cell;
+ cursor: pointer;
+ text-align: right;
+
+ -webkit-transition: color 0.5s ease;
+ -moz-transition: color 0.5s ease;
+ -ms-transition: color 0.5s ease;
+ transition: color 0.5s ease;
+}
+
+#enrollClassList i:hover {
+ color: #FF1A1A;
+}
+
+#ESCWrapper {
+ background-color: rgba(0,0,0,0.2);
+}
+
+#ESCWrapper:hover {
+ background-color: rgba(0,0,0,0.25);
+}
+
+#createActivate {
+ margin-right: 5%;
+ padding: 1%;
+ background-color: rgba(0,0,0,0.1);
+
+ float: right;
+ cursor: pointer;
+
+ -webkit-transition: background-color 0.5s ease;
+ -moz-transition: background-color 0.5s ease;
+ -ms-transition: background-color 0.5s ease;
+ transition: background-color 0.5s ease;
+}
+
+#createActivate:hover {
+ background-color: rgba(0,0,0,0.2)
+}
+
+#createInfo {
+ width: 100%;
+ position: absolute;
+ top: 150%;
+}
+
+#createWrapper {
+ margin: auto;
+ width: 30%;
+
+ background-color: rgba(255,255,255,0.2);
+}
+
+#createWrapper .formDiv {
+ width: 100%;
+ margin: 0;
+ background-color: transparent;
+}
+
+#createWrapper #creSubmit {
+ width: 30%;
+ margin: auto;
+ border: 1px solid #FCF0F0 !important;
+}
+
+#createWrapper p {
+ margin: 0;
}
diff --git a/hourglass/client/profile/profile.html b/hourglass/client/profile/profile.html
index dc4f350..0e9ab61 100644
--- a/hourglass/client/profile/profile.html
+++ b/hourglass/client/profile/profile.html
@@ -32,8 +32,7 @@
{{> inputAutocomplete id="classSearch" settings=classSettings placeholder="Search..."}}
-
+ Class not here?
-
-
+
+
My Classes
+ {{#each enrollClass}}
+ {{> enrollSideClass}}
+ {{/each}}
+
+
+
+
+
Submit a request for a class to be approved by an administrator.
+ You can have up to 8 unapproved classes at once.
+
+
+
+
+
+
+
{{name}}
+ {{#if x}}
+
+ {{/if}}
+
+
diff --git a/hourglass/client/profile/profile.js b/hourglass/client/profile/profile.js
index a6c8317..b633ab5 100644
--- a/hourglass/client/profile/profile.js
+++ b/hourglass/client/profile/profile.js
@@ -5,7 +5,8 @@ import {
Session.set("sections", [0,0]) // [Completed, Viewing]
-Session.set("profile", {});
+Session.set("profile", {classes: []});
+Session.set("autocompleteDivs", null);
Session.set("notsearching", true); // If user isn't searching
Session.set("noclass", null); // If user doesn't have classes.
Session.set("notfound", null); // If no results for autocomplete.
@@ -40,6 +41,9 @@ Template.profile.helpers({
privacy: {
$eq: false
},
+ _id: {
+ $nin: Session.get("profile").classes
+ },
school: {
$eq: Session.get("profile").school
}
@@ -72,7 +76,7 @@ Template.profile.helpers({
rules: [{
token: '',
collection: classes,
- template: Template.classDisplay,
+ template: Template.classAutoList,
filter: {
privacy: false,
status: true
@@ -92,6 +96,31 @@ Template.profile.helpers({
}]
};
},
+ schoolComplete() { // Returns autocomplete array for schools.
+ return {
+ position: "bottom",
+ limit: 6,
+ rules: [{
+ token: '',
+ collection: schools,
+ field: 'name',
+ matchAll: true,
+ template: Template.schoolList
+ }]
+ };
+ },
+ teacherComplete() { // Returns autocomplete array for teachers.
+ return {
+ position: "bottom",
+ limit: 1,
+ rules: [{
+ token: '',
+ collection: teachers,
+ field: 'name',
+ template: Template.teacherList
+ }]
+ };
+ },
notsearching() { // Tells whether user is using the searchbox
return Session.get("notsearching");
},
@@ -100,6 +129,11 @@ Template.profile.helpers({
},
notfound() { // Returns if autocomplete has no results.
return Session.get("notfound");
+ },
+ enrollClass() {
+ var myClasses = Session.get("profile").classes;
+ if(myClasses === undefined || myClasses.length === 0) return [{name:"Enroll!",x:false}];
+ return myClasses.map(function(a){return {name:classes.findOne({_id:a}).name,x:true,_id:a}});
}
});
@@ -131,9 +165,13 @@ Template.profile.events({
profile.school = values["school"];
profile.grade = values["grade"];
Session.set("profile", profile);
- Session.set("sections", [(Session.get("sections")[0] < 1) ? 1 : Session.get("sections")[0], Session.get("sections")[1]])
+ Session.set("sections", [(Session.get("sections")[0] < 1) ? 1 : Session.get("sections")[0], Session.get("sections")[1]]);
slideToField(1);
},
+ 'click #createActivate' () {
+ Session.set("sections", [(Session.get("sections")[0] < 2) ? 2 : Session.get("sections")[0], Session.get("sections")[1]]);
+ slideToField(2);
+ },
'click #backArrow' () {
slideToField(Session.get("sections")[1]-1);
},
@@ -218,33 +256,71 @@ Template.profile.events({
Session.set("autocompleteDivs", null);
var divs = [];
try {
- var items = document.getElementsByClassName("-autocomplete-container")[0].childNodes[3].childNodes;
- if (items.length === 0) { // If no results.
+ var items = document.getElementsByClassName("-autocomplete-container")[0].children;
+ if(items[0].tagName === "I") {
Session.set("notfound", true);
+ return;
} else {
+ items = items[0].children;
+ for(var i = 0; i < items.length; i++) {
+ var item = items[i].children;
+ var id = item[4].textContent;
+ if(Session.get("profile").classes.indexOf(id) !== -1) continue;
+ divs.push({
+ name: item[0].textContent,
+ teachershort: item[1].textContent.split(" ")[1],
+ hour: item[2].textContent,
+ subscribers: (item[3].textContent.match(new RegExp(",","g")) || []).length+1,
+ _id: id,
+ join: true
+ })
+ }
+ Session.set("autocompleteDivs", divs.sort(function(a, b) {
+ return b.subscribers - a.subscribers;
+ }));
Session.set("notfound", false);
+ return;
}
- for (var i = 2; i < items.length; i += 3) { // Iterate through autocomplete div.
- var item = items[i].childNodes[3];
- if (Meteor.user().profile.classes.indexOf(item.getAttribute("classid")) !== -1) continue;
- divs.push({
- name: item.childNodes[1].childNodes[0].nodeValue,
- teacher: item.childNodes[3].childNodes[0].nodeValue,
- hour: item.childNodes[5].childNodes[0].nodeValue,
- subscribers: Math.floor(item.childNodes[7].childNodes[0].nodeValue.replace(",", "").length / 17),
- _id: item.getAttribute("classid")
- });
- }
+ } catch(err) {}
+ },
+ 'click .classBox .fa-plus' (event) {
+ var profile = Session.get("profile");
+ var id = event.target.parentNode.getAttribute("classid");
+ if(profile.classes.indexOf(id) === -1) {
+ profile.classes.push(id);
+ Session.set("profile", profile);
+ if(Session.get("autocompleteDivs") === null) return;
+ var divs = Session.get("autocompleteDivs");
+ divs.splice(divs.map(function(a) {
+ return a._id;
+ }).indexOf(id),1);
+ Session.set("autocompleteDivs", divs);
+ }
+ },
+ 'click #ESCWrapper .fa-times' (event) {
+ var profile = Session.get("profile");
+ var id = event.target.parentNode.getAttribute("classid");
+ if(profile.classes.indexOf(id) !== -1) {
+ profile.classes.splice(profile.classes.indexOf(id),1);
+ Session.set("profile", profile);
+ if(Session.get("autocompleteDivs") === null) return;
+ var divs = Session.get("autocompleteDivs");
+ var myClass = classes.findOne({_id: id});
+ myClass.subscribers = myClass.subscribers.length;
+ myClass.teachershort = myClass.teacher.split(" ")[1]
+ myClass.join = true;
+ divs.push(myClass);
Session.set("autocompleteDivs", divs.sort(function(a, b) {
return b.subscribers - a.subscribers;
}));
- } catch (err) {}
- },
+ }
+ }
});
function slideToField(field) {
- var order = ["basicInfo", "enrollInfo"];
+ var order = ["basicInfo", "enrollInfo", "createInfo"];
$(".moveArrow").animate({"opacity":0})
+ $("#enrollClassList").fadeOut(200);
var viewing = Session.get("sections")[1]
var move = (viewing-field < 0) ? "-50%" : "150%";
$("#"+order[viewing]).animate({top: move});
@@ -254,6 +330,9 @@ function slideToField(field) {
complete: function() {
Session.set("sections", [Session.get("sections")[0],field]);
$(".moveArrow").animate({"opacity":1});
+ if(field === 1) {
+ $("#enrollClassList").fadeIn(200);
+ }
}
});
}