# Voice Recorder Component

**URL:** https://meta.discourse.org/t/voice-recorder-component/215621
**Category:** Theme component
**Tags:** pavilion
**Created:** [January 22, 2022, 8:43am UTC](https://meta.discourse.org/t/voice-recorder-component/215621 "2022-01-22T08:43:42Z")
**Posts on this page:** 20
**Page:** 1

<div class="post-metadata">

### Author: ![angus](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/angus/32/341715_2.png) [@angus](https://meta.discourse.org/u/angus)
#### Post date: [January 22, 2022, 8:43am UTC](https://meta.discourse.org/t/voice-recorder-component/215621/1 "2022-01-22T08:43:43Z")

</div>

This is a working theme component based on the existing (broken) [voice recording plugin](https://meta.discourse.org/t/voice-recording-plugin/91885). The functionality is the same.

Please make sure you’ve added `mp3` to authorized extensions.

| | | |
| --- | --- | --- |
| 🛠 | **Repository** | [GitHub - paviliondev/discourse-voice-recorder: Add voice recordings to Discourse posts · GitHub](https://github.com/paviliondev/discourse-voice-recorder) |
| ❓ | **Install Guide** | [How to install a theme or theme component](https://meta.discourse.org/t/how-do-i-install-a-theme-or-theme-component/63682) |
| 📖 | **New to Discourse Themes?** | [Beginner’s guide to using Discourse Themes](https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966) |

---

<div class="post-metadata">

### Author: ![Jagster](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jagster/32/192154_2.png) [@Jagster](https://meta.discourse.org/u/Jagster)
#### Post date: [January 22, 2022, 9:30am UTC](https://meta.discourse.org/t/voice-recorder-component/215621/2 "2022-01-22T09:30:20Z")

</div>

15 secs audio recording using iPad wasn’t too successful. After 10 minutes processing I gave up. Now i have an iPhone next to me and it has been processed 10 sec audio now around 5 minutes.

Processors, load and memory of DigitalOcean droplet are totally fine, though. Without any knowledge what is happening it sounds like there will happend nothing. Not even cancel works.

What do you suggest how I start to dig this? Will a recording device send wav or what it is using to server and the component change it to mp3 there using tools of server? If so perhaps I’m missing some tools.

I’m using S3, will that be a problem?

**Edit:**

It is an issue of iPad/iPhone. Using Windows-laptop everything worked just fine.

Same was bothering all recording plugins at Moodle. There must be used some tricks, I really don’t know how, but like using separate recording app and then upload a file.. Things can be changed between iOS-version, though.

Is there some CSS tricks to hide downloading/speed?

---

<div class="post-metadata">

### Author: ![Ivan\_Rapekas](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/ivan_rapekas/32/248924_2.png) [@Ivan\_Rapekas](https://meta.discourse.org/u/Ivan_Rapekas)
#### Post date: [January 22, 2022, 6:10pm UTC](https://meta.discourse.org/t/voice-recorder-component/215621/3 "2022-01-22T18:10:36Z")

</div>

Android 10 has the same issue. Never convert and upload…

---

<div class="post-metadata">

### Author: ![angus](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/angus/32/341715_2.png) [@angus](https://meta.discourse.org/u/angus)
#### Post date: [January 23, 2022, 8:15am UTC](https://meta.discourse.org/t/voice-recorder-component/215621/4 "2022-01-23T08:15:34Z")

</div>

Yes, the existing plugin had the same issues on mobile (when it worked). The only way these issues will be properly addressed is either:

- perhaps using a different javascript library that uses web workers (if you find one, I can switch it in); or
- handling file processing on the backend (the “proper” way).

This theme component is just a direct translation of the existing plugin to a theme component, and adding compatibility updates so it works with the latest Discourse. For a more comprehensive solution this would need to be a funded project and it would take a couple of months.

I made this conversion so the existing users of the plugin could enjoy the same functionality the plugin had 🙂

---

<div class="post-metadata">

### Author: ![Jagster](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jagster/32/192154_2.png) [@Jagster](https://meta.discourse.org/u/Jagster)
#### Post date: [January 23, 2022, 8:49am UTC](https://meta.discourse.org/t/voice-recorder-component/215621/5 "2022-01-23T08:49:16Z")

</div>

For avoiding unnecessary installs and questions should you tell in the description that component is very limited and works only at PCs?

Option to upload an audiofile to processing instead recording shoud not take weeks job, but on otherhand I don’t code.

Well, it is nice from you to do that work. But from my point if view as a free rider you could use your spare time better than giving respiration aid for dead 😉 Sorry.

---

<div class="post-metadata">

### Author: ![hellekin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/hellekin/32/51636_2.png) [@hellekin](https://meta.discourse.org/u/hellekin)
#### Post date: [January 23, 2022, 8:11pm UTC](https://meta.discourse.org/t/voice-recorder-component/215621/6 "2022-01-23T20:11:06Z")

</div>

> [@angus](#):
>
> Please make sure you’ve added `mp3` to authorized extensions.

I’m curious, why `mp3` rather than another sound format like `wav` or `vorbis`?

---

<div class="post-metadata">

### Author: ![Jagster](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jagster/32/192154_2.png) [@Jagster](https://meta.discourse.org/u/Jagster)
#### Post date: [January 24, 2022, 2:20pm UTC](https://meta.discourse.org/t/voice-recorder-component/215621/7 "2022-01-24T14:20:02Z")

</div>

> [@hellekin](#):
>
> why `mp3` rather than another sound format like `wav` or `vorbis` ?

Mostly because of size, when wav is huge. Support for vorbis is limited. MP3s are resonable in sizes and every device and browser supports it.

---

<div class="post-metadata">

### Author: ![hellekin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/hellekin/32/51636_2.png) [@hellekin](https://meta.discourse.org/u/hellekin)
#### Post date: [January 24, 2022, 5:18pm UTC](https://meta.discourse.org/t/voice-recorder-component/215621/8 "2022-01-24T17:18:52Z")

</div>

Yet using `vorbis` would be even more size-efficient. If it could become an option it would be nice 🙂

---

<div class="post-metadata">

### Author: ![Jagster](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jagster/32/192154_2.png) [@Jagster](https://meta.discourse.org/u/Jagster)
#### Post date: [January 24, 2022, 7:23pm UTC](https://meta.discourse.org/t/voice-recorder-component/215621/9 "2022-01-24T19:23:49Z")

</div>

Uploading audio as a file would be even more nicer 🙃

---

<div class="post-metadata">

### Author: ![anon40545810](https://avatars.discourse-cdn.com/v4/letter/a/d26b3c/32.png) [@anon40545810](https://meta.discourse.org/u/anon40545810)
#### Post date: [January 25, 2022, 1:07am UTC](https://meta.discourse.org/t/voice-recorder-component/215621/10 "2022-01-25T01:07:08Z")

</div>

1. I would like to help Discourse by translating plugins in ptbr.
2. There are several plugins that I really like and want to translate in ptbr.
3. As I said earlier, I would like to be a good software developer, one way I thought was to translate plugins in Discourse. I feel that in doing so, I am contributing in some way to Discourse.
4. As I said earlier, I can send a pull request if you guys want and find it interesting.
5. I think Discourse is amazing and the people in it are a great community.
6. I talked about these points of view, as I had commented here on this post: [https://meta.discourse.org/t/voice-recording-plugin](https://meta.discourse.org/t/voice-recording-plugin) - But they said the plugin doesn’t work - old post link. They said here would be the most stable version. So here I am - Hope this helps in some way
7. As far as I know at the moment, `.yml` files can be translated. This is very interesting if you want to support multiple languages, you may have multiple users who want to use your plugin in a native language. About this, I hope to help in some way

#### idea

 ![image](https://global.discourse-cdn.com/meta/original/3X/3/1/3148e3abdb0d0f49279433b6307209c54a4d2fca.png)

##### **ptbr.yml :**

```yaml
ptbr:
  composer:
    composer_audio_upload_button_title: "Record & upload audio file"
  composer_audio_upload:
    button_text: "Record & upload audio"
    title: "Record & upload audio"
  theme_metadata:
    description: "Add your voice to posts"

```

---

<div class="post-metadata">

### Author: ![angus](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/angus/32/341715_2.png) [@angus](https://meta.discourse.org/u/angus)
#### Post date: [January 25, 2022, 1:20am UTC](https://meta.discourse.org/t/voice-recorder-component/215621/11 "2022-01-25T01:20:58Z")

</div>

Fantastic! @keegan is setting up a new translation pipeline for Pavilion that will include this Theme Component, and a number of other Discourse plugins. He can fill you in on the details.

---

<div class="post-metadata">

### Author: ![osioke](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/osioke/32/238946_2.png) [@osioke](https://meta.discourse.org/u/osioke)
#### Post date: [January 25, 2022, 9:08am UTC](https://meta.discourse.org/t/voice-recorder-component/215621/12 "2022-01-25T09:08:19Z")

</div>

This would be an interesting addition along with [chat](https://meta.discourse.org/t/introducing-discourse-chat-pre-alpha/210734), ~~let me share this with the team~~ we are already discussing it but it may not come immediately though.

---

<div class="post-metadata">

### Author: ![anon40545810](https://avatars.discourse-cdn.com/v4/letter/a/d26b3c/32.png) [@anon40545810](https://meta.discourse.org/u/anon40545810)
#### Post date: [January 25, 2022, 5:59pm UTC](https://meta.discourse.org/t/voice-recorder-component/215621/13 "2022-01-25T17:59:44Z")

</div>

@angus

#### Can I submit the pull request?

- So, I was waiting for your answer ;D
- If you allow, please submit the pull request.

---

<div class="post-metadata">

### Author: ![keegan](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/keegan/32/383395_2.png) [@keegan](https://meta.discourse.org/u/keegan)
#### Post date: [January 26, 2022, 2:47am UTC](https://meta.discourse.org/t/voice-recorder-component/215621/14 "2022-01-26T02:47:09Z")

</div>

Hey @anon40545810,

Glad to hear you would like to contribute through translations! 😃

We are moving to using [Crowdin](https://crowdin.com/) for all our [official Pavilion plugins](https://discourse.pluginmanager.org).

To submit translations, you will first need a Crowdin account. You can sign up for one [here](https://accounts.crowdin.com/register). After creating an account you can submit your translations for the voice recorder component by doing the following:

1. Visit Pavilion’s Crowdin Profile [here](https://pavilion.crowdin.com).
2. Select the plugin you would like to translate. In your case, you would select [discourse-voice-recorder](https://pavilion.crowdin.com/discourse-voice-recorder).
3. Select the language you would like to translate for. In your case, you would select [Portuguese, Brazilian](https://pavilion.crowdin.com/discourse-voice-recorder/pt-BR)
4. From here you can click the **Translate All** button.
5. Now you can go ahead and translate! 📖
  - On the left are the strings you can select to translate.
  - You can enter the translations in the text field in the center and click save once you are complete.

Please feel free to DM me (@keegan) if you have any questions 🙂

---

<div class="post-metadata">

### Author: ![anon40545810](https://avatars.discourse-cdn.com/v4/letter/a/d26b3c/32.png) [@anon40545810](https://meta.discourse.org/u/anon40545810)
#### Post date: [January 26, 2022, 3:31am UTC](https://meta.discourse.org/t/voice-recorder-component/215621/15 "2022-01-26T03:31:48Z")

</div>

Thank you so much for the feedback ;D

---

<div class="post-metadata">

### Author: ![anon40545810](https://avatars.discourse-cdn.com/v4/letter/a/d26b3c/32.png) [@anon40545810](https://meta.discourse.org/u/anon40545810)
#### Post date: [April 21, 2022, 2:42pm UTC](https://meta.discourse.org/t/voice-recorder-component/215621/18 "2022-04-21T14:42:20Z")

</div>

@angus @keegan

As promised - ptbr translations completed:

- Layouts
- Voice Recorder
- Custom Wizard
- Tickets
- Legal Tools
- Multilingual
- Journal
- Mentionables
- Ratings
- Locations

here: [Crowdin Enterprise](https://pavilion.crowdin.com/u/projects/17)

---

<div class="post-metadata">

### Author: ![angus](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/angus/32/341715_2.png) [@angus](https://meta.discourse.org/u/angus)
#### Post date: [April 21, 2022, 2:44pm UTC](https://meta.discourse.org/t/voice-recorder-component/215621/19 "2022-04-21T14:44:25Z")

</div>

Thank you! We’ll get those in post haste.

---

<div class="post-metadata">

### Author: ![jimkleiber](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jimkleiber/32/121814_2.png) [@jimkleiber](https://meta.discourse.org/u/jimkleiber)
#### Post date: [May 14, 2022, 5:07pm UTC](https://meta.discourse.org/t/voice-recorder-component/215621/20 "2022-05-14T17:07:39Z")

</div>

I stumbled on this js library but I’m not sure if it would work or be easy to substitute in:

[https://github.com/higuma/web-audio-recorder-js](https://github.com/higuma/web-audio-recorder-js)

But I figured I’d document it here in case anyone was interested in trying.

Edit: this one may be even better because it also has an option for video and screen recording. The only challenge may be that it records to wav or ogg, not mp3, but says there may an easy way to convert wav to mp3 with a different library:

[https://github.com/muaz-khan/RecordRTC](https://github.com/muaz-khan/RecordRTC)

---

<div class="post-metadata">

### Author: ![Aizada\_M](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/aizada_m/32/352050_2.png) [@Aizada\_M](https://meta.discourse.org/u/Aizada_M)
#### Post date: [October 31, 2022, 5:28am UTC](https://meta.discourse.org/t/voice-recorder-component/215621/21 "2022-10-31T05:28:39Z")

</div>

Hello. When installing this component, I got the following error.  
 ![image](https://global.discourse-cdn.com/meta/original/4X/1/2/f/12fd37995dffa3ae95626a0b33d0ecc445e2661b.png)

Sorry, I’m not a programmer and I don’t understand this. Can I set up something myself in my Discourse or do I need to involve a specialist?

---

<div class="post-metadata">

### Author: ![Jagster](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jagster/32/192154_2.png) [@Jagster](https://meta.discourse.org/u/Jagster)
#### Post date: [October 31, 2022, 8:31am UTC](https://meta.discourse.org/t/voice-recorder-component/215621/22 "2022-10-31T08:31:25Z")

</div>

No, you don’t need anykind specialist. There is minor bug in localization, aka. translation, and it doesn’t mean anything.

Plus this component is more or less just a demo than a production tool. You (and yours users) should do audio more basic way: use your devices (mobile, audio recorder, deskop, what ever) and upload that file normally.

In general nothing is as badly supported as audio. Thinking the rise of podcasts it is a bit strange situation. iPhones doesn’t natively support even MP3 (AFAIK) and you don’t have too many options to stream your audio files.

[Next page](https://meta.discourse.org/t/voice-recorder-component/215621.md?page=2)
