diff --git a/src/app/app.component.html b/src/app/app.component.html
index b9cddfc..252ed1a 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -19,28 +19,28 @@
 </main>
 <footer>
     <mat-toolbar class="footer">
-      <button mat-icon-button (click)="previousItem()">
+      <button mat-icon-button (click)="previousItem()" matTooltip="Previous item">
         <mat-icon>first_page</mat-icon>
       </button>
-      <button mat-icon-button (click)="nextItem()">
+      <button mat-icon-button (click)="nextItem()" matTooltip="Next item">
         <mat-icon>last_page</mat-icon>
       </button>
-      <button mat-icon-button (click)="previousSlide()">
+      <button mat-icon-button (click)="previousSlide()" matTooltip="Previous slide">
         <mat-icon>navigate_before</mat-icon>
       </button>
-      <button mat-icon-button (click)="nextSlide()">
+      <button mat-icon-button (click)="nextSlide()" matTooltip="Next slide">
         <mat-icon>navigate_next</mat-icon>
       </button>
-      <button mat-icon-button (click)="blankDisplay()" class="displayButton" [class.active]="state.blank" [disabled]="state.blank">
+      <button mat-icon-button (click)="blankDisplay()" class="displayButton" [class.active]="state.blank" [disabled]="state.blank" matTooltip="Show black">
         <mat-icon>videocam_off</mat-icon>
       </button>
-      <button mat-icon-button (click)="themeDisplay()" class="displayButton" [class.active]="state.theme" [disabled]="state.theme">
+      <button mat-icon-button (click)="themeDisplay()" class="displayButton" [class.active]="state.theme" [disabled]="state.theme" matTooltip="Show background">
         <mat-icon>wallpaper</mat-icon>
       </button>
-      <button mat-icon-button (click)="desktopDisplay()" class="displayButton" [class.active]="state.display" [disabled]="state.display">
+      <button mat-icon-button (click)="desktopDisplay()" class="displayButton" [class.active]="state.display" [disabled]="state.display" matTooltip="Show Desktop">
         <mat-icon>desktop_windows</mat-icon>
       </button>
-      <button mat-icon-button (click)="showDisplay()" class="displayButton" [class.active]="state.display" [disabled]="state.live()">
+      <button mat-icon-button (click)="showDisplay()" class="displayButton" [class.active]="state.display" [disabled]="state.live()" matTooltip="Show Presentation">
         <mat-icon>videocam</mat-icon>
       </button>
     </mat-toolbar>
diff --git a/src/app/app.component.spec.ts b/src/app/app.component.spec.ts
deleted file mode 100644
index bcbdf36..0000000
--- a/src/app/app.component.spec.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { TestBed, async } from '@angular/core/testing';
-import { AppComponent } from './app.component';
-describe('AppComponent', () => {
-  beforeEach(async(() => {
-    TestBed.configureTestingModule({
-      declarations: [
-        AppComponent
-      ],
-    }).compileComponents();
-  }));
-  it('should create the app', async(() => {
-    const fixture = TestBed.createComponent(AppComponent);
-    const app = fixture.debugElement.componentInstance;
-    expect(app).toBeTruthy();
-  }));
-  it(`should have as title 'app'`, async(() => {
-    const fixture = TestBed.createComponent(AppComponent);
-    const app = fixture.debugElement.componentInstance;
-    expect(app.title).toEqual('app');
-  }));
-  it('should render title in a h1 tag', async(() => {
-    const fixture = TestBed.createComponent(AppComponent);
-    fixture.detectChanges();
-    const compiled = fixture.debugElement.nativeElement;
-    expect(compiled.querySelector('h1').textContent).toContain('Welcome to app!');
-  }));
-});
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 52aea3c..cd7ae25 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -12,6 +12,7 @@ import {MatFormFieldModule} from '@angular/material/form-field';
 import {MatSelectModule} from '@angular/material/select';
 import {MatButtonModule} from '@angular/material/button';
 import {MatInputModule} from '@angular/material';
+import {MatTooltipModule} from '@angular/material/tooltip';
 
 
 import { AppComponent } from './app.component';
@@ -46,7 +47,8 @@ import { FormsModule } from '@angular/forms';
     MatFormFieldModule,
     MatSelectModule,
     MatButtonModule,
-    MatInputModule
+    MatInputModule,
+    MatTooltipModule
   ],
   providers: [
     OpenLPService
diff --git a/src/app/openlp.service.ts b/src/app/openlp.service.ts
index 80ec3df..3dcd0b6 100644
--- a/src/app/openlp.service.ts
+++ b/src/app/openlp.service.ts
@@ -41,11 +41,11 @@ export class OpenLPService {
   }
 
   getItemSlides(): Observable<Slide[]> {
-    return this.http.get<Slide[]>('http://localhost:4316/controller/live/text');
+    return this.http.get<Slide[]>(`${this.apiURL}/controller/live/text`);
   }
 
   getServiceItems(): Observable<ServiceItem[]> {
-    return this.http.get<ServiceItem[]>('http://localhost:4316/service/list');
+    return this.http.get<ServiceItem[]>(`${this.apiURL}/service/list`);
   }
 
   sendItemLive(plugin, id) {}