Created classes tab, semi-styled and no functionality
This commit is contained in:
Kenneth Jao
parent
e871f6b7fc
commit
55ed7ace1e
@ -20,7 +20,7 @@
|
||||
font-weight: 400;
|
||||
margin: 0;
|
||||
margin-bottom: 1%;
|
||||
margin-right: 10%;
|
||||
margin-right: 30%;
|
||||
}
|
||||
|
||||
.profHea {
|
||||
@ -200,7 +200,7 @@
|
||||
display: inline;
|
||||
}
|
||||
|
||||
#profClassSearch {
|
||||
#profClassSearch, .userAddInput {
|
||||
font-size: 125%;
|
||||
width: 30%;
|
||||
margin-top: 3%;
|
||||
@ -274,6 +274,19 @@
|
||||
background-color: rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
.owned {
|
||||
background-color: #27646D;
|
||||
|
||||
-webkit-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;
|
||||
}
|
||||
|
||||
.owned:hover {
|
||||
background-color: #52848B;
|
||||
}
|
||||
|
||||
.classText {
|
||||
margin-left: .5%;
|
||||
margin-right: 10%;
|
||||
@ -311,17 +324,17 @@
|
||||
margin-right: 5% !important;
|
||||
margin-bottom: 0 !important;
|
||||
position: relative;
|
||||
|
||||
overflow: hidden !important;
|
||||
}
|
||||
|
||||
#create div {
|
||||
#formContainer div {
|
||||
margin: 3% 6% 5% 6%;
|
||||
width: 35%;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.creInput {
|
||||
font-size: 120%;
|
||||
width: 100%;
|
||||
padding: 3%;
|
||||
}
|
||||
|
||||
@ -330,7 +343,8 @@
|
||||
}
|
||||
|
||||
.-autocomplete-container {
|
||||
margin: 0.5% 0 0 0 !important;
|
||||
margin: 0 0 0 0 !important;
|
||||
position: absolute;
|
||||
display: none;
|
||||
}
|
||||
|
||||
@ -362,24 +376,7 @@
|
||||
color: #999 !important;
|
||||
}
|
||||
|
||||
#save {
|
||||
font-size: 90%;
|
||||
background-color: #CC4444;
|
||||
|
||||
box-shadow: -1px 2px 5px 1px #333;
|
||||
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 10%;
|
||||
z-index: 50;
|
||||
|
||||
-webkit-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, #mainpage:hover {
|
||||
#mainpage:hover {
|
||||
-webkit-transform: scale(1.05);
|
||||
-moz-transform: scale(1.05);
|
||||
-ms-transform: scale(1.05);
|
||||
@ -387,11 +384,7 @@
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
#save:active {
|
||||
background-color: #34CB34;
|
||||
}
|
||||
|
||||
#save h2, #mainpage h2 {
|
||||
#mainpage h2 {
|
||||
font-weight: 200;
|
||||
width: 100%;
|
||||
padding: 8%;
|
||||
@ -421,3 +414,20 @@
|
||||
background-color: #56708D;
|
||||
}
|
||||
|
||||
#createdClasses {
|
||||
width: 25%;
|
||||
margin-right: -80%;
|
||||
padding: 3%;
|
||||
|
||||
border-top: 5px solid #2E4F74;
|
||||
box-shadow: -1px 2px 5px 1px #444;
|
||||
|
||||
position: absolute;
|
||||
top: 30%;
|
||||
right: 0;
|
||||
|
||||
-webkit-transition: margin 0.4s ease;
|
||||
-moz-transition: margin 0.4s ease;
|
||||
-ms-transition: margin 0.4s ease;
|
||||
transition: margin 0.4s ease;
|
||||
}
|
||||
@ -125,7 +125,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<h3 id="creSubmit">Submit Request</h3>
|
||||
<h3 id="creSubmit">Submit Request</h3>
|
||||
</form>
|
||||
{{/if}}
|
||||
</div>
|
||||
@ -141,10 +141,43 @@
|
||||
<i class="fa fa-times-circle-o" aria-hidden="true"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="createdClasses" style="background-color:{{divColor 'cards'}}">
|
||||
<h3>{{selectedClass 'name'}}</h3>
|
||||
<h4>Code: {{selectedClass 'code'}}</h4>
|
||||
<div id="moderatorCont">
|
||||
<div class="userAdder">
|
||||
<h4>Moderators: </h4>
|
||||
<i class="fa fa-plus" aria-hidden="true"></i>
|
||||
</div>
|
||||
{{#each selectedClass 'moderators'}}
|
||||
{{> userDisplay}}
|
||||
{{/each}}
|
||||
</div>
|
||||
<div id="bannedCont">
|
||||
<div class="userAdder">
|
||||
<h4>Banned: </h4>
|
||||
<i class="fa fa-plus" aria-hidden="true"></i>
|
||||
</div>
|
||||
{{#each selectedClass 'banned'}}
|
||||
{{> userDisplay}}
|
||||
{{/each}}
|
||||
</div>
|
||||
<div id="blockEditCont">
|
||||
<div class="userAdder">
|
||||
<h4>View only: </h4>
|
||||
<i class="fa fa-plus" aria-hidden="true"></i>
|
||||
</div>
|
||||
{{#each selectedClass 'blockEdit'}}
|
||||
{{> userDisplay}}
|
||||
{{/each}}
|
||||
</div>
|
||||
<div id="deleteClass">Delete Class</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template name="classDisplay">
|
||||
<div class="classBox" classid="{{_id}}">
|
||||
<div class="classBox{{box}}" classid="{{_id}}">
|
||||
<span class="name classText">{{name}}</span>
|
||||
<span class="teacher classText">{{teacher}}</span>
|
||||
<span class="hour classText">{{hour}}</span>
|
||||
@ -152,6 +185,13 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template name="userDisplay">
|
||||
<div class="userBox" userid="{{_id}}">
|
||||
<span class="email">{{email}}</span>
|
||||
<span class="realname">{{name}}</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template name="schoollist">
|
||||
{{name}}
|
||||
</template>
|
||||
|
||||
@ -16,6 +16,8 @@ Session.set("confirm", null);
|
||||
Session.set("serverData", null);
|
||||
Session.set("autocompleteDivs", null);
|
||||
Session.set("confirmText", null);
|
||||
Session.set("selectedClass",null);
|
||||
Session.set("adding",null);
|
||||
|
||||
var themeColors = {
|
||||
"light": {
|
||||
@ -95,9 +97,9 @@ Template.profile.helpers({
|
||||
avatar() {
|
||||
var dim = window.innerWidth * 1600 / 1920 * 0.16;
|
||||
if (Meteor.user().profile.avatar !== undefined) {
|
||||
var pic = Meteor.user().profile.avatar;;
|
||||
var pic = Meteor.user().profile.avatar;
|
||||
} else {
|
||||
var pic = "Avatars/" + (Math.floor(Math.random() * (11 - 1)) + 1).toString(); + ".png";
|
||||
var pic = "Avatars/" + (Math.floor(Math.random() * (11 - 1)) + 1).toString() + ".png";
|
||||
currentprofile = Meteor.user().profile;
|
||||
currentprofile.avatar = pic
|
||||
Meteor.call("editProfile", currentprofile);
|
||||
@ -169,23 +171,14 @@ Template.profile.helpers({
|
||||
autocompleteClasses() {
|
||||
return Session.get("autocompleteDivs");
|
||||
},
|
||||
myclasses() {
|
||||
if (Meteor.user().profile.classes === undefined || Meteor.user().profile.classes.length === 0) {
|
||||
return [];
|
||||
} else {
|
||||
var array = [];
|
||||
var courses = Meteor.user().profile.classes;
|
||||
for(var i = 0; i < courses.length; i++) {
|
||||
array.push(classes.findOne({_id:courses[i]}));
|
||||
}
|
||||
return array;
|
||||
}
|
||||
},
|
||||
notfound() {
|
||||
return Session.get("notfound");
|
||||
},
|
||||
confirmText() {
|
||||
return Session.get("confirmText");
|
||||
},
|
||||
selectedClass(val) {
|
||||
return Session.get("selectedClass")[val];
|
||||
}
|
||||
});
|
||||
|
||||
@ -243,14 +236,14 @@ Template.profile.events({
|
||||
'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")) {
|
||||
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") &&
|
||||
!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++) {
|
||||
@ -261,6 +254,21 @@ Template.profile.events({
|
||||
Session.set("radioDiv", null);
|
||||
Session.set("radioOffset", null);
|
||||
}
|
||||
if(event.target.className !== "userAddInput" &&
|
||||
Session.get("adding")) {
|
||||
var inputs = document.getElementsByClassName("userAddInput");
|
||||
for(var i = 0; i < inputs.length; i++) {
|
||||
try {
|
||||
inputs[i].parentNode.removeChild(inputs[i]);
|
||||
} catch(err) {}
|
||||
}
|
||||
Session.set("adding",false);
|
||||
}
|
||||
if(!document.getElementById("createdClasses").contains(event.target) &&
|
||||
Session.get("selectedClass") !== null) {
|
||||
document.getElementById("createdClasses").style.marginRight = "-40%";
|
||||
setTimeout(function() { Session.set("selectedClass", null); }, 300);
|
||||
}
|
||||
},
|
||||
'keydown' (event) {
|
||||
var sessval = Session.get("modifying");
|
||||
@ -433,6 +441,38 @@ Template.profile.events({
|
||||
},
|
||||
'focus .op' (event) {
|
||||
event.target.click();
|
||||
},
|
||||
'click .owned' (event) {
|
||||
if (event.target.id === "label") return;
|
||||
if (!event.target.className.includes("owned")) {
|
||||
var attribute = event.target.parentNode.getAttribute("classid");
|
||||
} else {
|
||||
var attribute = event.target.getAttribute("classid");
|
||||
}
|
||||
var usertype = ["moderators","banned","blockEdit"];
|
||||
var array = classes.findOne({_id:attribute});
|
||||
|
||||
if(array.code === "") array.code = "None";
|
||||
for(var i = 0; i < usertype.length; i++) {
|
||||
var users = array[usertype[i]];
|
||||
for(var j = 0; j < users.length; j++) {
|
||||
var detailusers = {};
|
||||
var user = Meteor.users.findOne({_id:users[j]});
|
||||
detailusers._id = user._id;
|
||||
detailusers.email = user.name + "hi";
|
||||
detailusers.name = user.name;
|
||||
array[usertype[i]] = detailusers;
|
||||
}
|
||||
}
|
||||
document.getElementById("createdClasses").style.marginRight = "0";
|
||||
Session.set("selectedClass",array);
|
||||
},
|
||||
'click .userAdder .fa-plus' (event) {
|
||||
if(Session.get("adding")) return;
|
||||
var input = document.createElement("input");
|
||||
input.className = "userAddInput";
|
||||
event.target.parentNode.appendChild(input);
|
||||
Session.set("adding", true);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user