268 lines
10 KiB
HTML
268 lines
10 KiB
HTML
<template name="mobile">
|
|
<div class="noScroll" style="background-color: {{divColor 'mainColor'}}">
|
|
<header id="mobileHeader" style="background-color:{{divColor 'mainColor'}}">
|
|
<div id="mSidebarToggle">
|
|
<i class="fa fa-{{buttonTypeHeader}}" style="color:{{iconStatus}}" aria-hidden="true"></i>
|
|
</div>
|
|
<h2>{{schoolName}}</h2>
|
|
</header>
|
|
<div id="mobileBody">
|
|
{{#if showMode 'main'}}
|
|
<h4 class="minorHeader">Main</h4>
|
|
{{#each myWork}}
|
|
{{> mobileClass}}
|
|
{{/each}}
|
|
<h3 class="mNoneText" style="display:{{noneText 'main'}}">Nothing left here!</h3>
|
|
{{/if}}
|
|
{{#if showMode 'done'}}
|
|
<h4 class="minorHeader">Done</h4>
|
|
{{#each myWork "done"}}
|
|
{{> mobileClass}}
|
|
{{/each}}
|
|
<h3 class="mNoneText" style="display:{{noneText 'done'}}">You... should really get to work.</h3>
|
|
{{/if}}
|
|
{{#if showMode 'addWork'}}
|
|
{{> mAddWork}}
|
|
{{/if}}
|
|
{{#if showMode 'editWork'}}
|
|
{{> mEditWork}}
|
|
{{/if}}
|
|
{{#if showMode 'viewWork'}}
|
|
{{> mViewWork}}
|
|
{{/if}}
|
|
{{#if showMode 'settings'}}
|
|
{{> mSettings}}
|
|
{{/if}}
|
|
<div id="mainCircleButton" class="mCircleButton">
|
|
<i class="fa fa-{{buttonType}}" aria-hidden="true"></i>
|
|
</div>
|
|
</div>
|
|
<div id="mOverlay"></div>
|
|
<div id="mSidebar" style="background-color:{{divColor 'sidebarColor'}};border-left:3vw solid {{divColor 'sidebarColor'}}">
|
|
{{#if select 'class'}}
|
|
<p class="selectText">Pick a class to create work for</p>
|
|
<div id="mClassFilterWrapper" class="mSectionTitle">
|
|
<h3>Classes</h3>
|
|
</div>
|
|
<div id="mClassListHolder">
|
|
{{#each myClasses}}
|
|
{{> mSidebarClasses}}
|
|
{{/each}}
|
|
</div>
|
|
{{/if}}
|
|
{{#if select 'type'}}
|
|
<p class="selectText">Pick a type for your work</p>
|
|
<div id="mTypeFilterWrapper" class="mSectionTitle">
|
|
<h3>Types</h3>
|
|
</div>
|
|
<div id="mClassFilterHolder">
|
|
{{#each types}}
|
|
{{> mSideTypeFilter}}
|
|
{{/each}}
|
|
</div>
|
|
{{/if}}
|
|
{{#if select 'options'}}
|
|
<p class="selectText">Pick your new setting</p>
|
|
<div id="mTypeFilterWrapper" class="mSectionTitle">
|
|
<h3>{{optionInfo 'title'}}</h3>
|
|
</div>
|
|
<div id="mOptionHolder">
|
|
{{#each optionInfo 'list'}}
|
|
{{> mOptionCard}}
|
|
{{/each}}
|
|
</div>
|
|
{{/if}}
|
|
{{#if select 'none'}}
|
|
{{> defaultSidebar}}
|
|
{{/if}}
|
|
</div>
|
|
</div>
|
|
{{> sAlert}}
|
|
{{> loginButtons}}
|
|
</template>
|
|
|
|
<template name="mobileClass">
|
|
<div class="mClassContainer" workid="{{_id}}">
|
|
{{#if isDone}}
|
|
<h4 class="mUndoText" workid="{{_id}}">Unmarked as done!</h4>
|
|
{{else}}
|
|
<h4 class="mUndoText" workid="{{_id}}">Marked as done!</h4>
|
|
{{/if}}
|
|
<div class="mUndo" workid="{{_id}}">
|
|
<i class="fa fa-undo" aria-hidden="true"></i>
|
|
<p>Undo</p>
|
|
</div>
|
|
<div class="mobileClass" style="background-color:{{divColor 'secondaryColor'}}" workid="{{_id}}">
|
|
<div class="mobileType" style="background-color:{{typeColor}}"></div>
|
|
<div class="mobileClassContent">
|
|
<h4 class="mName">{{name}}</h4>
|
|
<h4 class="mDate">{{dateWord}}</h4>
|
|
<h4 class="mClass">{{className}}</h4>
|
|
<h4 class="mDesc">{{shortdesc}}</h4>
|
|
<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="defaultSidebar">
|
|
<div class="mSectionTitle downOffset">
|
|
<h3>Main</h3>
|
|
</div>
|
|
<div class="mSectionMode">
|
|
<div class="mStatus" style="background-color:{{modeStatus 'main'}}"></div>
|
|
<i class="fa fa-list-ul" aria-hidden="true"></i>
|
|
<h4>Main Work</h4>
|
|
</div>
|
|
<div class="mSectionMode">
|
|
<div class="mStatus" style="background-color:{{modeStatus 'done'}}"></div>
|
|
<i class="fa fa-check-square" aria-hidden="true"></i>
|
|
<h4>Done Work</h4>
|
|
</div>
|
|
<div id="mFilterHead" class="mSectionTitle mOpenable downOffset">
|
|
<h3>Filters</h3>
|
|
<h3 id="mDisableFilter" style="display:{{filterOn}}">Disable All</h3>
|
|
<i class="fa fa-angle-down" aria-hidden="true"></i>
|
|
</div>
|
|
<div id="mFilterWrapper">
|
|
<div id="mTypeFilterWrapper" class="mSectionTitle mOpenable">
|
|
<h3>By Type</h3>
|
|
<i class="fa fa-angle-down" aria-hidden="true"></i>
|
|
</div>
|
|
<div id="mClassFilterHolder">
|
|
{{#each types}}
|
|
{{> mSideTypeFilter}}
|
|
{{/each}}
|
|
</div>
|
|
<div id="mClassFilterWrapper" class="mSectionTitle mOpenable">
|
|
<h3>By Class</h3>
|
|
<i class="fa fa-angle-down" aria-hidden="true"></i>
|
|
</div>
|
|
<div id="mClassListHolder">
|
|
{{#each myClasses}}
|
|
{{> mSidebarClasses}}
|
|
{{/each}}
|
|
</div>
|
|
</div>
|
|
<div id="mSettings" class="mSectionTitle mSectionMode">
|
|
<i class="fa fa-cog" aria-hidden="true"></i>
|
|
<h3>Settings</h3>
|
|
</div>
|
|
<div id="mSignOut" class="mSectionTitle mSectionMode">
|
|
<i class="fa fa-sign-out" aria-hidden="true"></i>
|
|
<h3>Sign out</h3>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="mSideTypeFilter">
|
|
<div class="mSideFilter" type="{{type}}">
|
|
<div class="mStatus" style="background-color:{{selected}}"></div>
|
|
<span class="mSideTypeName">{{typeName}}</span>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="mSidebarClasses">
|
|
<div class="mSideClass" classid="{{_id}}">
|
|
<div class="mStatus" style="background-color:{{selected}}"></div>
|
|
<span class="mSideClassName">{{name}}</span>
|
|
<span class="mSideClassHour">{{hour}}</span>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="mOptionCard">
|
|
<div class="mSideFilter">
|
|
<span class="mOptionText">{{alias}}</span>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="mAddWork">
|
|
<h4 class="minorHeader">Add Work</h4>
|
|
<input id="name" class="mAddForm restrict" form="name" maxLength="50" placeholder="Name">
|
|
<input id="class" class="mAddForm" form="class" value="{{work 'class'}}">
|
|
<div id="dueDateCont">
|
|
<input id="dueDate" class="mAddForm" form="dueDate" placeholder="Due Date" readonly>
|
|
<i class="fa fa-angle-down" aria-hidden="true"></i>
|
|
</div>
|
|
<div id="typeCont">
|
|
<input id="type" class="mAddForm" form="type" placeholder="Type" value="{{work 'type'}}" readonly>
|
|
<i class="fa fa-angle-down" aria-hidden="true"></i>
|
|
</div>
|
|
<textarea id="description" class="mAddForm restrict" form="description" rows="8" maxLength="300" placeholder="Description"></textarea>
|
|
<div id="mRestrictText">
|
|
<span class="resText">{{restrict 'name'}}</span>
|
|
<span class="resText">{{restrict 'description'}}</span>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="mEditWork">
|
|
<h4 class="minorHeader">Edit Work</h4>
|
|
<input id="name" class="mAddForm restrict" form="name" maxLength="50" placeholder="Name" value="{{work 'name'}}">
|
|
<input id="class" class="mAddForm" form="class" value="{{work 'class'}}" onfocus="this.blur()" readonly>
|
|
<div id="dueDateCont">
|
|
<input id="dueDate" class="mAddForm" form="dueDate" placeholder="Due Date" value="{{work 'dueDate'}}" onfocus="this.blur()" readonly>
|
|
<i class="fa fa-angle-down" aria-hidden="true"></i>
|
|
</div>
|
|
<div id="typeCont">
|
|
<input id="type" class="mAddForm" form="type" placeholder="Type" value="{{work 'type'}}" onfocus="this.blur()" readonly>
|
|
<i class="fa fa-angle-down" aria-hidden="true"></i>
|
|
</div>
|
|
<textarea id="description" class="mAddForm restrict" form="description" rows="8" maxLength="300" placeholder="Description" value="{{work 'description'}}"></textarea>
|
|
<div id="mRestrictText">
|
|
<span class="resText">{{restrict 'name'}}</span>
|
|
<span class="resText">{{restrict 'description'}}</span>
|
|
</div>
|
|
<div id="mConfirm" class="mCircleButton" style="background-color:{{work 'userConfirm'}}">
|
|
<i class="fa fa-thumbs-up" aria-hidden="true" ></i>
|
|
</div>
|
|
<p id="mConfirmNum" class="mNum">{{work 'confirmations'}}</p>
|
|
<div id="mReport" class="mCircleButton" style="background-color:{{work 'userReport'}}">
|
|
<i class="fa fa-exclamation-triangle" aria-hidden="true" ></i>
|
|
</div>
|
|
<p id="mReportNum" class="mNum">{{work 'reports'}}</p>
|
|
<!-- <h4 id="mDelete">Delete Work</h4> -->
|
|
</template>
|
|
|
|
<template name="mViewWork">
|
|
<h4 class="minorHeader">View Work</h4>
|
|
<input id="name" class="mAddForm restrict" form="name" maxLength="50" placeholder="Name" value="{{work 'name'}}" onfocus="this.blur()" readonly>
|
|
<input id="class" class="mAddForm" form="class" value="{{work 'class'}}" onfocus="this.blur()" readonly>
|
|
<div id="dueDateCont">
|
|
<input id="dueDate" class="mAddForm" form="dueDate" placeholder="Due Date" value="{{work 'dueDate'}}" onfocus="this.blur()" readonly>
|
|
</div>
|
|
<div id="typeCont">
|
|
<input id="type" class="mAddForm" form="type" placeholder="Type" value="{{work 'type'}}" onfocus="this.blur()" readonly>
|
|
</div>
|
|
<textarea id="description" class="mAddForm restrict" form="description" rows="8" maxLength="300" placeholder="Description" value="{{work 'description'}}" onfocus="this.blur()" readonly></textarea>
|
|
<div id="mRestrictText">
|
|
<span class="resText">{{restrict 'name'}}</span>
|
|
<span class="resText">{{restrict 'description'}}</span>
|
|
</div>
|
|
<div id="mConfirm" class="mCircleButton" style="background-color:{{work 'userConfirm'}}">
|
|
<i class="fa fa-thumbs-up" aria-hidden="true" ></i>
|
|
</div>
|
|
<p id="mConfirmNum" class="mNum">{{work 'confirmations'}}</p>
|
|
<div id="mReport" class="mCircleButton" style="background-color:{{work 'userReport'}}">
|
|
<i class="fa fa-exclamation-triangle" aria-hidden="true" ></i>
|
|
</div>
|
|
<p id="mReportNum" class="mNum">{{work 'reports'}}</p>
|
|
</template>
|
|
|
|
<template name="mSettings">
|
|
<div id="theme" class="mOption">
|
|
<p class="mOpTitle">Theme:</p>
|
|
<p class="mOpVal">{{pref 'theme'}}</p>
|
|
</div>
|
|
<div id="timeHide" class="mOption">
|
|
<p class="mOpTitle">Hide Homework:</p>
|
|
<p class="mOpVal">{{pref 'timeHide'}}</p>
|
|
</div>
|
|
<div id="hideReport" class="mOption">
|
|
<p class="mOpTitle">Hide Reported:</p>
|
|
<p class="mOpVal">{{pref 'hideReport'}}</p>
|
|
</div>
|
|
</template> |