Fix public page crash due to audio player, fix unpause in audio player (#11652)

This commit is contained in:
Eugen Rochko 2019-08-25 02:13:40 +02:00 committed by GitHub
parent aa6b5b42df
commit e72bac7576
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 9 additions and 3 deletions

View file

@ -84,6 +84,7 @@ class Audio extends React.PureComponent {
if (this.wavesurfer) { if (this.wavesurfer) {
this.wavesurfer.destroy(); this.wavesurfer.destroy();
this.loaded = false;
} }
const wavesurfer = WaveSurfer.create({ const wavesurfer = WaveSurfer.create({
@ -100,8 +101,10 @@ class Audio extends React.PureComponent {
if (preload) { if (preload) {
wavesurfer.load(src); wavesurfer.load(src);
this.loaded = true;
} else { } else {
wavesurfer.load(src, arrayOf(1, 0.5), null, duration); wavesurfer.load(src, arrayOf(1, 0.5), null, duration);
this.loaded = false;
} }
wavesurfer.on('ready', () => this.setState({ duration: Math.floor(wavesurfer.getDuration()) })); wavesurfer.on('ready', () => this.setState({ duration: Math.floor(wavesurfer.getDuration()) }));
@ -116,15 +119,18 @@ class Audio extends React.PureComponent {
togglePlay = () => { togglePlay = () => {
if (this.state.paused) { if (this.state.paused) {
if (!this.props.preload) { if (!this.props.preload && !this.loaded) {
this.wavesurfer.createBackend(); this.wavesurfer.createBackend();
this.wavesurfer.createPeakCache(); this.wavesurfer.createPeakCache();
this.wavesurfer.load(this.props.src); this.wavesurfer.load(this.props.src);
this.loaded = true;
} }
this.wavesurfer.play(); this.wavesurfer.play();
this.setState({ paused: false });
} else { } else {
this.wavesurfer.pause(); this.wavesurfer.pause();
this.setState({ paused: true });
} }
} }

View file

@ -33,7 +33,7 @@
= render partial: 'statuses/attachment_list', locals: { attachments: status.media_attachments } = render partial: 'statuses/attachment_list', locals: { attachments: status.media_attachments }
- elsif status.media_attachments.first.audio? - elsif status.media_attachments.first.audio?
- audio = status.media_attachments.first - audio = status.media_attachments.first
= react_component :audio, src: audio.file.url(:original), height: 130, alt: audio.description, preload: true, duration: audio.meta.dig(:original, :duration) do = react_component :audio, src: audio.file.url(:original), height: 130, alt: audio.description, preload: true, duration: audio.file.meta.dig(:original, :duration) do
= render partial: 'statuses/attachment_list', locals: { attachments: status.media_attachments } = render partial: 'statuses/attachment_list', locals: { attachments: status.media_attachments }
- else - else
= react_component :media_gallery, height: 380, sensitive: !current_account&.user&.show_all_media? && status.sensitive? || current_account&.user&.hide_all_media?, standalone: true, 'autoPlayGif': current_account&.user&.setting_auto_play_gif || autoplay, 'reduceMotion': current_account&.user&.setting_reduce_motion, media: status.media_attachments.map { |a| ActiveModelSerializers::SerializableResource.new(a, serializer: REST::MediaAttachmentSerializer).as_json } do = react_component :media_gallery, height: 380, sensitive: !current_account&.user&.show_all_media? && status.sensitive? || current_account&.user&.hide_all_media?, standalone: true, 'autoPlayGif': current_account&.user&.setting_auto_play_gif || autoplay, 'reduceMotion': current_account&.user&.setting_reduce_motion, media: status.media_attachments.map { |a| ActiveModelSerializers::SerializableResource.new(a, serializer: REST::MediaAttachmentSerializer).as_json } do

View file

@ -37,7 +37,7 @@
= render partial: 'statuses/attachment_list', locals: { attachments: status.media_attachments } = render partial: 'statuses/attachment_list', locals: { attachments: status.media_attachments }
- elsif status.media_attachments.first.audio? - elsif status.media_attachments.first.audio?
- audio = status.media_attachments.first - audio = status.media_attachments.first
= react_component :audio, src: audio.file.url(:original), height: 110, alt: audio.description, duration: audio.meta.dig(:original, :duration) do = react_component :audio, src: audio.file.url(:original), height: 110, alt: audio.description, duration: audio.file.meta.dig(:original, :duration) do
= render partial: 'statuses/attachment_list', locals: { attachments: status.media_attachments } = render partial: 'statuses/attachment_list', locals: { attachments: status.media_attachments }
- else - else
= react_component :media_gallery, height: 343, sensitive: !current_account&.user&.show_all_media? && status.sensitive? || current_account&.user&.hide_all_media?, 'autoPlayGif': current_account&.user&.setting_auto_play_gif || autoplay, media: status.media_attachments.map { |a| ActiveModelSerializers::SerializableResource.new(a, serializer: REST::MediaAttachmentSerializer).as_json } do = react_component :media_gallery, height: 343, sensitive: !current_account&.user&.show_all_media? && status.sensitive? || current_account&.user&.hide_all_media?, 'autoPlayGif': current_account&.user&.setting_auto_play_gif || autoplay, media: status.media_attachments.map { |a| ActiveModelSerializers::SerializableResource.new(a, serializer: REST::MediaAttachmentSerializer).as_json } do