kjao/archive
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

formatting

Browse Source
This commit is contained in:
Yaman Qalieh 2016-08-12 12:28:55 -04:00
parent 513e19046c
commit 09104bbbeb
5 changed files with 952 additions and 967 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

181
hourglass/client/login/login.css
View File

@ -1,151 +1,134 @@
#loginHeader { #loginHeader {
font-weight: 600; font-weight: 600;
width: 100%; width: 100%;
margin: 0; margin: 0;
box-shadow: 2px 2px 5px 3px #666; box-shadow: 2px 2px 5px 3px #666;
background-color: #EBEBEB;
background-color: #EBEBEB; display: inline-block;
position: relative;
display: inline-block; z-index: 50;
position: relative;
z-index: 50;
} }
#logo { #logo {
padding: 0.5%; padding: 0.5%;
padding-left: 1%; padding-left: 1%;
float: left; float: left;
-webkit-filter: drop-shadow(2px 2px 5px #333);
-webkit-filter: drop-shadow(2px 2px 5px #333); filter: drop-shadow(2px 2px 5px #333);
filter: drop-shadow(2px 2px 5px #333);
} }
#banner { #banner {
height: 100%; height: 100%;
position: relative; position: relative;
} }
#loginTitle { #loginTitle {
font-size: 255%; font-size: 255%;
padding: 1.4%; padding: 1.4%;
padding-left: 1%; padding-left: 1%;
} }
#loginMain { #loginMain {
width: 100%; width: 100%;
min-height: 100%; min-height: 100%;
position: absolute; position: absolute;
top: 11%; top: 11%;
background-color: #E5E5E5;
background-color: #E5E5E5; background-image: url("banner100.jpg");
background-image: url("banner100.jpg");
} }
#circle { #circle {
position: fixed; position: fixed;
top: 50%; top: 50%;
left: 50%; left: 50%;
-moz-border-radius: 50%;
-moz-border-radius: 50%; -webkit-border-radius: 50%;
-webkit-border-radius: 50%; border-radius: 50%;
border-radius: 50%; background-color: rgba(0, 0, 0, 0.2);
-webkit-filter: drop-shadow(2px 2px 5px #333);
background-color: rgba(0,0,0,0.2); filter: drop-shadow(2px 2px 5px #333);
-webkit-filter: drop-shadow(2px 2px 5px #333);
filter: drop-shadow(2px 2px 5px #333);
} }
#loginContent { #loginContent {
position: fixed; position: fixed;
top: 50%; top: 50%;
left: 50%; left: 50%;
} }
.text { .text {
text-align: center; text-align: center;
color: #FFF; color: #FFF;
-webkit-filter: drop-shadow(2px 2px 5px #444);
-webkit-filter: drop-shadow(2px 2px 5px #444); filter: drop-shadow(2px 2px 5px #444);
filter: drop-shadow(2px 2px 5px #444);
} }
h2.text { h2.text {
font-size: 400%; font-size: 400%;
padding-bottom: 2%; padding-bottom: 2%;
border-bottom: 1px solid #FEFEFE; border-bottom: 1px solid #FEFEFE;
} }
p.text { p.text {
font-size: 150%; font-size: 150%;
margin-bottom: 5%; margin-bottom: 5%;
} }
#loginButton { #loginButton {
font-size: 200%; font-size: 200%;
padding: 2%; padding: 2%;
-webkit-border-radius: 6;
-webkit-border-radius: 6; -moz-border-radius: 6;
-moz-border-radius: 6; border-radius: 6px;
border-radius: 6px; position: relative;
background-color: #005CE6;
position: relative; -webkit-transition: background-color 0.4s ease;
-moz-transition: background-color 0.4s ease;
background-color: #005CE6; -ms-transition: background-color 0.4s ease;
transition: background-color 0.4s ease;
-webkit-transition: background-color 0.4s ease; cursor: pointer;
-moz-transition: background-color 0.4s ease;
-ms-transition: background-color 0.4s ease;
transition: background-color 0.4s ease;
cursor: pointer;
} }
#loginButton:hover { #loginButton:hover {
background-color: #0066FF; background-color: #0066FF;
} }
#loginButton:active { #loginButton:active {
background-color: #FF4D4D; background-color: #FF4D4D;
-webkit-transition: background-color 0.1s ease;
-webkit-transition: background-color 0.1s ease; -moz-transition: background-color 0.1s ease;
-moz-transition: background-color 0.1s ease; -ms-transition: background-color 0.1s ease;
-ms-transition: background-color 0.1s ease; transition: background-color 0.1s ease;
transition: background-color 0.1s ease;
} }
#loginFooter { #loginFooter {
width: 100%; width: 100%;
box-shadow: 2px 2px 5px 3px #666; box-shadow: 2px 2px 5px 3px #666;
background-color: #EBEBEB; background-color: #EBEBEB;
position: absolute; position: absolute;
bottom: 0; bottom: 0;
} }
.login-button { .login-button {
display: none !important; display: none !important;
} }
#github { #github {
font-size: 150%; font-size: 150%;
margin: 0; margin: 0;
padding: 1%; padding: 1%;
-webkit-filter: drop-shadow(2px 2px 5px #444);
-webkit-filter: drop-shadow(2px 2px 5px #444); filter: drop-shadow(2px 2px 5px #444);
filter: drop-shadow(2px 2px 5px #444);
} }
a { a {
color: #0099CC; color: #0099CC;
text-decoration: none; text-decoration: none;
-webkit-transition: color 0.4s ease;
-webkit-transition: color 0.4s ease; -moz-transition: color 0.4s ease;
-moz-transition: color 0.4s ease; -ms-transition: color 0.4s ease;
-ms-transition: color 0.4s ease; transition: color 0.4s ease
transition: color 0.4s ease
} }
a:hover { a:hover {
color: #00BFFF; color: #00BFFF;
} }

356
hourglass/client/main/main.js
View File

@ -1,205 +1,211 @@
import { Template } from 'meteor/templating'; import {
Template
} from 'meteor/templating';
import './main.html'; import './main.html';
var openValues = { var openValues = {
"menu": "-25%", "menu": "-25%",
"options": "-20%" "options": "-20%"
}; };
var themeColors = { var themeColors = {
"light": { "light": {
"background":"White.jpg", "background": "White.jpg",
"header":"#EBEBEB", "header": "#EBEBEB",
"sidebar":"#65839A", "sidebar": "#65839A",
"statusIcons":"#33ADFF", "statusIcons": "#33ADFF",
"highlightText":"#FF1A1A", "highlightText": "#FF1A1A",
"cards":"#FEFEFE" "cards": "#FEFEFE"
}, },
"dark": { "dark": {
} }
}; };
var calendarColors = { var calendarColors = {
"test": "red", "test": "red",
"project": "blue", "project": "blue",
"normal": "green", "normal": "green",
"quiz": "black" "quiz": "black"
} };
var options = { var options = {
"privacy": ["Public", "Hidden"], "privacy": ["Public", "Hidden"],
"category": ["Class", "Club", "Other"] "category": ["Class", "Club", "Other"]
} };
var searchSchools = []; var searchSchools = [];
Session.set("sidebar",null); Session.set("sidebar", null);
Session.set("mode",null); // Change to user preferences Session.set("mode", null); // Change to user preferences
Template.registerHelper( 'divColor', (div) => { Template.registerHelper('divColor', (div) => {
return themeColors[Cookie.get("theme")][div]; return themeColors[Cookie.get("theme")][div];
}) });
Template.registerHelper( 'overlayDim', (part) => { Template.registerHelper('overlayDim', (part) => {
var dim = [window.innerWidth * .2,window.innerHeight * .2]; var dim = [window.innerWidth * .2, window.innerHeight * 0.2];
var width = "width:"+dim[0].toString() + "px;"; var width = "width:" + dim[0].toString() + "px;";
var height = "height:"+dim[1].toString() + "px;"; var height = "height:" + dim[1].toString() + "px;";
var margin = "margin-left:"+(-dim[0]/2).toString() + "px;"; var margin = "margin-left:" + (-dim[0] / 2).toString() + "px;";
var bg = "background-color:"+themeColors[Cookie.get("theme")]["header"]+";"; var bg = "background-color:" + themeColors[Cookie.get("theme")].header + ";";
return width+height+margin+bg; return width + height + margin + bg;
}) });
Template.main.helpers({ Template.main.helpers({
schoolName() { schoolName() {
return " - " + Meteor.user().profile.school; return " - " + Meteor.user().profile.school;
}, },
iconColor(icon) { iconColor(icon) {
if(Session.get("sidebar") === icon+"Container") { if (Session.get("sidebar") === icon + "Container") {
return themeColors[Cookie.get("theme")].statusIcons; return themeColors[Cookie.get("theme")].statusIcons;
} else if(Session.get("sidebar") === "both") { } else if (Session.get("sidebar") === "both") {
return themeColors[Cookie.get("theme")].statusIcons; return themeColors[Cookie.get("theme")].statusIcons;
} else { } else {
return; return;
} }
}, },
bgSrc() { bgSrc() {
var dim = [window.innerWidth,window.innerHeight]; var dim = [window.innerWidth, window.innerHeight];
var pic = themeColors[Cookie.get("theme")].background; var pic = themeColors[Cookie.get("theme")].background;
return pic; return pic;
}, },
menuStatus() { menuStatus() {
if(Session.get("sidebar") === "menuContainer") { if (Session.get("sidebar") === "menuContainer") {
return "0%"; return "0%";
} else if(Session.get("sidebar") === "both") { } else if (Session.get("sidebar") === "both") {
return "0%"; return "0%";
} else { } else {
return openValues["menu"]; return openValues.menu;
} }
}, },
optionsStatus() { optionsStatus() {
if(Session.get("sidebar") === "optionsContainer") { if (Session.get("sidebar") === "optionsContainer") {
return "0%"; return "0%";
} else if(Session.get("sidebar") === "both") { } else if (Session.get("sidebar") === "both") {
return "0%"; return "0%";
} else { } else {
return openValues["options"]; return openValues.options;
} }
}, },
modeStatus(status) { modeStatus(status) {
if(status === Session.get("mode")) { if (status === Session.get("mode")) {
return themeColors[Cookie.get("theme")].highlightText; return themeColors[Cookie.get("theme")].highlightText;
} else { } else {
return; return;
} }
}, },
currMode(name) { currMode(name) {
if(name === Session.get("mode")) { if (name === Session.get("mode")) {
return true; return true;
} else { } else {
return false; return false;
} }
}, },
calendarOptions() { calendarOptions() {
var cursor = work.find({}); var cursor = work.find({});
var events = []; var events = [];
cursor.forEach(function(current) { cursor.forEach(function(current) {
backgroundColor = calendarColors[current.type]; backgroundColor = calendarColors[current.type];
title = current.name; title = current.name;
duedate = current.dueDate.toISOString().slice(0,10); duedate = current.dueDate.toISOString().slice(0, 10);
events.push({start: duedate, title: title, backgroundColor: backgroundColor}); events.push({
}); start: duedate,
return { title: title,
height: window.innerHeight *.8, backgroundColor: backgroundColor
events: events, });
buttonText: { });
today: 'Today', return {
month: 'Month', height: window.innerHeight * .8,
week: 'Week', events: events,
day: 'Day' buttonText: {
} today: 'Today',
}; month: 'Month',
}, week: 'Week',
calCenter() { day: 'Day'
var width = window.innerWidth * .85; }
return "width:"+width.toString()+"px;margin-left:"+(.5*window.innerWidth-.5*width).toString()+"px"; };
}, },
calbg() { calCenter() {
var width = window.innerWidth * .865; var width = window.innerWidth * 0.85;
var height = window.innerHeight * .76; return "width:" + width.toString() + "px;margin-left:" + (0.5 * window.innerWidth - 0.5 * width).toString() + "px";
return "width:"+width.toString()+"px;height:"+height.toString()+"px;margin-left:"+(.5*window.innerWidth-.5*width).toString()+"px;margin-top:"+(.47*window.innerHeight-.5*height).toString()+"px"; },
} calbg() {
var width = window.innerWidth * 0.865;
var height = window.innerHeight * 0.76;
return "width:" + width.toString() + "px;height:" + height.toString() + "px;margin-left:" + (0.5 * window.innerWidth - 0.5 * width).toString() + "px;margin-top:" + (0.47 * window.innerHeight - 0.5 * height).toString() + "px";
}
}); });
Template.main.events({ Template.main.events({
'click .fa-bars' () { 'click .fa-bars' () {
var side = Session.get("sidebar"); var side = Session.get("sidebar");
if(side === "menuContainer") { if (side === "menuContainer") {
Session.set("sidebar",null) Session.set("sidebar", null);
} else if(side === "optionsContainer") { } else if (side === "optionsContainer") {
Session.set("sidebar","both"); Session.set("sidebar", "both");
} else if(side === "both") { } else if (side === "both") {
Session.set("sidebar","optionsContainer"); Session.set("sidebar", "optionsContainer");
} else { } else {
Session.set("sidebar","menuContainer"); Session.set("sidebar", "menuContainer");
} }
}, },
'click .fa-cog' () { 'click .fa-cog' () {
var side = Session.get("sidebar"); var side = Session.get("sidebar");
if(side === "optionsContainer") { if (side === "optionsContainer") {
Session.set("sidebar",null) Session.set("sidebar", null);
} else if(side === "menuContainer") { } else if (side === "menuContainer") {
Session.set("sidebar","both"); Session.set("sidebar", "both");
} else if(side === "both") { } else if (side === "both") {
Session.set("sidebar","menuContainer"); Session.set("sidebar", "menuContainer");
} else { } else {
Session.set("sidebar","optionsContainer"); Session.set("sidebar", "optionsContainer");
} }
}, },
'click .classes' () { 'click .classes' () {
if(Session.get("mode") === "classes") return; if (Session.get("mode") === "classes") return;
var modeHolder = document.getElementById("mainBody"); var modeHolder = document.getElementById("mainBody");
closeDivFade(modeHolder); closeDivFade(modeHolder);
setTimeout(function() { setTimeout(function() {
Session.set("mode","classes"); Session.set("mode", "classes");
openDivFade(modeHolder); openDivFade(modeHolder);
}, 300); }, 300);
}, },
'click .calendar' () { 'click .calendar' () {
if(Session.get("mode") === "calendar") return; if (Session.get("mode") === "calendar") return;
var modeHolder = document.getElementById("mainBody"); var modeHolder = document.getElementById("mainBody");
closeDivFade(modeHolder); closeDivFade(modeHolder);
setTimeout(function() { setTimeout(function() {
Session.set("mode","calendar"); Session.set("mode", "calendar");
openDivFade(modeHolder); openDivFade(modeHolder);
}, 300); }, 300);
}, },
'click' (event) { 'click' (event) {
var e = event.target.className; var e = event.target.className;
if(e !== Session.get("sidebar") && if (e !== Session.get("sidebar") &&
!e.includes("fa-cog") && !e.includes("fa-cog") &&
!e.includes("fa-bars") && !e.includes("fa-bars") &&
!document.getElementById("menuContainer").contains(event.target) && !document.getElementById("menuContainer").contains(event.target) &&
!document.getElementById("optionsContainer").contains(event.target)) { !document.getElementById("optionsContainer").contains(event.target)) {
Session.set("sidebar", null); Session.set("sidebar", null);
} }
} }
}); });
function openDivFade(div) { function openDivFade(div) {
div.style.display = "block"; div.style.display = "block";
div.style.opacity = "0"; div.style.opacity = "0";
setTimeout(function() { setTimeout(function() {
div.style.opacity = "1"; div.style.opacity = "1";
}, 100); }, 100);
} }
function closeDivFade(div) { function closeDivFade(div) {
div.style.opacity = "0"; div.style.opacity = "0";
setTimeout(function() { setTimeout(function() {
div.style.display = "none"; div.style.display = "none";
}, 100); }, 100);
} }
function sendData() { function sendData() {
// Take form data // Take form data
} }

435
hourglass/client/profile/profile.css
View File

@ -1,374 +1,356 @@
.change { .change {
font-size: 150%; font-size: 150%;
color: #8C8C8C; color: #8C8C8C;
cursor: pointer; cursor: pointer;
} }
.radio { .radio {
cursor: pointer; cursor: pointer;
} }
.changeInput { .changeInput {
font-size: 100%; font-size: 100%;
padding: 0; padding: 0;
color: #8C8C8C; color: #8C8C8C;
position: relative; position: relative;
} }
.profTitle { .profTitle {
font-size: 150%; font-size: 150%;
font-weight: 400; font-weight: 400;
margin: 0; margin: 0;
margin-bottom: 1%; margin-bottom: 1%;
} }
.profHea { .profHea {
font-size: 300%; font-size: 300%;
font-weight: 200; font-weight: 200;
} }
#motda { #motda {
font-size: 100%; font-size: 100%;
width: 30% !important; width: 30% !important;
} }
#profPage { #profPage {
width: 100%; width: 100%;
padding-right: 10%; padding-right: 10%;
overflow-x: hidden; overflow-x: hidden;
overflow-y: auto; overflow-y: auto;
} }
#profMainContainer { #profMainContainer {
position: relative; position: relative;
top: 0; top: 0;
left: 50%; left: 50%;
} }
#profBanner { #profBanner {
border: 5px solid #0D0D0D; border: 5px solid #0D0D0D;
border-top: 0; border-top: 0;
border-bottom: 0; border-bottom: 0;
} }
#profAvatar { #profAvatar {
border: 10px solid #0D0D0D; border: 10px solid #0D0D0D;
-moz-border-radius: 50%; -moz-border-radius: 50%;
-webkit-border-radius: 50%; -webkit-border-radius: 50%;
border-radius: 50%; border-radius: 50%;
position: absolute;
position: absolute; top: 43%;
top: 43%; left: 2.5%;
left: 2.5%; float: left;
float: left; z-index: 5;
z-index: 5;
} }
#motdBox { #motdBox {
width: 100%; width: 100%;
height: 5%; height: 5%;
padding: 0.5% 0 0.5% 0; padding: 0.5% 0 0.5% 0;
background-color: #0D0D0D;
background-color: #0D0D0D;
} }
#motdBox span { #motdBox span {
font-size: 130% !important; font-size: 130% !important;
margin: 0; margin: 0;
color: #FFF; color: #FFF;
} }
.username { .username {
margin-left: 20% !important; margin-left: 20% !important;
} }
.profOptions { .profOptions {
box-shadow: 2px 2px 5px 3px #666; box-shadow: 2px 2px 5px 3px #666;
position: absolute;
position: absolute; display: none;
display: none; z-index: 5;
z-index: 5; opacity: 0;
-webkit-transition: opacity 0.4s ease;
opacity: 0; -moz-transition: opacity 0.4s ease;
-ms-transition: opacity 0.4s ease;
-webkit-transition: opacity 0.4s ease; transition: opacity 0.4s ease;
-moz-transition: opacity 0.4s ease;
-ms-transition: opacity 0.4s ease;
transition: opacity 0.4s ease;
} }
.profOptionText { .profOptionText {
font-size: 150%; font-size: 150%;
min-width: 10%; min-width: 10%;
padding: 20px; padding: 20px;
margin: 0; margin: 0;
text-align: center;
text-align: center; cursor: pointer;
cursor: pointer; -webkit-transition: box-shadow 0.4s ease;
-moz-transition: box-shadow 0.4s ease;
-webkit-transition: box-shadow 0.4s ease; -ms-transition: box-shadow 0.4s ease;
-moz-transition: box-shadow 0.4s ease; transition: box-shadow 0.4s ease;
-ms-transition: box-shadow 0.4s ease;
transition: box-shadow 0.4s ease;
} }
.profOptions p:hover { .profOptions p:hover {
box-shadow: inset 0 0 0 99999px rgba(0,0,0,0.1); box-shadow: inset 0 0 0 99999px rgba(0, 0, 0, 0.1);
} }
#profCards { #profCards {
margin-top: 3%; margin-top: 3%;
margin-bottom: 3%; margin-bottom: 3%;
} }
.card { .card {
margin-bottom: 5%; margin-bottom: 5%;
padding: 4%; padding: 4%;
padding-top: 2.5%; padding-top: 2.5%;
padding-right: 4%; padding-right: 4%;
box-shadow: 2px 2px 5px 3px #666;
box-shadow: 2px 2px 5px 3px #666;
} }
#profInfo { #profInfo {
width: 30%; width: 30%;
float: left; float: left;
border-top: 5px solid #CC4444; border-top: 5px solid #CC4444;
} }
#about { #about {
padding: 5%; padding: 5%;
} }
#profClasses { #profClasses {
width: 50%; width: 50%;
height: 30%; height: 30%;
float: right; float: right;
border-top: 5px solid #2E4F74; border-top: 5px solid #2E4F74;
-webkit-transition: width 0.4s ease;
-webkit-transition: width 0.4s ease; -moz-transition: width 0.4s ease;
-moz-transition: width 0.4s ease; -ms-transition: width 0.4s ease;
-ms-transition: width 0.4s ease; transition: width 0.4s ease;
transition: width 0.4s ease;
} }
#profClassInfoHolder { #profClassInfoHolder {
-webkit-transition: opacity 0.4s ease; -webkit-transition: opacity 0.4s ease;
-moz-transition: opacity 0.4s ease; -moz-transition: opacity 0.4s ease;
-ms-transition: opacity 0.4s ease; -ms-transition: opacity 0.4s ease;
transition: opacity 0.4s ease; transition: opacity 0.4s ease;
} }
#classes { #classes {
padding: 4% 0 4% 0; padding: 4% 0 4% 0;
} }
#profFunctions { #profFunctions {
display: inline; display: inline;
} }
.profFunction { .profFunction {
margin-right: 1%; margin-right: 1%;
padding: 2%; padding: 2%;
border: 2px solid rgba(0, 0, 0, 0.2);
border: 2px solid rgba(0,0,0,0.2); display: inherit;
cursor: pointer;
display: inherit; -webkit-transition: background-color 0.4s ease;
cursor: pointer; -moz-transition: background-color 0.4s ease;
-ms-transition: background-color 0.4s ease;
-webkit-transition: background-color 0.4s ease; transition: background-color 0.4s ease;
-moz-transition: background-color 0.4s ease;
-ms-transition: background-color 0.4s ease;
transition: background-color 0.4s ease;
} }
.profFunction:hover { .profFunction:hover {
background-color: rgba(0,0,0,0.1); background-color: rgba(0, 0, 0, 0.1);
} }
.profFunction i, .profFunction h4 { .profFunction i,
padding: 1%; .profFunction h4 {
padding: 1%;
} }
#searchBar { #searchBar {
display: inline; display: inline;
} }
#profClassSearch { #profClassSearch {
font-size: 125%; font-size: 125%;
width: 30%; width: 30%;
margin-top: 3%; margin-top: 3%;
padding: 1.5% 1% 1.5% 1%; padding: 1.5% 1% 1.5% 1%;
-webkit-animation: expand .7s ease 1;
-webkit-animation: expand .7s ease 1;
animation: expand .7s ease 1; animation: expand .7s ease 1;
} }
@-webkit-keyframes expand { @-webkit-keyframes expand {
0% { width: 0%; } 0% {
100% { width: 30%; } width: 0%;
} }
100% {
width: 30%;
}
}
@keyframes expand { @keyframes expand {
0% { width: 0%; } 0% {
100% { width: 30%; } width: 0%;
}
100% {
width: 30%;
}
} }
#label { #label {
width: 90%; width: 90%;
margin-top: 2.5%; margin-top: 2.5%;
margin-bottom: 2%; margin-bottom: 2%;
background-color: rgba(0, 0, 0, 0.2);
background-color: rgba(0,0,0,0.2); box-shadow: none;
box-shadow: none; display: table;
cursor: default;
display: table;
cursor: default;
} }
.classHolder { .classHolder {
width: 90%; width: 90%;
padding: 1%; padding: 1%;
padding-right: 100%; padding-right: 100%;
display: inline-block;
display: inline-block; overflow-x: hidden;
overflow-y: scroll;
overflow-x: hidden;
overflow-y: scroll;
} }
.classHolder h3 { .classHolder h3 {
font-style: italic; font-style: italic;
font-weight: 200; font-weight: 200;
margin-left: 1%; margin-left: 1%;
color: #999;
color: #999; -webkit-filter: none;
filter: none;
-webkit-filter :none;
filter: none;
} }
.classBox { .classBox {
font-size: 150%; font-size: 150%;
width: 100%; width: 100%;
margin-bottom: 3%; margin-bottom: 3%;
padding: 2%; padding: 2%;
box-shadow: 2px 2px 5px 3px #666;
box-shadow: 2px 2px 5px 3px #666; display: table;
display: table; cursor: pointer;
cursor: pointer; -webkit-transition: background-color 0.4s ease;
-moz-transition: background-color 0.4s ease;
-webkit-transition: background-color 0.4s ease; -ms-transition: background-color 0.4s ease;
-moz-transition: background-color 0.4s ease; transition: background-color 0.4s ease;
-ms-transition: background-color 0.4s ease;
transition: background-color 0.4s ease;
} }
.classBox:hover { .classBox:hover {
background-color: rgba(0,0,0,0.1); background-color: rgba(0, 0, 0, 0.1);
} }
.classText { .classText {
margin-left: .5%; margin-left: .5%;
margin-right: 10%; margin-right: 10%;
display: table-cell; display: table-cell;
} }
.name { .name {
width: 40%; width: 40%;
} }
.teacher { .teacher {
width: 25%; width: 25%;
} }
.hour { .hour {
width: 15%; width: 15%;
} }
.subscribers { .subscribers {
width: 13%; width: 13%;
} }
#creRules { #creRules {
position: absolute; position: absolute;
} }
#create { #create {
margin-top: 2.5%; margin-top: 2.5%;
padding: 5%; padding: 5%;
padding-top: 1%; padding-top: 1%;
} }
#create div { #create div {
margin: 2%; margin: 2%;
margin-left: 11%; margin-left: 11%;
margin-bottom: 5%; margin-bottom: 5%;
display: inline-block; display: inline-block;
} }
.creInput { .creInput {
font-size: 120%; font-size: 120%;
padding: 3%; padding: 3%;
} }
.creOp { .creOp {
margin: 0 !important; margin: 0 !important;
} }
.-autocomplete-container { .-autocomplete-container {
margin: 0.5% 0 0 0 !important; margin: 0.5% 0 0 0 !important;
display: none; display: none;
} }
#creSubmit { #creSubmit {
font-weight: 200; font-weight: 200;
font-size: 140%; font-size: 140%;
margin: 0 35% 0 35%; margin: 0 35% 0 35%;
padding: 2%; padding: 2%;
background-color: rgba(0, 0, 0, 0.25);
background-color: rgba(0,0,0,0.25); text-align: center;
text-align: center; cursor: pointer;
cursor: pointer; -webkit-transition: background-color 0.4s ease;
-moz-transition: background-color 0.4s ease;
-webkit-transition: background-color 0.4s ease; -ms-transition: background-color 0.4s ease;
-moz-transition: background-color 0.4s ease; transition: background-color 0.4s ease;
-ms-transition: background-color 0.4s ease;
transition: background-color 0.4s ease;
} }
#creSubmit:hover { #creSubmit:hover {
background-color: rgba(0,0,0,0.15); background-color: rgba(0, 0, 0, 0.15);
} }
#restrict { #restrict {
font-size: 100%; font-size: 100%;
font-style: italic; font-style: italic;
font-weight: 300; font-weight: 300;
padding-left: 1%; padding-left: 1%;
color: #999 !important; color: #999 !important;
} }
#save { #save {
font-size: 90%; font-size: 90%;
background-color: #CC4444; background-color: #CC4444;
box-shadow: -1px 2px 5px 1px #333;
box-shadow: -1px 2px 5px 1px #333; position: absolute;
top: 0;
position: absolute; right: 10%;
top: 0; z-index: 5;
right: 10%; -webkit-transition: transform 0.2s ease, background-color 0.1s ease;
z-index: 5; -moz-transition: transform 0.2s ease, background-color 0.1s ease;
-ms-transition: transform 0.2s ease, background-color 0.1s ease;
-webkit-transition: transform 0.2s ease, background-color 0.1s ease; transition: transform 0.2s ease, background-color 0.1s ease;
-moz-transition: transform 0.2s ease, background-color 0.1s ease;
-ms-transition: transform 0.2s ease, background-color 0.1s ease;
transition: transform 0.2s ease, background-color 0.1s ease;
} }
#save:hover { #save:hover {
-webkit-transform: scale(1.05); -webkit-transform: scale(1.05);
-moz-transform: scale(1.05); -moz-transform: scale(1.05);
-ms-transform: scale(1.05); -ms-transform: scale(1.05);
-o-transform: scale(1.05); -o-transform: scale(1.05);
@ -376,16 +358,13 @@
} }
#save:active { #save:active {
background-color: #34CB34; background-color: #34CB34;
} }
#save h2 { #save h2 {
font-weight: 200; font-weight: 200;
width: 100%; width: 100%;
padding: 8%; padding: 8%;
-webkit-filter: none;
-webkit-filter: none; filter: none !important;
filter: none !important; }
}

2
hourglass/client/profile/profile.html
View File

@ -148,4 +148,4 @@
<span class="hour classText">{{hour}}</span> <span class="hour classText">{{hour}}</span>
<span class="subscribers classText">{{subscribers}}</span> <span class="subscribers classText">{{subscribers}}</span>
</div> </div>
</template> </template>

945
hourglass/client/profile/profile.js
View File

@ -1,497 +1,514 @@
import { Template } from 'meteor/templating'; import {
Template
} from 'meteor/templating';
Session.set("profInputOpen",null); Session.set("profInputOpen", null);
Session.set("profClassTab","manClass"); Session.set("profClassTab", "manClass");
Session.set("modifying",null); Session.set("modifying", null);
Session.set("radioDiv",null); Session.set("radioDiv", null);
Session.set("notsearching",true); Session.set("notsearching", true);
Session.set("confirm",null); Session.set("confirm", null);
Session.set("serverData",null); Session.set("serverData", null);
Session.set("autocompleteDivs", null); Session.set("autocompleteDivs", null);
Session.set("confirmText",null); Session.set("confirmText", null);
var themeColors = { var themeColors = {
"light": { "light": {
"header":"#EBEBEB", "header": "#EBEBEB",
"sidebar":"#65839A", "sidebar": "#65839A",
"statusIcons":"#33ADFF", "statusIcons": "#33ADFF",
"highlightText":"#FF1A1A", "highlightText": "#FF1A1A",
"cards":"#FEFEFE" "cards": "#FEFEFE"
}, },
"dark": { "dark": {
} }
}; };
Template.profile.helpers({ Template.profile.helpers({
classsettings: function() { classsettings: function() {
return { return {
position: "bottom", position: "bottom",
limit: 10, limit: 10,
rules: [{ rules: [{
token: '', token: '',
collection: classes, collection: classes,
field: "name", field: "name",
template: Template.classDisplay, template: Template.classDisplay,
filter: {status: true} filter: {
}] status: true
}; }
}, }]
schoolcomplete() { };
return { },
position: "bottom", schoolcomplete() {
limit: 6, return {
rules: [{ position: "bottom",
token: '', limit: 6,
collection: schools, rules: [{
field: 'name', token: '',
matchAll: true, collection: schools,
template: Template.schoollist field: 'name',
}] matchAll: true,
}; template: Template.schoollist
}, }]
teachercomplete() { };
return { },
position: "bottom", teachercomplete() {
limit: 1, return {
rules: [{ position: "bottom",
token: '', limit: 1,
collection: classes, rules: [{
field: 'teacher', token: '',
template: Template.teacherlist collection: classes,
}] field: 'teacher',
}; template: Template.teacherlist
}, }]
mainCenter() { };
var width = window.innerWidth * 1600/1920 + 10; },
return "width:"+width.toString()+"px;margin-left:"+-.5*width.toString()+"px"; mainCenter() {
}, var width = window.innerWidth * 1600 / 1920 + 10;
mainHeight() { return "width:" + width.toString() + "px;margin-left:" + -0.5 * width.toString() + "px";
return window.innerHeight.toString()+"px"; },
}, mainHeight() {
banner() { return window.innerHeight.toString() + "px";
var width = window.innerWidth * 1600/1920; },
var height = width * 615/1600; banner() {
if(Meteor.user().profile.banner !== undefined) { var width = window.innerWidth * 1600 / 1920;
var banner = Meteor.user().profile.banner; var height = width * 615 / 1600;
} else { if (Meteor.user().profile.banner !== undefined) {
var banner = "defaultcover.jpg"; var banner = Meteor.user().profile.banner;
} } else {
return "width:"+width.toString()+"px;height:"+height.toString()+"px;background-image:url(\'"+banner+"\');background-size:"+width.toString()+"px "+height.toString()+"px"; var banner = "defaultcover.jpg";
}, }
avatar() { return "width:" + width.toString() + "px;height:" + height.toString() + "px;background-image:url(\'" + banner + "\');background-size:" + width.toString() + "px " + height.toString() + "px";
var dim = window.innerWidth * 1600/1920 * .16; },
if(Meteor.user().profile.avatar !== undefined) { avatar() {
var pic = "\'"+Meteor.user().profile.avatar+"\'"; var dim = window.innerWidth * 1600 / 1920 * 0.16;
} else { if (Meteor.user().profile.avatar !== undefined) {
var pic = "defaultAvatars/"+(Math.floor(Math.random() * (11 - 1)) + 1).toString()+".png"; var pic = "\'" + Meteor.user().profile.avatar + "\'";
} } else {
return "background-image:url("+pic+");background-size:"+dim.toString()+"px "+dim.toString()+"px"; var pic = "defaultAvatars/" + (Math.floor(Math.random() * (11 - 1)) + 1).toString() + ".png";
}, }
avatarDim() { return "background-image:url(" + pic + ");background-size:" + dim.toString() + "px " + dim.toString() + "px";
var dim = window.innerWidth * 1600/1920 * .16; },
return "height:"+dim.toString()+"px;width:"+dim.toString()+"px;top:"+.43*window.innerHeight.toString()+"px;"; avatarDim() {
}, var dim = window.innerWidth * 1600 / 1920 * 0.16;
username() { return "height:" + dim.toString() + "px;width:" + dim.toString() + "px;top:" + 0.43 * window.innerHeight.toString() + "px;";
return Meteor.user().profile.name; },
}, username() {
motd() { return Meteor.user().profile.name;
if(Meteor.user().profile.description !== undefined) { },
return Meteor.user().profile.description; motd() {
} else { if (Meteor.user().profile.description !== undefined) {
return "Say something about yourself!"; return Meteor.user().profile.description;
} } else {
}, return "Say something about yourself!";
school() { }
if(Meteor.user().profile.school !== undefined) { },
return Meteor.user().profile.school; school() {
} else { if (Meteor.user().profile.school !== undefined) {
return "Click here to edit..."; return Meteor.user().profile.school;
} } else {
}, return "Click here to edit...";
grade() { }
if(Meteor.user().profile.grade !== undefined) { },
return Meteor.user().profile.grade+"th"; grade() {
} else { if (Meteor.user().profile.grade !== undefined) {
return "Click here to edit..."; return Meteor.user().profile.grade + "th";
} } else {
}, return "Click here to edit...";
classes() { }
return classes.find( { status: { $eq: true }, privacy: { $eq: false }}, {sort: { subscribers: -1 }}, {limit: 20}).fetch(); },
}, classes() {
profClassHeight() { return classes.find({
return .6*window.innerHeight.toString()+"px"; status: {
}, $eq: true
classHolderHeight() { },
return .26*window.innerHeight.toString()+"px"; privacy: {
}, $eq: false
profClassTabColor(status) { }
        if(status === Session.get("profClassTab")) { }, {
            return themeColors[Cookie.get("theme")].highlightText; sort: {
        } else { subscribers: -1
            return; }
        } }, {
    }, limit: 20
profClassTab(tab) { }).fetch();
if(tab === Session.get("profClassTab")) { },
return true; profClassHeight() {
} else { return 0.6 * window.innerHeight.toString() + "px";
return false; },
} classHolderHeight() {
}, return 0.26 * window.innerHeight.toString() + "px";
notsearching() { },
return Session.get("notsearching"); profClassTabColor(status) {        
}, if (status === Session.get("profClassTab")) {            
autocompleteClasses() { return themeColors[Cookie.get("theme")].highlightText;        
return Session.get("autocompleteDivs"); } else {            
}, return;        
/*myclasses() { }    
if (Meteor.user().profile.classes === undefined || Meteor.user().profile.classes.length === 0) { },
return []; profClassTab(tab) {
} else { if (tab === Session.get("profClassTab")) {
return Meteor.user().profile.classes; return true;
} } else {
},*/ return false;
notfound() { }
return Session.get("notfound"); },
}, notsearching() {
confirmText() { return Session.get("notsearching");
return Session.get("confirmText"); },
} autocompleteClasses() {
}) return Session.get("autocompleteDivs");
},
/*myclasses() {
if (Meteor.user().profile.classes === undefined || Meteor.user().profile.classes.length === 0) {
return [];
} else {
return Meteor.user().profile.classes;
}
},*/
notfound() {
return Session.get("notfound");
},
confirmText() {
return Session.get("confirmText");
}
});
Template.profile.events({ Template.profile.events({
'click profOptions p' (event) { 'click profOptions p' (event) {
var p = event.target; var p = event.target;
p.parentNode.parentNode.childNodes[1].value = p.childNodes[0].nodeValue; p.parentNode.parentNode.childNodes[1].value = p.childNodes[0].nodeValue;
closeDivFade(p.parentNode); closeDivFade(p.parentNode);
Session.set("radioDiv",null); Session.set("radioDiv", null);
Session.set("radioOffset",null); Session.set("radioOffset", null);
}, },
'click .change' (event) { 'click .change' (event) {
var ele = event.target; var ele = event.target;
var sessval = Session.get("modifying"); var sessval = Session.get("modifying");
if(ele.id !== sessval && sessval !== null) closeInput(sessval); if (ele.id !== sessval && sessval !== null) closeInput(sessval);
Session.set("modifying", ele.id); Session.set("modifying", ele.id);
var dim = ele.getBoundingClientRect(); var dim = ele.getBoundingClientRect();
ele.style.display = "none"; ele.style.display = "none";
var input = document.createElement("input"); var input = document.createElement("input");
if(ele.getAttribute("type") !== null) {
input.type = ele.getAttribute("type");
} else {
input.type = "text";
}
input.value = ele.childNodes[0].nodeValue;
input.className = "changeInput";
input.style.height = .9*dim.height.toString()+"px";
input.style.width = "70%";
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();
if(ele.getAttribute("restrict") !== null) {
var span = document.createElement("span");
span.id = "restrict";
var num = parseInt(ele.getAttribute("restrict"))-input.value.length;
if(num <= 0) {
span.style.setProperty("color","#FF1A1A","important");
num = 0;
}
span.appendChild(document.createTextNode(num.toString()+" characters left"));
ele.parentNode.appendChild(span);
}
},
'click' (event) {
var sessval = Session.get("modifying");
if(event.target.id !== sessval &&
event.target.id !== sessval+"a" &&
!Session.equals("modifying",null) &&
!event.target.parentNode.className.includes("profOptions")) {
closeInput(sessval);
}
if(!event.target.className.includes("radio") &&
!Session.equals("radioDiv",null) &&
!event.target.parentNode.className.includes("profOptions") &&
event.target.readOnly !== true) {
var opnum = (parseInt(Session.get("radioDiv"))-parseInt(Session.get("radioOffset"))).toString();
for(var i = 0; i < document.getElementsByClassName("profOptions").length; i++) {
try {
closeDivFade(document.getElementsByClassName("profOptions")[i]);
} catch(err) {}
}
Session.set("radioDiv",null);
Session.set("radioOffset",null);
}
},
'keydown' (event) {
var sessval = Session.get("modifying");
if(event.keyCode == 13) {
try {
closeInput(sessval);
} catch(err) {}
}
if(sessval !== null && event.keyCode !== 13) {
var restrict = document.getElementById(sessval).getAttribute("restrict");
if(restrict !== null) {
var num = parseInt(restrict)-event.target.value.length;
var restext = document.getElementById("restrict");
if(num === 1) {
restext.childNodes[0].nodeValue = num.toString()+" character left";
restext.style.setProperty("color","#999","important");
} else if(num <= 0) {
var input = document.getElementById(sessval+"a");
input.value = input.value.substring(0,parseInt(restrict));
restext.childNodes[0].nodeValue = "0 characters left";
restext.style.setProperty("color","#FF1A1A","important");
} else {
restext.childNodes[0].nodeValue = num.toString()+" characters left";
restext.style.setProperty("color","#999","important");
}
}
}
},
'click .radio' (event) {
var op = event.target;
Session.set("radioDiv", op.getAttribute("op"));
Session.set("radioOffset", op.getAttribute("opc"));
try {
for(var i = 0; i < document.getElementsByClassName("profOptions").length; i++) {
var curr = document.getElementsByClassName("profOptions")[i];
if(Session.get("radioDiv") !== i.toString()) {
closeDivFade(document.getElementsByClassName("profOptions")[i]);
}
}
} catch(err) {}
openDivFade(document.getElementsByClassName("profOptions")[op.getAttribute("op")]);
},
'click .profOptions p' (event) {
var sessval = Session.get("modifying");
var p = event.target;
var opnum = (parseInt(Session.get("radioDiv"))-parseInt(Session.get("radioOffset"))).toString();
var input = document.getElementsByClassName("op")[opnum];
input.value = p.childNodes[0].nodeValue;
try{
closeInput(sessval);
} catch(err) {}
closeDivFade(p.parentNode);
input.focus();
Session.set("radioDiv",null);
Session.set("radioOffset",null);
},
'click .addClass' () {
        var functionHolder = document.getElementById("profClassInfoHolder")
        closeDivFade(functionHolder);
        setTimeout(function() {
            Session.set("profClassTab","addClass");
            openDivFade(functionHolder);
        },300);
    },
    'click .manageClass' () {
        var functionHolder = document.getElementById("profClassInfoHolder")
        closeDivFade(functionHolder);
        setTimeout(function() {
            Session.set("profClassTab","manClass");
            openDivFade(functionHolder);
        },300);
    },
    'click .createClass' () {
        var functionHolder = document.getElementById("profClassInfoHolder")
        closeDivFade(functionHolder);
        setTimeout(function() {
            Session.set("profClassTab","creClass");
            openDivFade(functionHolder);
        },300);
    },
'click .fa-search' () {
Session.set("searching",true);
},
'click .fa-times-thin' () {
Session.set("searching",false);
},
'keydown #profClassSearch' (event) {
if(event.target.value === "") {
Session.set("notsearching",true);
} else {
Session.set("notsearching",false);
}
Session.set("autocompleteDivs",null);
var divs = [];
try {
var items = document.getElementsByClassName("-autocomplete-container")[0].childNodes[3].childNodes;
if(items.length === 0) {
Session.set("notfound",true);
} else {
Session.set("notfound",false);
}
for(var i = 2; i < items.length; i+=3) {
var item = items[i].childNodes[3];
divs.push({
name: item.childNodes[1].childNodes[0].nodeValue,
teacher: item.childNodes[3].childNodes[0].nodeValue,
hour: item.childNodes[5].childNodes[0].nodeValue,
subscribers: item.childNodes[7].childNodes[0].nodeValue,
_id:item.getAttribute("classid")
});
Session.set("autocompleteDivs", divs);
}
} catch(err) {}
},
'click .classBox' (event) {
if(event.target.id === "label") return;
if(event.target.className !== "classBox") {
var attribute = event.target.parentNode.getAttribute("classid");
} else {
var attribute = event.target.getAttribute("classid");
}
var data = [attribute,""];
Session.set("serverData",data);
Session.set("confirm","joinClass");
Session.set("confirmText","Join class?");
openDivFade(document.getElementsByClassName("overlay")[0]); if (ele.getAttribute("type") !== null) {
setTimeout(function() { input.type = ele.getAttribute("type");
document.getElementsByClassName("overlay")[0].style.opacity = "1"; } else {
}, 200); input.type = "text";
}, }
'click .fa-check-circle-o' () { input.value = ele.childNodes[0].nodeValue;
sendData(Session.get("confirm")); input.className = "changeInput";
closeDivFade(document.getElementsByClassName("overlay")[0]); input.style.height = 0.9 * dim.height.toString() + "px";
Session.set("serverData",null); input.style.width = "70%";
Session.set("confirm",null); input.style.padding = "0.1%";
}, input.id = ele.id + "a";
'click .fa-times-circle-o' () { input.setAttribute("opc", ele.getAttribute("opc"));
closeDivFade(document.getElementsByClassName("overlay")[0]); ele.parentNode.appendChild(input);
Session.set("serverData",null); if (ele.getAttribute("re") == "readonly") {
Session.set("confirm",null); input.readOnly = true;
}, input.className += " op";
'click #save' () { input.style.cursor = "pointer";
Session.set("serverData",getProfileData()); } else {
Session.set("confirm","editProfile"); input.select();
Session.set("confirmText", "Save new profile settings?"); }
input.focus();
if (ele.getAttribute("restrict") !== null) {
var span = document.createElement("span");
span.id = "restrict";
var num = parseInt(ele.getAttribute("restrict")) - input.value.length;
if (num <= 0) {
span.style.setProperty("color", "#FF1A1A", "important");
num = 0;
}
span.appendChild(document.createTextNode(num.toString() + " characters left"));
ele.parentNode.appendChild(span);
}
},
'click' (event) {
var sessval = Session.get("modifying");
if (event.target.id !== sessval &&
event.target.id !== sessval + "a" &&
!Session.equals("modifying", null) &&
!event.target.parentNode.className.includes("profOptions")) {
closeInput(sessval);
}
if (!event.target.className.includes("radio") &&
!Session.equals("radioDiv", null) &&
!event.target.parentNode.className.includes("profOptions") &&
event.target.readOnly !== true) {
var opnum = (parseInt(Session.get("radioDiv")) - parseInt(Session.get("radioOffset"))).toString();
for (var i = 0; i < document.getElementsByClassName("profOptions").length; i++) {
try {
closeDivFade(document.getElementsByClassName("profOptions")[i]);
} catch (err) {}
}
Session.set("radioDiv", null);
Session.set("radioOffset", null);
}
},
'keydown' (event) {
var sessval = Session.get("modifying");
if (event.keyCode == 13) {
try {
closeInput(sessval);
} catch (err) {}
}
if (sessval !== null && event.keyCode !== 13) {
var restrict = document.getElementById(sessval).getAttribute("restrict");
if (restrict !== null) {
var num = parseInt(restrict) - event.target.value.length;
var restext = document.getElementById("restrict");
if (num === 1) {
restext.childNodes[0].nodeValue = num.toString() + " character left";
restext.style.setProperty("color", "#999", "important");
} else if (num <= 0) {
var input = document.getElementById(sessval + "a");
input.value = input.value.substring(0, parseInt(restrict));
restext.childNodes[0].nodeValue = "0 characters left";
restext.style.setProperty("color", "#FF1A1A", "important");
} else {
restext.childNodes[0].nodeValue = num.toString() + " characters left";
restext.style.setProperty("color", "#999", "important");
}
}
}
},
'click .radio' (event) {
var op = event.target;
Session.set("radioDiv", op.getAttribute("op"));
Session.set("radioOffset", op.getAttribute("opc"));
try {
for (var i = 0; i < document.getElementsByClassName("profOptions").length; i++) {
var curr = document.getElementsByClassName("profOptions")[i];
if (Session.get("radioDiv") !== i.toString()) {
closeDivFade(document.getElementsByClassName("profOptions")[i]);
}
}
} catch (err) {}
openDivFade(document.getElementsByClassName("profOptions")[op.getAttribute("op")]);
},
'click .profOptions p' (event) {
var sessval = Session.get("modifying");
var p = event.target;
var opnum = (parseInt(Session.get("radioDiv")) - parseInt(Session.get("radioOffset"))).toString();
var input = document.getElementsByClassName("op")[opnum];
input.value = p.childNodes[0].nodeValue;
try {
closeInput(sessval);
} catch (err) {}
openDivFade(document.getElementsByClassName("overlay")[0]); closeDivFade(p.parentNode);
setTimeout(function() { input.focus();
document.getElementsByClassName("overlay")[0].style.opacity = "1"; Session.set("radioDiv", null);
}, 200); Session.set("radioOffset", null);
}, },
'click #creSubmit' () { 'click .addClass' () {        
var data = getCreateFormData(); var functionHolder = document.getElementById("profClassInfoHolder");
if(data == null) return; closeDivFade(functionHolder);        
Session.set("serverData",data); setTimeout(function() {            
Session.set("confirm","createClass"); Session.set("profClassTab", "addClass");            
Session.set("confirmText", "Submit request?"); openDivFade(functionHolder);        
}, 300);    
},
    'click .manageClass' () {        
var functionHolder = document.getElementById("profClassInfoHolder");
closeDivFade(functionHolder);        
setTimeout(function() {            
Session.set("profClassTab", "manClass");            
openDivFade(functionHolder);        
}, 300);    
},
    'click .createClass' () {        
var functionHolder = document.getElementById("profClassInfoHolder");        
closeDivFade(functionHolder);        
setTimeout(function() {            
Session.set("profClassTab", "creClass");            
openDivFade(functionHolder);        
}, 300);    
},
'click .fa-search' () {
Session.set("searching", true);
},
'click .fa-times-thin' () {
Session.set("searching", false);
},
'keydown #profClassSearch' (event) {
if (event.target.value === "") {
Session.set("notsearching", true);
} else {
Session.set("notsearching", false);
}
Session.set("autocompleteDivs", null);
var divs = [];
try {
var items = document.getElementsByClassName("-autocomplete-container")[0].childNodes[3].childNodes;
if (items.length === 0) {
Session.set("notfound", true);
} else {
Session.set("notfound", false);
}
for (var i = 2; i < items.length; i += 3) {
var item = items[i].childNodes[3];
divs.push({
name: item.childNodes[1].childNodes[0].nodeValue,
teacher: item.childNodes[3].childNodes[0].nodeValue,
hour: item.childNodes[5].childNodes[0].nodeValue,
subscribers: item.childNodes[7].childNodes[0].nodeValue,
_id: item.getAttribute("classid")
});
Session.set("autocompleteDivs", divs);
}
} catch (err) {}
},
'click .classBox' (event) {
if (event.target.id === "label") return;
if (event.target.className !== "classBox") {
var attribute = event.target.parentNode.getAttribute("classid");
} else {
var attribute = event.target.getAttribute("classid");
}
var data = [attribute, ""];
Session.set("serverData", data);
Session.set("confirm", "joinClass");
Session.set("confirmText", "Join class?");
openDivFade(document.getElementsByClassName("overlay")[0]); openDivFade(document.getElementsByClassName("overlay")[0]);
setTimeout(function() { setTimeout(function() {
document.getElementsByClassName("overlay")[0].style.opacity = "1"; document.getElementsByClassName("overlay")[0].style.opacity = "1";
}, 200); }, 200);
}, },
'focus .op' (event) { 'click .fa-check-circle-o' () {
event.target.click(); sendData(Session.get("confirm"));
} closeDivFade(document.getElementsByClassName("overlay")[0]);
}) Session.set("serverData", null);
Session.set("confirm", null);
},
'click .fa-times-circle-o' () {
closeDivFade(document.getElementsByClassName("overlay")[0]);
Session.set("serverData", null);
Session.set("confirm", null);
},
'click #save' () {
Session.set("serverData", getProfileData());
Session.set("confirm", "editProfile");
Session.set("confirmText", "Save new profile settings?");
openDivFade(document.getElementsByClassName("overlay")[0]);
setTimeout(function() {
document.getElementsByClassName("overlay")[0].style.opacity = "1";
}, 200);
},
'click #creSubmit' () {
var data = getCreateFormData();
if (data === null) return;
Session.set("serverData", data);
Session.set("confirm", "createClass");
Session.set("confirmText", "Submit request?");
openDivFade(document.getElementsByClassName("overlay")[0]);
setTimeout(function() {
document.getElementsByClassName("overlay")[0].style.opacity = "1";
}, 200);
},
'focus .op' (event) {
event.target.click();
}
});
function openDivFade(div) { function openDivFade(div) {
if(div.className === "profOptions") { if (div.className === "profOptions") {
div.style.display = "inline-block"; div.style.display = "inline-block";
} else { } else {
div.style.display = "block"; div.style.display = "block";
} }
div.style.opacity = "0"; div.style.opacity = "0";
setTimeout(function() { setTimeout(function() {
div.style.opacity = "1"; div.style.opacity = "1";
}, 100); }, 100);
} }
function closeDivFade(div) { function closeDivFade(div) {
div.style.opacity = "0"; div.style.opacity = "0";
setTimeout(function() { setTimeout(function() {
div.style.display = "none"; div.style.display = "none";
}, 100); }, 100);
} }
function closeInput(sessval) { function closeInput(sessval) {
var input = document.getElementById(sessval+"a"); var input = document.getElementById(sessval + "a");
var span = document.getElementById(sessval); var span = document.getElementById(sessval);
input.parentNode.removeChild(input); input.parentNode.removeChild(input);
try{ try {
var restrict = document.getElementById("restrict"); var restrict = document.getElementById("restrict");
restrict.parentNode.removeChild(restrict) restrict.parentNode.removeChild(restrict);
} catch(err) {} } catch (err) {}
if(input.value == "") { if (input.value === "") {
span.childNodes[0].nodeValue = "Click here to edit..."; span.childNodes[0].nodeValue = "Click here to edit...";
} else { } else {
span.childNodes[0].nodeValue = input.value; span.childNodes[0].nodeValue = input.value;
} }
span.style.display = "initial"; span.style.display = "initial";
Session.set("modifying",null); Session.set("modifying", null);
} }
function sendData(funcName) { function sendData(funcName) {
Meteor.call(funcName,Session.get("serverData")); Meteor.call(funcName, Session.get("serverData"));
} }
function getProfileData() { function getProfileData() {
var description = document.getElementById("motd").childNodes[0].nodeValue; var description = document.getElementById("motd").childNodes[0].nodeValue;
var school = document.getElementById("school").childNodes[0].nodeValue; var school = document.getElementById("school").childNodes[0].nodeValue;
var gradein = document.getElementById("grade").childNodes[0].nodeValue; var gradein = document.getElementById("grade").childNodes[0].nodeValue;
var grade = parseInt(gradein.substring(gradein.length-2,gradein)); var grade = parseInt(gradein.substring(gradein.length - 2, gradein));
var avatar = document.getElementById("profAvatar").style.backgroundImage.replace(")","").replace("url(","").replace("\"","").replace("\"",""); var avatar = document.getElementById("profAvatar").style.backgroundImage.replace(")", "").replace("url(", "").replace("\"", "").replace("\"", "");
var banner = document.getElementById("profBanner").style.backgroundImage.replace(")","").replace("url(","").replace("\"","").replace("\"",""); var banner = document.getElementById("profBanner").style.backgroundImage.replace(")", "").replace("url(", "").replace("\"", "").replace("\"", "");
return { return {
school: school, school: school,
grade: grade, grade: grade,
description: description, description: description,
avatar: avatar, avatar: avatar,
banner: banner banner: banner
}; };
} }
function getCreateFormData() { function getCreateFormData() {
var stop; var stop;
var form = document.getElementsByClassName("creInput"); var form = document.getElementsByClassName("creInput");
for(var i = 0; i < form.length; i++) { for (var i = 0; i < form.length; i++) {
if(form[i].value === "") { if (form[i].value === "") {
form[i].focus(); form[i].focus();
form[i].placeholder = "Missing field"; form[i].placeholder = "Missing field";
form[i].className += " formInvalid"; form[i].className += " formInvalid";
stop = true; stop = true;
} else { } else {
form[i].className = form[i].className.replace(" formInvalid",""); form[i].className = form[i].className.replace(" formInvalid", "");
} }
} }
if(stop) return null; if (stop) return null;
var school = form[0].value; var school = form[0].value;
var hour = form[1].value; var hour = form[1].value;
var teacher = form[2].value; var teacher = form[2].value;
var name = form[3].value; var name = form[3].value;
if(form[4].value == "public") { if (form[4].value == "public") {
var privacy = false; var privacy = false;
} else { } else {
var privacy = true; var privacy = true;
} }
var category = form[5].value; var category = form[5].value;
return { return {
school: school, school: school,
hour: hour, hour: hour,
teacher: teacher, teacher: teacher,
name: name, name: name,
privacy: privacy, privacy: privacy,
category: category, category: category,
status: false, status: false,
code: "" code: ""
}; };
} }