269 lines
11 KiB
HTML
269 lines
11 KiB
HTML
<head>
|
|
<title>Hourglass</title>
|
|
<link rel="icon" href="/favicon.ico?v=2">
|
|
</head>
|
|
|
|
<template name="main">
|
|
<header style="background-color:{{user}}{{divColor 'header'}}{{textColor}}{{defaultMode}}{{refetchEvents}}">
|
|
<div id="aboveBar">
|
|
<i class="fa fa-bars" aria-hidden="true" style="color:{{iconColor 'menu'}}"></i>
|
|
<h1>Hourglass</h1><h2>{{schoolName}}</h2>
|
|
<i class="fa fa-cog" aria-hidden="true" style="color:{{iconColor 'options'}}"></i>
|
|
<div id="logout" onclick='document.getElementById("login-buttons-logout").click();'>Logout</div>
|
|
</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 id="modes">
|
|
<div class="mode classes" style="background-color:{{divColor 'funcButton'}}">
|
|
<i class="fa fa-university" aria-hidden="true"></i>
|
|
<h4 style="color:{{modeStatus 'classes'}}">Classes</h4>
|
|
</div>
|
|
<div class="mode calendar" style="background-color:{{divColor 'funcButton'}}">
|
|
<i class="fa fa-calendar" aria-hidden="true"></i>
|
|
<h4 style="color:{{modeStatus 'calendar'}}">Calendar</h4>
|
|
</div>
|
|
</div>
|
|
<div id="functions">
|
|
<div class="function manageClass" onclick="window.location='/profile'" style="background-color:{{divColor 'funcButton'}}">
|
|
<i class="fa fa-tasks" aria-hidden="true"></i>
|
|
<h4>Manage Classes</h4>
|
|
</div>
|
|
</div>
|
|
<div id="classListHolder">
|
|
{{#if myClasses}}
|
|
<h3>Enrolled</h3>
|
|
{{#if calCreWork}}
|
|
<h3 id="calCreWork">-- Pick a class</h3>
|
|
{{else}}
|
|
{{#if filterOn}}
|
|
<h3 id="disableFilter">Disable All</h3>
|
|
{{/if}}
|
|
{{/if}}
|
|
{{#each myClasses}}
|
|
{{> sidebarClasses}}
|
|
{{/each}}
|
|
{{/if}}
|
|
</div>
|
|
</div>
|
|
<div id="optionsContainer" style="margin-right:{{optionsStatus}};background-color:{{divColor 'sidebar'}}">
|
|
<h3>Preferences</h3>
|
|
<div id="prefCont">
|
|
<div>
|
|
<div class="inputRadioPref">
|
|
<p class="prefTitle">Theme:</p>
|
|
<span class="change radio" re="readonly" id="prefTheme">{{pref 'theme'}}</span>
|
|
</div>
|
|
<div class="prefOptions" style="background-color:{{divColor 'header'}}">
|
|
<p class="prefOptionText">Light</p>
|
|
<p class="prefOptionText">Dark</p>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div class="inputRadioPref">
|
|
<p class="prefTitle">Default Mode:</p>
|
|
<span class="change radio" re="readonly" id="prefMode">{{pref 'mode'}}</span>
|
|
</div>
|
|
<div class="prefOptions" style="background-color:{{divColor 'header'}}">
|
|
<p class="prefOptionText">Classes</p>
|
|
<p class="prefOptionText">Calendar</p>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div class="inputRadioPref">
|
|
<p class="prefTitle">Hide Homework:</p>
|
|
<span class="change radio" re="readonly" id="prefHide">{{pref 'timeHide'}}</span>
|
|
</div>
|
|
<div class="prefOptions" style="background-color:{{divColor 'header'}}">
|
|
<p class="prefOptionText">1 Day</p>
|
|
<P class="prefOptionText">2 Days</p>
|
|
<p class="prefOptionText">1 Week</p>
|
|
<p class="prefOptionText">1 Month</p>
|
|
<p class="prefOptionText">Never</p>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div class="inputRadioPref">
|
|
<p class="prefTitle">Hide Done:</p>
|
|
<span class="change radio" re="readonly" id="prefDone">{{pref 'done'}}</span>
|
|
</div>
|
|
<div class="prefOptions" style="background-color:{{divColor 'header'}}">
|
|
<p class="prefOptionText">Yes</p>
|
|
<p class="prefOptionText">No</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<img id="bg" src={{bgSrc}}>
|
|
<div id="mainBody">
|
|
{{#if currMode 'classes'}}
|
|
<div id="classesMode">
|
|
{{#each myClasses}}
|
|
{{> classesMode}}
|
|
{{/each}}
|
|
</div>
|
|
{{/if}}
|
|
|
|
{{#if currMode 'calendar'}}
|
|
<div id="calendar" style="{{calColor}}{{highlight}}">
|
|
{{> fullcalendar calendarOptions}}
|
|
</div>
|
|
{{/if}}
|
|
</div>
|
|
|
|
<div class="overlay">
|
|
<div id="editWork">
|
|
<div id="editWorkCont" style="{{workCenter}};background-color:{{divColor 'header'}}">
|
|
<div id="workTypeBar" style="background-color:{{workType}}"></div>
|
|
<div id="workInfoContainer">
|
|
<div>
|
|
<span id="workNamerestrict">{{commentLength}}</span>
|
|
<span class="change req" id="workName" restrict="50">{{work 'name'}}</span>
|
|
</div>
|
|
<div id="workInfoNmCont">
|
|
<div>
|
|
<span class="workTitle">Due Date:</span>
|
|
<span class="change req" re="readonly" id="workDate">{{work 'dueDate'}}</span>
|
|
</div>
|
|
<div>
|
|
<span class="workTitle">Description:</span><br>
|
|
<span id="workDescrestrict">{{commentLength}}</span>
|
|
<span class="change" type="textarea" id="workDesc" restrict="150">{{work 'description'}}</span>
|
|
</div>
|
|
<div>
|
|
<div class="inputRadio">
|
|
<span class="workTitle">Type:</span>
|
|
<span class="change radio req" re="readonly" id="workType">{{work 'type'}}</span>
|
|
</div>
|
|
<div class="workOptions type" style="background-color:{{divColor 'header'}}">
|
|
<p class="workOptionText">Normal</p>
|
|
<p class="workOptionText">Quiz</p>
|
|
<p class="workOptionText">Test</p>
|
|
<p class="workOptionText">Project</p>
|
|
<p class="workOptionText">Other</p>
|
|
</div>
|
|
</div>
|
|
<!-- <div id="workAttach">Attach other files</div>
|
|
<div id="workAttachmentHolder">
|
|
{{#each work 'attachments'}}
|
|
<a href={{link}}>{{filename}}</a>
|
|
{{/each}}
|
|
</div> -->
|
|
{{#unless newWork}}
|
|
<div id="workComments">
|
|
<h3>Comments</h3>
|
|
<div>
|
|
<textarea id="workComment" class="restrict" rows="4" cols="50" maxlength="200"></textarea><br>
|
|
<div>
|
|
<span id="commentrestrict">{{commentLength}}</span>
|
|
<div id="commentSubmit">Submit</div>
|
|
</div>
|
|
</div>
|
|
<div id="comment">
|
|
{{#each work 'comments'}}
|
|
{{> comment}}
|
|
{{/each}}
|
|
</div>
|
|
</div>
|
|
{{/unless}}
|
|
</div>
|
|
</div>
|
|
{{#unless newWork}}
|
|
<div id="workToggle">
|
|
<div id="done">
|
|
{{#each work 'done'}}
|
|
{{> doneUsers}}
|
|
{{/each}}
|
|
</div>
|
|
<div id="toggleButtons">
|
|
<div id="markDone" style="background-color:{{work 'doneCol'}}">
|
|
<i class="fa fa-check-square-o" aria-hidden="true"></i>
|
|
<p>{{work 'doneText'}}</p>
|
|
</div>
|
|
<div id="markConfirm" style="color:{{work 'userConfirm'}}">
|
|
<i class="fa fa-thumbs-up" aria-hidden="true"></i>
|
|
<p>{{work 'confirmations'}}</p>
|
|
</div>
|
|
<div id="markReport" style="color:{{work 'userReport'}}">
|
|
<i class="fa fa-thumbs-down" aria-hidden="true"></i>
|
|
<p>{{work 'reports'}}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{/unless}}
|
|
{{#if inRole}}
|
|
{{#if newWork}}
|
|
<div id="workSubmit">Save</div>
|
|
{{else}}
|
|
<div id="workDelete">Delete</div>
|
|
{{/if}}
|
|
{{/if}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{> loginButtons}}
|
|
</template>
|
|
|
|
<template name="sidebarClasses">
|
|
<div class="sideClass" classid="{{_id}}">
|
|
<div>
|
|
<p class="sideClassName">{{name}}</p>
|
|
<p class="sideClassHour">{{hour}}</p>
|
|
</div>
|
|
{{#if selected}}
|
|
<i class="fa fa-dot-circle-o" aria-hidden="true"></i>
|
|
{{/if}}
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<template name="classesMode">
|
|
<div class="mainClass" style="background-color:{{divColor 'classes'}}">
|
|
<div class="classInfo"> <!-- class color -->
|
|
<h3 class="mainClassName">{{name}}</h3>
|
|
<p class="mainClassHour">{{hour}}</p>
|
|
<p class="mainClassTeacher">{{teacher}}</p>
|
|
</div>
|
|
<div class="creWork" classid="{{_id}}">
|
|
<i class="fa fa-plus" aria-hidden="true"></i>
|
|
<h4>Add Work</h4>
|
|
</div>
|
|
<div class="workHolder">
|
|
{{#each thisClassWork}}
|
|
{{> classModeWork}}
|
|
{{/each}}
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="classModeWork">
|
|
<div class="workCard" workid="{{_id}}" style="{{scale}}">
|
|
<div class="cWorkType" style="background-color:{{typeColor}}"></div>
|
|
<div class="cWorkCont">
|
|
<p class="cWorkName">{{name}}</p>
|
|
<span class="cWorkDate" style="font-weight:{{cardDate}}">{{dueDate}}</span>
|
|
<div style="float:right">
|
|
<i class="fa fa-thumbs-up" aria-hidden="true"></i>
|
|
<span>{{confirmationLength}} </span>
|
|
<i class="fa fa-thumbs-down" aria-hidden="true"></i>
|
|
<span>{{reportLength}} </span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="comment">
|
|
<div class="commentBox">
|
|
<span class="commentComment">{{comment}}</span><br>
|
|
<span class="commentUser">{{user}}</span>
|
|
<span class="commentDate">{{date}}</span>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="doneUsers">
|
|
<div class="doneUser">
|
|
<p>{{user}}</p>
|
|
</div>
|
|
</template> |