Folder organization
This commit is contained in:
Kenneth Jao
parent
c2b71d6674
commit
3e7d6fec7c
148
hourglass/client/login/login.css
Normal file
148
hourglass/client/login/login.css
Normal file
@ -0,0 +1,148 @@
|
||||
#loginHeader {
|
||||
font-weight: 600;
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
box-shadow: 2px 2px 5px 3px #666;
|
||||
|
||||
background-color: #EBEBEB;
|
||||
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
z-index: 50;
|
||||
}
|
||||
|
||||
#logo {
|
||||
padding: 0.5%;
|
||||
padding-left: 1%;
|
||||
float: left;
|
||||
|
||||
-webkit-filter: drop-shadow(2px 2px 5px #333);
|
||||
filter: drop-shadow(2px 2px 5px #333);
|
||||
}
|
||||
|
||||
#banner {
|
||||
height: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#loginTitle {
|
||||
font-size: 255%;
|
||||
padding: 1.4%;
|
||||
padding-left: 1%;
|
||||
}
|
||||
|
||||
#loginMain {
|
||||
width: 100%;
|
||||
min-height: 100%;
|
||||
position: absolute;
|
||||
top: 11%;
|
||||
|
||||
background-color: #E5E5E5;
|
||||
background-image: url("banner100.jpg");
|
||||
}
|
||||
|
||||
#circle {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
|
||||
-moz-border-radius: 50%;
|
||||
-webkit-border-radius: 50%;
|
||||
border-radius: 50%;
|
||||
|
||||
background-color: rgba(0,0,0,0.2);
|
||||
|
||||
-webkit-filter: drop-shadow(2px 2px 5px #333);
|
||||
filter: drop-shadow(2px 2px 5px #333);
|
||||
}
|
||||
|
||||
#loginContent {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
.text {
|
||||
text-align: center;
|
||||
color: #FFF;
|
||||
|
||||
-webkit-filter: drop-shadow(2px 2px 5px #444);
|
||||
filter: drop-shadow(2px 2px 5px #444);
|
||||
}
|
||||
|
||||
h2.text {
|
||||
font-size: 400%;
|
||||
padding-bottom: 2%;
|
||||
border-bottom: 1px solid #FEFEFE;
|
||||
}
|
||||
|
||||
p.text {
|
||||
font-size: 150%;
|
||||
}
|
||||
|
||||
#loginButton {
|
||||
font-size: 200%;
|
||||
padding: 2%;
|
||||
|
||||
-webkit-border-radius: 6;
|
||||
-moz-border-radius: 6;
|
||||
border-radius: 6px;
|
||||
|
||||
position: relative;
|
||||
|
||||
background-color: #005CE6;
|
||||
|
||||
-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;
|
||||
}
|
||||
|
||||
#loginButton:hover {
|
||||
background-color: #0066FF;
|
||||
}
|
||||
|
||||
#loginButton:active {
|
||||
background-color: #FF4D4D;
|
||||
|
||||
-webkit-transition: background-color 0.1s ease;
|
||||
-moz-transition: background-color 0.1s ease;
|
||||
-ms-transition: background-color 0.1s ease;
|
||||
transition: background-color 0.1s ease;
|
||||
}
|
||||
|
||||
#loginFooter {
|
||||
width: 100%;
|
||||
box-shadow: 2px 2px 5px 3px #666;
|
||||
background-color: #EBEBEB;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.login-button {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#github {
|
||||
font-size: 150%;
|
||||
margin: 0;
|
||||
padding: 1%;
|
||||
|
||||
-webkit-filter: drop-shadow(2px 2px 5px #444);
|
||||
filter: drop-shadow(2px 2px 5px #444);
|
||||
}
|
||||
|
||||
a {
|
||||
color: #0099CC;
|
||||
text-decoration: none;
|
||||
|
||||
-webkit-transition: color 0.4s ease;
|
||||
-moz-transition: color 0.4s ease;
|
||||
-ms-transition: color 0.4s ease;
|
||||
transition: color 0.4s ease
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: #00BFFF;
|
||||
}
|
||||
|
||||
23
hourglass/client/login/login.html
Normal file
23
hourglass/client/login/login.html
Normal file
@ -0,0 +1,23 @@
|
||||
<template name="login">
|
||||
<header id="loginHeader">
|
||||
<img id="logo" src="logo.png" width="{{logo}}" height="{{logo}}">
|
||||
<h1 id="loginTitle">Hourglass</h1>
|
||||
<div id="loadBar">
|
||||
<div id="progress" style="background-color:{{loadType}};width:{{loadPercent}}"></div>
|
||||
</div>
|
||||
</header>
|
||||
<div id="loginMain">
|
||||
<div id="circle" style="width:{{dim}};height:{{dim}};margin:{{margin}}">
|
||||
<div id="loginContent" style="width:{{contDim}};height:{{contDim}};margin:{{contMargin}}">
|
||||
<h2 class="text">Hourglass</h2>
|
||||
<p class="text">All your work in one place. Finish before your time runs out.</p>
|
||||
<h3 class="text" id="loginButton" style="{{hea}}">Sign in</h3>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<footer id="loginFooter">
|
||||
<p id="github">View the <a href="https://github.com/ksjdragon/hourglass">Code!</a></p>
|
||||
</footer>
|
||||
{{> loginButtons}}
|
||||
</template>
|
||||
370
hourglass/client/main/main.css
Normal file
370
hourglass/client/main/main.css
Normal file
@ -0,0 +1,370 @@
|
||||
/* CSS Code Styling
|
||||
Tag { Always spaces between values
|
||||
Font:
|
||||
Height
|
||||
Width
|
||||
Margin: [top, right, bottom, left];
|
||||
Padding: [top, right, bottom, left];
|
||||
|
||||
Border
|
||||
<Newline if 3 or more above>
|
||||
Drop-shadow
|
||||
<Newline if 3 or more above>
|
||||
Display
|
||||
Position
|
||||
Float
|
||||
Overflow
|
||||
z-index
|
||||
<Newline between if 3 or more above>
|
||||
Color related items
|
||||
<Newline between>
|
||||
Animation related items
|
||||
}*/
|
||||
|
||||
@import url(https://fonts.googleapis.com/css?family=Raleway:200,400,600);
|
||||
|
||||
html {
|
||||
font-family: 'Raleway';
|
||||
font-weight: 200;
|
||||
overflow: hidden;
|
||||
|
||||
/*background-image: url("Hourglass.png");
|
||||
background-size: 1920px 1080px;*/
|
||||
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
header {
|
||||
font-weight: 600;
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
box-shadow: 2px 2px 5px 3px #666;
|
||||
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
z-index: 50;
|
||||
}
|
||||
|
||||
h1,h2,h3,h4,h5 {
|
||||
margin: 0;
|
||||
|
||||
-webkit-filter: drop-shadow(2px 2px 5px #666);
|
||||
filter: drop-shadow(2px 2px 5px #666);
|
||||
}
|
||||
|
||||
h1 {
|
||||
padding: 0.4%;
|
||||
float: left;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 130%;
|
||||
font-weight: 200;
|
||||
padding: 5%;
|
||||
-webkit-filter: drop-shadow(2px 2px 5px #333);
|
||||
filter: drop-shadow(2px 2px 5px #333);
|
||||
|
||||
display: inline-block;
|
||||
|
||||
-webkit-transition: color 0.5s ease;
|
||||
-moz-transition: color 0.5s ease;
|
||||
-ms-transition: color 0.5s ease;
|
||||
transition: color 0.5s ease;
|
||||
}
|
||||
|
||||
#aboveBar {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.fa-bars, .fa-cog {
|
||||
font-size: 200%;
|
||||
height: 100%;
|
||||
padding: 0.6%;
|
||||
padding-right: 0.8%;
|
||||
|
||||
float: left;
|
||||
color: #333;
|
||||
|
||||
-webkit-transition: color 0.5s ease, background-color 0.5s ease;
|
||||
-moz-transition: color 0.5s ease, background-color 0.5s ease;
|
||||
-ms-transition: color 0.5s ease, background-color 0.5s ease;
|
||||
transition: color 0.5s ease, background-color 0.5s ease;
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
.fa-cog {
|
||||
padding-left: 0.8%;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.fa-bars:hover, .fa-cog:hover {
|
||||
background-color: #CCC;
|
||||
}
|
||||
|
||||
#loadBar, #progress {
|
||||
width: 100%;
|
||||
height: 4px;
|
||||
display: table;
|
||||
background-color: #33ADFF;
|
||||
}
|
||||
|
||||
#menuContainer, #optionsContainer {
|
||||
min-height: 100%;
|
||||
max-height: 100%;
|
||||
width: 15%;
|
||||
padding: 1% 0 1% 0;
|
||||
box-shadow: 2px 2px 5px 3px #666;
|
||||
|
||||
position: absolute;
|
||||
z-index:0;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
|
||||
-webkit-transition: margin 0.5s ease, background-color 0.5s ease;
|
||||
-moz-transition: margin 0.5s ease, background-color 0.5s ease;
|
||||
-ms-transition: margin 0.5s ease, background-color 0.5s ease;
|
||||
transition: margin 0.5s ease, background-color 0.5s ease;
|
||||
}
|
||||
|
||||
#optionsContainer {
|
||||
width: 12%;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.mode, .function {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
background-color: #849CAE;
|
||||
|
||||
-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;
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.mode:hover, .function:hover {
|
||||
background-color: #A2B5C3;
|
||||
}
|
||||
|
||||
.mode:active, .function:active {
|
||||
background-color: #EFF3F5;
|
||||
|
||||
-webkit-transition: background-color 0.2s ease;
|
||||
-moz-transition: background-color 0.2s ease;
|
||||
-ms-transition: background-color 0.2s ease;
|
||||
transition: background-color 0.2s ease;
|
||||
}
|
||||
|
||||
.fa-university, .fa-calendar {
|
||||
font-size: 175%;
|
||||
width: 12%;
|
||||
padding: 10%;
|
||||
-webkit-filter: drop-shadow(2px 2px 5px #666);
|
||||
filter: drop-shadow(2px 2px 5px #666);
|
||||
}
|
||||
|
||||
.fa-plus, .fa-minus, .fa-tasks, .fa-graduation-cap {
|
||||
font-size: 130%;
|
||||
padding: 5%;
|
||||
-webkit-filter: drop-shadow(2px 2px 5px #666);
|
||||
filter: drop-shadow(2px 2px 5px #666);
|
||||
}
|
||||
|
||||
#functions {
|
||||
width: 100%;
|
||||
margin-top: 7%;
|
||||
|
||||
border-style: solid;
|
||||
border-color: #D9D9D9;
|
||||
border-left: none;
|
||||
|
||||
box-shadow: 0px 4px 8px 1px #222;
|
||||
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
#functionHolder {
|
||||
max-height: 48%;
|
||||
width: 90%;
|
||||
margin-bottom: 30%;
|
||||
padding: 8%;
|
||||
|
||||
display: none;
|
||||
position: absolute;
|
||||
overflow-y: auto;
|
||||
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;
|
||||
}
|
||||
|
||||
#create {
|
||||
font-size: 140%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.input {
|
||||
margin: 0;
|
||||
margin-top: 3%;
|
||||
margin-bottom: -9%;
|
||||
|
||||
-webkit-filter: drop-shadow(2px 2px 5px #666);
|
||||
filter: drop-shadow(2px 2px 5px #666);
|
||||
}
|
||||
|
||||
.creSubmit {
|
||||
width: 100%;
|
||||
margin-top: 50%;
|
||||
padding: 3% 0 3% 0;
|
||||
text-align: center;
|
||||
background-color: #849CAE;
|
||||
|
||||
-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;
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.creSubmit:hover {
|
||||
background-color: #A2B5C3;
|
||||
}
|
||||
|
||||
.creSubmit:active {
|
||||
background-color: #EFF3F5;
|
||||
|
||||
-webkit-transition: background-color 0.2s ease;
|
||||
-moz-transition: background-color 0.2s ease;
|
||||
-ms-transition: background-color 0.2s ease;
|
||||
transition: background-color 0.2s ease;
|
||||
}
|
||||
|
||||
input, select {
|
||||
font-family: 'Raleway';
|
||||
width: 90%;
|
||||
margin-bottom: 4%;
|
||||
padding: 3.5%;
|
||||
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
select {
|
||||
font-family: 'Raleway';
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.creOptions {
|
||||
width: 80%;
|
||||
margin-top: -3.4%;
|
||||
|
||||
box-shadow: 2px 2px 5px 3px #666;
|
||||
|
||||
display: none;
|
||||
position: absolute;
|
||||
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;
|
||||
}
|
||||
|
||||
.creOptions p {
|
||||
margin: 0;
|
||||
padding: 5%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.creOptions p:hover {
|
||||
box-shadow: inset 0 0 0 99999px rgba(0,0,0,0.1)
|
||||
}
|
||||
|
||||
.overlay {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(0,0,0,0.5);
|
||||
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 51;
|
||||
|
||||
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;
|
||||
}
|
||||
|
||||
.overlayCont {
|
||||
font-size: 150%;
|
||||
box-shadow: 2px 2px 5px 3px #666;
|
||||
|
||||
-moz-border-radius: 30px;
|
||||
-webkit-border-radius: 30px;
|
||||
border-radius: 30px;
|
||||
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.fa-check-circle-o, .fa-times-circle-o {
|
||||
font-size: 300%;
|
||||
padding: 5% 13% 5% 13%;
|
||||
|
||||
color: #333;
|
||||
|
||||
-webkit-transition: color 0.4s ease;
|
||||
-moz-transition: color 0.4s ease;
|
||||
-ms-transition: color 0.4s ease;
|
||||
transition: color 0.4s ease;
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.fa-check-circle-o:hover {
|
||||
color: #85E085;
|
||||
}
|
||||
|
||||
.fa-check-circle-o:active {
|
||||
color: #33CC33;
|
||||
|
||||
-webkit-transition: background-color 0.2s ease;
|
||||
-moz-transition: background-color 0.2s ease;
|
||||
-ms-transition: background-color 0.2s ease;
|
||||
transition: background-color 0.2s ease;
|
||||
}
|
||||
|
||||
.fa-times-circle-o:hover {
|
||||
color: #FF6666;
|
||||
}
|
||||
|
||||
.fa-times-circle-o:active {
|
||||
color: #ff1A1A;
|
||||
|
||||
-webkit-transition: background-color 0.2s ease;
|
||||
-moz-transition: background-color 0.2s ease;
|
||||
-ms-transition: background-color 0.2s ease;
|
||||
transition: background-color 0.2s ease;
|
||||
}
|
||||
99
hourglass/client/main/main.html
Normal file
99
hourglass/client/main/main.html
Normal file
@ -0,0 +1,99 @@
|
||||
<head>
|
||||
<title>Hourglass</title>
|
||||
<link rel="icon" href="favicon.ico?v=2">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
</body>
|
||||
|
||||
<template name="main">
|
||||
<header style="background-color:{{divColor 'header'}}">
|
||||
<div id="aboveBar">
|
||||
<i class="fa fa-bars" aria-hidden="true" style="color:{{iconColor 'menu'}}"></i>
|
||||
<h1>Hourglass</h1>
|
||||
<i class="fa fa-cog" aria-hidden="true" style="color:{{iconColor 'options'}}"></i>
|
||||
</div>
|
||||
<div id="loadBar">
|
||||
<div id="progress" style="background-color:{{loadType}};width:{{loadPercent}}"></div>
|
||||
</div>
|
||||
</header>
|
||||
<div id="menuContainer" style="margin-left:{{menuStatus}};background-color:{{divColor 'sidebar'}}">
|
||||
<div class="mode classes">
|
||||
<i class="fa fa-university" aria-hidden="true"></i>
|
||||
<h4 style="color:{{modeStatus 'classes'}}">Classes</h4>
|
||||
</div>
|
||||
<div class="mode calendar">
|
||||
<i class="fa fa-calendar" aria-hidden="true"></i>
|
||||
<h4 style="color:{{modeStatus 'calendar'}}">Calendar</h4>
|
||||
</div>
|
||||
<div id="functions">
|
||||
<div class="function addClass">
|
||||
<i class="fa fa-plus" aria-hidden="true"></i>
|
||||
<h4 style="color:{{functionStatus 'addClass'}}">Join Class</h4>
|
||||
</div>
|
||||
<div class="function createClass">
|
||||
<i class="fa fa-graduation-cap" aria-hidden="true"></i>
|
||||
<h4 style="color:{{functionStatus 'creClass'}}">Create Class</h4>
|
||||
</div>
|
||||
<div class="function manageClass">
|
||||
<i class="fa fa-tasks" aria-hidden="true"></i>
|
||||
<h4 style="color:{{functionStatus 'manClass'}}">Manage Classes</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div id="functionHolder">
|
||||
{{#if currFunction "addClass"}}
|
||||
<p>Add a Class</p>
|
||||
{{/if}}
|
||||
|
||||
{{#if currFunction "manClass"}}
|
||||
<p>Manage Classes</p>
|
||||
{{/if}}
|
||||
|
||||
{{#if currFunction "creClass"}}
|
||||
<h2>Create a Class</h2>
|
||||
<form id="create">
|
||||
<p class="input">School:</p><br>
|
||||
{{> inputAutocomplete settings=schoolcomplete class="form-control creInput" type="text" name="school" placeholder="Example: International Academy" }}
|
||||
<p class="input">Hour:</p><br>
|
||||
<input class="creInput" type="text" name="hour"><br>
|
||||
<p class="input">Teacher</p>:<br>
|
||||
<input class="creInput" type="text" name="teacher"><br>
|
||||
<p class="input">Class Name:</p><br>
|
||||
<input class="creInput" type="text" name="classname"><br>
|
||||
<p class="input">Privacy:</p><br>
|
||||
<div class="select">
|
||||
<input class="creInput creInputSel" type = "text" name="privacy" readonly><br>
|
||||
<div class="creOptions" style="background-color:{{divColor 'header'}}">
|
||||
<p>Public</p>
|
||||
<p>Private</p>
|
||||
</div>
|
||||
</div>
|
||||
<p class="input">Category:</p><br>
|
||||
<div class="select">
|
||||
<input class="creInput creInputSel" type="text" name="category" readonly><br>
|
||||
<div class="creOptions" style="background-color:{{divColor 'header'}}">
|
||||
<p>Class</p>
|
||||
<p>Club</p>
|
||||
<p>Other</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="creSubmit">Submit Request</div>
|
||||
</form>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
<div id="optionsContainer" style="margin-right:{{optionsStatus}};background-color:{{divColor 'sidebar'}}">
|
||||
</div>
|
||||
<div class="overlay">
|
||||
<div class="overlayCont" style="{{overlayDim}};">
|
||||
<p>Are you sure?</p>
|
||||
<i class="fa fa-check-circle-o" aria-hidden="true"></i>
|
||||
<i class="fa fa-times-circle-o" aria-hidden="true"></i>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template name="schoollist">
|
||||
{{name}}
|
||||
</template>
|
||||
221
hourglass/client/main/main.js
Normal file
221
hourglass/client/main/main.js
Normal file
@ -0,0 +1,221 @@
|
||||
import { Template } from 'meteor/templating';
|
||||
import { ReactiveVar } from 'meteor/reactive-var';
|
||||
|
||||
import './main.html';
|
||||
|
||||
var openValues = {
|
||||
"menu": "-25%",
|
||||
"options": "-20%"
|
||||
};
|
||||
|
||||
var themeColors = {
|
||||
"light": {
|
||||
"header":"#EBEBEB",
|
||||
"sidebar":"#65839A",
|
||||
"statusIcons":"#33ADFF",
|
||||
"highlightText":"#FF1A1A"
|
||||
},
|
||||
"dark": {
|
||||
|
||||
}
|
||||
};
|
||||
|
||||
var options = {
|
||||
"school": [],
|
||||
"privacy": ["Public", "Hidden"],
|
||||
"category": ["Class", "Club", "Other"]
|
||||
}
|
||||
|
||||
var searchSchools = [];
|
||||
|
||||
Session.set("menuOpen", false);
|
||||
Session.set("optionsOpen", false);
|
||||
Session.set("mode",null); // Change to user preferences
|
||||
Session.set("function", null);
|
||||
Session.set("confirm",null);
|
||||
Session.set("formCre",null);
|
||||
|
||||
Cookie.set("theme","light",{'years':15});
|
||||
|
||||
Template.main.helpers({
|
||||
divColor(div) {
|
||||
return themeColors[Cookie.get("theme")][div];
|
||||
},
|
||||
iconColor(icon) {
|
||||
let status = Session.get(icon+"Open");
|
||||
if(status) {
|
||||
return themeColors[Cookie.get("theme")].statusIcons;
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
},
|
||||
menuStatus() {
|
||||
let status = Session.get("menuOpen");
|
||||
if(status) {
|
||||
return "0%";
|
||||
} else {
|
||||
return openValues["menu"];
|
||||
}
|
||||
},
|
||||
modeStatus(status) {
|
||||
if(status === Session.get("mode")) {
|
||||
return themeColors[Cookie.get("theme")].highlightText;
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
},
|
||||
functionStatus(status) {
|
||||
if(status === Session.get("function")) {
|
||||
return themeColors[Cookie.get("theme")].highlightText;
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
},
|
||||
currFunction(name) {
|
||||
if(name === Session.get("function")) {
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
},
|
||||
optionsStatus() {
|
||||
let status = Session.get("optionsOpen");
|
||||
if(status) {
|
||||
return "0%";
|
||||
} else {
|
||||
return openValues["options"];
|
||||
}
|
||||
},
|
||||
overlayDim(part) {
|
||||
var dim = [window.innerWidth * .2,window.innerHeight * .2];
|
||||
var width = "width:"+dim[0].toString() + "px;";
|
||||
var height = "height:"+dim[1].toString() + "px;";
|
||||
var margin = "margin:"+(-dim[0]/2).toString() + "px 0 0 " + -(dim[1]/2).toString() + "px;";
|
||||
var bg = "background-color:"+themeColors[Cookie.get("theme")]["header"]+";";
|
||||
return width+height+margin+bg;
|
||||
},
|
||||
creHighlight(input) {
|
||||
if(input == Session.get("creInput")) {
|
||||
return "#CCEEFF";
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
},
|
||||
schoolcomplete() {
|
||||
return {
|
||||
position: "bottom",
|
||||
limit: 6,
|
||||
rules: [
|
||||
{
|
||||
token: '',
|
||||
collection: schools,
|
||||
field: 'name',
|
||||
matchAll: true,
|
||||
template: Template.schoollist
|
||||
}
|
||||
]
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
Template.main.events({
|
||||
'click .fa-bars' () {
|
||||
Session.set("menuOpen",!Session.get("menuOpen"));
|
||||
},
|
||||
'click .fa-cog' () {
|
||||
Session.set("optionsOpen",!Session.get("optionsOpen"));
|
||||
},
|
||||
'click .classes' () {
|
||||
Session.set("mode","classes");
|
||||
},
|
||||
'click .calendar' () {
|
||||
Session.set("mode","calendar");
|
||||
},
|
||||
'click .addClass' () {
|
||||
var functionHolder = document.getElementById("functionHolder")
|
||||
closeDivFade(functionHolder);
|
||||
setTimeout(function() {
|
||||
Session.set("function","addClass");
|
||||
openDivFade(functionHolder);
|
||||
},300);
|
||||
},
|
||||
'click .manageClass' () {
|
||||
var functionHolder = document.getElementById("functionHolder")
|
||||
closeDivFade(functionHolder);
|
||||
setTimeout(function() {
|
||||
Session.set("function","manClass");
|
||||
openDivFade(functionHolder);
|
||||
},300);
|
||||
},
|
||||
'click .createClass' () {
|
||||
var functionHolder = document.getElementById("functionHolder")
|
||||
closeDivFade(functionHolder);
|
||||
setTimeout(function() {
|
||||
Session.set("function","creClass");
|
||||
openDivFade(functionHolder);
|
||||
},300);
|
||||
},
|
||||
'click .creSubmit' () {
|
||||
openDivFade(document.getElementsByClassName("overlay")[0]);
|
||||
setTimeout(function() {
|
||||
document.getElementsByClassName("overlay")[0].style.opacity = "1";
|
||||
}, 200);
|
||||
Session.set("confirm","createClass");
|
||||
},
|
||||
'click .fa-check-circle-o' () {
|
||||
sendData();
|
||||
closeDivFade(document.getElementsByClassName("overlay")[0]);
|
||||
closeDivFade(document.getElementById("functionHolder"));
|
||||
document.getElementById("create").reset();
|
||||
setTimeout(function() {
|
||||
Session.set("confirm",null);
|
||||
Session.set("function",null);
|
||||
}, 300);
|
||||
},
|
||||
'click .fa-times-circle-o' () {
|
||||
closeDivFade(document.getElementsByClassName("overlay")[0]);
|
||||
closeDivFade(document.getElementById("functionHolder"));
|
||||
document.getElementById("create").reset();
|
||||
setTimeout(function() {
|
||||
Session.set("confirm",null);
|
||||
Session.set("function",null);
|
||||
}, 300);
|
||||
},
|
||||
'click .creInput' (event) {
|
||||
openDivFade(event.target.parentNode.childNodes[4]);
|
||||
},
|
||||
'click .creOptions p' (event) {
|
||||
var p = event.target;
|
||||
p.parentNode.parentNode.childNodes[1].value = p.childNodes[0].nodeValue;
|
||||
closeDivFade(p.parentNode);
|
||||
}
|
||||
});
|
||||
|
||||
Template.schoollist.helpers({
|
||||
name() {
|
||||
return this.name;
|
||||
}
|
||||
});
|
||||
|
||||
function openDivFade(div) {
|
||||
div.style.display = "block";
|
||||
div.style.opacity = "0";
|
||||
setTimeout(function() {
|
||||
div.style.opacity = "1";
|
||||
}, 100);
|
||||
}
|
||||
|
||||
function closeDivFade(div) {
|
||||
div.style.opacity = "0";
|
||||
setTimeout(function() {
|
||||
div.style.display = "none";
|
||||
}, 100);
|
||||
}
|
||||
|
||||
function sendData() {
|
||||
// Take form data
|
||||
}
|
||||
|
||||
function select(div) {
|
||||
div.parentNode.parentNode.childNodes[0].value = div.childNodes[0].nodeValue;
|
||||
}
|
||||
0
hourglass/client/profile/profile.css
Normal file
0
hourglass/client/profile/profile.css
Normal file
3
hourglass/client/profile/profile.html
Normal file
3
hourglass/client/profile/profile.html
Normal file
@ -0,0 +1,3 @@
|
||||
<template name="profile">
|
||||
|
||||
</template>
|
||||
0
hourglass/client/profile/profile.js
Normal file
0
hourglass/client/profile/profile.js
Normal file
Loading…
x
Reference in New Issue
Block a user