NickLusson opened a new issue #172:
URL: https://github.com/apache/cordova-plugin-media-capture/issues/172
<!--
Please have a look at the issue templates you get when you click "New issue"
in the GitHub UI.
We very much prefer issues created by using one of these templates.
-->
### Issue Type
<!-- Please check the boxes by putting an x in the [ ] like so: [x] -->
- [ ] Bug Report
- [ x ] Feature Request
- [ x ] Support Question
## Description
When you press the capture audio button it first asks for permission to use
the microphone, then it opens the microphone in a full screen that covers the
statements that I would like to be read, so the user can record but cannot see
the statements they are supposed to read into the microphone.
## Information
here is some code showing the issue, first the html showing 3 statements
that I would like the user to record, and the capture audio button, and then
the ts file:
here is the html
### Command or Code
<!-- What command or code is needed to reproduce the problem? -->
<ion-content>
<ion-grid>
<ion-row>
<ion-col>
<h1 class="ion-text-center">Record these statments</h1><br>
<p class="ion-text-center">
Go somewhere quiet.. and record these statements with as much
enthusiasim as you can!
</p>
1. I am worthy of success. I am worthy of peace.<br><br>
2. I accept myself as I am. I love myself as I am. I release all
limiting thoughts. I honor myself always.<br><br>
3. I am fearless. I am Powerful.<br><br>
<div class="ion-text-center">
<ion-button color="danger" (click)="captureAudio()">
<ion-icon name="mic"></ion-icon>Capture
Audio</ion-button>
</div>
<ion-list style="background-color:#f0f0f0">
<ion-radio-group value="1" required id="recordingradio">
<ion-item *ngFor="let file of mediaFiles" tappable
(click)="play(file)" text-wrap>
My Recording
<ion-radio id="recording" name="recording" required
value="1"></ion-radio><br><br><br>
<ion-button slot="end" color="success" href="/results"
id="submit">
<ion-icon name="arrow-forward-circle"
slot="start"></ion-icon>Continue</ion-button>
</ion-item>
</ion-radio-group>
</ion-list>
</ion-col>
</ion-row>
</ion-grid>
</ion-content>
Here is the .ts file
import { Component, OnInit, ViewChild } from '@angular/core';
import { NavController } from '@ionic/angular';
import { MediaCapture, MediaFile, CaptureError, CaptureVideoOptions } from
'@ionic-native/media-capture/ngx';
import { Storage } from '@ionic/storage';
import { Media, MediaObject } from '@ionic-native/media/ngx';
import { File } from '@ionic-native/file/ngx';
const MEDIA_FILES_KEY = 'mediaFiles';
@Component({
selector: 'app-confidence2',
templateUrl: './confidence2.page.html',
styleUrls: ['./confidence2.page.scss'],
})
export class Confidence2Page implements OnInit {
mediaFiles = []
constructor(public navCtrl: NavController, private mediaCapture:
MediaCapture, private storage: Storage, private media: Media, private file:
File) {}
ionViewDidLoad() {
this.storage.get(MEDIA_FILES_KEY).then(res => {
this.mediaFiles = JSON.parse(res) || [];
});
}
captureAudio(){
this.mediaCapture.captureAudio().then(res => {
this.storeMediaFiles(res);
}, (err: CaptureError) => console.error(err));
}
play(myFile) {
if (myFile.name.indexOf('wav.') > -1) {
const audioFile: MediaObject = this.media.create(myFile.localURL);
audioFile.play();
} else {
let path = this.file.dataDirectory + myFile.name;
let url = path.replace(/file^\/\//, '');
}
}
storeMediaFiles(files) {
console.log('store: ', files);
this.storage.get(MEDIA_FILES_KEY).then(res => {
if (res) {
let arr = JSON.parse(res);
arr = arr.concat(files);
this.storage.set(MEDIA_FILES_KEY, JSON.stringify(arr));
} else {
this.storage.set(MEDIA_FILES_KEY, JSON.stringify(files))
}
this.mediaFiles = this.mediaFiles.concat(files);
})
}
ngOnInit() {
}
}<!-- Include all relevant information that might help understand and
reproduce the problem -->
### Environment, Platform, Device
<!-- In what environment, on what platform or on which device are you
experiencing the issue? -->
Android Device
### Version information
<!--
What are relevant versions you are using?
For example:
Cordova: Cordova CLI, Cordova Platforms, Cordova Plugins
Other Frameworks: Ionic Framework and CLI version
Operating System, Android Studio, Xcode etc.
-->
ionic 6.9.1
cordova 9.0.0 ([email protected])
plugins:
cordova-plugin-device 2.0.2 "Device"
cordova-plugin-file 6.0.2 "File"
cordova-plugin-ionic-keyboard 2.2.0 "cordova-plugin-ionic-keyboard"
cordova-plugin-ionic-webview 4.2.1 "cordova-plugin-ionic-webview"
cordova-plugin-media 5.0.3 "Media"
cordova-plugin-media-capture 3.0.3 "Capture"
cordova-plugin-nativeaudio 3.0.9 "Cordova Native Audio"
cordova-plugin-nativestorage 2.3.2 "NativeStorage"
cordova-plugin-splashscreen 5.0.2 "Splashscreen"
cordova-plugin-statusbar 2.4.2 "StatusBar"
cordova-plugin-whitelist 1.3.3 "Whitelist"
## Checklist
<!-- Please check the boxes by putting an `x` in the `[ ]` like so: `[x]` -->
- [ x ] I searched for already existing GitHub issues about this
- [ x ] I updated all Cordova tooling to their most recent version
- [ x ] I included all the necessary information above
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
