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

CSS size and zoom fixes

Browse Source
This commit is contained in:
Kenneth Jao 2016-09-12 11:12:06 -04:00
parent 7842b995dc
commit a5d0d17947
6 changed files with 248 additions and 234 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
hourglass/client/main/main.css
View File

@ -777,7 +777,6 @@ input, textarea {
} }
#bg { #bg {
min-width: 1920px;
min-height: 100%; min-height: 100%;
width: 100%; width: 100%;
height: auto; height: auto;

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

@ -95,7 +95,7 @@
</div> </div>
</div> </div>
</div> </div>
<img id="bg" src={{bgSrc}}> <img id="bg" src={{bgSrc}} style="min-width:{{screen}}">
<div id="mainBody{{highlight}}"> <div id="mainBody{{highlight}}">
{{#if currMode 'classes'}} {{#if currMode 'classes'}}
<div id="classesMode"> <div id="classesMode">

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

@ -70,6 +70,12 @@ Template.registerHelper('userProfile', () => {
return; return;
}); });
Template.registerHelper('screen', (multiplier, fraction) => {
if(multiplier === undefined) return screen.width.toString() + "px";
if(fraction === undefined) return (screen.width * parseInt(multiplier)).toString() + "px"
return ((screen.width) * parseInt(multiplier) / parseInt(fraction)).toString() + "px";
});
Template.registerHelper('divColor', (div) => { // Reactive color changing based on preferences. Colors stored in themeColors. Template.registerHelper('divColor', (div) => { // Reactive color changing based on preferences. Colors stored in themeColors.
return themeColors[Session.get("user").preferences.theme][div]; return themeColors[Session.get("user").preferences.theme][div];
}); });

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

@ -4,6 +4,13 @@
cursor: pointer; cursor: pointer;
} }
#profWrapper {
width: 100%;
height: 100%;
overflow-x: auto;
overflow-y: hidden;
}
#profPage .change { #profPage .change {
font-size: 2.5vh; font-size: 2.5vh;
} }
@ -41,7 +48,6 @@
#profPage { #profPage {
width: 100%; width: 100%;
height: 100%; height: 100%;
padding-right: 10%;
overflow-x: hidden; overflow-x: hidden;
overflow-y: auto; overflow-y: auto;
} }
@ -307,7 +313,7 @@
.classBox { .classBox {
font-size: 2.7vh; font-size: 2.7vh;
width: 39vw; width: 94%;
margin-bottom: 3%; margin-bottom: 3%;
padding: 2%; padding: 2%;
@ -493,22 +499,20 @@
} }
#createdClasses { #createdClasses {
width: 35vw; width: 500px;
height: 73vh; height: 73vh;
margin-right: -40%; padding: 30px 0 30px 30px;
padding: 2.5% 0 2.5% 2.5%;
border-top: 5px solid #27646D; border-top: 5px solid #27646D;
box-shadow: -1px 2px 5px 1px #444; box-shadow: -1px 2px 5px 1px #444;
position: absolute; position: absolute;
top: 10vh; top: 10vh;
right: 0;
-webkit-transition: margin 0.4s ease; -webkit-transition: right 0.4s ease;
-moz-transition: margin 0.4s ease; -moz-transition: right 0.4s ease;
-ms-transition: margin 0.4s ease; -ms-transition: right 0.4s ease;
transition: margin 0.4s ease; transition: right 0.4s ease;
} }
#code { #code {
@ -684,22 +688,20 @@
} }
#joinPrivClass { #joinPrivClass {
width: 18vw; width: 200px;
margin-bottom: -20%; height: 110px;
padding: 1.5%; padding: 20px;
padding-bottom: 1%;
border-top: 5px solid #852E6D; border-top: 5px solid #852E6D;
box-shadow: -2px 0px 5px 1px #444; box-shadow: -2px 0px 5px 1px #444;
position: absolute; position: absolute;
right: 5vw; right: 5vw;
bottom: 0;
-webkit-transition: margin 0.4s ease; -webkit-transition: bottom 0.4s ease;
-moz-transition: margin 0.4s ease; -moz-transition: bottom 0.4s ease;
-ms-transition: margin 0.4s ease; -ms-transition: bottom 0.4s ease;
transition: margin 0.4s ease; transition: bottom 0.4s ease;
} }
#joinPrivClass h3 { #joinPrivClass h3 {

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

@ -2,203 +2,205 @@
<div class="noScroll"> <div class="noScroll">
<div id="mainpage{{userProfile}}" onclick="window.location='/'"><h2>Main Page</h2></div> <div id="mainpage{{userProfile}}" onclick="window.location='/'"><h2>Main Page</h2></div>
<div id="logout2" onclick='document.getElementById("login-buttons-logout").click();'><h2>Logout</h2></div> <div id="logout2" onclick='document.getElementById("login-buttons-logout").click();'><h2>Logout</h2></div>
<div id="profPage" style="background-color:{{divColor 'header'}};{{textColor}}{{loadNew}}"> <div id="profWrapper">
<div id="profMainContainer"> <div id="profPage" style="background-color:{{divColor 'header'}};min-width:{{screen}}{{textColor}}{{loadNew}}">
<div id="profTop"> <div id="profMainContainer">
<img id="profBanner" src='{{banner}}' alt="Banner"> <div id="profTop">
<img id="profAvatar" src='{{avatar}}' alt="Avatar"> <img id="profBanner" src='{{banner}}' alt="Banner">
<div id="motdBox"> <img id="profAvatar" src='{{avatar}}' alt="Avatar">
<span class="username">{{username}} - </span> <div id="motdBox">
<span class="change mo" restrict="50" id="motd">{{motd}}</span> <span class="username">{{username}} - </span>
<span id="motdrestrict">{{commentLength}}</span> <span class="change mo" restrict="50" id="motd">{{motd}}</span>
<span id="motdrestrict">{{commentLength}}</span>
</div>
</div> </div>
</div> <div id="profCards">
<div id="profCards"> <div id="cardColLeft">
<div id="cardColLeft"> <!-- Card 1 -->
<!-- Card 1 --> <div id="profInfo" class="card" style="background-color:{{divColor 'cards'}}">
<div id="profInfo" class="card" style="background-color:{{divColor 'cards'}}"> <h3 class="profHea">About</h3>
<h3 class="profHea">About</h3> <div id="about">
<div id="about">
<div>
<p class="profTitle">School Name:</p>
<span class="change" id="school">{{school}}</span>
</div>
<br>
<div class="radioContainer">
<div> <div>
<p class="profTitle">Grade:</p> <p class="profTitle">School Name:</p>
<span class="change radio" re="readonly" id="grade">{{grade}}</span> <span class="change" id="school">{{school}}</span>
</div> </div>
<div class="profOptions"> <br>
<p class="profOptionText" style="background-color:{{divColor 'header'}}">9th</p> <div class="radioContainer">
<p class="profOptionText" style="background-color:{{divColor 'header'}}">10th</p> <div>
<p class="profOptionText" style="background-color:{{divColor 'header'}}">11th</p> <p class="profTitle">Grade:</p>
<p class="profOptionText" style="background-color:{{divColor 'header'}}">12th</p> <span class="change radio" re="readonly" id="grade">{{grade}}</span>
</div>
<div class="profOptions">
<p class="profOptionText" style="background-color:{{divColor 'header'}}">9th</p>
<p class="profOptionText" style="background-color:{{divColor 'header'}}">10th</p>
<p class="profOptionText" style="background-color:{{divColor 'header'}}">11th</p>
<p class="profOptionText" style="background-color:{{divColor 'header'}}">12th</p>
</div>
</div> </div>
</div> </div>
</div> </div>
<!-- Card 2 -->
<div id="profPreferences" class="card" style="background-color:{{divColor 'cards'}}">
<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">{{pref 'theme'}}</span>
</div>
<div class="profOptions">
<p class="profOptionText" style="background-color:{{divColor 'header'}}">Light</p>
<p class="profOptionText" style="background-color:{{divColor 'header'}}">Dark</p>
</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>
<div class="profOptions">
<p class="profOptionText" style="background-color:{{divColor 'header'}}">Classes</p>
<p class="profOptionText" style="background-color:{{divColor 'header'}}">Calendar</p>
</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>
<div class="profOptions">
<p class="profOptionText" style="background-color:{{divColor 'header'}}">1 Day</p>
<P class="profOptionText" style="background-color:{{divColor 'header'}}">2 Days</p>
<p class="profOptionText" style="background-color:{{divColor 'header'}}">1 Week</p>
<p class="profOptionText" style="background-color:{{divColor 'header'}}">1 Month</p>
<p class="profOptionText" style="background-color:{{divColor 'header'}}">Never</p>
</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>
<div class="profOptions">
<p class="profOptionText" style="background-color:{{divColor 'header'}}">Yes</p>
<p class="profOptionText" style="background-color:{{divColor 'header'}}">No</p>
</div>
</div>
</div>
</div>
</div> </div>
<!-- Card 2 --> <div id="cardColRight">
<div id="profPreferences" class="card" style="background-color:{{divColor 'cards'}}"> <!-- Card 3 -->
<h3 class="profHea">Preferences</h3> <div id="profClasses" class="card" style="background-color:{{divColor 'cards'}};">
<div id="preferences"> <h3 class="profHea">Classes</h3>
<div class="radioContainer"> <div id="classes">
<div class="inputRadio"> <div id="profFunctions">
<p class="profTitle">Theme:</p> <div class="profFunction manageClass">
<span class="change radio" re="readonly" id="prefTheme">{{pref 'theme'}}</span> <i class="fa fa-tasks" aria-hidden="true"></i>
</div> <h4 style="color:{{profClassTabColor 'manClass'}}">Manage my Classes</h4>
<div class="profOptions"> </div>
<p class="profOptionText" style="background-color:{{divColor 'header'}}">Light</p> <div class="profFunction addClass">
<p class="profOptionText" style="background-color:{{divColor 'header'}}">Dark</p> <i class="fa fa-plus" aria-hidden="true"></i>
</div> <h4 style="color:{{profClassTabColor 'addClass'}}">Join a Class</h4>
</div> </div>
<br> <div class="profFunction createClass">
<div class="radioContainer"> <i class="fa fa-graduation-cap" aria-hidden="true"></i>
<div class="inputRadio"> <h4 style="color:{{profClassTabColor 'creClass'}}">Create a Class</h4>
<p class="profTitle">Default Mode:</p> </div>
<span class="change radio" re="readonly" id="prefMode">{{pref 'mode'}}</span> </div>
</div> <div id="profClassInfoHolder">
<div class="profOptions"> {{#if profClassTab "manClass"}}
<p class="profOptionText" style="background-color:{{divColor 'header'}}">Classes</p> <div id="label" class="classBox">
<p class="profOptionText" style="background-color:{{divColor 'header'}}">Calendar</p> <span class="name classText">Class Name</span>
</div> <span class="teacher classText">Teacher</span>
</div> <span class="hour classText">Hour</span>
<br> <span class="subscriptions classText">Members</span>
<div class="radioContainer"> </div>
<div class="inputRadio"> <div class="classHolder">
<p class="profTitle">Hide Homework:</p> {{#each myClasses}}
<span class="change radio" re="readonly" id="prefHide">{{pref 'timeHide'}}</span> {{> classDisplay}}
</div>
<div class="profOptions">
<p class="profOptionText" style="background-color:{{divColor 'header'}}">1 Day</p>
<P class="profOptionText" style="background-color:{{divColor 'header'}}">2 Days</p>
<p class="profOptionText" style="background-color:{{divColor 'header'}}">1 Week</p>
<p class="profOptionText" style="background-color:{{divColor 'header'}}">1 Month</p>
<p class="profOptionText" style="background-color:{{divColor 'header'}}">Never</p>
</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>
<div class="profOptions">
<p class="profOptionText" style="background-color:{{divColor 'header'}}">Yes</p>
<p class="profOptionText" style="background-color:{{divColor 'header'}}">No</p>
</div>
</div>
</div>
</div>
</div>
<div id="cardColRight">
<!-- Card 3 -->
<div id="profClasses" class="card" style="background-color:{{divColor 'cards'}};">
<h3 class="profHea">Classes</h3>
<div id="classes">
<div id="profFunctions">
<div class="profFunction manageClass">
<i class="fa fa-tasks" aria-hidden="true"></i>
<h4 style="color:{{profClassTabColor 'manClass'}}">Manage my Classes</h4>
</div>
<div class="profFunction addClass">
<i class="fa fa-plus" aria-hidden="true"></i>
<h4 style="color:{{profClassTabColor 'addClass'}}">Join a Class</h4>
</div>
<div class="profFunction createClass">
<i class="fa fa-graduation-cap" aria-hidden="true"></i>
<h4 style="color:{{profClassTabColor 'creClass'}}">Create a Class</h4>
</div>
</div>
<div id="profClassInfoHolder">
{{#if profClassTab "manClass"}}
<div id="label" class="classBox">
<span class="name classText">Class Name</span>
<span class="teacher classText">Teacher</span>
<span class="hour classText">Hour</span>
<span class="subscriptions classText">Members</span>
</div>
<div class="classHolder">
{{#each myClasses}}
{{> classDisplay}}
{{/each}} {{/each}}
{{#if noclass}} {{#if noclass}}
<h3>No results found...</h3> <h3>No results found...</h3>
{{/if}} {{/if}}
</div> </div>
{{/if}} {{/if}}
{{#if profClassTab "addClass"}} {{#if profClassTab "addClass"}}
<div id="joinTop"> <div id="joinTop">
<i class="fa fa-search" aria-hidden="true"></i> <i class="fa fa-search" aria-hidden="true"></i>
{{> inputAutocomplete id="profClassSearch" settings=classSettings placeholder="Search..."}} {{> inputAutocomplete id="profClassSearch" settings=classSettings placeholder="Search..."}}
<h4 id="private">Join Private Class</h4> <h4 id="private">Join Private Class</h4>
</div> </div>
<div id="label" class="classBox"> <div id="label" class="classBox">
<span class="name classText">Class Name</span> <span class="name classText">Class Name</span>
<span class="teacher classText">Teacher</span> <span class="teacher classText">Teacher</span>
<span class="hour classText">Hour</span> <span class="hour classText">Hour</span>
<span class="subscriptions classText">Members</span> <span class="subscriptions classText">Members</span>
</div> </div>
<div class="classHolder"> <div class="classHolder">
{{#if notsearching}} {{#if notsearching}}
{{#each classes}} {{#each classes}}
{{> classDisplay}} {{> classDisplay}}
{{/each}} {{/each}}
{{#if noclass}} {{#if noclass}}
<h3>No results found...</h3> <h3>No results found...</h3>
{{/if}} {{/if}}
{{else}} {{else}}
{{#each autocompleteClasses}} {{#each autocompleteClasses}}
{{> classDisplay}} {{> classDisplay}}
{{/each}} {{/each}}
{{#if notfound}} {{#if notfound}}
<h3>No results found...</h3> <h3>No results found...</h3>
{{/if}}
{{/if}} {{/if}}
</div>
{{/if}}
{{#if profClassTab "creClass"}}
<div id="creRules"><p>Submit a request for a class to be approved by an administrator.</p></div>
<div id="formContainer">
<div class="formDiv">
<p class="profTitle">School:</p>
{{> inputAutocomplete settings=schoolComplete class="form-control creInput" type="text" name="school" placeholder="Example: International Academy" }}
</div>
<div class="formDiv">
<p class="profTitle">Hour:</p>
<input class="creInput" type="text" name="hour">
</div>
<div class="formDiv">
<p class="profTitle">Teacher:</p>
{{> inputAutocomplete settings=teacherComplete class="form-control creInput" type="text" name="teacher" placeholder="Example: Woods" }}
</div>
<div class="formDiv">
<p class="profTitle">Class Name:</p>
<input class="creInput" type="text" name="classname">
</div>
<div class="formDiv">
<p class="profTitle">Privacy:</p>
<input class="creInput radio op" type="text" name="privacy" readonly>
<div class="profOptions creOp">
<p class="profOptionText cre" style="background-color:{{divColor 'header'}}">Public</p>
<p class="profOptionText cre" style="background-color:{{divColor 'header'}}">Private</p>
</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 'header'}}">Class</p>
<p class="profOptionText cre" style="background-color:{{divColor 'header'}}">Club</p>
<p class="profOptionText cre" style="background-color:{{divColor 'header'}}">Other</p>
</div>
</div>
</div>
<h3 id="creSubmit">Submit Request</h3>
{{/if}} {{/if}}
</div> </div>
{{/if}}
{{#if profClassTab "creClass"}}
<div id="creRules"><p>Submit a request for a class to be approved by an administrator.</p></div>
<div id="formContainer">
<div class="formDiv">
<p class="profTitle">School:</p>
{{> inputAutocomplete settings=schoolComplete class="form-control creInput" type="text" name="school" placeholder="Example: International Academy" }}
</div>
<div class="formDiv">
<p class="profTitle">Hour:</p>
<input class="creInput" type="text" name="hour">
</div>
<div class="formDiv">
<p class="profTitle">Teacher:</p>
{{> inputAutocomplete settings=teacherComplete class="form-control creInput" type="text" name="teacher" placeholder="Example: Woods" }}
</div>
<div class="formDiv">
<p class="profTitle">Class Name:</p>
<input class="creInput" type="text" name="classname">
</div>
<div class="formDiv">
<p class="profTitle">Privacy:</p>
<input class="creInput radio op" type="text" name="privacy" readonly>
<div class="profOptions creOp">
<p class="profOptionText cre" style="background-color:{{divColor 'header'}}">Public</p>
<p class="profOptionText cre" style="background-color:{{divColor 'header'}}">Private</p>
</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 'header'}}">Class</p>
<p class="profOptionText cre" style="background-color:{{divColor 'header'}}">Club</p>
<p class="profOptionText cre" style="background-color:{{divColor 'header'}}">Other</p>
</div>
</div>
</div>
<h3 id="creSubmit">Submit Request</h3>
{{/if}}
</div> </div>
</div> </div>
</div> </div>
@ -216,7 +218,7 @@
</div> </div>
</div> </div>
<div id="createdClasses" style="background-color:{{divColor 'cards'}}" classid="{{selectedClass '_id'}}"> <div id="createdClasses" style="background-color:{{divColor 'cards'}};right:{{ownedStatus}}" classid="{{selectedClass '_id'}}">
<h3>{{selectedClass 'name'}}</h3> <h3>{{selectedClass 'name'}}</h3>
<h4 id="codetext">Code:</h4> <h4 id="codetext">Code:</h4>
<input id="code" value="{{selectedClass 'code'}}" type="text" readonly> <input id="code" value="{{selectedClass 'code'}}" type="text" readonly>
@ -253,7 +255,7 @@
<div id="deleteClass">Delete Class</div> <div id="deleteClass">Delete Class</div>
</div> </div>
<div id="joinPrivClass" style="background-color:{{divColor 'cards'}}"> <div id="joinPrivClass" style="background-color:{{divColor 'cards'}};bottom:{{privStatus}}">
<h3>Enter Code:</h3> <h3>Enter Code:</h3>
<input id="privateCode" type="text" placeholder="Enter code here..."> <input id="privateCode" type="text" placeholder="Enter code here...">
<h4 id="privSubmit">Submit</h4> <h4 id="privSubmit">Submit</h4>

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

@ -1,14 +1,20 @@
/* jshint esversion: 6 */ /* jshint esversion: 6 */
import { import {
Template Template
} from 'meteor/templating'; } from 'meteor/templating';
var openValues = {
"owned": "-540px",
"priv": "-160px"
};
confirm = null; // Sets function to execute after confirmation click. confirm = null; // Sets function to execute after confirmation click.
// Sets up global variables // Sets up global variables
Session.set("profClassTab", "manClass"); // Set default classes card mode to 'Manage Classes.' Session.set("profClassTab", "manClass"); // Set default classes card mode to 'Manage Classes.'
Session.set("owned",false); // Status of createdClasses.
Session.set("privClass",false); //Status of joinPrivClass.
Session.set("modifying", null); // Stores current open input. Session.set("modifying", null); // Stores current open input.
Session.set("notsearching", true); // If user is searching in search box. Session.set("notsearching", true); // If user is searching in search box.
Session.set("autocompleteDivs", null); // Stores returned autocomplete results. Session.set("autocompleteDivs", null); // Stores returned autocomplete results.
@ -70,25 +76,16 @@ Template.profile.helpers({
return Session.get("user").name; return Session.get("user").name;
}, },
motd() { // Returns the current user's description motd() { // Returns the current user's description
if (Session.get("user").description === "") { if (Session.get("user").description !== "") return Session.get("user").description;
return Session.get("user").description; return "Say something about yourself!";
} else {
return "Say something about yourself!";
}
}, },
school() { // Returns the current user's school's name school() { // Returns the current user's school's name
if (Session.get("user").school === "") { if (Session.get("user").school !== "") return Session.get("user").school;
return Session.get("user").school; return "Click here to edit...";
} else {
return "Click here to edit...";
}
}, },
grade() { // Returns the current user's grade grade() { // Returns the current user's grade
if (Session.get("user").grade === "") { if (Session.get("user").grade !== "") return Session.get("user").grade + "th";
return Session.get("user").grade + "th"; return "Click here to edit...";
} else {
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 )
var array = classes.find( var array = classes.find(
@ -111,6 +108,14 @@ Template.profile.helpers({
} }
return array; return array;
}, },
ownedStatus() { // Status of createdClasses
if(!Session.get("owned")) return openValues.owned;
return "0px";
},
privStatus() {
if(!Session.get("privClass")) return openValues.priv;
return "0px";
},
profClassTabColor(status) { // Change this [Supposed to show the current mode that's selected via color]     profClassTabColor(status) { // Change this [Supposed to show the current mode that's selected via color]    
if (Session.equals("profClassTab",status)) {             if (Session.equals("profClassTab",status)) {            
return themeColors[Meteor.user().profile.preferences.theme].highlightText;         return themeColors[Meteor.user().profile.preferences.theme].highlightText;        
@ -170,7 +175,7 @@ Template.profile.events({
if(!document.getElementById("createdClasses").contains(event.target) && if(!document.getElementById("createdClasses").contains(event.target) &&
!Session.equals("code",null) && !Session.equals("code",null) &&
!event.target.className.includes("fa-times-circle-o")) { !event.target.className.includes("fa-times-circle-o")) {
document.getElementById("createdClasses").style.marginRight = "-40%"; Session.set("owned",false);
} }
if(Session.get("changeAdmin") && if(Session.get("changeAdmin") &&
!document.getElementById("changeAdmin").contains(event.target)) { !document.getElementById("changeAdmin").contains(event.target)) {
@ -179,10 +184,10 @@ Template.profile.events({
div.removeChild(div.childNodes[3]); div.removeChild(div.childNodes[3]);
div.removeChild(div.childNodes[3]); div.removeChild(div.childNodes[3]);
} }
if(Session.get("privateClass") && if(Session.get("privClass") &&
!(event.target.id === "private") &&
!document.getElementById("joinPrivClass").contains(event.target)) { !document.getElementById("joinPrivClass").contains(event.target)) {
Session.set("privateClass",false); Session.set("privClass",false);
document.getElementById("joinPrivClass").style.marginBottom = "-20%";
} }
}, },
// MAIN BUTTONS // MAIN BUTTONS
@ -275,7 +280,7 @@ Template.profile.events({
} }
Session.set("selectedClass",array); Session.set("selectedClass",array);
document.getElementById("createdClasses").style.marginRight = "0"; Session.set("owned",true);
}); });
}, },
'click .classBox .fa-times' (event) { // Leaves a class 'click .classBox .fa-times' (event) { // Leaves a class
@ -296,11 +301,11 @@ Template.profile.events({
openDivFade(document.getElementsByClassName("overlay")[0]); openDivFade(document.getElementsByClassName("overlay")[0]);
}, },
'click #private' (event) { // Joins private class 'click #private' (event) { // Joins private class
Session.set("privateClass",true); if(Session.get("privClass")) return;
var input = document.getElementById("privateCode"); var input = document.getElementById("privateCode");
input.className = ""; input.className = "";
input.placeholder = "Enter code here..."; input.placeholder = "Enter code here...";
document.getElementById("joinPrivClass").style.marginBottom = "0"; Session.set("privClass",true);
}, },
'click #privSubmit' () { // Submits private class code 'click #privSubmit' () { // Submits private class code
var input = document.getElementById("privateCode"); var input = document.getElementById("privateCode");
@ -309,7 +314,7 @@ Template.profile.events({
serverData = code; serverData = code;
Meteor.call("joinPrivateClass", code, function(error, result) { Meteor.call("joinPrivateClass", code, function(error, result) {
if(result) { if(result) {
document.getElementById("joinPrivClass").style.marginBottom = "-10%"; Session.set("privClass",false);
} else { } else {
input.className = "formInvalid"; input.className = "formInvalid";
input.placeholder = "Invalid code."; input.placeholder = "Invalid code.";