Merge pull request #130 from taigaio/us/1212/attachment-max-size

US #1212: Show info about maximun size allowed for the avatar and attachments
stable
Alejandro 2014-10-29 19:51:24 +01:00
commit dcbaf285fd
9 changed files with 87 additions and 22 deletions

View File

@ -6,6 +6,7 @@
- Multiple User stories Drag & Drop in the backlog.
- Add visual difference to closed USs in backlog panel.
- Show crerated date of attachments in the hover of the filename.
- Show info about maximun size allowed for avatar and attachments files.
- Add beta ribbon.
- Support for custom text when inviting users.

View File

@ -72,10 +72,12 @@ class AttachmentsController extends taiga.Controller
@.attachments.push(data)
@rootscope.$broadcast("attachment:create")
promise = promise.then null, (data) ->
promise = promise.then null, (data) =>
@scope.$emit("attachments:size-error") if data.status == 413
index = @.uploadingAttachments.indexOf(attachment)
@.uploadingAttachments.splice(index, 1)
@confirm.notify("error", null, "We have not been able to upload '#{attachment.name}'.")
@confirm.notify("error", "We have not been able to upload '#{attachment.name}'.
#{data.data._error_message}")
return @q.reject(data)
return promise
@ -109,7 +111,8 @@ class AttachmentsController extends taiga.Controller
@.updateCounters()
@rootscope.$broadcast("attachment:edit")
onError = =>
onError = (response) =>
$scope.$emit("attachments:size-error") if response.status == 413
@confirm.notify("error")
return @q.reject()
@ -151,7 +154,7 @@ class AttachmentsController extends taiga.Controller
return not item.is_deprecated
AttachmentsDirective = ($confirm) ->
AttachmentsDirective = ($config, $confirm) ->
template = _.template("""
<section class="attachments">
<div class="attachments-header">
@ -159,7 +162,11 @@ AttachmentsDirective = ($confirm) ->
<span class="attachments-num" tg-bind-html="ctrl.attachmentsCount"></span>
<span class="attachments-text">attachments</span>
</h3>
<div tg-check-permission="modify_<%- type %>" title="Add new attachment" class="add-attach">
<div tg-check-permission="modify_<%- type %>" class="add-attach"
title="Add new attachment. <%- maxFileSizeMsg %>">
<% if (maxFileSize){ %>
<span class="size-info hidden">[Max. size: <%- maxFileSize %>]</span>
<% }; %>
<label for="add-attach" class="icon icon-plus related-tasks-buttons"></label>
<input id="add-attach" type="file" multiple="multiple"/>
</div>
@ -195,7 +202,6 @@ AttachmentsDirective = ($confirm) ->
</div>
</section>""")
link = ($scope, $el, $attrs, $ctrls) ->
$ctrl = $ctrls[0]
$model = $ctrls[1]
@ -222,6 +228,12 @@ AttachmentsDirective = ($confirm) ->
$ctrl.reorderAttachment(attachment, newIndex)
$ctrl.saveAttachments()
showSizeInfo = ->
$el.find(".size-info").removeClass("hidden")
$scope.$on "attachments:size-error", ->
showSizeInfo()
$el.on "change", ".attachments-header input", (event) ->
files = _.toArray(event.target.files)
return if files.length < 1
@ -249,7 +261,16 @@ AttachmentsDirective = ($confirm) ->
$el.off()
templateFn = ($el, $attrs) ->
return template({type: $attrs.type})
maxFileSize = $config.get("maxUploadFileSize", null)
maxFileSize = sizeFormat(maxFileSize) if maxFileSize
maxFileSizeMsg = if maxFileSize then "Maximum upload size is #{maxFileSize}" else "" # TODO: i18n
ctx = {
type: $attrs.type
maxFileSize: maxFileSize
maxFileSizeMsg: maxFileSizeMsg
}
return template(ctx)
return {
require: ["tgAttachments", "ngModel"]
@ -261,7 +282,7 @@ AttachmentsDirective = ($confirm) ->
template: templateFn
}
module.directive("tgAttachments", ["$tgConfirm", AttachmentsDirective])
module.directive("tgAttachments", ["$tgConfig", "$tgConfirm", AttachmentsDirective])
AttachmentDirective = ->

View File

@ -24,7 +24,7 @@ taiga = @.taiga
sizeFormat = @.taiga.sizeFormat
resourceProvider = ($rootScope, $urls, $model, $repo, $auth, $q) ->
resourceProvider = ($rootScope, $config, $urls, $model, $repo, $auth, $q) ->
service = {}
service.list = (urlName, objectId, projectId) ->
@ -38,6 +38,16 @@ resourceProvider = ($rootScope, $urls, $model, $repo, $auth, $q) ->
defered.reject(null)
return defered.promise
maxFileSize = $config.get("maxUploadFileSize", null)
if maxFileSize and file.size > maxFileSize
response = {
status: 413,
data: _error_message: "'#{file.name}' (#{sizeFormat(file.size)}) is too heavy for our oompa
loompas, try it with a smaller than {#{sizeFormat(maxFileSize)})"
}
defered.reject(response)
return defered.promise
uploadProgress = (evt) =>
$rootScope.$apply =>
file.status = "in-progress"
@ -83,5 +93,5 @@ resourceProvider = ($rootScope, $urls, $model, $repo, $auth, $q) ->
module = angular.module("taigaResources")
module.factory("$tgAttachmentsResourcesProvider", ["$rootScope", "$tgUrls", "$tgModel", "$tgRepo", "$tgAuth",
"$q", resourceProvider])
module.factory("$tgAttachmentsResourcesProvider", ["$rootScope", "$tgConfig", "$tgUrls", "$tgModel", "$tgRepo",
"$tgAuth", "$q", resourceProvider])

View File

@ -21,13 +21,26 @@
taiga = @.taiga
sizeFormat = @.taiga.sizeFormat
resourceProvider = ($repo, $http, $urls) ->
resourceProvider = ($config, $repo, $http, $urls, $q) ->
service = {}
service.changeAvatar = (attachmentModel) ->
service.changeAvatar = (file) ->
maxFileSize = $config.get("maxUploadFileSize", null)
if maxFileSize and file.size > maxFileSize
response = {
status: 413,
data: _error_message: "'#{file.name}' (#{sizeFormat(file.size)}) is too heavy for our oompa
loompas, try it with a smaller than {#{sizeFormat(maxFileSize)})"
}
defered = $q.defer()
defered.reject(response)
return defered.promise
data = new FormData()
data.append('avatar', attachmentModel)
data.append('avatar', file)
options = {
transformRequest: angular.identity,
headers: {'Content-Type': undefined}
@ -52,4 +65,5 @@ resourceProvider = ($repo, $http, $urls) ->
module = angular.module("taigaResources")
module.factory("$tgUserSettingsResourcesProvider", ["$tgRepo", "$tgHttp", "$tgUrls", resourceProvider])
module.factory("$tgUserSettingsResourcesProvider", ["$tgConfig", "$tgRepo", "$tgHttp", "$tgUrls", "$q",
resourceProvider])

View File

@ -21,6 +21,7 @@
taiga = @.taiga
mixOf = @.taiga.mixOf
sizeFormat = @.taiga.sizeFormat
module = angular.module("taigaUserSettings")
@ -32,6 +33,7 @@ class UserSettingsController extends mixOf(taiga.Controller, taiga.PageMixin)
@.$inject = [
"$scope",
"$rootScope",
"$tgConfig",
"$tgRepo",
"$tgConfirm",
"$tgResources",
@ -42,11 +44,15 @@ class UserSettingsController extends mixOf(taiga.Controller, taiga.PageMixin)
"$tgAuth"
]
constructor: (@scope, @rootscope, @repo, @confirm, @rs, @params, @q, @location, @navUrls, @auth) ->
constructor: (@scope, @rootscope, @config, @repo, @confirm, @rs, @params, @q, @location, @navUrls, @auth) ->
@scope.sectionName = "User Profile" #i18n
@scope.project = {}
@scope.user = @auth.getUser()
maxFileSize = @config.get("maxUploadFileSize", null)
if maxFileSize
@scope.maxFileSizeMsg = "[Max, size: #{sizeFormat(maxFileSize)}" # TODO: i18n
promise = @.loadInitialData()
promise.then null, @.onInitialDataError.bind(@)
@ -111,6 +117,9 @@ module.directive("tgUserProfile", ["$tgConfirm", "$tgAuth", "$tgRepo", UserProf
UserAvatarDirective = ($auth, $model, $rs, $confirm) ->
link = ($scope, $el, $attrs) ->
showSizeInfo = ->
$el.find(".size-info").removeClass("hidden")
onSuccess = (response) ->
user = $model.make_model("users", response.data)
$auth.setUser(user)
@ -120,6 +129,7 @@ UserAvatarDirective = ($auth, $model, $rs, $confirm) ->
$confirm.notify('success')
onError = (response) ->
showSizeInfo() if response.status == 413
$el.find('.overlay').hide()
$confirm.notify('error', response.data._error_message)

View File

@ -24,9 +24,9 @@ block content
span.icon.icon-spinner
input(type="file", id="avatar-field", class="hidden",
tg-avatar-model="avatarAttachment")
p The image will be cropped to 80x80 size.
a.button.button-green.change Change
p The image will be cropped to 80x80px.<br>
span.size-info.hidden(tg-bo-html="maxFileSizeMsg")
a.button.button-green.change(tg-bo-title="'Change photo. ' + maxFileSizeMsg") Change
a.use-gravatar Use gravatar image
div.data

View File

@ -169,4 +169,8 @@
input {
display: none;
}
span {
@extend %small;
color: $gray-light;
}
}

View File

@ -36,9 +36,13 @@
}
p {
@extend %xsmall;
margin-bottom: 0;
line-height: .8rem;
margin-bottom: .3rem;
text-align: center;
}
span {
@extend %bold;
}
.use-gravatar {
@extend %small;
cursor: pointer;

View File

@ -5,5 +5,6 @@
"publicRegisterEnabled": true,
"feedbackEnabled": true,
"privacyPolicyUrl": null,
"termsOfServiceUrl": null
"termsOfServiceUrl": null,
"maxUploadFileSize": null
}