From 447dd6eddf92f1eb2af1b9df3e3bb6deb4b3ca6a Mon Sep 17 00:00:00 2001
From: Paulina Nogal <pnogal@wisc.edu>
Date: Wed, 5 Dec 2018 18:39:09 +0000
Subject: [PATCH] Tooltips for note icons

---
 .../dialogs/notes-dialog/notes-dialog.component.html      | 8 ++++----
 .../term-container/term-container.component.html          | 2 +-
 src/app/shared/shared.module.ts                           | 4 +++-
 3 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/app/degree-planner/dialogs/notes-dialog/notes-dialog.component.html b/src/app/degree-planner/dialogs/notes-dialog/notes-dialog.component.html
index 955e529..c338c6d 100644
--- a/src/app/degree-planner/dialogs/notes-dialog/notes-dialog.component.html
+++ b/src/app/degree-planner/dialogs/notes-dialog/notes-dialog.component.html
@@ -1,6 +1,6 @@
 <mat-toolbar color="primary" class="dialog-toolbar">
     <h2 class="dialog-toolbar-title">{{ id ? 'Edit' : 'Add' }} Note</h2>
-    <button mat-button mat-dialog-close class="close-btn"><i class="material-icons">clear</i></button>
+    <button mat-button mat-dialog-close class="close-btn" aria-label="Close note dialog"><i class="material-icons">clear</i></button>
 </mat-toolbar>
 
 <mat-dialog-content id="note-dialog" class="mat-typography dialog-with-toolbar">
@@ -15,8 +15,8 @@
 			</mat-dialog-content>
 		</div>
 		<mat-dialog-actions align="end">
-			<button mat-button class="btn-secondary" mat-dialog-close>Cancel</button>
-			<button mat-raised-button id="saveNote" class="btn-primary mat-button" (click)="saveNote()" [disabled]="!note || note.length > 512">Save</button>
+			<button mat-button class="btn-secondary" mat-dialog-close aria-label="Close note dialog">Cancel</button>
+			<button mat-raised-button id="saveNote" class="btn-primary mat-button" (click)="saveNote()" [disabled]="!note || note.length > 512" aria-label="Save note for selected term and close dialog">Save</button>
 		</mat-dialog-actions>
 
 		<div id="delete-note-section" *ngIf="id">
@@ -25,7 +25,7 @@
 				<p>Once the note is deleted, there is no going back.</p>
 			</div>
 			<mat-dialog-actions align="end">
-				<button mat-raised-button class="btn-delete mat-button" (click)="removeNote()" mat-dialog-close>Delete</button>
+				<button mat-raised-button class="btn-delete mat-button" (click)="removeNote()" mat-dialog-close aria-label="Delete note from selected term">Delete</button>
 			</mat-dialog-actions>
 		</div>
 	</div>
diff --git a/src/app/degree-planner/term-container/term-container.component.html b/src/app/degree-planner/term-container/term-container.component.html
index c849747..63e6628 100644
--- a/src/app/degree-planner/term-container/term-container.component.html
+++ b/src/app/degree-planner/term-container/term-container.component.html
@@ -5,7 +5,7 @@
             <div fxLayout="row" fxLayoutAlign="end center">
                 <p class="text-right semi-bold credits">{{getTotalCredits()}} Cr</p>
                 <button mat-icon-button>
-                    <mat-icon aria-label="Term notes" class="add-note-icon" (click)="openNotesDialog()">{{ noteForTerm() ? 'insert_drive_file' :'note_add' }}</mat-icon>
+                    <mat-icon aria-label="Open dialog with notes in this term" class="add-note-icon" (click)="openNotesDialog()" [matTooltip]="noteForTerm() ? 'Edit Note' : 'Add Note'" matTooltipPosition="above">{{ noteForTerm() ? 'insert_drive_file' : 'note_add' }}</mat-icon>
                 </button>
             </div>
         </div>
diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts
index 53c3941..c09a08e 100644
--- a/src/app/shared/shared.module.ts
+++ b/src/app/shared/shared.module.ts
@@ -14,6 +14,7 @@ import { MatExpansionModule } from '@angular/material/expansion';
 import { MatToolbarModule } from '@angular/material/toolbar';
 import { MatDialogModule } from '@angular/material/dialog';
 import { MatInputModule } from '@angular/material/input';
+import { MatTooltipModule } from '@angular/material/tooltip';
 
 import { GetTermDescriptionPipe } from './get-term-description.pipe';
 import { AcademicYearStatePipe } from './academic-year-state.pipe';
@@ -34,7 +35,8 @@ const modules = [
 	MatSidenavModule,
 	MatToolbarModule,
 	MatDialogModule,
-	MatInputModule
+	MatInputModule,
+	MatTooltipModule
 ];
 
 @NgModule({
-- 
GitLab