Skip to content
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.

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

[FIX] Large files crashed browser when trying to show preview #6598

Merged
merged 2 commits into from
Apr 5, 2017
Merged
Changes from 1 commit
Commits
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
73 changes: 55 additions & 18 deletions packages/rocketchat-ui/client/lib/fileUpload.coffee
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,31 @@ readAsDataURL = (file, callback) ->

reader.readAsDataURL file

getUploadPreview = (file, callback) ->
if file.file.type.indexOf('audio') > -1 or file.file.type.indexOf('video') > -1 or file.file.type.indexOf('image') > -1
file.type = file.file.type.split('/')[0]

readAsDataURL file.file, (content) ->
callback(file, content)
else
callback(file, null)

formatBytes = (bytes, decimals) ->
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

please change this function's code to tabs

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

fixed 👍

if bytes == 0
return '0 Bytes'
k = 1000
dm = decimals + 1 or 3
sizes = [
'Bytes'
'KB'
'MB'
'GB'
'TB'
'PB'
]
i = Math.floor(Math.log(bytes) / Math.log(k))
parseFloat((bytes / k ** i).toFixed(dm)) + ' ' + sizes[i]

readAsArrayBuffer = (file, callback) ->
reader = new FileReader()
reader.onload = (ev) ->
Expand All @@ -23,29 +48,29 @@ readAsArrayBuffer = (file, callback) ->
swal.close()
return

readAsDataURL file.file, (fileContent) ->
if not RocketChat.fileUploadIsValidContentType file.file.type
swal
title: t('FileUpload_MediaType_NotAccepted')
text: file.file.type || "*.#{s.strRightBack(file.file.name, '.')}"
type: 'error'
timer: 3000
return

if file.file.size is 0
swal
title: t('FileUpload_File_Empty')
type: 'error'
timer: 1000
return
if not RocketChat.fileUploadIsValidContentType file.file.type
swal
title: t('FileUpload_MediaType_NotAccepted')
text: file.file.type || "*.#{s.strRightBack(file.file.name, '.')}"
type: 'error'
timer: 3000
return

if file.file.size is 0
swal
title: t('FileUpload_File_Empty')
type: 'error'
timer: 1000
return

getUploadPreview file, (file, preview) ->
text = ''

if file.type is 'audio'
text = """
<div class='upload-preview'>
<audio style="width: 100%;" controls="controls">
<source src="#{fileContent}" type="audio/wav">
<source src="#{preview}" type="audio/wav">
Your browser does not support the audio element.
</audio>
</div>
Expand All @@ -58,7 +83,7 @@ readAsArrayBuffer = (file, callback) ->
text = """
<div class='upload-preview'>
<video style="width: 100%;" controls="controls">
<source src="#{fileContent}" type="video/webm">
<source src="#{preview}" type="video/webm">
Your browser does not support the video element.
</video>
</div>
Expand All @@ -67,10 +92,22 @@ readAsArrayBuffer = (file, callback) ->
<input id='file-description' style='display: inherit;' value='' placeholder='#{t("Upload_file_description")}'>
</div>
"""
else if file.type is 'image'
text = """
<div class='upload-preview'>
<div class='upload-preview-file' style='background-image: url(#{preview})'></div>
</div>
<div class='upload-preview-title'>
<input id='file-name' style='display: inherit;' value='#{Handlebars._escape(file.name)}' placeholder='#{t("Upload_file_name")}'>
<input id='file-description' style='display: inherit;' value='' placeholder='#{t("Upload_file_description")}'>
</div>
"""
else
fileSize = formatBytes(file.file.size)

text = """
<div class='upload-preview'>
<div class='upload-preview-file' style='background-image: url(#{fileContent})'></div>
<div>#{Handlebars._escape(file.name)} - #{fileSize}</div>
</div>
<div class='upload-preview-title'>
<input id='file-name' style='display: inherit;' value='#{Handlebars._escape(file.name)}' placeholder='#{t("Upload_file_name")}'>
Expand Down