summaryrefslogtreecommitdiff
path: root/app
diff options
context:
space:
mode:
authorAlfredo Sumaran <alfredo@gitlab.com>2016-03-17 11:34:21 -0500
committerAlfredo Sumaran <alfredo@gitlab.com>2016-03-17 11:34:21 -0500
commit95cc46a44a2d871fe700ed08850851f863ef2408 (patch)
tree87d99e7c138cf62e98e825cde15f62bf4a87d625 /app
parent7216ce97f748988c644b1baff2ec42006e508fbc (diff)
downloadgitlab-ce-95cc46a44a2d871fe700ed08850851f863ef2408.tar.gz
Allow to set crop box and export image dimensions
Diffstat (limited to 'app')
-rw-r--r--app/assets/javascripts/gl_crop.js.coffee22
1 files changed, 17 insertions, 5 deletions
diff --git a/app/assets/javascripts/gl_crop.js.coffee b/app/assets/javascripts/gl_crop.js.coffee
index 5d5b2c406a3..276e56b4349 100644
--- a/app/assets/javascripts/gl_crop.js.coffee
+++ b/app/assets/javascripts/gl_crop.js.coffee
@@ -6,8 +6,13 @@ class GitLabCrop
# Set defaults
{
@filename
+ @previewImage = $('.avatar-image .avatar')
@form = @fileInput.parents('form')
@modalCrop = '.modal-profile-crop'
+ @exportWidth = 200
+ @exportHeight = 200
+ @cropBoxWidth = 200
+ @cropBoxHeight = 200
# Button where user clicks to open file dialog
# If not passed as argument let's pick a default one
@@ -40,6 +45,7 @@ class GitLabCrop
@fileInput.trigger('click')
onModalShow: =>
+ self = @
@modalCropImg.cropper(
viewMode: 1
center: false
@@ -57,8 +63,8 @@ class GitLabCrop
toggleDragModeOnDblclick: false
built: ->
container = $(@).cropper 'getContainerData'
- cropBoxWidth = 200;
- cropBoxHeight = 200;
+ cropBoxWidth = self.cropBoxWidth;
+ cropBoxHeight = self.cropBoxHeight;
$(@).cropper('setCropBoxData',
width: cropBoxWidth,
@@ -77,8 +83,8 @@ class GitLabCrop
onUploadImageBtnClick: (e) =>
e.preventDefault()
@setBlob()
+ @setPreview()
@modalCrop.modal('hide')
- # @form.submit();
onActionBtnClick: (btn) ->
data = $(btn).data()
@@ -106,9 +112,15 @@ class GitLabCrop
array.push(binary.charCodeAt(k))
new Blob([new Uint8Array(array)], type: 'image/png')
+ setPreview: ->
+ @previewImage.attr('src', @dataURL)
+
setBlob: ->
- dataURL = @modalCropImg.cropper('getCroppedCanvas').toDataURL('image/png')
- @croppedImageBlob = @dataURLtoBlob(dataURL)
+ @dataURL = @modalCropImg.cropper('getCroppedCanvas',
+ width: 200
+ height: 200
+ ).toDataURL('image/png')
+ @croppedImageBlob = @dataURLtoBlob(@dataURL)
getBlob: ->
@croppedImageBlob