Skip to content

[FIX] Audio message recording issues #13486

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
ggazzo merged 17 commits into from
Mar 12, 2019
Merged

[FIX] Audio message recording issues #13486

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
17 commits
Select commit Hold shift + click to select a range
646192e
Isolate audio message recording from uploading
tassoevan Feb 14, 2019
f99ec6b
Disable audio message when another room started the recording
tassoevan Feb 14, 2019
08c6fb6
Ádd time helper in audio message
tassoevan Feb 14, 2019
a035de7
Remove unnecessary RoomManager references
tassoevan Feb 14, 2019
fdcb922
Refactor AudioRecorder
tassoevan Feb 14, 2019
59a3961
Fix audio message recording interval clean up
tassoevan Feb 14, 2019
c0046d5
Refactor Recorder as AudioEncoder
tassoevan Feb 15, 2019
d99f36a
Rewrite web worker for MP3 encoding
tassoevan Feb 15, 2019
48bda5b
Update LAME encoder script
tassoevan Feb 15, 2019
ace849c
Merge branch 'develop' into fix/audio-message
tassoevan Feb 15, 2019
2ec3f2a
Merge branch 'develop' into fix/audio-message
tassoevan Mar 8, 2019
1ef5e9c
Export web worker assets from rocketchat-ui package
tassoevan Mar 8, 2019
98a5b0b
Fix wrong imports
tassoevan Mar 11, 2019
eee6889
Merge branch 'develop' into fix/audio-message
tassoevan Mar 11, 2019
7dcdcfb
Fix bug on applyFormatting()
tassoevan Mar 12, 2019
f85958a
Merge branch 'develop' into fix/audio-message
tassoevan Mar 12, 2019
68dd85c
Readapt some tests
tassoevan Mar 12, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 2 additions & 3 deletions .eslintignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,12 +13,11 @@ packages/rocketchat_theme/client/minicolors/jquery.minicolors.js
packages/rocketchat_theme/client/vendor/
packages/rocketchat-ui/client/lib/customEventPolyfill.js
packages/rocketchat-ui/client/lib/Modernizr.js
packages/rocketchat-ui/client/lib/recorderjs/recorder.js
packages/rocketchat-ui/client/public/mp3-realtime-worker.js
packages/rocketchat-ui/client/public/lame.min.js
packages/rocketchat-videobridge/client/public/external_api.js
packages/tap-i18n/lib/tap_i18next/tap_i18next-1.7.3.js
private/moment-locales/
public/livechat/
public/mp3-realtime-worker.js
public/lame.min.js
!.scripts
!packages/rocketchat-livechat/.app
2 changes: 1 addition & 1 deletion packages/rocketchat-ui-message/client/messageBox.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@
</span>
{{else}}
{{#if isAudioMessageAllowed}}
{{> messageBoxAudioMessage}}
{{> messageBoxAudioMessage rid=_id}}
{{/if}}
<span class="rc-message-box__action-menu" data-desktop>
{{#if actions}}
Expand Down
21 changes: 13 additions & 8 deletions packages/rocketchat-ui-message/client/messageBox.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,14 +3,20 @@ import { ReactiveVar } from 'meteor/reactive-var';
import { Session } from 'meteor/session';
import { Template } from 'meteor/templating';
import { Tracker } from 'meteor/tracker';
import { settings } from 'meteor/rocketchat:settings';
import { Markdown } from 'meteor/rocketchat:markdown';
import { EmojiPicker } from 'meteor/rocketchat:emoji';
import { KonchatNotification, fileUpload, chatMessages, ChatMessages } from 'meteor/rocketchat:ui';
import { RoomManager, popover, messageBox, Layout } from 'meteor/rocketchat:ui-utils';
import { katex } from 'meteor/rocketchat:katex';
import { Markdown } from 'meteor/rocketchat:markdown';
import { ChatSubscription } from 'meteor/rocketchat:models';
import { settings } from 'meteor/rocketchat:settings';
import {
AudioRecorder,
ChatMessages,
chatMessages,
fileUpload,
KonchatNotification,
} from 'meteor/rocketchat:ui';
import { Layout, messageBox, popover, RoomManager } from 'meteor/rocketchat:ui-utils';
import { t, roomTypes, getUserPreference } from 'meteor/rocketchat:utils';
import { katex } from 'meteor/rocketchat:katex';
import moment from 'moment';
import './messageBoxReplyPreview';
import './messageBoxTyping';
Expand Down Expand Up @@ -85,7 +91,7 @@ const formattingButtons = [

function applyFormatting(event, instance) {
event.preventDefault();
const { input } = instance;
const { input } = chatMessages[RoomManager.openedRoom];
const { selectionEnd = input.value.length, selectionStart = 0 } = input;
const initText = input.value.slice(0, selectionStart);
const selectedText = input.value.slice(selectionStart, selectionEnd);
Expand Down Expand Up @@ -226,8 +232,7 @@ Template.messageBox.helpers({
return !Template.instance().sendIconDisabled.get();
},
isAudioMessageAllowed() {
return (navigator.mediaDevices || navigator.getUserMedia || navigator.webkitGetUserMedia ||
navigator.mozGetUserMedia || navigator.msGetUserMedia) &&
return AudioRecorder.isSupported() &&
settings.get('FileUpload_Enabled') &&
settings.get('Message_AudioRecorderEnabled') &&
(!settings.get('FileUpload_MediaTypeWhiteList') ||
Expand Down
18 changes: 9 additions & 9 deletions packages/rocketchat-ui-message/client/messageBoxAudioMessage.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,19 +1,19 @@
<template name="messageBoxAudioMessage">
<div class="rc-message-box__audio-message">
<div class="rc-message-box__icon cross js-audio-message-cross">
<template name="messageBoxAudioMessage" args="rid">
<div class="rc-message-box__audio-message {{stateClass}}">
<div class="rc-message-box__icon rc-message-box__audio-message-cancel js-audio-message-cancel">
{{> icon block="rc-input__icon-svg" icon="circle-cross"}}
</div>
<div class="rc-message-box__timer-box">
<p class="rc-message-box__timer-dot">&bull;&nbsp;</p>
<span class="rc-message-box__timer">00:00</span>
<div class="rc-message-box__audio-message-timer">
<span class="rc-message-box__audio-message-timer-dot"></span>
<span class="rc-message-box__audio-message-timer-text">{{time}}</span>
</div>
<div class="rc-message-box__icon check js-audio-message-check">
<div class="rc-message-box__icon rc-message-box__audio-message-done js-audio-message-done">
{{> icon block="rc-input__icon-svg" icon="checkmark-circled"}}
</div>
<div class="rc-message-box__icon mic active js-audio-message-record">
<div class="rc-message-box__icon rc-message-box__audio-message-mic js-audio-message-record">
{{> icon block="rc-input__icon-svg" icon="mic"}}
</div>
<div class="rc-message-box__icon loading js-audio-message-loading">
<div class="rc-message-box__icon rc-message-box__audio-message-loading js-audio-message-loading">
{{> icon block="rc-input__icon-svg" icon="loading"}}
</div>
</div>
Expand Down
Loading