436 lines
18 KiB
HTML
436 lines
18 KiB
HTML
<head>
|
|
<title>Hourglass</title>
|
|
<link rel="icon" href="/favicon.ico?v=2">
|
|
</head>
|
|
|
|
<template name="main">
|
|
{{> sAlert}}
|
|
<div class="noScroll">
|
|
<img id="bg" src={{bgSrc}} style="min-width:{{screen}}">
|
|
<div id="divLeftBar">
|
|
<div id="menuBar" style="background-color:{{divColor 'sidebarColor'}}">
|
|
<i class="fa fa-bars" style="color:{{iconStatus 'menu'}}" aria-hidden="true"></i>
|
|
<i class="fa fa-cog" style="color:{{iconStatus 'option'}}" aria-hidden="true"></i>
|
|
<i class="fa fa-question" style="color:{{iconStatus 'requests'}}" aria-hidden="true"></i>
|
|
</div>
|
|
<div id="menuContainer" style="background-color:{{divColor 'sidebarColor'}};">
|
|
<div class="menuWrapper">
|
|
{{#if sidebarStatus 'menu'}}
|
|
{{> sidebarMenuPlate}}
|
|
{{/if}}
|
|
{{#if sidebarStatus 'option'}}
|
|
{{> sidebarOptionPlate}}
|
|
{{/if}}
|
|
{{#if sidebarStatus 'requests'}}
|
|
{{> sidebarRequestPlate}}
|
|
{{/if}}
|
|
{{#if sidebarStatus 'create'}}
|
|
{{> sidebarCreatePlate}}
|
|
{{/if}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="divCenter">
|
|
<header id="mainHeader" style="background-color:{{divColor 'mainColor'}}{{textColor}}{{defaultMode}}{{refetchEvents}}">
|
|
<h1>Hourglass</h1><h2>{{schoolName}}</h2>
|
|
<div id="dropdown">
|
|
<img src="{{avatar}}">
|
|
<h4>{{username}}</h4>
|
|
</div>
|
|
</header>
|
|
<div id="mainBody{{highlight}}">
|
|
{{#if currMode 'classes'}}
|
|
<div id="classesMode">
|
|
{{#each myClasses}}
|
|
{{> classesMode}}
|
|
{{/each}}
|
|
</div>
|
|
{{/if}}
|
|
|
|
{{#if currMode 'calendar'}}
|
|
<div id="calendar">
|
|
{{> fullcalendar calendarOptions}}
|
|
</div>
|
|
{{/if}}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="overlay">
|
|
<div id="editWork" style="width:{{screen '.4'}}">
|
|
<div id="editWorkCont" style="background-color:{{divColor 'mainColor'}};border-top:10px solid {{work 'typeColor'}}">
|
|
<div id="workInfoContainer">
|
|
{{#if inRole}}
|
|
{{> workDisplayEdit}}
|
|
{{else}}
|
|
{{> workDisplay}}
|
|
{{/if}}
|
|
{{#unless newWork}}
|
|
<div id="workInfo2">
|
|
<div id="workComments">
|
|
<h3>Comments</h3>
|
|
<div>
|
|
<textarea id="workComment" class="restrict" rows="4" cols="50" maxlength="200"></textarea><br>
|
|
<div>
|
|
<span class="resText">{{restrict 'workComment'}}</span>
|
|
<div id="commentSubmit">Submit</div>
|
|
</div>
|
|
</div>
|
|
<div id="comment">
|
|
{{#each work 'comments'}}
|
|
{{> comment}}
|
|
{{/each}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{/unless}}
|
|
</div>
|
|
{{#unless newWork}}
|
|
<div id="workToggle">
|
|
<div id="doneUsers">
|
|
{{#each work 'done'}}
|
|
{{> doneUsers}}
|
|
{{/each}}
|
|
</div>
|
|
<div id="toggleButtons">
|
|
<div id="markDone" style="background-color:{{work 'doneCol'}}">
|
|
<i class="fa {{work 'doneIcon'}}" 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-exclamation-triangle" aria-hidden="true"></i>
|
|
<p>{{work 'reports'}}</p>
|
|
</div>
|
|
<div class="workCreator doneUser" onclick="window.location='/user/{{work 'email'}}'">
|
|
<div style="display:inline-block;width:{{screen '3' '140'}}">
|
|
<img src="{{work 'avatar'}}" style="width:{{screen '3' '140'}};height:{{screen '3' '140'}}">
|
|
</div>
|
|
<div style="display:inline-block;margin-left:0.3vw">
|
|
<span>{{work 'creator'}}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{/unless}}
|
|
{{#if inRole}}
|
|
{{#if newWork}}
|
|
<div id="workSubmit">Save</div>
|
|
{{else}}
|
|
<div id="workDelete">Delete</div>
|
|
{{/if}}
|
|
{{/if}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="userDropdown" style="background-color:{{divColor 'userDropdownColor'}}">
|
|
<div id="userTab" style="border-bottom: 3vh solid {{divColor 'userDropdownColor'}}"></div>
|
|
<div id="userDropdownAvatar" style="background-color:{{divColor 'userDropdownColor'}}">
|
|
<img src="{{avatar}}">
|
|
<p>{{username}}</p>
|
|
</div>
|
|
<div id="userFunctions" style="background-color:{{divColor 'userDropdownColor'}}">
|
|
<div id="myprofile" class="userFunction" onclick="window.location='/profile';">
|
|
<i class="fa fa-user" aria-hidden="true"></i>
|
|
<p>My Profile</p>
|
|
</div>
|
|
{{#if admin}}
|
|
<div id="myprofile" class="userFunction" onclick="window.location='/admin';">
|
|
<i class="fa fa-cogs" aria-hidden="true"></i>
|
|
<p>Admin Panel</p>
|
|
</div>
|
|
{{/if}}
|
|
</div>
|
|
<div style="background-color:{{divColor 'userDropdownColor'}}">
|
|
<div id="myprofile" class="userFunction" onclick="document.getElementById('login-buttons-logout').click();">
|
|
<i class="fa fa-sign-out" aria-hidden="true"></i>
|
|
<p>Sign out</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{> loginButtons}}
|
|
</div>
|
|
</template>
|
|
|
|
<template name="sidebarMenuPlate">
|
|
<div id="modes">
|
|
<h3 class="sectionTitle">Main</h3>
|
|
<div class="mode classes">
|
|
<div class="status" style="background-color:{{modeStatus 'classes'}}"></div>
|
|
<i class="fa fa-university" aria-hidden="true"></i>
|
|
<h4>Classes</h4>
|
|
</div>
|
|
<div class="mode calendar">
|
|
<div class="status" style="background-color:{{modeStatus 'calendar'}}"></div>
|
|
<i class="fa fa-calendar" aria-hidden="true"></i>
|
|
<h4>Calendar</h4>
|
|
</div>
|
|
<div class="mode manageClass" onclick="window.location='/profile'">
|
|
<div class="status"></div>
|
|
<i class="fa fa-tasks" aria-hidden="true"></i>
|
|
<h4>Manage Classes</h4>
|
|
</div>
|
|
</div>
|
|
<div id="filters">
|
|
<div id="filterHead" class="sectionTitle">
|
|
<h3>Filters</h3>
|
|
{{#if filterOn}}
|
|
<h3 id="disableFilter">Disable All</h3>
|
|
{{/if}}
|
|
<i class="fa fa-angle-down" aria-hidden="true"></i>
|
|
</div>
|
|
<div id="filterWrapper">
|
|
<div id="typeFilterWrapper" class="sectionTitle">
|
|
<h3>By Type</h3>
|
|
<i class="fa fa-angle-down" aria-hidden="true"></i>
|
|
</div>
|
|
<div id="classFilterHolder">
|
|
{{#each types}}
|
|
{{> sideTypeFilter}}
|
|
{{/each}}
|
|
</div>
|
|
<div id="classFilterWrapper" class="sectionTitle">
|
|
<h3>By Class</h3>
|
|
<i class="fa fa-angle-down" aria-hidden="true"></i>
|
|
</div>
|
|
<div id="classListHolder">
|
|
{{#each myClasses}}
|
|
{{> sidebarClasses}}
|
|
{{/each}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="exportDiv" class="mode">
|
|
<i class="fa fa-download" aria-hidden="true"></i>
|
|
<h4>Export</h4>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="sidebarOptionPlate">
|
|
<h3 class="sectionTitle option">Preferences</h3>
|
|
<div id="prefCont">
|
|
<div class="prefWrapper">
|
|
<h3 class="sectionTitle prefText">Theme:</h3>
|
|
<div id="theme" class="clickModify dropdown" tabindex="1">
|
|
<span>{{pref 'theme'}}</span>
|
|
<i class="fa fa-angle-down" aria-hidden="true"></i>
|
|
</div>
|
|
{{> selectOptionMenu optionName="theme"}}
|
|
</div>
|
|
<div class="prefWrapper">
|
|
<h3 class="sectionTitle prefText">Default Mode:</h3>
|
|
<div id="mode" class="clickModify dropdown" tabindex="2">
|
|
<span>{{pref 'mode'}}</span>
|
|
<i class="fa fa-angle-down" aria-hidden="true"></i>
|
|
</div>
|
|
{{> selectOptionMenu optionName="mode"}}
|
|
</div>
|
|
<div class="prefWrapper">
|
|
<h3 class="sectionTitle prefText">Hide Homework:</h3>
|
|
<div id="timeHide" class="clickModify dropdown" tabindex="3">
|
|
<span>{{pref 'timeHide'}}</span>
|
|
<i class="fa fa-angle-down" aria-hidden="true"></i>
|
|
</div>
|
|
{{> selectOptionMenu optionName="timeHide"}}
|
|
</div>
|
|
<div class="prefWrapper">
|
|
<h3 class="sectionTitle prefText">Hide Done:</h3>
|
|
<div id="done" class="clickModify dropdown" tabindex="4">
|
|
<span>{{pref 'done'}}</span>
|
|
<i class="fa fa-angle-down" aria-hidden="true"></i>
|
|
</div>
|
|
{{> selectOptionMenu optionName="done"}}
|
|
</div>
|
|
<div class="prefWrapper">
|
|
<h3 class="sectionTitle prefText">Hide Reported:</h3>
|
|
<div id="hideReport" class="clickModify dropdown" tabindex="5">
|
|
<span>{{pref 'hideReport'}}</span>
|
|
<i class="fa fa-angle-down" aria-hidden="true"></i>
|
|
</div>
|
|
{{> selectOptionMenu optionName="hideReport"}}
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="sidebarRequestPlate">
|
|
<h3 class="sectionTitle option">Requests</h3>
|
|
<p class="sidebarDesc">Ask for help, submit a bug, or request a feature! We won't bite.</p>
|
|
<textarea id="requestArea" class="restrict" rows="4" cols="50" maxlength="500" placeholder="Enter request here..."></textarea><br>
|
|
<span id="requestRes" class="resText">{{restrict 'requestArea'}}</span>
|
|
<span style="opacity:0">.</span>
|
|
<div id="requestSubmit">
|
|
<span>Send</span>
|
|
<span style="display:none">Request sent!</span>
|
|
<i class="fa fa-paper-plane" aria-hidden="true"></i>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="sidebarCreatePlate">
|
|
<h3 class="sectionTitle option">Classes</h3>
|
|
<p class="sidebarDesc">Pick a class to create work for.</p>
|
|
{{#each myClasses}}
|
|
{{> sidebarClasses}}
|
|
{{/each}}
|
|
</template>
|
|
|
|
<template name="sidebarClasses">
|
|
<div class="sideClass" classid="{{_id}}">
|
|
<div class="status" style="background-color:{{selected}}"></div>
|
|
<span class="sideClassName">{{name}}</span>
|
|
<span class="sideClassHour">{{hour}}</span>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="sideTypeFilter">
|
|
<div class="sideFilter" type="{{type}}">
|
|
<div class="status" style="background-color:{{selected}}"></div>
|
|
<span class="sideTypeName">{{typeName}}</span>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="classesMode">
|
|
<div class="classWrapper">
|
|
<div class="mainClass" style="background-color:{{divColor 'classCardColor'}}">
|
|
<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>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="classModeWork">
|
|
<div class="workCard" workid="{{_id}}" classid="{{classid}}" type="{{type}}">
|
|
<div class="cWorkType" style="background-color:{{typeColor}}"></div>
|
|
<div class="cWorkCont">
|
|
<div class="cWorkTop">
|
|
<h3 class="cWorkName">{{name}}</h3>
|
|
<span class="cWorkCreator">{{creator}}</span>
|
|
</div>
|
|
<div class="cWorkBottom">
|
|
<span class="cWorkDate" style="font-weight:{{cardDate}}">{{dueDate}}</span>
|
|
<div style="color:{{doneRatio}}">
|
|
<i class="fa fa-thumbs-up" aria-hidden="true"></i>
|
|
<span>{{confirmationLength}}</span>
|
|
<i class="fa fa-exclamation-triangle" aria-hidden="true"></i>
|
|
<span>{{reportLength}}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="comment">
|
|
<div class="commentBox">
|
|
<div class="commentAvatarCont">
|
|
<img class="commentAvatar" src='{{avatar}}' onclick="window.location='/user/{{email}}'">
|
|
</div>
|
|
<div class="commentInfo">
|
|
<span class="commentComment">{{comment}}</span><br>
|
|
<span class="commentUser" onclick="window.location='/user/{{email}}'">{{user}}</span>
|
|
<span class="commentDate">{{date}}</span>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="doneUsers">
|
|
<div class="doneUser" onclick="window.location='/user/{{email}}'">
|
|
<div style="display:inline-block">
|
|
<img src='{{avatar}}' style="width:{{screen '3' '140'}};height:{{screen '3' '140'}}">
|
|
</div>
|
|
<div style="display:inline-block;margin-left:0.3vw">
|
|
<span>{{user}}</span>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="option">
|
|
<p class="optionText" style="background-color:{{divColor 'mainColor'}}">{{alias}}</p>
|
|
</template>
|
|
|
|
<template name="workDisplay">
|
|
<div id="workNameDiv">
|
|
<span id="wName" class="info">{{work 'name'}}</span>
|
|
</div>
|
|
<div id="workInfo1">
|
|
<div>
|
|
<span class="workTitle">Due Date:</span><br>
|
|
<span id="wDescription" class="info">{{work 'dueDate'}}</span>
|
|
</div>
|
|
<div>
|
|
<span class="workTitle">Description:</span><br>
|
|
<span id="wDueDate" class="info form-control">{{work 'description'}}</span>
|
|
</div>
|
|
<div>
|
|
<span class="workTitle">Type:</span>
|
|
<span id="wType" class="info">{{work 'type'}}</span>
|
|
</div>
|
|
<!-- <div id="workAttach">Attach other files</div>
|
|
<div id="workAttachmentHolder">
|
|
{{#each work 'attachments'}}
|
|
<a href={{link}}>{{filename}}</a>
|
|
{{/each}}
|
|
</div> -->
|
|
</div>
|
|
</template>
|
|
|
|
<template name="workDisplayEdit">
|
|
<div id="workNameDiv">
|
|
<input id="wName" class="clickModify restrict" style="color:{{divColor 'textColor'}}" value="{{work 'name'}}" tabindex="10" maxLength="50">
|
|
<span class="resText">{{restrict 'wName'}}</span>
|
|
</div>
|
|
<div id="workInfo1">
|
|
<div>
|
|
<span class="workTitle">Due Date:</span><br>
|
|
<input id="wDueDate" class="clickModify" style="color:{{divColor 'textColor'}}" value="{{work 'dueDate'}}" tabindex="11" readonly>
|
|
</div>
|
|
<div>
|
|
<span class="workTitle">Description:</span><br>
|
|
<textarea id="wDescription" class="clickModify restrict" style="color:{{divColor 'textColor'}}" value="{{work 'description'}}" rows="5" tabindex="12" maxLength="150"></textarea>
|
|
<span style="opacity:0">.</span>
|
|
<span class="resText">{{restrict 'wDescription'}}</span>
|
|
</div>
|
|
<div>
|
|
<span class="workTitle">Type:</span>
|
|
<div id="typeWrapper">
|
|
<div id="wType" class="clickModify dropdown" tabindex="13">
|
|
<span>{{work 'type'}}</span>
|
|
<i class="fa fa-angle-down" aria-hidden="true"></i>
|
|
</div>
|
|
<div class="optionHolder type">
|
|
{{#each selectOptions 'type'}}
|
|
{{> option}}
|
|
{{/each}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- <div id="workAttach">Attach other files</div>
|
|
<div id="workAttachmentHolder">
|
|
{{#each work 'attachments'}}
|
|
<a href={{link}}>{{filename}}</a>
|
|
{{/each}}
|
|
</div> -->
|
|
</div>
|
|
</template>
|
|
|
|
<template name="selectOptionMenu">
|
|
<div class="optionHolder">
|
|
{{#each selectOptions optionName}}
|
|
{{> option}}
|
|
{{/each}}
|
|
</div>
|
|
</template>
|