changeset 13:b12e78d6185e

Add a component for opening local audio files, unfinished and of course untested. Expect cross-cutting concerns to follow.
author Lucas Thompson <dev@lucas.im>
date Thu, 27 Oct 2016 13:36:09 +0100
parents 1244f556512f
children 2ae70581dafd
files src/app/app.component.html src/app/app.module.ts src/app/audio-file-open/audio-file-open.component.css src/app/audio-file-open/audio-file-open.component.html src/app/audio-file-open/audio-file-open.component.spec.ts src/app/audio-file-open/audio-file-open.component.ts
diffstat 6 files changed, 65 insertions(+), 2 deletions(-) [+]
line wrap: on
line diff
--- a/src/app/app.component.html	Thu Oct 27 10:44:34 2016 +0100
+++ b/src/app/app.component.html	Thu Oct 27 13:36:09 2016 +0100
@@ -3,11 +3,12 @@
   <!-- This fills the remaining space of the current row -->
   <span class="app-toolbar-filler"></span>
 
+
+  <app-audio-file-open></app-audio-file-open>
   <!-- menu opens when trigger button is clicked -->
   <button md-icon-button [md-menu-trigger-for]="menu">
     <md-icon>more_vert</md-icon>
   </button>
-
   <md-menu x-position="before" #menu="mdMenu">
     <button md-menu-item> Settings</button>
     <button md-menu-item> Help</button>
--- a/src/app/app.module.ts	Thu Oct 27 10:44:34 2016 +0100
+++ b/src/app/app.module.ts	Thu Oct 27 13:36:09 2016 +0100
@@ -7,11 +7,13 @@
 import {MailService} from "./mail.service";
 import {MaterialModule} from "@angular/material";
 import { WaveformComponent } from './waveform/waveform.component';
+import { AudioFileOpenComponent } from './audio-file-open/audio-file-open.component';
 
 @NgModule({
   declarations: [
     AppComponent,
-    WaveformComponent
+    WaveformComponent,
+    AudioFileOpenComponent
   ],
   imports: [
     BrowserModule,
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/app/audio-file-open/audio-file-open.component.css	Thu Oct 27 13:36:09 2016 +0100
@@ -0,0 +1,3 @@
+input {
+  display: none;
+}
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/app/audio-file-open/audio-file-open.component.html	Thu Oct 27 13:36:09 2016 +0100
@@ -0,0 +1,4 @@
+<input #open type="file" accept="audio/*" (change)="openAudio($event.srcElement.files)"/>
+<button md-icon-button (click)="openAudioDialog()">
+    <md-icon>folder_open</md-icon>
+</button>
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/app/audio-file-open/audio-file-open.component.spec.ts	Thu Oct 27 13:36:09 2016 +0100
@@ -0,0 +1,28 @@
+/* tslint:disable:no-unused-variable */
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
+import { DebugElement } from '@angular/core';
+
+import { AudioFileOpenComponent } from './audio-file-open.component';
+
+describe('AudioFileOpenComponent', () => {
+  let component: AudioFileOpenComponent;
+  let fixture: ComponentFixture<AudioFileOpenComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ AudioFileOpenComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(AudioFileOpenComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/app/audio-file-open/audio-file-open.component.ts	Thu Oct 27 13:36:09 2016 +0100
@@ -0,0 +1,25 @@
+import {Component, OnInit, ViewChild, ElementRef} from '@angular/core';
+
+@Component({
+  selector: 'app-audio-file-open',
+  templateUrl: './audio-file-open.component.html',
+  styleUrls: ['./audio-file-open.component.css']
+})
+export class AudioFileOpenComponent implements OnInit {
+
+  @ViewChild('open') open: ElementRef;
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+  openAudio(files: FileList) {
+    console.log(files);
+    console.log("open");
+  }
+
+  openAudioDialog() {
+    this.open.nativeElement.click();
+  }
+}