This commit is contained in:
Yaman Qalieh 2016-10-19 21:12:08 -04:00
commit 174f70769a
10 changed files with 761 additions and 639 deletions

View File

@ -9,10 +9,9 @@ mobile-experience@1.0.4 # Packages for a great mobile UX
mongo@1.1.12_1 # The database Meteor supports right now
blaze-html-templates@1.0.4 # Compile .html files into Meteor Blaze views
reactive-var@1.0.10 # Reactive variable for tracker
jquery@1.11.9 # Helpful client-side library
jquery # Helpful client-side library
tracker@1.1.0 # Meteor's client-side reactive programming library
standard-minifier-css@1.2.0_1 # CSS minifier run for production mode
standard-minifier-js@1.2.0_1 # JS minifier run for production mode
es5-shim@4.6.14_1 # ECMAScript 5 compatibility for older browsers.
ecmascript@0.5.8_1 # Enable ECMAScript2015+ syntax in app code
@ -36,7 +35,6 @@ underscore@1.0.9
ahref:dragula
harrison:papa-parse
pfafman:filesaver
flemay:less-autoprefixer
natestrauser:select2
juliancwirko:s-alert
juliancwirko:s-alert-stackslide
@ -44,3 +42,4 @@ aldeed:collection2
dburles:collection-helpers
yogiben:admin-edit
mfactory:admin-lte
standard-minifier-css

View File

@ -42,7 +42,6 @@ email@1.0.16
es5-shim@4.6.14_1
eternicode:bootstrap-datepicker@1.6.0_3
fastclick@1.0.12
flemay:less-autoprefixer@1.2.0
fortawesome:fontawesome@4.5.0
geojson-utils@1.0.9
google@1.1.14
@ -74,7 +73,7 @@ meteor-base@1.0.4
meteorhacks:meteorx@1.4.1
meteorhacks:unblock@1.1.0
mfactory:admin-lte@0.0.2
minifier-css@1.2.14
minifier-css@1.2.14_1
minifier-js@1.2.14_1
minimongo@1.0.17
mizzao:autocomplete@0.5.1

View File

@ -99,11 +99,6 @@ body {
position: absolute;
top: 0;
z-index: 50;
-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;
}
#mainHeader h1, #mainHeader h2 {
@ -154,7 +149,7 @@ body {
.noScroll input, .noScroll textarea {
font-family: 'Raleway';
background-color: #EBEBEB;
border: 3px solid #EBEBEB;
border: 3px solid #CECECE;
border-radius: 3px;
resize: none;
}
@ -237,10 +232,10 @@ body {
z-index: 5;
overflow: hidden;
-webkit-transition: left 0.5s ease, right 0.5s ease, background-color 0.5s ease;
-moz-transition: left 0.5s ease, right 0.5s ease, background-color 0.5s ease;
-ms-transition: left 0.5s ease, right 0.5s ease, background-color 0.5s ease;
transition: left 0.5s ease, right 0.5s ease, background-color 0.5s ease;
-webkit-transition: left 0.5s ease, right 0.5s ease;
-moz-transition: left 0.5s ease, right 0.5s ease
-ms-transition: left 0.5s ease, right 0.5s ease;
transition: left 0.5s ease, right 0.5s ease;
}
#optionsContainer {
@ -476,8 +471,8 @@ body {
white-space: normal;
word-break: break-all;
-webkit-filter: none;
filter: none;
-webkit-filter: none !important;
filter: none !important;
}
.mainClassHour {
@ -489,7 +484,7 @@ body {
cursor: pointer;
box-shadow: 0px 5px 5px 1px #666;
-webkit-transition: background-color 0.4s ease;
-webkit-transition: background-color 0.4 ease;
-moz-transition: background-color 0.4s ease;
-ms-transition: background-color 0.4s ease;
transition: background-color 0.4s ease;
@ -555,8 +550,8 @@ body {
width: 50%;
margin-top: 0;
-webkit-filter: none;
filter: none;
-webkit-filter: none !important;
filter: none !important;
display: table-cell;
white-space: normal;
@ -574,10 +569,12 @@ body {
}
input.clickModify, textarea.clickModify {
width: 100%;
font-size: 2.2vh;
font-weight: 200;
background-color: rgba(0,0,0,0);
border-color: rgba(0,0,0,0);
cursor: pointer;
-webkit-transition: background-color 0.4s ease, border-color 0.4s ease;
-moz-transition: background-color 0.4s ease, border-color 0.4s ease;
@ -586,9 +583,8 @@ input.clickModify, textarea.clickModify {
}
input.clickModify:hover, textarea.clickModify:hover {
cursor: pointer;
background-color: rgba(255,255,255,0.1);
border-color: rgba(255,255,255,0.1);;
background-color: rgba(0,0,0,0.1);
}
textarea.clickModify {
@ -607,12 +603,15 @@ textarea.clickModify {
#editWorkCont {
width: 100%;
height: 100%;
min-height: 68vh;
position: relative;
display: table;
}
#workInfoContainer {
min-height: 68vh;
}
#workTypeBar {
background-color: rgba(0,0,0,0.1);
height: 2%;
@ -625,7 +624,16 @@ textarea.clickModify {
#wName {
font-weight: 400;
font-size: 2.5vh;
width: 100%;
width: 70%;
margin-right: 2%;
}
#wDescription {
margin-bottom: 1%;
}
.info {
font-size: 130%;
}
.workTitle, .prefTitle {
@ -645,20 +653,16 @@ textarea.clickModify {
position: relative;
}
#workNamerestrict, #workDescrestrict, #commentrestrict {
display: none;
}
#workNamerestrict, #workDescrestrict {
margin-top: 1.5%;
float: right;
.noneLeft {
color: red;
}
.clickModify.dropdown {
font-size: 2.5vh;
width: 100%;
border: 1px solid #999797;
background-color: rgba(0,0,0,0.15);
background-color: rgba(0,0,0,0.07);
cursor: pointer;
outline: 0;
@ -669,7 +673,7 @@ textarea.clickModify {
}
.clickModify.dropdown:hover {
background-color: rgba(0,0,0,0.07);
background-color: rgba(0,0,0,0.03);
}
.clickModify.dropdown span {
@ -688,11 +692,14 @@ textarea.clickModify {
.optionHolder {
width: 100%;
margin-top: -1px;
border: 1px solid #666;
position: absolute;
border-top: none;
position: absolute;
z-index: 5;
display: none;
opacity: 0;
@ -702,12 +709,8 @@ textarea.clickModify {
transition: opacity 0.4s ease;
}
.optionHolder:hover {
background-color: rgba(255,255,255,0.05);
}
.optionText {
font-size: 150%;
font-size: 120%;
min-width: 10%;
padding: 4% 7% 4% 7%;
margin: 0;
@ -720,12 +723,8 @@ textarea.clickModify {
transition: box-shadow 0.4s ease;
}
.optionText:hover {
box-shadow: inset 0 0 0 99999px rgba(0,0,0,0.1);
}
.workOptions p:hover, .prefOptions p:hover {
box-shadow: inset 0 0 0 99999px rgba(0,0,0,0.1);
.selectedOption {
box-shadow: inset 0 0 0 99999px rgba(0,0,0,0.2);
}
#workInfoContainer, #workToggle {
@ -752,12 +751,36 @@ textarea.clickModify {
}
#workInfoNmCont div {
margin-bottom: 5%;
margin-bottom: 3%;
}
#workInfo1 div, #workInfo2 div {
margin-bottom: 3%;
}
#workInfo1 {
margin: 0;
padding: 3% 0 0 7%
}
#workInfo2 {
margin: 0;
padding: 0 0 3% 7%;
}
#wType {
margin: 0 !important;
padding: 2%;
}
#typeWrapper {
margin: 0 !important;
min-width: 56%;
position: relative;
display: inline-block;
}
#typeWrapper .optionText:hover {
box-shadow: inset 0 0 0 99999px rgba(0,0,0,0.2);
}
.datepicker {
@ -768,11 +791,7 @@ textarea.clickModify {
}
.type {
width: 95%;
margin-left: 1%;
}
.type p {
padding: 3% 5% 3% 5%;
margin: -1px 0 0 0 !important;
}
#workComments h3 {

View File

@ -146,48 +146,19 @@
<div id="editWork" style="width:{{screen '.4'}}">
<div id="editWorkCont" style="background-color:{{divColor 'mainColor'}};border-top:10px solid {{work 'typeColor'}}">
<div id="workInfoContainer">
<div id="workNameDiv">
<span id="workNamerestrict">{{commentLength}}</span>
<!-- <span class="change req" id="workName" restrict="50">{{work 'name'}}</span> -->
<input id="wName" class="clickModify" style="color:{{divColor 'textColor'}}" value="{{work 'name'}}">
</div>
<div id="workInfoNmCont">
<div>
<span class="workTitle">Due Date:</span><br>
<!-- <span class="change req" re="readonly" id="workDate">{{work 'dueDate'}}</span> -->
<input id="wDueDate" class="clickModify" style="color:{{divColor 'textColor'}}" value="{{work 'dueDate'}}">
</div>
<div>
<span class="workTitle">Description:</span><br>
<span id="workDescrestrict">{{commentLength}}</span>
<!-- <span class="change" type="textarea" id="workDesc" restrict="150">{{work 'description'}}</span> -->
<textarea id="wDescription" class="clickModify" style="color:{{divColor 'textColor'}}" value="{{work 'description'}}" rows="5"></textarea>
</div>
<div>
<span class="workTitle">Type:</span>
<div id="wType" class="clickModify dropdown">
<span>{{work 'type'}}</span>
<i class="fa fa-caret-down" aria-hidden="true"></i>
</div>
<div class="optionHolder type">
{{#each selectOptions 'type'}}
{{> option}}
{{/each}}
</div>
</div>
<!-- <div id="workAttach">Attach other files</div>
<div id="workAttachmentHolder">
{{#each work 'attachments'}}
<a href={{link}}>{{filename}}</a>
{{/each}}
</div> -->
{{#if inRole}}
{{> workDisplayEdit}}
{{else}}
{{> workDisplay}}
{{/if}}
{{#unless newWork}}
<div id="workInfo2">
<div id="workComments">
<h3>Comments</h3>
<div>
<textarea id="workComment" class="restrict" rows="4" cols="50" maxlength="200"></textarea><br>
<div>
<span id="commentrestrict">{{commentLength}}</span>
<span class="resText">{{restrict 'workComment'}}</span>
<div id="commentSubmit">Submit</div>
</div>
</div>
@ -197,8 +168,8 @@
{{/each}}
</div>
</div>
{{/unless}}
</div>
{{/unless}}
</div>
{{#unless newWork}}
<div id="workToggle">
@ -275,7 +246,7 @@
<p>Send an help request, feature, or bug report.</p>
<textarea id="requestArea" class="restrict" rows="4" cols="50" maxlength="500" placeholder="Enter request here..."></textarea><br>
<div id="requestCont" style="background-color:{{divColor 'secondaryColor'}}">
<span id="requestrestrict">{{commentLength}}</span>
<span class="resText">{{restrict 'requestArea'}}</span>
<div id="requestSubmit">Send</div>
</div>
</div>
@ -377,3 +348,68 @@
<template name="option">
<p class="optionText" style="background-color:{{divColor 'mainColor'}}">{{alias}}</p>
</template>
<template name="workDisplay">
<div id="workNameDiv">
<span id="wName" class="info">{{work 'name'}}</span>
</div>
<div id="workInfo1">
<div>
<span class="workTitle">Due Date:</span><br>
<span id="wDescription" class="info">{{work 'dueDate'}}</span>
</div>
<div>
<span class="workTitle">Description:</span><br>
<span id="wDueDate" class="info">{{work 'description'}}</span>
</div>
<div>
<span class="workTitle">Type:</span>
<span id="wType" class="info">{{work 'type'}}</span>
</div>
<!-- <div id="workAttach">Attach other files</div>
<div id="workAttachmentHolder">
{{#each work 'attachments'}}
<a href={{link}}>{{filename}}</a>
{{/each}}
</div> -->
</div>
</template>
<template name="workDisplayEdit">
<div id="workNameDiv">
<input id="wName" class="clickModify restrict" style="color:{{divColor 'textColor'}}" value="{{work 'name'}}" tabindex="10" maxLength="50">
<span class="resText">{{restrict 'wName'}}</span>
</div>
<div id="workInfo1">
<div>
<span class="workTitle">Due Date:</span><br>
<input id="wDueDate" class="clickModify" style="color:{{divColor 'textColor'}}" value="{{work 'dueDate'}}" tabindex="11" readonly>
</div>
<div>
<span class="workTitle">Description:</span><br>
<textarea id="wDescription" class="clickModify restrict" style="color:{{divColor 'textColor'}}" value="{{work 'description'}}" rows="5" tabindex="12" maxLength="150"></textarea>
<span style="opacity:0">.</span>
<span class="resText">{{restrict 'wDescription'}}</span>
</div>
<div>
<span class="workTitle">Type:</span>
<div id="typeWrapper">
<div id="wType" class="clickModify dropdown" tabindex="13">
<span>{{work 'type'}}</span>
<i class="fa fa-caret-down" aria-hidden="true"></i>
</div>
<div class="optionHolder type">
{{#each selectOptions 'type'}}
{{> option}}
{{/each}}
</div>
</div>
</div>
<!-- <div id="workAttach">Attach other files</div>
<div id="workAttachmentHolder">
{{#each work 'attachments'}}
<a href={{link}}>{{filename}}</a>
{{/each}}
</div> -->
</div>
</template>

View File

@ -39,10 +39,7 @@ Session.set("calendarClasses", []); // Stores calendar classes.
Session.set("sidebar", null); // Status of sidebar.
Session.set("requests", false); // Status of requests.
Session.set("newWork", null); // If user creating new work.
Session.set("currentWorkId",null); // Stores current work Id.
Session.set("currentWork",null);
Session.set("currentReadableWork", null); // Stores readable selected work info.
Session.set("modifying", null); // Stores current open input.
Session.set("noclass", null); // If user does not have classes.
Session.set("calCreWork", null); // If user is creating a work from calendar.
Session.set("classDisp", []); // Stores current filter for classes.
@ -50,7 +47,7 @@ Session.set("typeFilter", []); // Stores type filters for classes.
Session.set("typeFilterHover", null); // Stores current hovered type filter.
Session.set("classDispHover", null); // Stores current hovered class filter.
Session.set("refetchEvents", null); // Stores whether to get calendar events again.
Session.set("commentRestrict", ""); // Stores text for comment character restriction.
Session.set("restrictText", {}); // Stores text for comment character restriction.
Template.login.rendered = function() {
@ -60,10 +57,26 @@ Template.login.rendered = function() {
Template.main.rendered = function() {
Accounts._loginButtonsSession.set('dropdownVisible', true);
setTimeout(startDragula, 300);
$(".optionText").hover(
function() {
$(this).addClass("selectedOption");
},
function() {
$(this).removeClass("selectedOption");
}
);
};
Template.profile.rendered = function() {
Accounts._loginButtonsSession.set('dropdownVisible', true);
$(".optionText").hover(
function() {
$(this).addClass("selectedOption");
},
function() {
$(this).removeClass("selectedOption");
}
);
};
Template.registerHelper('userProfile', () => {
@ -229,29 +242,46 @@ Template.registerHelper('pref', (val) => { // Obtains all user preferences.
})[0].alias;
});
Template.registerHelper('commentLength', () => { // Returns characters left for comment length.
return Session.get("commentRestrict");
Template.registerHelper('restrict', (input) => { // Returns characters left for comment length.
var restrict = Session.get("restrictText");
$(".resText").removeClass("noneLeft");
if(Object.keys(restrict).length === 0) return "";
if(restrict[restrict.selected][0] === "0") $(".resText").addClass("noneLeft");
return (restrict.selected === input) ? Session.get("restrictText")[input] : "";
});
function startDragula() {
dragula([document.querySelector('#classesMode'), document.querySelector('#nonexistant')], {
moves: function(el, container, handle) {
// return handle.classList.contains("classInfo") || handle.classList.contains("mainClassName");
return _.intersection(["classInfo", "mainClassName", "mainClassHour", "mainClassTeacher"], handle.classList).length > 0;
Template.registerHelper('selectOptions', (val) => {
if(val === "grade") {
var grade = [];
for(var i = 0; i < 5; i++) {
var year = (new Date).getFullYear() + i;
grade.push( { "val": year, "alias": year.toString() } );
}
})
.on('out', function(el) {
var els = document.getElementsByClassName("classWrapper");
var final = [];
for (var i = 0; i < els.length; i++) {
var classid = els[i].getElementsByClassName("creWork")[0].getAttribute("classid");
final.push(classid);
return grade;
} else if(val === "school") {
var school = [];
var schoolList = schools.find().fetch();
for(var i = 0; i < schoolList.length; i++) {
school.push( { "val": schoolList[i].name, "alias": schoolList[i].name } );
}
return school;
} else {
return options[val];
}
});
Template.registerHelper('work', (value) => {// Returns the specified work value.
var thisWork = Session.get("currentWork");
if (Session.equals("currentWork", null)) return;
if (Session.get("newWork") && (thisWork[value] === true || thisWork[value] === undefined)) {
return defaultWork[value];
} else {
return formReadable(thisWork,value);
}
});
Template.main.helpers({
themeName() {
/*themeName() {
var vals = _.values(themeColors);
var curtheme = Session.get("user").preferences.theme;
for (var i = 0; i < vals.length; i++) {
@ -261,7 +291,7 @@ Template.main.helpers({
}
}
return "Custom";
},
},*/
schoolName() { // Finds the name of the user's school.
if (Session.get("user").school === undefined || Session.get("user").school === null) return;
return " - " + Session.get("user").school;
@ -372,7 +402,7 @@ Template.main.helpers({
},
eventClick: function(event, jsEvent, view) { // On-click for work.
Session.set("newWork", false);
Session.set("currentWorkId", event.id);
Session.set("currentWork", work.findOne({_id: event.id}));
openDivFade(document.getElementsByClassName("overlay")[0]);
},
eventMouseover: function(event, jsEvent, view) {
@ -421,18 +451,6 @@ Template.main.helpers({
}
return;
},
work(value) { // Returns the specified work value.
var thisWork = Session.get("currentWork");
if (Session.equals("currentWork", null)) return;
if (Session.get("newWork") && (thisWork[value] === "Missing field" || thisWork[value] === undefined)) {
return defaultWork[value];
} else {
return formReadable(thisWork,value);
}
},
selectOptions(val) {
return options[val];
},
newWork() { // If user is creating a new work.
return Session.get("newWork");
},
@ -449,8 +467,9 @@ Template.main.helpers({
return array;
},
inRole() { // Checks correct permissions.
if(Session.equals("currentWork",null)) return;
var thisWork = work.findOne({
_id: Session.get("currentWorkId")
_id: Session.get("currentWork")._id
});
if (Session.get("newWork")) {
return true;
@ -482,13 +501,12 @@ Template.main.events({
var e = event.target.className;
if(modifyingInput !== null && event.target !== document.getElementById(modifyingInput)) {
if (!_.contains(e, ["optionHolder", "optionText"])) {
if (!(e.includes("optionHolder") || e.includes("optionText"))) {
if(document.getElementById(modifyingInput).className.includes("dropdown")) {
$(".optionHolder")
.fadeOut('fast')
.hide('fast');
.fadeOut(250, "linear");
dropOpen = false;
$(".selectedOption").removeClass("selectedOption");
} else {
closeInput(modifyingInput);
}
@ -514,12 +532,10 @@ Template.main.events({
if (e === "overlay") { // Overlay closing.
closeDivFade(document.getElementsByClassName("overlay")[0]);
Session.set("newWork",false);
if (!Session.get("newWork")) {
document.getElementById("workComment").value = "";
}
Session.set("newWork", null);
$('.req').css("color", "");
Session.set("commentRestrict", null);
}
if (!document.getElementById("userDropdown").contains(event.target)) closeDivFade(document.getElementById("userDropdown"));
@ -584,14 +600,14 @@ Template.main.events({
attr = event.target.getAttribute("classid");
}
Session.set("newWork", true);
Session.set("currentWork",{"class": attr});
Session.set("currentWork",{class: attr, dueDate: (new Date((new Date()).valueOf() + 1000*3600*24))});
openDivFade(document.getElementsByClassName("overlay")[0]);
},
'click #dropdown' (event) {
if (document.getElementById("userDropdown").style.display === "block") return;
setTimeout(function() {
openDivFade(document.getElementById("userDropdown"));
}, 300);
}, 100);
},
'click .workCard' (event) { // Display work information on work card click.
var dom = event.target;
@ -637,74 +653,6 @@ Template.main.events({
}, 750);
});
},
// HANDLING INPUT CHANGING
'click .clickModify' (event) {
if(modifyingInput !== event.target.id) modifyingInput = event.target.id;
},
'focus .clickModify' (event) {
if(modifyingInput !== event.target.id) modifyingInput = event.target.id;
},
'keydown .dropdown' (event) {
console.log("hi");
},
'focus .dropdown' (event) {
if(event.target.id === modifyingInput) return;
event.target.click();
},
'click .dropdown' (event) {
console.log(dropOpen);
console.log(event.target.id === modifyingInput);
if(event.target.id === modifyingInput && dropOpen) {
dropOpen = false;
modifyingInput = null;
$("#" + modifyingInput).next()
.fadeOut(200)
.hide(200);
console.log("hiasdf");
return;
}
dropOpen = true;
$("#" + modifyingInput).next()
.css('opacity',0)
.slideDown(300)
.animate(
{ opacity: 1 },
{ queue: false, duration: 100 }
)
//event.target.focus();
},
'click .optionText' (event) { // Click each preferences setting.
var option = event.target.childNodes[0].nodeValue;
if(modifyingInput[0] === 'w') {
var newSetting = Session.get("currentWork");
newSetting[modifyingInput.charAt(1).toLowerCase() + modifyingInput.slice(2)] = option;
Session.set("currentWork", newSetting);
} else {
var newSetting = Session.get("user");
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('fast')
.hide('fast');
},
'click #workComment' (event) {
var restrict = event.target.maxLength;
Session.set("commentRestrict", restrict - event.target.value.length.toString() + " characters left");
var text = document.getElementById("commentrestrict");
text.style.display = "initial";
text.style.color = "#7E7E7E";
},
'click #exportDiv' (event) {
var events = [];
var userClasses = Session.get("calendarClasses");
@ -741,33 +689,108 @@ Template.main.events({
});
saveAs(eventBlob, "hourglass.csv");
},
'keydown input' (event) { // Enter to close input.
var modifyingInput = Session.get("modifying");
if (event.keyCode == 13 && modifyingInput != "workDesc") {
try {
closeInput(modifyingInput);
} catch (err) {}
// HANDLING INPUT CHANGING
'focus .clickModify' (event) {
$(".optionHolder")
.fadeOut(250, "linear");
if(modifyingInput !== null) {
if(!$("#"+modifyingInput)[0].className.includes("dropdown")) closeInput(modifyingInput);
}
modifyingInput = event.target.id;
if(!$("#"+modifyingInput)[0].className.includes("dropdown")) {
event.target.select();
event.target.style.cursor = "text";
}
},
'keydown .dropdown' (event) {
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");
if (event.keyCode === 38) {
event.preventDefault();
if (lastSel === undefined) {
last.addClass("selectedOption");
} else {
if (prev.length === 0) {
last.addClass("selectedOption");
lastSel.removeClass("selectedOption");
} else {
prev.addClass("selectedOption");
lastSel.removeClass("selectedOption");
}
}
} else if (event.keyCode === 40) {
event.preventDefault();
if (lastSel === undefined) {
first.addClass("selectedOption");
last.removeClass("selectedOption");
} else {
if (next.length === 0) {
first.addClass("selectedOption");
lastSel.removeClass("selectedOption");
} else {
next.addClass("selectedOption");
lastSel.removeClass("selectedOption");
}
}
} else if (event.keyCode === 13) {
lastSel[0].click();
}
},
'focus .dropdown' (event) {
$(".selectedOption").removeClass("selectedOption");
$("#" + modifyingInput).next()
.css('opacity',0)
.slideDown(300)
.animate(
{ opacity: 1 },
{ queue: false, duration: 100 }
);
},
'click .optionText' (event) { // Click each preferences setting.
var option = event.target.childNodes[0].nodeValue;
if(modifyingInput[0] === 'w') {
var newSetting = Session.get("currentWork");
newSetting[modifyingInput.charAt(1).toLowerCase() + modifyingInput.slice(2)] = option.toLowerCase();
Session.set("currentWork", newSetting);
serverData = Session.get("currentWork");
$("#" + modifyingInput).next()
.fadeOut(250, "linear");
$(".selectedOption").removeClass("selectedOption");
if(Session.get("newWork")) return;
if(checkMissing()) return;
sendData("editWork")
} else {
var newSetting = Session.get("user");
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");
$(".selectedOption").removeClass("selectedOption");
},
'input .restrict' (event) {
var restrict = event.target.maxLength;
var chars = restrict - event.target.value.length;
var text;
if (event.target.id === "workComment") {
text = document.getElementById("commentrestrict");
} else if (event.target.id === "requestArea") {
text = document.getElementById("requestrestrict");
} else {
text = document.getElementById(Session.get("modifying") + "restrict");
}
text.style.color = "#7E7E7E";
if (chars === restrict) { // Don't display if nothing in comment.
Session.set("commentRestrict", "");
return;
} else if (chars === 0) {
text.style.color = "#FF1A1A"; // Make text red if 0 characters left.
}
Session.set("commentRestrict", chars.toString() + " characters left");
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);
},
'focus #wDueDate' () { // Open date picker.
$('#wDueDate').datepicker({
@ -776,46 +799,43 @@ Template.main.events({
startDate: 'd',
todayHighlight: true,
todayBtn: true,
onSelect: function(dateText, inst) {
alert("asdf");
closeInput(modifyingInput);
}
autoclose: true
});
},
// WORK OVERLAY BUTTONS
'click #commentSubmit' (event) { // Click to submit a comment.
workId = Session.get("currentWorkId");
workId = Session.get("currentWork")._id;
var input = document.getElementById('workComment');
comment = input.value;
input.value = "";
Session.set("commentRestrict", null);
if (comment !== "") {
document.getElementById('workComment').value = "";
Meteor.call('addComment', [comment, workId]);
serverData = [comment, workId];
sendData("addComment");
}
},
'click #workSubmit' () { // Click submit work to create a work.
serverData = Session.get("currentWork");
if(checkMissing()) return;
sendData("createWork");
Session.set("newWork", null);
Session.set("newWork",false);
closeDivFade(document.getElementsByClassName("overlay")[0]);
},
'click #workDelete' () {
serverData = Session.get("currentWorkId");
serverData = Session.get("currentWork")._id;
sendData("deleteWork");
closeDivFade(document.getElementsByClassName("overlay")[0]);
},
'click #markDone' () { // Click done button.
serverData = [Session.get("currentWorkId"), "done"];
serverData = [Session.get("currentWork")._id, "done"];
sendData("toggleWork");
},
'click #markConfirm' () { // Click confirm button.
serverData = [Session.get("currentWorkId"), "confirmations"];
serverData = [Session.get("currentWork")._id, "confirmations"];
sendData("toggleWork");
},
'click #markReport' () { // Click report button.
serverData = [Session.get("currentWorkId"), "reports"];
serverData = [Session.get("currentWork")._id, "reports"];
sendData("toggleWork");
},
// CLASS FILTERS
@ -831,7 +851,7 @@ Template.main.events({
var date = calWorkDate.split("-");
date = new Date(date[0], parseInt(date[1]) - 1, date[2], 11, 59, 59);
Session.set("newWork", true);
Session.get("currentWorkId", classid);
Session.set("currentWork", {class: classid, dueDate: date});
openDivFade(document.getElementsByClassName("overlay")[0]);
} else { // Normal clicking turns on filter.
var array = Session.get("classDisp");
@ -897,6 +917,8 @@ Template.main.events({
}
});
// Other Functions
function openDivFade(div) {
div.style.display = "block";
div.style.opacity = "0";
@ -913,19 +935,32 @@ function closeDivFade(div) {
}
function sendData(funcName) { // Call Meteor function, and do actions after function is completed depending on function.
Meteor.call(funcName, serverData);
if(funcName === "editWork" || funcName === "createWork") {
for(var key in serverData) {
if(serverData[key] === true) serverData[key] = "";
}
}
Meteor.call(funcName, serverData, function(error, result) {
serverData = null;
currWork = Session.get("currentWork");
if(currWork !== null && currWork._id !== undefined) {
Session.set("currentWork", work.findOne({
_id: currWork._id
}));
}
});
}
function closeInput() { // Close a changeable input and change it back to span.
var data = getHomeworkFormData();
Session.set("currentWork", data);
Session.set("restrictText", {});
$("#"+modifyingInput).css('cursor','pointer');
if(!Session.get("newWork")) {
serverData = Session.get("currentWork");
//sendData("editWork");
if(checkMissing()) return;
sendData("editWork");
}
console.log(serverData);
}
function getHomeworkFormData() { // Get all data relating to work creation.
@ -934,12 +969,50 @@ function getHomeworkFormData() { // Get all data relating to work creation.
var data = Session.get("currentWork");
for(var i = 0; i < inputs.length; i++) {
var title = inputs[i].charAt(1).toLowerCase() + inputs[i].slice(2);
var thisData = (title === 'type') ? $("#"+inputs[i]+" span")[0].childNodes[0].nodeValue : $("#"+inputs[i])[0].value;
data[title] = (thisData.includes(defaultWork[title].slice(0,-3)) && !_.contains(optional, title)) ? "Missing field" : thisData;
var thisData = (function() {
if(title === "type") {
return $("#"+inputs[i]+" span")[0].childNodes[0].nodeValue.toLowerCase();
} else if (title === "dueDate") {
var val = $("#"+inputs[i])[0].value;
return toDate(val);
} else {
return $("#"+inputs[i])[0].value;
}
})();
// True signifies missing field to prevent missing if value is'Missing field.'
data[title] = data[title] = (thisData.toString().includes(defaultWork[title].slice(0,-3)) && !_.contains(optional, title)) ? true : thisData;
}
return data;
}
function checkMissing() {
var required = ["name","dueDate","type"]
var no = false;
if(serverData === null || Object.keys(serverData).length < 4) {
for(var i = 0; i < required.length; i++) {
var id = "w" + required[i].charAt(0).toUpperCase() + required[i].slice(1);
$("#"+id).addClass("formInvalid");
$("#"+id)[0].value = "";
$("#"+id)[0].placeholder = "Missing field";
}
return true;
}
for(var key in serverData) {
if(!_.contains(required, key)) continue;
var id = "w" + key.charAt(0).toUpperCase() + key.slice(1);
if(serverData[key] === true || serverData[key] === "" || serverData[key] === undefined) {
no = true;
$("#"+id).addClass("formInvalid");
$("#"+id)[0].value = "";
$("#"+id)[0].placeholder = "Missing field";
} else {
$("#"+id)[0].placeholder = "";
$("#"+id).removeClass("formInvalid");
}
}
return no;
}
var days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
@ -1035,3 +1108,20 @@ function formReadable(input, val) { // Makes work information readable by users.
}).profile.name;
}
}
function startDragula() {
dragula([document.querySelector('#classesMode'), document.querySelector('#nonexistant')], {
moves: function(el, container, handle) {
// return handle.classList.contains("classInfo") || handle.classList.contains("mainClassName");
return _.intersection(["classInfo", "mainClassName", "mainClassHour", "mainClassTeacher"], handle.classList).length > 0;
}
})
.on('out', function(el) {
var els = document.getElementsByClassName("classWrapper");
var final = [];
for (var i = 0; i < els.length; i++) {
var classid = els[i].getElementsByClassName("creWork")[0].getAttribute("classid");
final.push(classid);
}
});
}

View File

@ -1,9 +1,3 @@
.change {
font-size: 150%;
color: #BEBEBE;
cursor: pointer;
}
#profWrapper {
width: 100%;
height: 100%;
@ -11,21 +5,6 @@
overflow-y: hidden;
}
#profPage .change {
font-size: 2.5vh;
}
.radio {
cursor: pointer;
}
.changeInput {
font-size: 100%;
padding: 0;
color: #BEBEBE;
position: relative;
}
.profTitle {
font-size: 3vh;
font-weight: 400;
@ -40,11 +19,6 @@
padding: 6% 6% 0 8%;
}
#motda {
font-size: 100%;
width: 30% !important;
}
#profPage {
width: 100%;
height: 100%;
@ -102,47 +76,20 @@
color: #FFF;
}
#motdBox input {
width: 50% !important;
}
#description:hover {
background-color: rgba(255,255,255,0.1);
}
.username {
margin-left: 20% !important;
}
#motdrestrict {
margin-right: 1% !important;
float: right;
}
.profOptions {
box-shadow: 2px 2px 5px 3px #666;
position: absolute;
display: none;
z-index: 5;
opacity: 0;
-webkit-transition: opacity 0.4s ease;
-moz-transition: opacity 0.4s ease;
-ms-transition: opacity 0.4s ease;
transition: opacity 0.4s ease;
}
.profOptionText {
font-size: 150%;
min-width: 10%;
padding: 20px;
margin: 0;
text-align: center;
cursor: pointer;
-webkit-transition: box-shadow 0.4s ease;
-moz-transition: box-shadow 0.4s ease;
-ms-transition: box-shadow 0.4s ease;
transition: box-shadow 0.4s ease;
}
.profOptions p:hover {
box-shadow: inset 0 0 0 99999px rgba(0,0,0,0.1);
.smallText p {
font-size: 90%;
}
#profCards {
@ -179,6 +126,15 @@
text-align: left;
}
#profWrapper .clickModify span {
width: 80%;
padding: 3.5% 5% 3.5% 5%;
}
#profWrapper .clickModify, #profWrapper .optionHolder {
width: 90%;
}
#profInfo {
margin-left: 0;
border-top: 5px solid #CC4444;
@ -188,16 +144,12 @@
padding: 3% 5% 7% 14%;
}
.radioContainer {
position: relative;
}
#classes {
padding: 3% 5% 7% 7%;
}
#profClasses {
height: 90%;
height: 70%;
margin-right: 0;
border-top: 5px solid #2E4F74;
@ -242,11 +194,11 @@
}
.profFunction i, .profFunction h4 {
padding: 1%;
padding: 1% !important;
}
.profFunction h4 {
font-size: 120%;
font-size: 120% !important;
}
#searchBar {
@ -404,19 +356,37 @@
position: relative;
}
#formContainer .clickModify {
background-color: #EBEBEB;
border: 1px solid #CECECE;
}
#formContainer .optionText:hover {
box-shadow: inset 0 0 0 99999px rgba(0,0,0,0.2);
}
.formDiv {
margin: 3% 6% 5% 6%;
width: 35%;
position: relative;
display: inline-block;
}
.formDiv input {
width: 90%;
}
#formContainer .optionHolder {
width: 96%;
}
.creInput {
font-size: 2vh;
padding: 3%;
}
.creOp {
margin: 0 !important;
.classDropdown {
cursor: pointer;
}
.formDiv .-autocomplete-container {
@ -499,7 +469,7 @@
}
#createdClasses {
width: 500px;
width: 600px;
height: 73vh;
padding: 30px 0 30px 30px;

View File

@ -11,8 +11,8 @@
<img id="profAvatar" src='{{avatar}}' alt="Avatar">
<div id="motdBox">
<span class="username">{{username}} - </span>
<span class="change mo" restrict="50" id="motd">{{motd}}</span>
<span id="motdrestrict">{{commentLength}}</span>
<input id="description" class="clickModify restrict" style="color:#fff" value="{{description}}" maxLength="50">
<span class="resText">{{restrict 'description'}}</span>
</div>
</div>
<div id="profCards">
@ -21,21 +21,29 @@
<div id="profInfo" class="card" style="background-color:{{divColor 'secondaryColor'}}">
<h3 class="profHea">About</h3>
<div id="about">
<div>
<div class="prefWrapper">
<p class="profTitle">School Name:</p>
<span class="change" id="school">{{school}}</span>
<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="radioContainer">
<div>
<p class="profTitle">Grade:</p>
<span class="change radio" re="readonly" id="grade">{{grade}}</span>
<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="profOptions">
<p class="profOptionText" style="background-color:{{divColor 'mainColor'}}">9th</p>
<p class="profOptionText" style="background-color:{{divColor 'mainColor'}}">10th</p>
<p class="profOptionText" style="background-color:{{divColor 'mainColor'}}">11th</p>
<p class="profOptionText" style="background-color:{{divColor 'mainColor'}}">12th</p>
<div class="optionHolder">
{{#each selectOptions 'grade'}}
{{> option}}
{{/each}}
</div>
</div>
</div>
@ -44,61 +52,64 @@
<div id="profPreferences" class="card" style="background-color:{{divColor 'secondaryColor'}}">
<h3 class="profHea">Preferences</h3>
<div id="preferences">
<div class="radioContainer">
<div class="inputRadio">
<p class="profTitle">Theme:</p>
<span class="change radio" re="readonly" id="prefTheme">{{themeName}}</span>
<div class="prefWrapper">
<p class="prefTitle">Theme:</p>
<div id="theme" class="clickModify dropdown" tabindex="3">
<span>{{pref 'theme'}}</span>
<i class="fa fa-caret-down" aria-hidden="true"></i>
</div>
<div class="profOptions">
<p class="profOptionText" style="background-color:{{divColor 'mainColor'}}">Light</p>
<p class="profOptionText" style="background-color:{{divColor 'mainColor'}}">Dark</p>
<div class="optionHolder">
{{#each selectOptions 'theme'}}
{{> option}}
{{/each}}
</div>
</div>
<br>
<div class="radioContainer">
<div class="inputRadio">
<p class="profTitle">Default Mode:</p>
<span class="change radio" re="readonly" id="prefMode">{{pref 'mode'}}</span>
<div class="prefWrapper">
<p class="prefTitle">Default Mode:</p>
<div id="mode" class="clickModify dropdown" tabindex="4">
<span>{{pref 'mode'}}</span>
<i class="fa fa-caret-down" aria-hidden="true"></i>
</div>
<div class="profOptions">
<p class="profOptionText" style="background-color:{{divColor 'mainColor'}}">Classes</p>
<p class="profOptionText" style="background-color:{{divColor 'mainColor'}}">Calendar</p>
<div class="optionHolder">
{{#each selectOptions 'mode'}}
{{> option}}
{{/each}}
</div>
</div>
<br>
<div class="radioContainer">
<div class="inputRadio">
<p class="profTitle">Hide Homework:</p>
<span class="change radio" re="readonly" id="prefHide">{{pref 'timeHide'}}</span>
<div class="prefWrapper">
<p class="prefTitle">Hide Homework:</p>
<div id="timeHide" class="clickModify dropdown" tabindex="5">
<span>{{pref 'timeHide'}}</span>
<i class="fa fa-caret-down" aria-hidden="true"></i>
</div>
<div class="profOptions">
<p class="profOptionText" style="background-color:{{divColor 'mainColor'}}">1 Day</p>
<P class="profOptionText" style="background-color:{{divColor 'mainColor'}}">2 Days</p>
<p class="profOptionText" style="background-color:{{divColor 'mainColor'}}">1 Week</p>
<p class="profOptionText" style="background-color:{{divColor 'mainColor'}}">1 Month</p>
<p class="profOptionText" style="background-color:{{divColor 'mainColor'}}">Never</p>
<div class="optionHolder">
{{#each selectOptions 'timeHide'}}
{{> option}}
{{/each}}
</div>
</div>
<br>
<div class="radioContainer">
<div class="inputRadio">
<p class="profTitle">Hide Done:</p>
<span class="change radio" re="readonly" id="prefDone">{{pref 'done'}}</span>
<div class="prefWrapper">
<p class="prefTitle">Hide Done:</p>
<div id="done" class="clickModify dropdown" tabindex="6">
<span>{{pref 'done'}}</span>
<i class="fa fa-caret-down" aria-hidden="true"></i>
</div>
<div class="profOptions">
<p class="profOptionText" style="background-color:{{divColor 'mainColor'}}">Yes</p>
<p class="profOptionText" style="background-color:{{divColor 'mainColor'}}">No</p>
<div class="optionHolder">
{{#each selectOptions 'done'}}
{{> option}}
{{/each}}
</div>
</div>
<br>
<div class="radioContainer">
<div class="inputRadio">
<p class="profTitle">Hide Reported:</p>
<span class="change radio" re="readonly" id="prefReport">{{pref 'hideReport'}}</span>
<div class="prefWrapper">
<p class="prefTitle">Hide Reported:</p>
<div id="hideReport" class="clickModify dropdown" tabindex="7">
<span>{{pref 'hideReport'}}</span>
<i class="fa fa-caret-down" aria-hidden="true"></i>
</div>
<div class="profOptions">
<p class="profOptionText" style="background-color:{{divColor 'mainColor'}}">Yes</p>
<p class="profOptionText" style="background-color:{{divColor 'mainColor'}}">No</p>
<div class="optionHolder">
{{#each selectOptions 'hideReport'}}
{{> option}}
{{/each}}
</div>
</div>
</div>
@ -182,7 +193,7 @@
</div>
<div class="formDiv">
<p class="profTitle">Hour:</p>
<input class="creInput" type="text" name="hour">
<input class="creInput" type="text">
</div>
<div class="formDiv">
<p class="profTitle">Teacher:</p>
@ -190,39 +201,24 @@
</div>
<div class="formDiv">
<p class="profTitle">Class Name:</p>
<input class="creInput" type="text" name="classname">
<input class="creInput" type="text">
</div>
<div class="formDiv">
<p class="profTitle">Privacy:</p>
<!-- <script type="text/javascript"> -->
<!-- $(document).ready(function() { -->
<!-- $(".js-example-basic-single").select2(); -->
<!-- $('select').on('select2:open', function (e) { -->
<!-- console.log("hello"); -->
<!-- $('.select2-dropdown').hide(); -->
<!-- setTimeout(function(){ $('.select2-dropdown').slideDown("slow", "easeInOutQuint"); }, 200); -->
<!-- }); -->
<!-- }); -->
<!-- </script>-->
<!-- <select class="js-example-basic-single"> -->
<!-- <option value="AL">Alabama</option> -->
<!-- <option value="WY">Wyoming</option> -->
<!-- </select> -->
<input class="creInput radio op" type="text" name="privacy" readonly>
<div class="profOptions creOp">
<p class="profOptionText cre" style="background-color:{{divColor 'mainColor'}}">Public</p>
<p class="profOptionText cre" style="background-color:{{divColor 'mainColor'}}">Private</p>
<input id="privacy" class="creInput clickModify dropdown" type="text" readonly>
<div class="optionHolder">
{{#each selectOptions 'privacy'}}
{{> option}}
{{/each}}
</div>
</div>
<div class="formDiv">
<p class="profTitle">Category:</p>
<input class="creInput radio op" type="text" name="category" readonly>
<div class="profOptions creOp">
<p class="profOptionText cre" style="background-color:{{divColor 'mainColor'}}">Class</p>
<p class="profOptionText cre" style="background-color:{{divColor 'mainColor'}}">Club</p>
<p class="profOptionText cre" style="background-color:{{divColor 'mainColor'}}">Other</p>
<input id="category" class="creInput clickModify dropdown" type="text" readonly>
<div class="optionHolder">
{{#each selectOptions 'category'}}
{{> option}}
{{/each}}
</div>
</div>
</div>
@ -321,3 +317,4 @@
<template name="teacherList">
{{teacher}}
</template>

View File

@ -4,7 +4,7 @@ import {
} from 'meteor/templating';
var openValues = {
"owned": "-540px",
"owned": "-650px",
"priv": "-160px"
};
@ -25,7 +25,7 @@ Session.set("noclass", null); // If user doesn't have classes.
Session.set("notfound", null); // If no results for autocomplete.
Template.profile.helpers({
themeName() {
/* themeName() {
var vals = _.values(themeColors);
var curtheme = Session.get("user").preferences.theme;
for (var i = 0; i < vals.length; i++) {
@ -35,7 +35,7 @@ Template.profile.helpers({
}
}
return "Custom";
},
},*/
classSettings() { // Returns autocomplete array for classes.
return {
position: "bottom",
@ -86,7 +86,7 @@ Template.profile.helpers({
username() { //Returns current user's username
return Session.get("user").name;
},
motd() { // Returns the current user's description
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!";
},
@ -95,10 +95,10 @@ Template.profile.helpers({
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 + "th";
if (Session.get("user").grade !== undefined && Session.get("user").grade !== null && Session.get("user").grade !== "") return Session.get("user").grade;
return "Click here to edit...";
},
classes() { // Loads all of the possible classes ( Limit of twenty shown ) ( Sorts by class size )
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
@ -107,7 +107,10 @@ Template.profile.helpers({
$eq: false
},
_id: {
$nin: Meteor.user().profile.classes
$nin: Session.get("user").classes
},
school: {
$eq: Session.get("user").school
}
}, {
sort: {
@ -174,23 +177,29 @@ Template.profile.helpers({
});
Template.profile.events({
'click' (event) { // Whenever a click happens
var modifyingInput = Session.get("modifying");
if (event.target.id !== modifyingInput &&
event.target.id !== modifyingInput + "a" &&
!Session.equals("modifying", null) &&
!event.target.parentNode.className.includes("profOptions")) {
closeInput(modifyingInput);
}
if (!event.target.className.includes("radio") &&
!event.target.parentNode.className.includes("profOptions") &&
event.target.readOnly !== true) {
for (var i = 0; i < document.getElementsByClassName("profOptions").length; i++) {
try {
closeDivFade(document.getElementsByClassName("profOptions")[i]);
} catch (err) {}
'click' (event) { // Whenever a click happens'
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");
}
}
modifyingInput = null;
}
}
if (!document.getElementById("createdClasses").contains(event.target) &&
!Session.equals("code", null) &&
!event.target.className.includes("fa-times-circle-o")) {
@ -226,7 +235,7 @@ Template.profile.events({
div.style.height = "50%";
setTimeout(function() {            
Session.set("profClassTab", "addClass");
div.style.height = "90%";          
div.style.height = "70%";          
openDivFade(functionHolder);        
}, 400);
},
@ -238,7 +247,7 @@ Template.profile.events({
div.style.height = "50%";     
setTimeout(function() {            
Session.set("profClassTab", "manClass"); 
div.style.height = "90%";           
div.style.height = "70%";           
openDivFade(functionHolder);        
}, 400);
},
@ -250,7 +259,7 @@ Template.profile.events({
div.style.height = "50%";
setTimeout(function() {
Session.set("profClassTab", "creClass");
div.style.height = "90%";
div.style.height = "70%";
openDivFade(functionHolder);
}, 400);
},
@ -281,6 +290,7 @@ Template.profile.events({
} else {
var attribute = event.target.getAttribute("classid");
}
if(attribute === Meteor.userId()) return;
Session.set("selectedClass", null);
var usertype = ["moderators", "banned"];
var array = classes.findOne({
@ -446,102 +456,108 @@ Template.profile.events({
confirm = null;
},
// INPUT HANDLING
'click .change' (event) { // Click changable inputs. Creates an input where the span is.
var ele = event.target;
var modifyingInput = Session.get("modifying");
if (ele.id !== modifyingInput && modifyingInput !== null) closeInput(modifyingInput);
'focus .clickModify' (event) {
$(".optionHolder")
.fadeOut(250, "linear");
Session.set("modifying", ele.id);
var dim = ele.getBoundingClientRect();
ele.style.display = "none";
var input = document.createElement("input");
if (ele.getAttribute("type") !== null) {
input.type = ele.getAttribute("type");
} else {
input.type = "text";
if(modifyingInput !== null) {
if(!$("#"+modifyingInput)[0].className.includes("dropdown")) closeInput(modifyingInput);
}
input.value = ele.childNodes[0].nodeValue;
input.className = "changeInput";
input.style.height = 0.9 * dim.height.toString() + "px";
input.style.width = "55%";
input.style.padding = "0.1%";
input.id = ele.id + "a";
input.setAttribute("opc", ele.getAttribute("opc"));
ele.parentNode.appendChild(input);
if (ele.getAttribute("re") == "readonly") {
input.readOnly = true;
input.className += " op";
input.style.cursor = "pointer";
} else {
input.select();
}
input.focus();
var restrict = ele.getAttribute("restrict");
if (restrict !== null) {
input.maxLength = restrict;
input.className += " restrict";
Session.set("commentRestrict", restrict - input.value.length.toString() + " characters left");
var text = document.getElementById(Session.get("modifying") + "restrict");
text.style.display = "inherit";
text.style.color = "#7E7E7E";
modifyingInput = event.target.id;
if(!$("#"+modifyingInput)[0].className.includes("dropdown")) {
event.target.select();
event.target.style.cursor = "text";
}
},
'click .radio' (event) { // Click dropdown input. Opens the dropdown menu.
var op = event.target;
try {
for (var i = 0; i < document.getElementsByClassName("profOptions").length; i++) {
var curr = document.getElementsByClassName("profOptions")[i];
if (curr.childNodes[1] !== op.nextSibling.nextSibling.childNodes[1] &&
curr.childNodes[1] !== op.parentNode.parentNode.childNodes[3].childNodes[1]) {
closeDivFade(document.getElementsByClassName("profOptions")[i]);
}
}
} catch (err) {}
'keydown .dropdown' (event) {
event.preventDefault();
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");
if (event.target.className.includes("op")) {
openDivFade(op.nextSibling.nextSibling);
if (event.keyCode === 38) {
event.preventDefault();
if (lastSel === undefined) {
last.addClass("selectedOption");
} else {
openDivFade(op.parentNode.parentNode.childNodes[3]);
if (prev.length === 0) {
last.addClass("selectedOption");
lastSel.removeClass("selectedOption");
} else {
prev.addClass("selectedOption");
lastSel.removeClass("selectedOption");
}
}
} else if (event.keyCode === 40) {
event.preventDefault();
if (lastSel === undefined) {
first.addClass("selectedOption");
last.removeClass("selectedOption");
} else {
if (next.length === 0) {
first.addClass("selectedOption");
lastSel.removeClass("selectedOption");
} else {
next.addClass("selectedOption");
lastSel.removeClass("selectedOption");
}
}
} else if (event.keyCode === 13) {
lastSel[0].click();
}
},
'keydown input' (event) { // Restricts characters for certain inputs.
var modifyingInput = Session.get("modifying");
if (event.keyCode == 13) {
try {
closeInput(modifyingInput);
} catch (err) {}
'focus .dropdown' (event) {
$(".selectedOption").removeClass("selectedOption");
$("#" + modifyingInput).next()
.css('opacity',0)
.slideDown(300)
.animate(
{ opacity: 1 },
{ queue: false, duration: 100 }
);
},
'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");
$(".selectedOption").removeClass("selectedOption");
},
'input .restrict' (event) {
var restrict = event.target.maxLength;
var chars = restrict - event.target.value.length;
var text = document.getElementById(Session.get("modifying") + "restrict");
text.style.color = "#7E7E7E";
if (chars === restrict) { // Don't display if nothing in comment.
Session.set("commentRestrict", "");
return;
} else if (chars === 0) {
text.style.color = "#FF1A1A"; // Make text red if 0 characters left.
text.style.opacity = "0";
}
Session.set("commentRestrict", chars.toString() + " characters left");
},
'click .profOptionText' (event) { // Click each profile option setting.
var modifyingInput = Session.get("modifying");
var p = event.target;
if (p.className.includes("cre")) {
var input = p.parentNode.parentNode.childNodes[3];
} else {
var input = p.parentNode.parentNode.childNodes[1].childNodes[5];
}
input.value = p.childNodes[0].nodeValue;
try {
closeInput(modifyingInput);
} catch (err) {}
closeDivFade(p.parentNode);
input.focus();
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
'keyup #profClassSearch' (event) { // Auto-complete updater
@ -572,10 +588,7 @@ Template.profile.events({
Session.set("autocompleteDivs", divs);
}
} catch (err) {}
},
'focus .op' (event) { // Selects input for next tabbing.
event.target.click();
},
}
});
function openDivFade(div) {
@ -593,27 +606,6 @@ function closeDivFade(div) {
}, 100);
}
function closeInput(modifyingInput) { // Closes current modifying input.
var input = document.getElementById(modifyingInput + "a");
var span = document.getElementById(modifyingInput);
input.parentNode.removeChild(input);
Session.set("commentRestrict", "");
try {
document.getElementById("modifyingInput" + "restrict").style.display = "none";
} catch (err) {}
if (input.value === "") {
span.childNodes[0].nodeValue = "Click here to edit...";
} else {
span.childNodes[0].nodeValue = input.value;
}
span.style.display = "initial";
Session.set("modifying", null);
Session.set("user", getProfileData());
serverData = Session.get("user");
sendData("editProfile");
}
function sendData(funcName) {
Meteor.call(funcName, serverData, function(err, result) {
if (funcName === "trackUserInClass") {

View File

@ -1,8 +1,8 @@
themeColors = {
"light": {
"lux": {
"background": "White.jpg",
"mainColor": "#EBEBEB",
"secondaryColor": "#FEFEFE",
"mainColor": "#D9D9D9",
"secondaryColor": "#E8E8E8",
"sidebarColor": "#65839A",
"userDropdownColor": "#E6E6E6",
"iconHighlight": "#33ADFF",
@ -10,7 +10,7 @@ themeColors = {
"classCardColor":"#EBEBEB",
"textColor": "#000"
},
/*"dark": {
"nox": {
"background": "Black.jpg",
"mainColor": "#373A56",
"secondaryColor": "#151A2B",
@ -20,57 +20,61 @@ themeColors = {
"modeHighlight": "#FF1A1A",
"classCardColor":"#46396E",
"textColor": "#F6F6F6"
},*/
/*"dark": {
},
"requom": {
"background": "RedBlack.jpg",
"mainColor": "#302c36",
"secondaryColor": "#151313",
"sidebarColor": "#327c5a",
"userDropdownColor": "#cc3333",
"iconHighlight": "#327c5a",
"modeHighlight": "#c9fe62",
"mainColor": "#302C36",
"secondaryColor": "#B93A3A",
"sidebarColor": "#327C5A",
"userDropdownColor": "#CC3333",
"iconHighlight": "#327C5A",
"modeHighlight": "#C9fE62",
"classCardColor":"#302c36",
"textColor": "#fcf0f0"
},*/
/*"dark": {
"textColor": "#FCF0F0"
},
"aequor": {
"background": "Sea.jpg",
"mainColor": "#1e926c",
"secondaryColor": "#1c564f",
"sidebarColor": "#3cb08a",
"userDropdownColor": "#2ea96a",
"iconHighlight": "#61d9a3",
"modeHighlight": "#c9fe62",
"classCardColor":"#2567a1",
"textColor": "#fcf0f0"
},*/
/*"dark": {
"mainColor": "#1E926C",
"secondaryColor": "#1C564F",
"sidebarColor": "#3CB08A",
"userDropdownColor": "#2EA96A",
"iconHighlight": "#61D9A3",
"modeHighlight": "#C9FE62",
"classCardColor":"#2567A1",
"textColor": "#FCF0F0"
},
"fresva": {
"background": "Earth.jpg",
"mainColor": "#dea743",
"mainColor": "#DEA743",
"secondaryColor": "#496234",
"sidebarColor": "#6d9957",
"userDropdownColor": "#89bb52",
"iconHighlight": "#91ee61",
"modeHighlight": "#b9f643",
"classCardColor":"#c18311",
"textColor": "#fcf0f0"
},*/
"dark": {
"sidebarColor": "#6D9957",
"userDropdownColor": "#89BB52",
"iconHighlight": "#91EE61",
"modeHighlight": "#B9f643",
"classCardColor":"#C18311",
"textColor": "#FCF0F0"
},
"atlaneon": {
"background": "NeonBlue.jpg",
"mainColor": "#1d1c23",
"secondaryColor": "#1f212f",
"sidebarColor": "#312e32",
"mainColor": "#1D1C23",
"secondaryColor": "#1F212f",
"sidebarColor": "#312E32",
"userDropdownColor": "#2e312b",
"iconHighlight": "#70e6e6",
"modeHighlight": "#70e6e6",
"classCardColor":"#1faab1",
"textColor": "#fcf0f0"
"iconHighlight": "#70E6E6",
"modeHighlight": "#70E6E6",
"classCardColor":"#1FAAB1",
"textColor": "#FCF0F0"
}
};
options = {
"theme": [
{"val": "light", "alias": "Light"},
{"val": "dark", "alias": "Dark"}
{"val": "lux", "alias": "Lux"},
{"val": "nox", "alias": "Nox"},
{"val": "requom", "alias": "Recoum"},
{"val": "aequor", "alias": "Aequor"},
{"val": "fresva", "alias": "Fresva"},
{"val": "atlaneon", "alias": "Atlaneon"}
],
"mode": [
{"val": "classes", "alias": "Classes"},
@ -90,6 +94,22 @@ options = {
"hideReport": [
{"val": true, "alias": "Yes"},
{"val": false, "alias": "No"}
],
"type": [
{"val": "normal", "alias": "Normal"},
{"val": "quiz", "alias": "Quiz"},
{"val": "test", "alias": "Test"},
{"val": "project", "alias": "Project"},
{"val": "other", "alias": "Other"},
],
"privacy": [
{"val": false, "alias": "Public"},
{"val": true, "alias": "Private"}
],
"category": [
{"val": "class", "alias": "Class"},
{"val": "club", "alias": "Club"},
{"val": "other", "alias": "Other"}
]
}

View File

@ -494,7 +494,7 @@ Meteor.methods({
current.banner = "/Banners/defaultcover.jpg";
current.classes = [userId];
current.preferences = {
"theme": themeColors.light,
"theme": themeColors.lux,
"mode": "classes",
"timeHide": 1,
"done": true,