1 files changed, 96 insertions, 0 deletions
diff --git a/settings/js/personal.js b/settings/js/personal.js
index 8ad26c086b5..d9b6836568e 100644
--- a/settings/js/personal.js
+++ b/settings/js/personal.js
@@ -34,6 +34,7 @@ function changeDisplayName(){
                 $('#oldDisplayName').text($('#displayName').val());
                 // update displayName on the top right expand button
                 $('#expandDisplayName').text($('#displayName').val());
+		updateAvatar();
             }
             else{
                 $('#newdisplayname').val(data.data.displayName);
@@ -44,6 +45,76 @@ function changeDisplayName(){
     }
 }
 
+function selectAvatar (path) {
+	$.post(OC.Router.generate('core_avatar_post'), {path: path}, avatarResponseHandler);
+}
+
+function updateAvatar () {
+	$('header .avatardiv').avatar(OC.currentUser, 32);
+	$('#avatar .avatardiv').avatar(OC.currentUser, 128);
+}
+
+function showAvatarCropper() {
+	var $dlg = $('<div class="hidden" id="cropperbox" title="'+t('settings', 'Crop')+'"><img id="cropper" src="'+OC.Router.generate('core_avatar_get_tmp')+'"></div>');
+	$('body').append($dlg);
+
+	$cropperbox = $('#cropperbox');
+	$cropper = $('#cropper');
+
+	$cropper.on('load', function() {
+		$cropperbox.show();
+
+		$cropper.Jcrop({
+			onChange: saveCoords,
+			onSelect: saveCoords,
+			aspectRatio: 1,
+			boxHeight: 500,
+			boxWidth: 500,
+			setSelect: [0, 0, 300, 300]
+		});
+
+		$cropperbox.ocdialog({
+			buttons: [{
+				text: t('settings', 'Crop'),
+				click: sendCropData,
+				defaultButton: true
+			}],
+			close: function(){
+				$(this).remove();
+			}
+		});
+	});
+}
+
+function sendCropData() {
+	var cropperdata = $('#cropper').data();
+	var data = {
+		x: cropperdata.x,
+		y: cropperdata.y,
+		w: cropperdata.w,
+		h: cropperdata.h
+	};
+	$('#cropperbox').remove();
+	$.post(OC.Router.generate('core_avatar_post_cropped'), {crop: data}, avatarResponseHandler);
+}
+
+function saveCoords(c) {
+	$('#cropper').data(c);
+}
+
+function avatarResponseHandler(data) {
+	$warning = $('#avatar .warning');
+	$warning.hide();
+	if (data.status === "success") {
+		updateAvatar();
+	} else if (data.data.message === "notsquare") {
+		showAvatarCropper();
+	} else {
+		$warning.show();
+		$warning.text(data.data.message);
+	}
+}
+
 $(document).ready(function(){
 	$("#passwordbutton").click( function(){
 		if ($('#pass1').val() !== '' && $('#pass2').val() !== '') {
@@ -128,6 +199,31 @@ $(document).ready(function(){
 		}
 	});
 	
+	var uploadparms = {
+		done: function(e, data) {
+			avatarResponseHandler(data.result);
+		}
+	};
+
+	$('#uploadavatarbutton').click(function(){
+		$('#uploadavatar').click();
+	});
+
+	$('#uploadavatar').fileupload(uploadparms);
+
+	$('#selectavatar').click(function(){
+		OC.dialogs.filepicker(t('settings', "Select a profile picture"), selectAvatar, false, "image");
+	});
+
+	$('#removeavatar').click(function(){
+		$.ajax({
+			type:	'DELETE',
+			url:	OC.Router.generate('core_avatar_delete'),
+			success: function(msg) {
+				updateAvatar();
+			}
+		});
+	});
 } );
 
 OC.Encryption = {