API tools faq
paste
Advertisement
FiringBlanks

Autocomplete Search (3) HTML

FiringBlanks
Oct 27th, 2019
164
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 33.55 KB | None | 0 0
raw download clone embed print report
  1.  
  2. <!-- <div class="ui centered grid" style="margin-top: 56px;"> -->
  3. <!-- <div class="ui centered grid" style="margin-top: 8vh;"> -->
  4.  
  5. <!-- <span *ngIf="!userExists || ( user.pins < 1 && (user.moderations < 1) ); then splash else dash;"></span> -->
  6.  
  7. <!-- <div>userExists: {{userExists}}</div>
  8. <div>pinsFetched: {{pinsFetched}}</div>
  9. <div>modsFetched: {{modsFetched}}</div> -->
  10.  
  11. <span *ngIf="userExists == false && pinsFetched == 'stopped' && modsFetched == 'stopped'; then splash;"></span>
  12. <span *ngIf="userExists && ( !(user.pins > 0) && !(user.moderations > 0) ); then splash;"></span>
  13. <span *ngIf="userExists && ( user.pins > 0 || (user.moderations > 0) ); then dash;"></span>
  14.  
  15. <ng-template #splash>
  16.  
  17. <iframe style="display: none;" (load)="toggleDisplayGradient(true)" src="" frameborder="0"></iframe>
  18. <iframe style="display: none;" (load)="toggleElevateToolbar(false)" src="" frameborder="0"></iframe>
  19.  
  20. <span *ngIf="windowWidth > 1000; then desktopLayout else mobileLayout"></span>
  21.  
  22. <ng-template #desktopLayout>
  23. <div class="ui two column grid" style="margin-top: 5vh; margin-bottom: 3vh; transform: translateY(7%);">
  24. <div class="column">
  25.  
  26. <!-- <div class="ui icon message" style="margin-top: -64px; transform: translateX(50%);">
  27. <i class="violet rocket icon"></i>
  28. <div class="content">
  29. <div class="ui grid">
  30. <div class="ten wide column">
  31. <div class="header">We're launching soon</div>
  32. <p>Support us on our Product Hunt launch with a vote and earn 200 points!</p>
  33. </div>
  34. <div class="five wide column">
  35. <span *ngIf="userExists; then notifiable else notNotifiable"></span>
  36. <ng-template #notifiable><button class="ui blue button" style="margin-top: 12px;">Notify Me</button></ng-template>
  37. <ng-template #notNotifiable>
  38. <div matTooltip="Must be signed in">
  39. <button class="ui disabled blue button" style="margin-top: 12px;">Notify Me</button>
  40. </div>
  41. </ng-template>
  42. </div>
  43. </div>
  44. </div>
  45. </div> -->
  46.  
  47. <h1 class="ui violet header" style="margin-top: 6vh;">
  48. <span class="ui large text" style="color: #afb1fc; font-family: 'Source Sans Pro'; letter-spacing: 8px;">FIND UPLOADED </span>
  49. <div style="margin-top: 24px;"></div>
  50. <span style="font-family: 'Source Sans Pro'; font-size: 350%;">ANSWERS</span>
  51. <h3 class="sub header" style="margin-top: 14px; font-family: 'Source Sans Pro';">
  52. QuizMeNot is a database of schoolwork assignments, uploaded by students around the world.
  53. <span *ngIf="windowWidth > 890">Find your school in the search box below to search for uploaded classwork.
  54. Click <strong><a (click)="navigateToAboutPage()">here</a></strong> to learn more.
  55. </span>
  56. </h3>
  57. </h1>
  58.  
  59. <form>
  60. <mat-form-field style="width: 50vw; max-width: 400px;" appearance="outline">
  61. <input matInput placeholder="Search for your school..." aria-label="School" [matAutocomplete]="auto" (input)="filterSchools()" #schoolInput [(ngModel)]="searchModel" (keyup.enter)="searchButton(schoolInput.value)" name="inputField" id="searchInput">
  62. <mat-icon class="searchIcon" matSuffix style="color: #6336c6;" (click)="searchButton(schoolInput.value)">search</mat-icon>
  63. <mat-autocomplete #auto="matAutocomplete">
  64. <mat-option *ngFor="let school of schoolsObs | async" [value]="school.name" (click)="searchButton(school.name)">
  65. <span class="ui tiny header">{{ school.schoolNameDisplay }}</span>
  66. <span *ngIf="school.country == 'United States'; then withState else withoutState"></span>
  67. <ng-template #withState><small> {{school.city}}, {{school.state}}</small></ng-template>
  68. <ng-template #withoutState><small> {{school.city}}, {{school.country}}</small></ng-template>
  69. </mat-option>
  70. <span *ngIf="user; then addSchoolEnabled else addSchoolDisabled"></span>
  71. <ng-template #addSchoolEnabled>
  72. <mat-option (click)="openDialogAddSchool()" style="font-style: italic; padding-bottom: 4px; margin-bottom: 0px;">
  73. <!-- <button class="ui basic violet tertiary button" style="margin-top:6px;"><i class="plus icon"></i>Add school</button> -->
  74. <div class="ui center aligned basic segment" style="padding-bottom: 8px;">
  75. <i class="violet plus icon"></i>
  76. <span class="ui violet text" style="font-style: normal;">Add School</span>
  77. </div>
  78. </mat-option>
  79. </ng-template>
  80. <ng-template #addSchoolDisabled>
  81. <mat-option (click)="addSchoolDisabledClick()" style="font-style: italic; padding-bottom: 4px; margin-bottom: 0px;">
  82. <!-- <button class="ui disabled basic violet tertiary button" style="margin-top:6px;"><i class="plus icon"></i>Add school</button> -->
  83. <div class="ui center aligned basic segment" matTooltip="Must be signed in" style="padding-bottom: 8px;">
  84. <i class="violet plus icon" style="opacity: 0.5;"></i>
  85. <span class="ui violet text" style="font-style: normal; opacity: 0.5;">Add School</span>
  86. </div>
  87. </mat-option>
  88. </ng-template>
  89. </mat-autocomplete>
  90. </mat-form-field>
  91. </form>
  92.  
  93. </div>
  94. <div class="column">
  95. <img class="ui image" style="transform: translateY(-7%);" src="../../assets/images/607-edited_2.png" alt="" oncontextmenu="return false;" onmousedown="return false" (click)="splashPicClicked()">
  96. </div>
  97.  
  98. </div>
  99. </ng-template>
  100.  
  101. <ng-template #mobileLayout>
  102. <div class="ui centered grid" style="margin-bottom: 8vh; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">
  103.  
  104. <img class="ui medium fluid image" style="background-size: cover; display: block;" src="../../assets/images/607-edited_2.png">
  105.  
  106. <div class="ui center aligned basic segment">
  107. <h2 class="ui header">
  108. <span class="ui violet text">FIND YOUR SCHOOL</span>
  109. <div class="sub header">
  110. QuizMeNot is a database of schoolwork assignments
  111. uploaded by students around the world.
  112. </div>
  113. </h2>
  114. </div>
  115.  
  116. <form>
  117. <mat-form-field style="width: 50vw; max-width: 400px;" appearance="outline">
  118. <input matInput placeholder="Search schools..." aria-label="School" [matAutocomplete]="auto" (input)="filterSchools()" #schoolInput [(ngModel)]="searchModel" (keyup.enter)="searchButton(schoolInput.value)" name="inputField" id="searchInput">
  119. <mat-icon class="searchIcon" matSuffix style="color: #6336c6;" (click)="searchButton(schoolInput.value)">search</mat-icon>
  120. <mat-autocomplete #auto="matAutocomplete">
  121. <mat-option *ngFor="let school of schoolsObs | async" [value]="school.name" (click)="searchButton(school.name)">
  122. <span class="ui tiny header">{{ school.schoolNameDisplay }}</span>
  123. <span *ngIf="school.country == 'United States'; then withState else withoutState"></span>
  124. <ng-template #withState><small> {{school.city}}, {{school.state}}</small></ng-template>
  125. <ng-template #withoutState><small> {{school.city}}, {{school.country}}</small></ng-template>
  126. </mat-option>
  127. <mat-option *ngIf="user" (click)="openDialogAddSchool()" style="font-style: italic; padding: 4px; margin: 0px;">
  128. <!-- <button class="ui basic fluid violet tertiary button" style="margin-top:6px;"><i class="plus icon"></i>Add school</button> -->
  129. <div class="ui center aligned basic segment" style="padding-bottom: 8px;">
  130. <i class="violet plus icon"></i>
  131. <span class="ui violet text" style="font-style: normal;">Add School</span>
  132. </div>
  133. </mat-option>
  134. </mat-autocomplete>
  135. </mat-form-field>
  136. </form>
  137.  
  138.  
  139.  
  140. </div>
  141. </ng-template>
  142.  
  143. </ng-template>
  144.  
  145. <ng-template #dash>
  146.  
  147. <!-- <span *ngIf="user.usersMeta.currency; then showCurr else noCurr"></span>
  148. <ng-template #showCurr>
  149. <div>User's currency: {{user.usersMeta.currency}}</div>
  150. </ng-template>
  151. <ng-template #noCurr>
  152. <div>No currency on user</div>
  153. </ng-template> -->
  154.  
  155. <iframe style="display: none;" (load)="toggleDisplayGradient(false)" src="" frameborder="0"></iframe>
  156. <iframe style="display: none;" (load)="toggleElevateToolbar(true)" src="" frameborder="0"></iframe>
  157.  
  158. <div class="ui center aligned basic segment">
  159. <form>
  160. <mat-form-field style="width: 50vw; max-width: 400px;" appearance="outline">
  161. <input matInput placeholder="Search schools..." aria-label="School" [matAutocomplete]="auto" (input)="filterSchools()" #schoolInput [(ngModel)]="searchModel" (keyup.enter)="searchButton(schoolInput.value)" name="inputField" id="searchInput">
  162. <mat-icon class="searchIcon" matSuffix style="color: #6336c6;" (click)="searchButton(schoolInput.value)">search</mat-icon>
  163. <mat-autocomplete #auto="matAutocomplete">
  164. <mat-option *ngFor="let school of schoolsObs | async" [value]="school.name" (click)="searchButton(school.name)">
  165. <span class="ui tiny header">{{ school.schoolNameDisplay }}</span>
  166. <span *ngIf="school.country == 'United States'; then withState else withoutState"></span>
  167. <ng-template #withState><small> {{school.city}}, {{school.state}}</small></ng-template>
  168. <ng-template #withoutState><small> {{school.city}}, {{school.country}}</small></ng-template>
  169. </mat-option>
  170. <mat-option *ngIf="user" (click)="openDialogAddSchool()" style="font-style: italic; padding-bottom: 4px; margin-bottom: 12px;">
  171. <!-- <button class="ui basic fluid violet tertiary button" style="margin-top:6px;"><i class="plus icon"></i>Add school</button> -->
  172. <div class="ui center aligned basic segment" style="padding-bottom: 8px;">
  173. <i class="violet plus icon"></i>
  174. <span class="ui violet text" style="font-style: normal;">Add School</span>
  175. </div>
  176. </mat-option>
  177. </mat-autocomplete>
  178. </mat-form-field>
  179. </form>
  180. </div>
  181.  
  182. <div class="ui centered grid" style="margin-top: 3vh;">
  183. <div class="twelve wide column">
  184. <h3 class="ui header" *ngIf="(pinnedClasses | async)?.length > 0" style="margin-bottom: 32px; position: relative; left: 57%; transform: translateX(-50%);">
  185. Pinned Classes
  186. </h3>
  187.  
  188. <div class="ui grid" *ngFor="let class of pinnedClasses | async" style="margin-left: -2px;">
  189.  
  190. <div class="column" style="padding-right: 0px; margin-right: -8px;">
  191. <i class="pin icon" matTooltip="Unpin class" matTooltipPosition="before" (click)="unpinClass(class.school, class.teacher, class.className, class.classUID)" style="position: relative; top: 0%; transform: translateY(-50%); transform: rotate(-45deg);"></i>
  192. </div>
  193.  
  194. <div class="thirteen wide column" style="padding-top: 0px; padding-bottom: 0px; padding-right: 4px;">
  195. <mat-expansion-panel class="mat-elevation-z1" style="margin-bottom: 16px;">
  196. <mat-expansion-panel-header>
  197. <mat-panel-title>
  198. <h4 class="ui header">{{class.className}}</h4>
  199. </mat-panel-title>
  200. <mat-panel-description>
  201. {{class.teacher}}
  202. </mat-panel-description>
  203. </mat-expansion-panel-header>
  204. <mat-panel-description>
  205. <table class="ui very basic table">
  206. <tbody>
  207. <tr *ngFor="let assignment of class.assignmentsObj | orderBy : ['weekDue'] ">
  208. <td class="collapsing">{{assignment.weekDue}}</td>
  209.  
  210. <span *ngIf="assignment.submissions > 0; then bold else unbold"></span>
  211. <ng-template #bold>
  212. <td class="selectable" (click)="openPinnedClassAssignment(class, assignment)"><strong style="margin-left: 12px;">{{assignment.title}}</strong></td>
  213. </ng-template>
  214. <ng-template #unbold>
  215. <td>{{assignment.title}}</td>
  216. </ng-template>
  217.  
  218. <td class="right aligned">{{assignment.type}}</td>
  219. </tr>
  220. </tbody>
  221. </table>
  222. </mat-panel-description>
  223. </mat-expansion-panel>
  224. </div>
  225.  
  226. <div class="column">
  227. <button class="ui basic circular icon button" (click)="navigateToClass(class.school, class.teacher, class.className)" style="position: relative; top: 20%; transform: translateY(-50%);">
  228. <i class="right arrow icon"></i>
  229. </button>
  230. </div>
  231.  
  232. </div>
  233.  
  234. <h3 class="ui header" *ngIf="(moderatingClasses | async)?.length > 0" style="margin-top: 36px; margin-bottom: 28px; position: relative; left: 57%; transform: translateX(-50%);">
  235. Moderating Classes
  236. </h3>
  237.  
  238. <div class="ui grid" *ngFor="let class of moderatingClasses | async; index as i" style="padding-top: 0px; padding-bottom: 0px;">
  239.  
  240. <div class="column" style="padding-top: 4px; padding-bottom: 0px;">
  241. <!-- <i *ngIf="i == 1 || i == 3 || i == 5;" class="info icon" style="position: relative; top: 40%; transform: translateY(-50%); cursor: pointer;"></i> -->
  242. </div>
  243.  
  244. <div class="thirteen wide column" style="padding-top: 4px; padding-bottom: 0px;">
  245. <mat-card style="margin-bottom: 12px; padding-top:0px; height: 52px;" >
  246. <div class="ui grid">
  247. <div class="seven wide column" style="padding-top: 16px;">
  248. <h4 class="ui header">{{class.class}}</h4>
  249. </div>
  250. <div class="four wide column" style="padding-top: 16px;">
  251. <div class="meta"><span class="category">{{class.teacher}}</span></div>
  252. </div>
  253. <div class="five wide column" style="padding-top: 12px;">
  254. <span matTooltip="Current owner" matTooltipPosition="after">
  255. <img src="{{class.currentOwnerPhotoURL}}" alt="" class="ui avatar image" style="padding-top: -8px;">
  256. {{class.currentOwnerName}}
  257. </span>
  258. </div>
  259. </div>
  260. </mat-card>
  261. </div>
  262.  
  263. <div class="column" style="padding-top: 4px; padding-bottom: 0px;">
  264. <button class="ui circular basic icon button" (click)="navigateToClass(class.school, class.teacher, class.className)" style="position: relative; top: 40%; transform: translateY(-50%);">
  265. <i class="right arrow icon"></i>
  266. </button>
  267. </div>
  268.  
  269. </div>
  270.  
  271.  
  272.  
  273. <h3 class="ui header" *ngIf="(createdSchools | async)?.length > 0" style="margin-top: 36px; margin-bottom: 28px; position: relative; left: 57%; transform: translateX(-50%);">
  274. Created Schools
  275. </h3>
  276.  
  277. <div class="ui grid" *ngFor="let school of createdSchools | async">
  278.  
  279. <div class="column" style="padding-top: 4px; padding-bottom: 0px;">
  280. <i class="right floated cog icon" (click)="editSchool(school)" style="position: relative; top: 35%; transform: translateY(-50%) translateX(80%);"></i>
  281. </div>
  282.  
  283. <div class="thirteen wide column" style="padding-top: 4px; padding-bottom: 0px;">
  284. <mat-card style="margin-bottom: 12px; padding-top:0px; height: 52px;">
  285. <div class="ui grid">
  286. <div class="ten wide column" style="padding-top: 16px;">
  287. <h4 class="ui header">{{school.schoolNameDisplay}}</h4>
  288. </div>
  289. <div class="five wide column" style="padding-top: 16px;">
  290. <span *ngIf="school.state; then withState else withCountry"></span>
  291. <ng-template #withState><div class="meta">{{school.city}}, {{school.state}}</div></ng-template>
  292. <ng-template #withCountry><div class="meta">{{school.city}}, {{school.country}}</div></ng-template>
  293. </div>
  294. </div>
  295. </mat-card>
  296. </div>
  297.  
  298. <div class="column" style="padding-top: 4px; padding-bottom: 0px;">
  299. <button class="ui circular basic icon button" (click)="searchButton(school.schoolName)" style="position: relative; top: 40%; transform: translateY(-50%);">
  300. <i class="right arrow icon"></i>
  301. </button>
  302. </div>
  303.  
  304. </div>
  305.  
  306.  
  307. </div>
  308. </div>
  309.  
  310.  
  311. <button class="ui fluid basic button" *ngIf="user.userRole == 'super admin' " style="margin-top: 32px;" (click)="openAdminPanel()">Admin Panel</button>
  312.  
  313.  
  314.  
  315.  
  316. <!-- <div class="ui grid" style="margin-top: 3vh;">
  317.  
  318. <div class="four wide column" style="margin-bottom: 32px;">
  319. <h4 class="ui header" style="position: relative; left: 75%; transform: translateX(-50%);">Moderating Classes</h4>
  320.  
  321. <div class="ui link card" *ngFor="let class of moderatingClasses | async; index as i" (click)="navigateToClass(class.school, class.teacher, class.className)">
  322. <div class="content">
  323. <div class="header">{{class.class}}</div>
  324. <div class="meta"><span class="category">{{class.teacher}}</span></div>
  325. </div>
  326. <div class="extra content">
  327. <div class="center aligned author">
  328. <img src="{{class.currentOwnerPhotoURL}}" alt="" class="ui avatar image"> {{class.currentOwnerName}}
  329. </div>
  330. </div>
  331. </div>
  332.  
  333. </div>
  334. <div class="eight wide column">
  335. <h4 class="ui header" style="position: relative; left: 85%; transform: translateX(-50%); padding-bottom: 14px;">Pinned Classes</h4>
  336.  
  337. <div class="ui grid" *ngFor="let class of pinnedClasses | async">
  338.  
  339. <div class="column" style="padding-right: 0px; margin-right: -8px;">
  340. <i class="pin icon" matTooltip="Unpin class" matTooltipPosition="before" (click)="unpinClass(class.school, class.teacher, class.className, class.classUID)" style="position: relative; top: 0%; transform: translateY(-50%); transform: rotate(-45deg);"></i>
  341. </div>
  342.  
  343. <div class="thirteen wide column" style="padding-top: 0px; padding-bottom: 0px;">
  344. <mat-expansion-panel class="mat-elevation-z1" style="margin-bottom: 16px;">
  345. <mat-expansion-panel-header>
  346. <mat-panel-title><h4 class="ui header">{{class.className}}</h4></mat-panel-title>
  347. <mat-panel-description>{{class.teacher}}</mat-panel-description>
  348. </mat-expansion-panel-header>
  349. <mat-panel-description>
  350. <table class="ui very basic table">
  351. <tbody>
  352. <tr *ngFor="let assignment of class.assignmentsObj | orderBy : ['weekDue'] ">
  353. <td class="collapsing">{{assignment.weekDue}}</td>
  354. <td>{{assignment.title}}</td>
  355. <td class="right aligned">{{assignment.type}}</td>
  356. </tr>
  357. </tbody>
  358. </table>
  359. </mat-panel-description>
  360. </mat-expansion-panel>
  361. </div>
  362.  
  363. <div class="column">
  364. <button class="ui basic circular icon button" (click)="navigateToClass(class.school, class.teacher, class.className)" style="position: relative; top: 20%; transform: translateY(-50%);">
  365. <i class="right arrow icon"></i>
  366. </button>
  367. </div>
  368.  
  369. </div>
  370.  
  371. </div>
  372. <div class="four wide column">
  373.  
  374. <h4 class="ui header" style="position: relative; left: 85%; transform: translateX(-50%);">Created Schools</h4>
  375.  
  376. <div class="ui card" *ngFor="let school of createdSchools | async">
  377. <div class="content">
  378. <i class="right floated cog icon" (click)="editSchool(school)"></i>
  379. <div class="header">{{school.schoolName}}</div>
  380. <span *ngIf="school.state; then withState else withCountry"></span>
  381. <ng-template #withState><div class="meta">{{school.city}}, {{school.state}}</div></ng-template>
  382. <ng-template #withCountry><div class="meta">{{school.city}}, {{school.country}}</div></ng-template>
  383. </div>
  384. <div class="ui bottom attached button" (click)="searchButton(school.schoolName)">View</div>
  385. </div>
  386. </div>
  387. </div> -->
  388.  
  389.  
  390.  
  391.  
  392.  
  393.  
  394.  
  395.  
  396.  
  397. <!-- <div class="ui center aligned two column grid" style="margin-top: 3vh;">
  398.  
  399. <div class="ui basic center aligned segment">
  400. <h1 class="ui violet header">
  401. Find your school
  402. <h3 class="sub header" style="margin-top: 8px;">
  403. QuizMeNot is a library of schoolwork assignments uploaded by students around the world.
  404. <span *ngIf="windowWidth > 660">Find your school in the search box below.</span>
  405. </h3>
  406. </h1>
  407.  
  408. <form>
  409. <mat-form-field style="width: 50vw; max-width: 400px;" appearance="outline">
  410. <input matInput placeholder="Search schools..." aria-label="School" [matAutocomplete]="auto" #schoolInput [(ngModel)]="searchModel" (keyup.enter)="searchButton(schoolInput.value)" name="inputField" id="searchInput">
  411. <mat-icon class="searchIcon" matSuffix style="color: #6336c6;" (click)="searchButton(schoolInput.value)">search</mat-icon>
  412. <mat-autocomplete #auto="matAutocomplete">
  413. <mat-option *ngFor="let school of schools | async" [value]="school.name">
  414. <span class="ui tiny header">{{ school.name }}</span>
  415. <span *ngIf="school.country == 'United States'; then withState else withoutState"></span>
  416. <ng-template #withState><small> {{school.city}}, {{school.state}}</small></ng-template>
  417. <ng-template #withoutState><small> {{school.city}}, {{school.country}}</small></ng-template>
  418. </mat-option>
  419. <mat-option *ngIf="user" (click)="openDialogAddSchool()" style="font-style: italic; padding-bottom: 4px; margin-bottom: 12px;">
  420. <button class="ui basic fluid violet button" style="margin-top:6px;"><i class="plus icon"></i>Add school</button>
  421. </mat-option>
  422. </mat-autocomplete>
  423. </mat-form-field>
  424. </form>
  425.  
  426. </div>
  427.  
  428.  
  429.  
  430. <div class="column">
  431. <h3 class="ui violet header">Pinned Classes</h3>
  432.  
  433. <iframe style="display: none;" (load)="toggleDisplayGradient(false)" src="" frameborder="0"></iframe>
  434.  
  435. <mat-tab-group disableRipple="true" style="min-width: 15vw; max-width: 50vw;">
  436. <mat-tab *ngFor="let class of pinnedClasses | async" label="{{class.className}}">
  437.  
  438. <div class="ui basic segment" style="margin-bottom: 0px;">
  439. <h4 class="ui header" style="margin-top: 2px;">{{class.teacher}}</h4>
  440. </div>
  441.  
  442. <table class="ui selectable table" style="margin-top: 0px;">
  443. <tbody>
  444. <tr *ngFor="let assignment of class.assignmentsObj | orderBy : ['weekDue'] ">
  445. <td class="collapsing">{{assignment.weekDue}}</td>
  446. <td>{{assignment.title}}</td>
  447. <td class="right aligned">{{assignment.type}}</td>
  448. </tr>
  449. </tbody>
  450. </table>
  451.  
  452. <iframe (load)="setCurrentPinnedVariables(class)" style="display: none;"></iframe>
  453.  
  454. </mat-tab>
  455. </mat-tab-group>
  456.  
  457. <div class="ui row" style="padding-top: 0px;" *ngIf="(pinnedClasses | async)?.length > 0">
  458. <button class="ui circular icon button" style="margin-right: 8px;" matTooltip="Unpin class" matTooltipPosition="before" (click)="unpinClass(currentlySelectedPinnedSchool, currentlySelectedPinnedTeacher, currentlySelectedPinnedClass, currentlySelectedPinnedClassUID)"><i class="right floated pin icon" style="transform: rotate(45deg);"></i></button>
  459. <button class="ui circular violet button" (click)="navigateToClass(currentlySelectedPinnedSchool, currentlySelectedPinnedTeacher, currentlySelectedPinnedClass)">View Teacher</button>
  460. <button class="ui icon button" *ngIf="user.userRole == 'super admin' " (click)="openAdminPanel()">
  461. <i class="cloud icon"></i>
  462. </button>
  463. </div>
  464.  
  465.  
  466. </div>
  467. <div class="column">
  468. <h3 class="ui violet header">Moderating Classes</h3>
  469.  
  470. <div class="ui two link centered cards" style="margin-top: 52px;">
  471.  
  472. <div class="card" id="moderatingClasses" *ngFor="let class of moderatingClasses | async; index as i" (click)="navigateToClass(class.school, class.teacher, class.className)">
  473. <div *ngIf="!class">Not moderating any classes yet.</div>
  474. <div class="content">
  475. <div class="center aligned grid">
  476. <h4 class="header" style="margin-bottom: 8px;">{{class.class}}</h4>
  477. <div class="description">{{class.teacher}}</div>
  478. </div>
  479. </div>
  480. </div>
  481.  
  482. </div>
  483.  
  484. </div>
  485.  
  486. </div> -->
  487.  
  488.  
  489.  
  490.  
  491.  
  492.  
  493.  
  494.  
  495.  
  496.  
  497.  
  498. <!-- --------------------- -->
  499.  
  500. <!-- <div class="ui center aligned basic segment" *ngIf="(pinnedClasses | async)?.length > 0">
  501. <h3 class="ui violet header">Pinned Classes</h3>
  502. </div> -->
  503.  
  504. <!-- <div class="ui centered grid" style="margin-bottom: 24px;" >
  505.  
  506. <mat-tab-group disableRipple="true" style="min-width: 40vw; max-width: 50vw;">
  507. <mat-tab *ngFor="let class of pinnedClasses | async" label="{{class.className}}">
  508.  
  509. <div class="ui basic segment" style="margin-bottom: 0px;">
  510. <h4 class="ui header" style="margin-top: 2px;">{{class.teacher}}</h4>
  511. </div>
  512.  
  513. <table class="ui selectable table" style="margin-top: 0px;">
  514. <tbody>
  515. <tr *ngFor="let assignment of class.assignmentsObj | orderBy : ['weekDue'] ">
  516. <td class="collapsing">{{assignment.weekDue}}</td>
  517. <td>{{assignment.title}}</td>
  518. <td class="right aligned">{{assignment.type}}</td>
  519. </tr>
  520. </tbody>
  521. </table>
  522.  
  523. <iframe (load)="setCurrentPinnedVariables(class)" style="display: none;"></iframe>
  524.  
  525. </mat-tab>
  526. </mat-tab-group>
  527.  
  528. <div class="ui row" style="padding-top: 0px;" *ngIf="(pinnedClasses | async)?.length > 0">
  529. <button class="ui circular icon button" style="margin-right: 8px;" matTooltip="Unpin class" matTooltipPosition="before" (click)="unpinClass(currentlySelectedPinnedSchool, currentlySelectedPinnedTeacher, currentlySelectedPinnedClass, currentlySelectedPinnedClassUID)"><i class="right floated pin icon" style="transform: rotate(45deg);"></i></button>
  530. <button class="ui circular violet button" (click)="navigateToClass(currentlySelectedPinnedSchool, currentlySelectedPinnedTeacher, currentlySelectedPinnedClass)">View Teacher</button>
  531. </div>
  532.  
  533.  
  534. </div> -->
  535.  
  536.  
  537. <!-- <div class="ui center aligned basic segment" *ngIf="(moderatingClasses | async)?.length > 0">
  538. <h3 class="ui violet header">Moderating Classes</h3>
  539. </div> -->
  540.  
  541. <!-- [ngClass]="color" (mouseover)="color='violet' " (mouseout)="color=none" -->
  542.  
  543. <!-- <div class="ui centered link cards" style="margin-bottom: 32px;">
  544. <div class="card" id="moderatingClasses" *ngFor="let class of moderatingClasses | async; index as i" (click)="navigateToClass(class.school, class.teacher, class.className)">
  545. <div class="content">
  546. <div class="center aligned grid">
  547. <h4 class="header" style="margin-bottom: 8px;">{{class.class}}</h4>
  548. <div class="description">{{class.teacher}}</div>
  549. </div>
  550. </div>
  551. </div>
  552. </div>
  553.  
  554. <div *ngIf="user.userRole == 'super admin' " style="margin-top: 64px;">
  555. <button class="ui button" (click)="openAdminPanel()">Admin Panel</button>
  556. </div> -->
  557.  
  558.  
  559. </ng-template>
  560.  
  561. <!-- </div> -->
  562.  
  563. <!-- <button class="ui button" (click)="testButton()">Test Button</button> -->
  564.  
  565.  
  566.  
  567. <div *ngIf="userExists" style="margin-top: 32px;">
  568.  
  569.  
  570.  
  571. <!-- <div class="ui three cards">
  572.  
  573. <div class="ui card" *ngFor="let class of pinnedClasses | async">
  574. <div class="content">
  575. <i class="right floated pin icon" matTooltip="Unpin class" matTooltipPosition="after" (click)="unpinClass(class.school, class.teacher, class.className, class.classUID)"></i>
  576. <div class="ui grid">
  577. <div class="two column row">
  578. <div class="column">
  579. <div class="ui content">
  580. <h4 class="header" style="margin-bottom: 0px;">{{class.className}}</h4>
  581. <div class="meta">{{class.teacher}}</div>
  582. </div>
  583. </div>
  584. <div class="column">
  585. <button class="ui basic icon button" matTooltip="Syllabus" matTooltipPosition="above"><i class="list icon"></i></button>
  586. <button class="ui basic icon button" matTooltip="Files" matTooltipPosition="above"><i class="folder icon"></i></button>
  587. <button class="ui basic icon button" matTooltip="Links" matTooltipPosition="above"><i class="external icon"></i></button>
  588. </div>
  589. </div>
  590. </div>
  591. <div>
  592. </div>
  593.  
  594.  
  595. <div class="ui list">
  596. <div class="item" *ngFor="let assignment of class.assignmentsObj | orderBy : ['weekDue'] ">
  597. <div class="content">
  598. <table class="ui very basic table">
  599. <tbody>
  600. <tr>
  601. <td>{{assignment.weekDue}}</td>
  602. <td>{{assignment.title}}</td>
  603. <td>{{assignment.type}}</td>
  604. </tr>
  605. </tbody>
  606. </table>
  607.  
  608. </div>
  609. </div>
  610. </div>
  611.  
  612. </div>
  613.  
  614. <div class="ui bottom attached blue button" (click)="navigateToClass(class.school, class.teacher, class.className)">
  615. View Teacher
  616. </div>
  617. </div>
  618.  
  619. </div> -->
  620.  
  621.  
  622. <!-- ------------------------------- -->
  623.  
  624. <!-- <mat-card *ngFor="let class of pinnedClasses | async" style="width: 350px; display: inline-block; margin: 4px; justify-content: center; ">
  625.  
  626. <div class="ui grid">
  627. <div class="thirteen wide column" style="padding: 0px;">
  628. <mat-card-header>
  629. <mat-card-title>
  630. <h4 class="ui header">
  631. {{class.className}}
  632. <div class="sub header">{{class.teacher}}</div>
  633. </h4>
  634. </mat-card-title>
  635. </mat-card-header>
  636. </div>
  637. <div class="one wide column" style="padding: 0px;">
  638. <div class="ui basic right aligned segment" style="padding: 0px; margin-right: -16px;">
  639. <i class="right floated pin icon" style="margin-right: 0px; transform: rotate(45deg);" matTooltip="Unpin class" matTooltipPosition="after" (click)="unpinClass(class.school, class.teacher, class.className, class.classUID)"></i>
  640. </div>
  641. </div>
  642. </div>
  643.  
  644. <mat-card-content style="margin-top: 4px;">
  645. <table class="ui very basic table">
  646. <tbody>
  647. <tr *ngFor="let assignment of class.assignmentsObj | orderBy : ['weekDue'] ">
  648. <td>{{assignment.weekDue}}</td>
  649. <td>{{assignment.title}}</td>
  650. <td>{{assignment.type}}</td>
  651. </tr>
  652. </tbody>
  653. </table>
  654. </mat-card-content>
  655. <mat-card-actions style="padding-top: 0px;">
  656. <button class="ui violet fluid button" (click)="navigateToClass(class.school, class.teacher, class.className)">View Teacher</button>
  657. </mat-card-actions>
  658. </mat-card> -->
  659.  
  660. <!-- ------------------------------- -->
  661.  
  662.  
  663. </div>
  664.  
  665. <!-- <button class="ui button" (click)="showNewUserDialog()">Show New User Dialog</button> -->
  666.  
  667. <!-- <button class="ui button" (click)="asyncTest()">Test Async</button>
  668. <button class="ui button" (click)="updateCounts(null, null, 0)">Test AFS Counts</button>
  669. <button class="ui button" (click)="generateDate()">Generate Today's Date</button> -->
  670. <!-- <div class="ui button" (click)="updateTokenTest()">Update token</div> -->
  671.  
  672. <!-- Current Date: {{ date | date: 'MM/dd/yyyy'}} -->
  673.  
  674. <!-- <div style="margin-top: 100px;"></div>
  675.  
  676. <button class="ui button" (click)="sendAlertTest()">Send Alert</button>
  677. <button class="ui button" (click)="sendAlertTestWithoutSettingMassDelete()">Send Alert WO setting MD</button>
  678.  
  679. <button class="ui button" (click)="doAsync()">Do something async</button> -->
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!