From 4cc60b3755ad0aa45167ed3bb48b1c71f5aed4f5 Mon Sep 17 00:00:00 2001
From: jgerstbe <jannikanni.jg@gmail.com>
Date: Fri, 30 Oct 2020 19:13:49 +0100
Subject: [PATCH] [U] input-manager: hide selects via input parameter

---
 .../input-manager.component.html              | 30 +++++++++++--------
 .../input-manager/input-manager.component.ts  |  1 +
 src/app/recorder/recorder.component.html      |  2 +-
 3 files changed, 20 insertions(+), 13 deletions(-)

diff --git a/src/app/input-manager/input-manager.component.html b/src/app/input-manager/input-manager.component.html
index 57c27b3..3c756a6 100644
--- a/src/app/input-manager/input-manager.component.html
+++ b/src/app/input-manager/input-manager.component.html
@@ -1,15 +1,21 @@
 <video id="localVideo" autoplay muted></video>
 
-<div class="form-group">
-    <label for="audioSource">Audio input source: </label>
-    <select class="form-control" id="audioSource" (change)="start()"></select>
-</div>
 
-<!-- <div class="select">
-    <label for="audioOutput">Audio output destination: </label><select id="audioOutput" (change)="changeAudioDestination()"></select>
-</div> -->
-
-<div class="form-group">
-    <label for="videoSource">Video source: </label>
-    <select class="form-control" id="videoSource" (change)="start()"></select>
-</div>
+<details [open]="detailsOpen">
+    <summary>
+        Settings:
+    </summary>
+    <div class="form-group">
+        <label for="audioSource">Audio input source: </label>
+        <select class="form-control" id="audioSource" (change)="start()"></select>
+    </div>
+    
+    <!-- <div class="select">
+        <label for="audioOutput">Audio output destination: </label><select id="audioOutput" (change)="changeAudioDestination()"></select>
+    </div> -->
+    
+    <div class="form-group">
+        <label for="videoSource">Video source: </label>
+        <select class="form-control" id="videoSource" (change)="start()"></select>
+    </div>
+</details> 
diff --git a/src/app/input-manager/input-manager.component.ts b/src/app/input-manager/input-manager.component.ts
index b9023f5..6eb94f8 100644
--- a/src/app/input-manager/input-manager.component.ts
+++ b/src/app/input-manager/input-manager.component.ts
@@ -6,6 +6,7 @@ import { AfterViewInit, Component, EventEmitter, Input, Output } from '@angular/
   styleUrls: ['./input-manager.component.scss']
 })
 export class InputManagerComponent implements AfterViewInit {
+  @Input() detailsOpen: boolean = true;
   @Output() streamOutput: EventEmitter<MediaStream> = new EventEmitter();
   stream: MediaStream;
   videoElement:any = document.querySelector('#localVideo');
diff --git a/src/app/recorder/recorder.component.html b/src/app/recorder/recorder.component.html
index f4307dc..75275f6 100644
--- a/src/app/recorder/recorder.component.html
+++ b/src/app/recorder/recorder.component.html
@@ -23,7 +23,7 @@
         </span>
     </div>
     <div class="modal-body d-flex flex-column">
-        <app-input-manager (streamOutput)="handleStreamChange($event)"></app-input-manager>
+        <app-input-manager (streamOutput)="handleStreamChange($event)" [detailsOpen]="false"></app-input-manager>
         <button *ngIf="!isRecording" class="btn btn-success mt-2" (click)="startRecording()">
             <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                 <path