Merge branch 'master' of github.com:ksjdragon/hourglass
This commit is contained in:
Yaman Qalieh
commit
242336de54
@ -76,6 +76,10 @@ body {
|
||||
pointer-events: all;
|
||||
}
|
||||
|
||||
input {
|
||||
font-family: Raleway !important;
|
||||
}
|
||||
|
||||
.noScroll {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
@ -8,9 +8,6 @@ import './main.html';
|
||||
var load = true;
|
||||
var calWorkOpen = null;
|
||||
var calWorkDate = null;
|
||||
modifyingInput = null;
|
||||
var clickDisabled = false;
|
||||
var optionOpen = false;
|
||||
|
||||
var defaultWork = {
|
||||
name: "Name | Click here to edit...",
|
||||
@ -59,11 +56,6 @@ Template.main.rendered = function() {
|
||||
document.getElementsByTagName("body")[0].style.color = Session.get("user").preferences.theme.textColor;
|
||||
};
|
||||
|
||||
Template.profile.rendered = function() {
|
||||
Accounts._loginButtonsSession.set('dropdownVisible', true);
|
||||
document.getElementsByTagName("body")[0].style.color = Session.get("user").preferences.theme.textColor;
|
||||
};
|
||||
|
||||
// Global Helpers
|
||||
|
||||
Template.registerHelper('adminPage', () => {
|
||||
@ -77,7 +69,7 @@ Template.registerHelper('screen', (multiplier, fraction) => {
|
||||
});
|
||||
|
||||
Template.registerHelper('divColor', (div) => { // Reactive color changing based on preferences. Colors stored in themeColors.
|
||||
return Session.get("user").preferences.theme[div];
|
||||
return (Object.keys(Session.get("user")).length === 0) ? themeColors["lux"][div] : Session.get("user").preferences.theme[div];
|
||||
});
|
||||
|
||||
Template.registerHelper('overlayDim', (part) => { // Gets size of the overlay container.
|
||||
@ -750,7 +742,7 @@ Template.main.events({
|
||||
|
||||
// Other Functions
|
||||
|
||||
function toggleOptionMenu(toggle, menu) {
|
||||
toggleOptionMenu = function(toggle, menu) {
|
||||
if(toggle) {
|
||||
$(".selectedOption").removeClass("selectedOption");
|
||||
$("#" + menu).next()
|
||||
@ -971,6 +963,26 @@ function formReadable(input, val) { // Makes work information readable by users.
|
||||
}
|
||||
}
|
||||
|
||||
checkComplete = function(required, inputs) {
|
||||
var values = {};
|
||||
var no = [];
|
||||
for (var i = 0; i < inputs.length; i++) {
|
||||
var val = inputs[i].value;
|
||||
var where = inputs[i].getAttribute("form");
|
||||
if (val === "" && _.contains(required, where)) {
|
||||
no.push(where);
|
||||
}
|
||||
values[where] = val;
|
||||
}
|
||||
if (no.length > 0) { // Check missing fields.
|
||||
return [false,no.reduce(function(a, b) {
|
||||
return (b === no[no.length - 1]) ? a + ((no.length === 2) ? " and " : ", and ") + b : a + ", " + b;
|
||||
}), values];
|
||||
} else {
|
||||
return [true,"", values];
|
||||
}
|
||||
}
|
||||
|
||||
startDragula = function() {
|
||||
dragula([document.querySelector('#classesMode'), document.querySelector('#nonexistant')], {
|
||||
moves: function(el, container, handle) {
|
||||
|
||||
@ -503,23 +503,11 @@ Template.createClass.helpers({
|
||||
Template.createClass.events({
|
||||
'click #creSubmit' () {
|
||||
var inputs = document.getElementsByClassName("creInput");
|
||||
var values = {};
|
||||
var required = ["school", "name", "privacy", "category"];
|
||||
var no = [];
|
||||
for (var i = 0; i < inputs.length; i++) {
|
||||
var val = inputs[i].value;
|
||||
var where = inputs[i].getAttribute("form");
|
||||
if (val === "" && _.contains(required, where)) {
|
||||
no.push(where);
|
||||
}
|
||||
values[where] = val;
|
||||
}
|
||||
console.log(values);
|
||||
console.log(no);
|
||||
if (no.length > 0) { // Check missing fields.
|
||||
sAlert.error("Missing " + no.reduce(function(a, b) {
|
||||
return (b === no[no.length - 1]) ? a + ", and " + b : a + ", " + b;
|
||||
}), {
|
||||
var alert = checkComplete(required, inputs);
|
||||
var values = alert[2];
|
||||
if (!alert[0]) { // Check missing fields.
|
||||
sAlert.error("Missing " + alert[1], {
|
||||
effect: 'stackslide',
|
||||
position: 'top',
|
||||
timeout: 3000
|
||||
|
||||
@ -1,11 +1,144 @@
|
||||
#profInfo {
|
||||
margin: auto;
|
||||
margin-top: 5%;
|
||||
width: 50%;
|
||||
padding: 1%;
|
||||
#profPageWrapper {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
background-color: #282933;
|
||||
color: #FCF0F0 !important;
|
||||
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
#schoolnext {
|
||||
text-align: right;
|
||||
margin-right: 2%;
|
||||
}
|
||||
#profPageWrapper input {
|
||||
color: #FCF0F0 !important;
|
||||
}
|
||||
|
||||
#profPageWrapper .optionText {
|
||||
background-color: #282933 !important;
|
||||
}
|
||||
|
||||
#profPageWrapper #classSearch {
|
||||
background-color: rgba(0,0,0,0.1);
|
||||
border: 0;
|
||||
|
||||
-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;
|
||||
}
|
||||
|
||||
#profPageWrapper #classSearch:hover {
|
||||
background-color: rgba(0,0,0,0.2);
|
||||
}
|
||||
|
||||
#profPageWrapper .classBox:not(:first-child) {
|
||||
border: 1px solid #FCF0F0 !important;
|
||||
}
|
||||
|
||||
#basicInfo {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 20%;
|
||||
}
|
||||
|
||||
#newUserWrapper {
|
||||
width: 25%;
|
||||
padding: 2.5%;
|
||||
margin: auto;
|
||||
|
||||
background-color: rgba(255,255,255,0.2);
|
||||
}
|
||||
|
||||
#newUserWrapper .formDiv {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.opTitle {
|
||||
font-weight: 200;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#newUserWrapper .optionHolder {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
#basicNext {
|
||||
padding: 2%;
|
||||
border: 1px solid #FCF0F0;
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
|
||||
-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;
|
||||
}
|
||||
|
||||
#basicNext:hover {
|
||||
background-color: rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
#backArrow {
|
||||
margin: auto;
|
||||
z-index: 10;
|
||||
cursor: pointer;
|
||||
opacity: 0;
|
||||
|
||||
position: relative;
|
||||
top: 5%;
|
||||
|
||||
-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;
|
||||
}
|
||||
|
||||
#backArrow i {
|
||||
line-height: 5vh;
|
||||
}
|
||||
|
||||
#backArrow:hover {
|
||||
background-color: rgba(255,255,255,0.05);
|
||||
}
|
||||
|
||||
#forwardArrow {
|
||||
margin: auto;
|
||||
z-index: 10;
|
||||
cursor: pointer;
|
||||
opacity: 0;
|
||||
|
||||
position: relative;
|
||||
top: 85%;
|
||||
|
||||
-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;
|
||||
}
|
||||
|
||||
#forwardArrow:hover {
|
||||
background-color: rgba(255,255,255,0.05);
|
||||
}
|
||||
|
||||
#enrollInfo {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 150%;
|
||||
}
|
||||
|
||||
#enrollUserWrapper {
|
||||
width: 60%;
|
||||
margin: auto;
|
||||
padding: 1%;
|
||||
background-color: rgba(255,255,255,0.2);
|
||||
}
|
||||
|
||||
@ -1,42 +1,70 @@
|
||||
<template name="profile">
|
||||
{{> sAlert}}
|
||||
<div id="schoolgrade">
|
||||
|
||||
<div id="profInfo" class="card" style="background-color:{{divColor 'secondaryColor'}}">
|
||||
<h2 class="profHea">About You</h2>
|
||||
<div id="about">
|
||||
<div class="prefWrapper">
|
||||
<p class="profTitle">School Name:</p>
|
||||
<div id="school" class="clickModify dropdown" tabindex="1">
|
||||
<span>{{school}}</span>
|
||||
<i class="fa fa-caret-down" aria-hidden="true"></i>
|
||||
</div>
|
||||
<div class="optionHolder smallText">
|
||||
{{#each selectOptions 'school'}}
|
||||
{{> option}}
|
||||
{{/each}}
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<div class="prefWrapper">
|
||||
<p class="profTitle">Graduation Year:</p>
|
||||
<div id="grade" class="clickModify dropdown" tabindex="2">
|
||||
<span>{{grade}}</span>
|
||||
<i class="fa fa-caret-down" aria-hidden="true"></i>
|
||||
</div>
|
||||
<div class="optionHolder">
|
||||
{{#each selectOptions 'grade'}}
|
||||
{{> option}}
|
||||
{{/each}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p id="schoolnext" {{schoolgradenext}}>Next</p>
|
||||
<div id="classsection" style="display:none;">
|
||||
<!-- CLASS ENROLLMENT + CREATE -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- GRAD YEAR INPUT -->
|
||||
<div id="profPageWrapper">
|
||||
<div id="backArrow" class="circleIcon moveArrow" style="display:{{showArrow 'back'}}">
|
||||
<i class="fa fa-chevron-up" aria-hidden="true"></i>
|
||||
</div>
|
||||
<div id="basicInfo">
|
||||
<div id="newUserWrapper">
|
||||
<div class="formDiv">
|
||||
<p class="opTitle">**School:</p>
|
||||
<input id="school" class="basicInfoField clickModify dropdown" type="text" form="school" placeholder=" Click here to edit..." readonly>
|
||||
<div class="optionHolder">
|
||||
{{#each selectOptions 'school'}}
|
||||
{{> option}}
|
||||
{{/each}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="formDiv">
|
||||
<p class="opTitle">**Grade:</p>
|
||||
<input id="grade" class="basicInfoField clickModify dropdown" type="text" form="grade" placeholder="Click here to edit..." readonly>
|
||||
<div class="optionHolder">
|
||||
{{#each selectOptions 'grade'}}
|
||||
{{> option}}
|
||||
{{/each}}
|
||||
</div>
|
||||
</div>
|
||||
<h3 id="basicNext">Continue</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div id="enrollInfo">
|
||||
<div id="enrollUserWrapper">
|
||||
<div id="joinTop">
|
||||
<i class="fa fa-search" aria-hidden="true"></i>
|
||||
{{> inputAutocomplete id="classSearch" settings=classSettings placeholder="Search..."}}
|
||||
<!-- <h4 id="private">Join Private Class</h4>
|
||||
<input id="privateCode" placeholder="Enter code here..."> -->
|
||||
</div>
|
||||
<div id="settingClassWrapper">
|
||||
<div id="label" class="classBox">
|
||||
<span class="name classText">Class Name</span>
|
||||
<span class="teacher classText">Teacher</span>
|
||||
<span class="hour classText">Hour</span>
|
||||
<span class="subscriptions classText">Members</span>
|
||||
</div>
|
||||
{{#if notsearching}}
|
||||
{{#each classes}}
|
||||
{{> classDisplay}}
|
||||
{{/each}}
|
||||
{{#if noclass}}
|
||||
<h3>No results found...</h3>
|
||||
{{/if}}
|
||||
{{else}}
|
||||
{{#each autocompleteClasses}}
|
||||
{{> classDisplay}}
|
||||
{{/each}}
|
||||
{{#if notfound}}
|
||||
<h3>No results found...</h3>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="classsection" style="display:none;">
|
||||
<!-- CLASS ENROLLMENT + CREATE -->
|
||||
</div>
|
||||
<div id="forwardArrow" class="circleIcon moveArrow" style="display:{{showArrow 'forward'}}">
|
||||
<i class="fa fa-chevron-down" aria-hidden="true"></i>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -3,40 +3,69 @@ import {
|
||||
Template
|
||||
} from 'meteor/templating';
|
||||
|
||||
var openValues = {
|
||||
"owned": "-650px",
|
||||
"priv": "-160px"
|
||||
};
|
||||
|
||||
confirm = null; // Sets function to execute after confirmation click.
|
||||
|
||||
// Sets up global variables
|
||||
|
||||
Session.set("profClassTab", "manClass"); // Set default classes card mode to 'Manage Classes.'
|
||||
Session.set("owned", false); // Status of createdClasses.
|
||||
Session.set("privClass", false); //Status of joinPrivClass.
|
||||
Session.set("modifying", null); // Stores current open input.
|
||||
Session.set("notsearching", true); // If user is searching in search box.
|
||||
Session.set("autocompleteDivs", null); // Stores returned autocomplete results.
|
||||
Session.set("confirmText", null); // Stores text for different confirmation functions.
|
||||
Session.set("selectedClass", null); // Stores selected owned class info.
|
||||
Session.set("code", null); // If owned class has a code.
|
||||
Session.set("sections", [0,0]) // [Completed, Viewing]
|
||||
Session.set("profile", {});
|
||||
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.
|
||||
|
||||
Template.profile.helpers({
|
||||
/* themeName() {
|
||||
var vals = _.values(themeColors);
|
||||
var curtheme = Session.get("user").preferences.theme;
|
||||
for (var i = 0; i < vals.length; i++) {
|
||||
if (_.isEqual(vals[i], curtheme)) {
|
||||
var name = _.keys(themeColors)[i];
|
||||
return name.charAt(0).toUpperCase() + name.slice(1);
|
||||
}
|
||||
schoolgradenext() {
|
||||
if(_.contains([null, undefined, ""], Meteor.user().profile.school ||
|
||||
_.contains([null, undefined, ""], Meteor.user().profile.grade))) {
|
||||
return "";
|
||||
} else {
|
||||
return "disabled";
|
||||
}
|
||||
},
|
||||
showArrow(type) {
|
||||
var order = [
|
||||
{"back":false, "forward":true},
|
||||
{"back":true, "forward":true},
|
||||
{"back":true, "forward":false}
|
||||
];
|
||||
var section = Session.get("sections");
|
||||
if(type === "forward") {
|
||||
return (section[1]+1 <= section[0] && order[section[1]][type]) ? "block":"none";
|
||||
} else {
|
||||
return (order[section[1]][type]) ? "block":"none";
|
||||
}
|
||||
},
|
||||
classes() {
|
||||
var array = classes.find({
|
||||
status: {
|
||||
$eq: true
|
||||
},
|
||||
privacy: {
|
||||
$eq: false
|
||||
},
|
||||
school: {
|
||||
$eq: Session.get("profile").school
|
||||
}
|
||||
return "Custom";
|
||||
},*/
|
||||
classSettings() { // Returns autocomplete array for classes.
|
||||
}, {
|
||||
sort: {
|
||||
subscribers: -1
|
||||
}
|
||||
}, {
|
||||
limit: 20
|
||||
}).fetch();
|
||||
|
||||
for (var i = 0; i < array.length; i++) {
|
||||
array[i].join = true;
|
||||
array[i].subscribers = array[i].subscribers.length;
|
||||
array[i].teachershort = array[i].teacher.split(" ").slice(1).reduce(function(a, b) {
|
||||
return a + " " + b;
|
||||
});
|
||||
}
|
||||
if (array.length === 0) {
|
||||
Session.set("noclass", true);
|
||||
} else {
|
||||
Session.set("noclass", false);
|
||||
}
|
||||
return array;
|
||||
},
|
||||
classSettings() {
|
||||
return {
|
||||
position: "bottom",
|
||||
limit: 10,
|
||||
@ -63,108 +92,6 @@ 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: classes,
|
||||
field: 'teacher',
|
||||
template: Template.teacherList
|
||||
}]
|
||||
};
|
||||
},
|
||||
banner() { // Returns banner
|
||||
return Session.get("user").banner;
|
||||
},
|
||||
avatar() { // Returns avatar
|
||||
return Meteor.user().services.google.picture;
|
||||
},
|
||||
username() { //Returns current user's username
|
||||
return Session.get("user").name;
|
||||
},
|
||||
description() { // Returns the current user's description
|
||||
if (Session.get("user").description !== undefined && Session.get("user").description !== null && Session.get("user").description !== "") return Session.get("user").description;
|
||||
return "Say something about yourself!";
|
||||
},
|
||||
school() { // Returns the current user's school's name
|
||||
if (!_.contains([null, undefined, ""], Session.get("user").school)) return Session.get("user").school;
|
||||
return "Click here to edit...";
|
||||
},
|
||||
grade() { // Returns the current user's grade
|
||||
if (Session.get("user").grade !== undefined &&
|
||||
Session.get("user").grade !== null &&
|
||||
Session.get("user").grade !== "") return (Session.get("user").grade === 0) ? "Faculty" : Session.get("user").grade;
|
||||
return "Click here to edit...";
|
||||
},
|
||||
classes() { // Loads all of the possible classes ( Limit of twenty shown ) ( Sorts by class size ) ( Only your school)
|
||||
var array = classes.find({
|
||||
status: {
|
||||
$eq: true
|
||||
},
|
||||
privacy: {
|
||||
$eq: false
|
||||
},
|
||||
_id: {
|
||||
$nin: Session.get("user").classes
|
||||
},
|
||||
school: {
|
||||
$eq: Session.get("user").school
|
||||
}
|
||||
}, {
|
||||
sort: {
|
||||
subscribers: -1
|
||||
}
|
||||
}, {
|
||||
limit: 20
|
||||
}).fetch();
|
||||
|
||||
for (var i = 0; i < array.length; i++) {
|
||||
array[i].subscribers = array[i].subscribers.length;
|
||||
}
|
||||
if (array.length === 0) {
|
||||
Session.set("noclass", true);
|
||||
} else {
|
||||
Session.set("noclass", false);
|
||||
}
|
||||
return array;
|
||||
},
|
||||
ownedStatus() { // Status of createdClasses
|
||||
if (!Session.get("owned")) return openValues.owned;
|
||||
return "0px";
|
||||
},
|
||||
privStatus() {
|
||||
if (!Session.get("privClass")) return openValues.priv;
|
||||
return "0px";
|
||||
},
|
||||
profClassTabColor(status) { // Change this [Supposed to show the current mode that's selected via color]
|
||||
if (Session.equals("profClassTab", status)) {
|
||||
return Meteor.user().profile.preferences.theme.modeHighlight;
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
},
|
||||
profClassTab(tab) { // Tells current class
|
||||
if (Session.equals("profClassTab", tab)) {
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
},
|
||||
notsearching() { // Tells whether user is using the searchbox
|
||||
return Session.get("notsearching");
|
||||
},
|
||||
@ -173,316 +100,63 @@ Template.profile.helpers({
|
||||
},
|
||||
notfound() { // Returns if autocomplete has no results.
|
||||
return Session.get("notfound");
|
||||
},
|
||||
noclass() { // Returns if user has classes.
|
||||
return Session.get("noclass");
|
||||
},
|
||||
confirmText() { // Returns respective text for different confirm functions.
|
||||
return Session.get("confirmText");
|
||||
},
|
||||
selectedClass(val) { // Returns values for selectedClass
|
||||
if (Session.equals("selectedClass", null)) return;
|
||||
return Session.get("selectedClass")[val];
|
||||
},
|
||||
code() { // Returns if selected class has code.
|
||||
return Session.get("code");
|
||||
}
|
||||
});
|
||||
|
||||
Template.profile.events({
|
||||
'click' (event) { // Whenever a click happens'
|
||||
'click' (event) { // Closes respective divs when clicking outside of them. Order matters.
|
||||
var e = event.target.className;
|
||||
if (modifyingInput !== null && event.target !== document.getElementById(modifyingInput)) {
|
||||
if (!(e.includes("optionHolder") || e.includes("optionText"))) {
|
||||
if (document.getElementById(modifyingInput).className.includes("dropdown")) {
|
||||
$(".optionHolder")
|
||||
.fadeOut(250, "linear");
|
||||
|
||||
$(".selectedOption").removeClass("selectedOption");
|
||||
} else {
|
||||
if (modifyingInput === "description") {
|
||||
Session.set("restrictText", {});
|
||||
$("#" + modifyingInput).css('cursor', 'pointer');
|
||||
var newSetting = Session.get("user");
|
||||
newSetting[modifyingInput] = document.getElementById(modifyingInput).value;
|
||||
serverData = newSetting;
|
||||
sendData("editProfile");
|
||||
}
|
||||
}
|
||||
if(modifyingInput !== null && event.target !== document.getElementById(modifyingInput)) {
|
||||
if (!(e.includes("optionHolder") || e.includes("optionText"))) {
|
||||
toggleOptionMenu(false, modifyingInput);
|
||||
modifyingInput = null;
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
// MAIN BUTTONS
|
||||
'click #mainpage' () {
|
||||
if (!Meteor.userId() || _.contains([null, undefined, ""], Meteor.user().profile.school)) {
|
||||
sAlert.closeAll();
|
||||
sAlert.error('Please fill in your profile!', {
|
||||
'click #basicNext' () {
|
||||
var inputs = document.getElementsByClassName("basicInfoField");
|
||||
var required = ["school", "grade"];
|
||||
var alert = checkComplete(required, inputs);
|
||||
var values = alert[2];
|
||||
if(!alert[0]) {
|
||||
sAlert.error("Missing " + alert[1], {
|
||||
effect: 'stackslide',
|
||||
position: 'top'
|
||||
position: 'top',
|
||||
timeout: 3000
|
||||
});
|
||||
} else {
|
||||
window.location = '/';
|
||||
}
|
||||
},
|
||||
'click #schoolnext' () {
|
||||
if (Meteor.user().profile.school && Meteor.user().profile.grade) {
|
||||
document.getElementById('schoolnext').style.display = "none";
|
||||
document.getElementById('classsection').style.display = "";
|
||||
} else {
|
||||
sAlert.error("Please fill out the fields", {
|
||||
effect: 'stackslide',
|
||||
position: 'top'
|
||||
});
|
||||
}
|
||||
},
|
||||
'click .addClass' () {
|
||||
if (Session.equals("profClassTab", "addClass")) return;
|
||||
var functionHolder = document.getElementById("profClassInfoHolder");
|
||||
closeDivFade(functionHolder);
|
||||
var div = document.getElementById("profClasses");
|
||||
div.style.height = "50%";
|
||||
setTimeout(function() {
|
||||
Session.set("profClassTab", "addClass");
|
||||
div.style.height = "70%";
|
||||
openDivFade(functionHolder);
|
||||
}, 400);
|
||||
},
|
||||
'click .manageClass' () {
|
||||
if (Session.equals("profClassTab", "manClass")) return;
|
||||
var functionHolder = document.getElementById("profClassInfoHolder");
|
||||
closeDivFade(functionHolder);
|
||||
var div = document.getElementById("profClasses");
|
||||
div.style.height = "50%";
|
||||
setTimeout(function() {
|
||||
Session.set("profClassTab", "manClass");
|
||||
div.style.height = "70%";
|
||||
openDivFade(functionHolder);
|
||||
}, 400);
|
||||
},
|
||||
'click .createClass' () {
|
||||
if (Session.equals("profClassTab", "creClass")) return;
|
||||
var functionHolder = document.getElementById("profClassInfoHolder");
|
||||
closeDivFade(functionHolder);
|
||||
var div = document.getElementById("profClasses");
|
||||
div.style.height = "50%";
|
||||
setTimeout(function() {
|
||||
Session.set("profClassTab", "creClass");
|
||||
div.style.height = "70%";
|
||||
openDivFade(functionHolder);
|
||||
}, 400);
|
||||
},
|
||||
'click .classBox' (event) { // When you click on a box that holds class
|
||||
if (event.target.id === "label" ||
|
||||
Session.equals("profClassTab", "manClass") ||
|
||||
event.target.className.includes("fa-times")) return;
|
||||
|
||||
if (event.target.className !== "classBox") {
|
||||
var attribute = event.target.parentNode.getAttribute("classid");
|
||||
} else {
|
||||
var attribute = event.target.getAttribute("classid");
|
||||
}
|
||||
var data = [attribute, ""];
|
||||
serverData = data;
|
||||
confirm = "joinClass";
|
||||
Session.set("confirmText", "Join class?");
|
||||
|
||||
openDivFade(document.getElementsByClassName("overlay")[0]);
|
||||
setTimeout(function() {
|
||||
document.getElementsByClassName("overlay")[0].style.opacity = "1";
|
||||
}, 200);
|
||||
},
|
||||
'click .owned' (event) { // When you click your own class
|
||||
if (event.target.id === "label") return;
|
||||
if (!event.target.className.includes("owned")) {
|
||||
var attribute = event.target.parentNode.getAttribute("classid");
|
||||
} else {
|
||||
var attribute = event.target.getAttribute("classid");
|
||||
}
|
||||
if (attribute === Meteor.userId()) return;
|
||||
Session.set("selectedClass", null);
|
||||
var usertype = ["moderators", "banned"];
|
||||
var array = classes.findOne({
|
||||
_id: attribute
|
||||
});
|
||||
|
||||
for (var i = 0; i < usertype.length; i++) {
|
||||
var users = array[usertype[i]];
|
||||
array[usertype[i]] = [];
|
||||
for (var j = 0; j < users.length; j++) {
|
||||
var detailusers = {};
|
||||
var user = Meteor.users.findOne({
|
||||
_id: users[j]
|
||||
});
|
||||
detailusers._id = user._id;
|
||||
detailusers.email = user.services.google.email;
|
||||
detailusers.name = user.profile.name;
|
||||
array[usertype[i]].push(detailusers);
|
||||
}
|
||||
}
|
||||
|
||||
Meteor.call('getCode', attribute, function(err, result) {
|
||||
array.code = result;
|
||||
if (result === "None") {
|
||||
Session.set("code", false);
|
||||
} else {
|
||||
Session.set("code", true);
|
||||
}
|
||||
|
||||
Session.set("selectedClass", array);
|
||||
Session.set("owned", true);
|
||||
});
|
||||
},
|
||||
'click .classBox .fa-times' (event) { // Leaves a class
|
||||
var box = event.target.parentNode;
|
||||
var classid = box.getAttribute("classid");
|
||||
serverData = box.getAttribute("classid");
|
||||
confirm = "leaveClass";
|
||||
Session.set("confirmText", "Leave this class?");
|
||||
openDivFade(document.getElementsByClassName("overlay")[0]);
|
||||
},
|
||||
'click #creSubmit' () { //Submits form data for class
|
||||
var data = getCreateFormData();
|
||||
if (data === null) return;
|
||||
serverData = data;
|
||||
confirm = "createClass";
|
||||
Session.set("confirmText", "Submit request?");
|
||||
|
||||
openDivFade(document.getElementsByClassName("overlay")[0]);
|
||||
},
|
||||
'click #private' (event) { // Joins private class
|
||||
if (Session.get("privClass")) return;
|
||||
var input = document.getElementById("privateCode");
|
||||
input.className = "";
|
||||
input.placeholder = "Enter code here...";
|
||||
Session.set("privClass", true);
|
||||
},
|
||||
'click #privSubmit' () { // Submits private class code
|
||||
var input = document.getElementById("privateCode");
|
||||
var code = input.value;
|
||||
input.value = "";
|
||||
serverData = code;
|
||||
Meteor.call("joinPrivateClass", code, function(error, result) {
|
||||
if (result) {
|
||||
Session.set("privClass", false);
|
||||
} else {
|
||||
input.className = "formInvalid";
|
||||
input.placeholder = "Invalid code.";
|
||||
}
|
||||
});
|
||||
},
|
||||
// OWNED CLASS BUTTONS
|
||||
'click #copy' () { // Copies code for private classes.
|
||||
if (document.getElementById("code").value === "None") return;
|
||||
document.getElementById("code").select();
|
||||
document.execCommand("copy");
|
||||
},
|
||||
'click .userAdder .fa-plus' (event) { // Gives/Removes user privileges
|
||||
var input = event.target.parentNode.childNodes[3];
|
||||
input.placeholder = "1234@abc.xyz";
|
||||
input.className.replace(" formInvalid", "");
|
||||
var value = input.value;
|
||||
var classid = document.getElementById("createdClasses").getAttribute("classid");
|
||||
input.value = " ";
|
||||
if (checkUser(value, classid)) {
|
||||
input.className += " formInvalid";
|
||||
input.placeholder = "Not a valid user";
|
||||
return;
|
||||
}
|
||||
var user = Meteor.users.findOne({
|
||||
"services.google.email": value
|
||||
});
|
||||
serverData = [
|
||||
user._id,
|
||||
classid,
|
||||
event.target.parentNode.childNodes[1].childNodes[0].nodeValue.replace(":", "").toLowerCase(),
|
||||
true
|
||||
];
|
||||
sendData("trackUserInClass");
|
||||
}
|
||||
var profile = Session.get("profile");
|
||||
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]])
|
||||
slideToField(1);
|
||||
},
|
||||
'click .userBox .fa-times' (event) { // Removes user from permissions
|
||||
var box = event.target.parentNode;
|
||||
serverData = [
|
||||
box.getAttribute("userid"),
|
||||
document.getElementById("createdClasses").getAttribute("classid"),
|
||||
box.parentNode.parentNode.childNodes[1].childNodes[1].childNodes[0].nodeValue.replace(":", "").toLowerCase(),
|
||||
false
|
||||
];
|
||||
sendData("trackUserInClass");
|
||||
'click #backArrow' () {
|
||||
slideToField(Session.get("sections")[1]-1);
|
||||
},
|
||||
'click #deleteClass' () {
|
||||
serverData = document.getElementById("createdClasses").getAttribute("classid");
|
||||
confirm = "deleteClass";
|
||||
Session.set("confirmText", "Delete this class?");
|
||||
openDivFade(document.getElementsByClassName("overlay")[0]);
|
||||
'click #forwardArrow' () {
|
||||
slideToField(Session.get("sections")[1]+1);
|
||||
},
|
||||
'click #changeAdmin span' (event) { // Click to give ownership of class.
|
||||
if (Session.get("changeAdmin")) return;
|
||||
Session.set("changeAdmin", true);
|
||||
var input = document.createElement("input");
|
||||
input.placeholder = "1234@abc.xyz";
|
||||
var i = document.createElement("i");
|
||||
i.className = "fa fa-exchange";
|
||||
i.setAttribute("aria-hidden", "true");
|
||||
event.target.parentNode.appendChild(input);
|
||||
event.target.parentNode.appendChild(i);
|
||||
},
|
||||
'click .fa-exchange' (event) { //Changes class admin upon confirmation
|
||||
var input = event.target.parentNode.childNodes[3];
|
||||
input.placeholder = "1234@abc.xyz";
|
||||
input.className.replace(" formInvalid", "");
|
||||
var value = input.value;
|
||||
var classid = document.getElementById("createdClasses").getAttribute("classid");
|
||||
input.value = "";
|
||||
if (checkUser(value, classid)) {
|
||||
input.className += " formInvalid";
|
||||
input.placeholder = "Not a valid user";
|
||||
return;
|
||||
}
|
||||
var user = Meteor.users.findOne({
|
||||
"services.google.email": value
|
||||
});
|
||||
serverData = [user._id, classid];
|
||||
confirm = "changeAdmin";
|
||||
Session.set("confirmText", "Are you really sure?");
|
||||
openDivFade(document.getElementsByClassName("overlay")[0]);
|
||||
document.getElementById("createdClasses").style.marginRight = "-40%";
|
||||
},
|
||||
// OVERLAY BUTTONS
|
||||
'click .fa-check-circle-o' () { // Confirmation Button
|
||||
sendData(confirm);
|
||||
closeDivFade(document.getElementsByClassName("overlay")[0]);
|
||||
if (confirm === "createClass") {
|
||||
var form = document.getElementsByClassName("creInput");
|
||||
for (var i = 0; i < form.length; i++) form[i].value = "";
|
||||
}
|
||||
serverData = null;
|
||||
confirm = null;
|
||||
},
|
||||
'click .fa-times-circle-o' () { // Deny Button
|
||||
closeDivFade(document.getElementsByClassName("overlay")[0]);
|
||||
serverData = null;
|
||||
confirm = null;
|
||||
},
|
||||
// INPUT HANDLING
|
||||
// HANDLING INPUT CHANGING
|
||||
'focus .clickModify' (event) {
|
||||
$(".optionHolder")
|
||||
.fadeOut(250, "linear");
|
||||
.fadeOut(100);
|
||||
|
||||
if (modifyingInput !== null) {
|
||||
if (!$("#" + modifyingInput)[0].className.includes("dropdown")) closeInput(modifyingInput);
|
||||
if(modifyingInput !== null) {
|
||||
if(!$("#"+modifyingInput)[0].className.includes("dropdown")) closeInput(modifyingInput);
|
||||
}
|
||||
modifyingInput = event.target.id;
|
||||
if (!$("#" + modifyingInput)[0].className.includes("dropdown")) {
|
||||
if(!$("#"+modifyingInput)[0].className.includes("dropdown")) {
|
||||
event.target.select();
|
||||
event.target.style.cursor = "text";
|
||||
}
|
||||
},
|
||||
'keydown .dropdown' (event) {
|
||||
event.preventDefault();
|
||||
var first = $("#" + modifyingInput).next().children("p:first-child");
|
||||
var last = $("#" + modifyingInput).next().children("p:last-child");
|
||||
var first = $("#"+modifyingInput).next().children("p:first-child");
|
||||
var last = $("#"+modifyingInput).next().children("p:last-child");
|
||||
var next = $(".selectedOption").next();
|
||||
var prev = $(".selectedOption").prev();
|
||||
var lastSel = $(".selectedOption");
|
||||
@ -516,63 +190,26 @@ Template.profile.events({
|
||||
}
|
||||
} else if (event.keyCode === 13) {
|
||||
lastSel[0].click();
|
||||
$("#"+modifyingInput)[0].focus();
|
||||
}
|
||||
},
|
||||
'focus .dropdown' (event) {
|
||||
$(".selectedOption").removeClass("selectedOption");
|
||||
|
||||
$("#" + modifyingInput).next()
|
||||
.css('opacity', 0)
|
||||
.slideDown(300)
|
||||
.animate({
|
||||
opacity: 1
|
||||
}, {
|
||||
queue: false,
|
||||
duration: 100
|
||||
});
|
||||
'click .dropdown, focus .dropdown' (event) {
|
||||
if(clickDisabled) return;
|
||||
clickDisabled = true;
|
||||
if(event.target.id === optionOpen[0] && optionOpen[1]) {
|
||||
toggleOptionMenu(false, event.target.id);
|
||||
} else {
|
||||
toggleOptionMenu(true, event.target.id);
|
||||
}
|
||||
setTimeout(function(){clickDisabled = false;},130); // Prevents spamming and handles extra click events.
|
||||
},
|
||||
'click .optionText' (event) { // Click each preferences setting.
|
||||
var option = event.target.childNodes[0].nodeValue;
|
||||
var userSettings = ["description", "school", "grade"];
|
||||
var newSetting = Session.get("user");
|
||||
|
||||
if (modifyingInput === "privacy" || modifyingInput === "category") {
|
||||
document.getElementById(modifyingInput).value = option;
|
||||
$("#" + modifyingInput).next()
|
||||
.fadeOut(250, "linear");
|
||||
$(".selectedOption").removeClass("selectedOption");
|
||||
return;
|
||||
}
|
||||
|
||||
if (_.contains(userSettings, modifyingInput)) {
|
||||
newSetting[modifyingInput] = (modifyingInput === "grade") ? parseInt(option) : option;
|
||||
} else {
|
||||
newSetting.preferences[modifyingInput] = (function() {
|
||||
var value = options[modifyingInput].filter(function(entry) {
|
||||
return option === entry.alias;
|
||||
})[0].val;
|
||||
return (modifyingInput === 'theme') ? themeColors[value] : value;
|
||||
})();
|
||||
}
|
||||
Session.set("user", newSetting);
|
||||
serverData = Session.get("user");
|
||||
sendData("editProfile");
|
||||
|
||||
$("#" + modifyingInput).next()
|
||||
.fadeOut(250, "linear");
|
||||
|
||||
document.getElementById(modifyingInput).value = option;
|
||||
toggleOptionMenu(false, modifyingInput);
|
||||
$(".selectedOption").removeClass("selectedOption");
|
||||
},
|
||||
'input .restrict' (event) {
|
||||
var restrict = event.target.maxLength;
|
||||
var chars = restrict - event.target.value.length;
|
||||
var newSetting = Session.get("restrictText");
|
||||
newSetting[event.target.id] = (chars === restrict) ? "" : (chars.toString() + ((chars === 1) ? " character " : " characters ") + "left");
|
||||
newSetting.selected = event.target.id;
|
||||
Session.set("restrictText", newSetting);
|
||||
},
|
||||
// AUTOCOMPLETE HANDLING
|
||||
'input #profClassSearch' (event) { // Auto-complete updater
|
||||
'input #classSearch' (event) { // Auto-complete updater
|
||||
if (event.target.value.length === 0) {
|
||||
Session.set("notsearching", true);
|
||||
} else {
|
||||
@ -599,132 +236,24 @@ Template.profile.events({
|
||||
});
|
||||
}
|
||||
Session.set("autocompleteDivs", divs.sort(function(a, b) {
|
||||
return b.subscribers - a.subscribers
|
||||
return b.subscribers - a.subscribers;
|
||||
}));
|
||||
} catch (err) {}
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
function openDivFade(div) {
|
||||
div.style.display = "block";
|
||||
div.style.opacity = "0";
|
||||
setTimeout(function() {
|
||||
div.style.opacity = "1";
|
||||
}, 100);
|
||||
}
|
||||
|
||||
function closeDivFade(div) {
|
||||
div.style.opacity = "0";
|
||||
setTimeout(function() {
|
||||
div.style.display = "none";
|
||||
}, 100);
|
||||
}
|
||||
|
||||
function sendData(funcName) {
|
||||
Meteor.call(funcName, serverData, function(err, result) {
|
||||
if (funcName === "trackUserInClass") {
|
||||
var selectedClass = Session.get("selectedClass");
|
||||
var array = classes.findOne({
|
||||
_id: selectedClass._id
|
||||
});
|
||||
var usertype = ["moderators", "banned"];
|
||||
for (var i = 0; i < usertype.length; i++) {
|
||||
var users = array[usertype[i]];
|
||||
array[usertype[i]] = [];
|
||||
for (var j = 0; j < users.length; j++) {
|
||||
var detailusers = {};
|
||||
var user = Meteor.users.findOne({
|
||||
_id: users[j]
|
||||
});
|
||||
detailusers._id = user._id;
|
||||
detailusers.email = user.services.google.email;
|
||||
detailusers.name = user.profile.name;
|
||||
array[usertype[i]].push(detailusers);
|
||||
}
|
||||
}
|
||||
selectedClass.moderators = array.moderators;
|
||||
selectedClass.banned = array.banned;
|
||||
Session.set("selectedClass", selectedClass);
|
||||
function slideToField(field) {
|
||||
var order = ["basicInfo", "enrollInfo"];
|
||||
$(".moveArrow").animate({"opacity":0})
|
||||
var viewing = Session.get("sections")[1]
|
||||
var move = (viewing-field < 0) ? "-50%" : "150%";
|
||||
$("#"+order[viewing]).animate({top: move});
|
||||
$("#"+order[field]).animate({
|
||||
top:"20%"
|
||||
},{
|
||||
complete: function() {
|
||||
Session.set("sections", [Session.get("sections")[0],field]);
|
||||
$(".moveArrow").animate({"opacity":1});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function getProfileData() { // Gets all data related to profile.
|
||||
var profile = Session.get("user");
|
||||
|
||||
profile.description = document.getElementById("motd").childNodes[0].nodeValue;
|
||||
if (profile.description.includes("Say something about yourself!")) profile.description = "";
|
||||
|
||||
profile.school = document.getElementById("school").childNodes[0].nodeValue;
|
||||
if (profile.school === "Click here to edit...") profile.school = "";
|
||||
|
||||
var gradein = document.getElementById("grade").childNodes[0].nodeValue;
|
||||
profile.grade = parseInt(gradein.substring(gradein.length - 2, gradein));
|
||||
if (!profile.grade) profile.grade = "";
|
||||
|
||||
profile.avatar = document.getElementById("profAvatar").src;
|
||||
profile.banner = document.getElementById("profBanner").src;
|
||||
|
||||
var themename = document.getElementById("prefTheme").childNodes[0].nodeValue.toLowerCase();
|
||||
var themeobj = themeColors[themename];
|
||||
profile.preferences = {
|
||||
"theme": themeobj,
|
||||
"mode": document.getElementById("prefMode").childNodes[0].nodeValue.toLowerCase(),
|
||||
"timeHide": ref[document.getElementById("prefHide").childNodes[0].nodeValue],
|
||||
"done": ref[document.getElementById("prefDone").childNodes[0].nodeValue],
|
||||
"hideReport": ref[document.getElementById("prefReport").childNodes[0].nodeValue]
|
||||
};
|
||||
return profile;
|
||||
}
|
||||
|
||||
function getCreateFormData() { // Gets create class form data, and returns null.
|
||||
var stop;
|
||||
var form = document.getElementsByClassName("creInput");
|
||||
for (var i = 0; i < form.length; i++) { // Checks for missing/invalid fields.
|
||||
if (i === 1 || i === 2) continue;
|
||||
if (form[i].value === "") {
|
||||
form[i].focus();
|
||||
form[i].placeholder = "Missing field";
|
||||
form[i].className += " formInvalid";
|
||||
stop = true;
|
||||
} else {
|
||||
form[i].className = form[i].className.replace(" formInvalid", "");
|
||||
}
|
||||
}
|
||||
if (stop) return null;
|
||||
|
||||
var school = form[0].value;
|
||||
var hour = form[1].value;
|
||||
var teacher = form[2].value;
|
||||
var name = form[3].value;
|
||||
if (form[4].value == "Public") {
|
||||
var privacy = false;
|
||||
} else {
|
||||
var privacy = true;
|
||||
}
|
||||
var category = form[5].value.toLowerCase();
|
||||
return {
|
||||
school: school,
|
||||
hour: hour,
|
||||
teacher: teacher,
|
||||
name: name,
|
||||
privacy: privacy,
|
||||
category: category,
|
||||
status: false,
|
||||
code: ""
|
||||
};
|
||||
}
|
||||
|
||||
function checkUser(email, classid) { // Checks if user email exists.
|
||||
var user = Meteor.users.findOne({
|
||||
"services.google.email": email
|
||||
});
|
||||
if (user === undefined) {
|
||||
return true;
|
||||
} else {
|
||||
if (classes.findOne({
|
||||
_id: classid
|
||||
}).subscribers)
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
@ -122,4 +122,9 @@ options = {
|
||||
}
|
||||
|
||||
serverData = null;
|
||||
confirm = null;
|
||||
confirm = null;
|
||||
|
||||
//Input Handling
|
||||
modifyingInput = null;
|
||||
clickDisabled = false;
|
||||
optionOpen = false;
|
||||
@ -62,7 +62,6 @@ Router.route('/profile', {
|
||||
}
|
||||
},
|
||||
action: function() {
|
||||
Session.set("user", Meteor.user().profile);
|
||||
this.render("profile");
|
||||
}
|
||||
});
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user