Nemcio/NodeBB
1
0
Fork 0
mirror of https://github.com/NodeBB/NodeBB.git synced 2026-01-04 14:50:47 +01:00
Code Issues Packages Projects Releases Wiki Activity

parse picture modals when needed

Browse Source 
https://github.com/NodeBB/nodebb-theme-persona/issues/161
This commit is contained in:
barisusakli
2015-10-03 18:36:50 -04:00
parent 848a14d861
commit f4c5d3e159
1 changed files with 96 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files

187
public/src/client/account/edit.js
View File

@@ -29,12 +29,10 @@ define('forum/account/edit', ['forum/account/header', 'uploader', 'translator'],
handleImageChange();
handleAccountDelete();
handleImageUpload();
handleEmailConfirm();
handlePasswordChange();
updateSignature();
updateAboutMe();
updateImages();
};
function updateProfile() {
@@ -68,7 +66,7 @@ define('forum/account/edit', ['forum/account/header', 'uploader', 'translator'],
if (data.userslug) {
var oldslug = $('.account-username-box').attr('data-userslug');
$('.account-username-box a').each(function(index) {
$('.account-username-box a').each(function() {
$(this).attr('href', $(this).attr('href').replace(oldslug, data.userslug));
});
@@ -104,50 +102,79 @@ define('forum/account/edit', ['forum/account/header', 'uploader', 'translator'],
}
function handleImageChange() {
function selectImageType(type) {
$('#gravatar-box .fa-check').toggle(type === 'gravatar');
$('#uploaded-box .fa-check').toggle(type === 'uploaded');
selectedImageType = type;
}
$('#changePictureBtn').on('click', function() {
selectedImageType = '';
updateImages();
templates.parse('partials/modals/change_picture_modal', {uploadedpicture: uploadedPicture}, function(html) {
translator.translate(html, function(html) {
function updateImages() {
var currentPicture = $('#user-current-picture').attr('src');
$('#change-picture-modal').modal('show');
$('#change-picture-modal').removeClass('hide');
if (gravatarPicture) {
modal.find('#user-gravatar-picture').attr('src', gravatarPicture);
}
if (uploadedPicture) {
modal.find('#user-uploaded-picture').attr('src', uploadedPicture);
}
modal.find('#gravatar-box').toggle(!!gravatarPicture);
modal.find('#uploaded-box').toggle(!!uploadedPicture);
modal.find('#gravatar-box .fa-check').toggle(currentPicture !== uploadedPicture);
modal.find('#uploaded-box .fa-check').toggle(currentPicture === uploadedPicture);
}
function selectImageType(type) {
modal.find('#gravatar-box .fa-check').toggle(type === 'gravatar');
modal.find('#uploaded-box .fa-check').toggle(type === 'uploaded');
selectedImageType = type;
}
var modal = $(html);
modal.on('hidden.bs.modal', function() {
modal.remove();
});
selectedImageType = '';
updateImages();
modal.modal('show');
modal.find('#gravatar-box').on('click', function() {
selectImageType('gravatar');
});
modal.find('#uploaded-box').on('click', function() {
selectImageType('uploaded');
});
handleImageUpload(modal);
modal.find('#savePictureChangesBtn').on('click', function() {
modal.modal('hide');
if (!selectedImageType) {
return;
}
changeUserPicture(selectedImageType, function(err) {
if (err) {
return app.alertError(err.message);
}
if (selectedImageType === 'gravatar') {
$('#user-current-picture').attr('src', gravatarPicture);
updateHeader(gravatarPicture);
} else if (selectedImageType === 'uploaded') {
$('#user-current-picture').attr('src', uploadedPicture);
updateHeader(uploadedPicture);
}
});
});
});
});
return false;
});
$('#gravatar-box').on('click', function() {
selectImageType('gravatar');
});
$('#uploaded-box').on('click', function() {
selectImageType('uploaded');
});
$('#savePictureChangesBtn').on('click', function() {
$('#change-picture-modal').modal('hide');
if (!selectedImageType) {
return;
}
changeUserPicture(selectedImageType, function(err) {
if (err) {
return app.alertError(err.message);
}
if (selectedImageType === 'gravatar') {
$('#user-current-picture').attr('src', gravatarPicture);
updateHeader(gravatarPicture);
} else if (selectedImageType === 'uploaded') {
$('#user-current-picture').attr('src', uploadedPicture);
updateHeader(uploadedPicture);
}
});
});
}
function handleAccountDelete() {
@@ -178,32 +205,23 @@ define('forum/account/edit', ['forum/account/header', 'uploader', 'translator'],
});
}
function handleImageUpload() {
function handleImageUpload(modal) {
function onUploadComplete(urlOnServer) {
urlOnServer = urlOnServer + '?' + new Date().getTime();
$('#user-current-picture').attr('src', urlOnServer);
$('#user-uploaded-picture').attr('src', urlOnServer);
updateHeader(urlOnServer);
uploadedPicture = urlOnServer;
$('#removeUploadedPictureBtn').removeClass('hide');
}
function onRemoveComplete(urlOnServer) {
$('#user-current-picture').attr('src', urlOnServer);
$('#user-uploaded-picture').attr('src', '');
updateHeader(urlOnServer);
uploadedPicture = '';
$('#removeUploadedPictureBtn').addClass('hide');
}
$('#upload-picture-modal').on('hide', function() {
$('#userPhotoInput').val('');
});
$('#uploadPictureBtn').on('click', function() {
$('#change-picture-modal').modal('hide');
modal.find('#uploadPictureBtn').on('click', function() {
modal.modal('hide');
uploader.open(config.relative_path + '/api/user/' + ajaxify.data.userslug + '/uploadpicture', {}, config.maximumProfileImageSize, function(imageUrlOnServer) {
onUploadComplete(imageUrlOnServer);
});
@@ -211,39 +229,44 @@ define('forum/account/edit', ['forum/account/header', 'uploader', 'translator'],
return false;
});
$('#uploadFromUrlBtn').on('click', function() {
$('#change-picture-modal').modal('hide');
var uploadModal = $('#upload-picture-from-url-modal');
uploadModal.modal('show').removeClass('hide');
modal.find('#uploadFromUrlBtn').on('click', function() {
modal.modal('hide');
templates.parse('partials/modals/upload_picture_from_url_modal', {}, function(html) {
translator.translate(html, function(html) {
var uploadModal = $(html);
uploadModal.modal('show');
uploadModal.find('.upload-btn').on('click', function() {
var url = uploadModal.find('#uploadFromUrl').val();
if (!url) {
return;
}
socket.emit('user.uploadProfileImageFromUrl', {url: url, uid: ajaxify.data.theirid}, function(err, imageUrlOnServer) {
if (err) {
return app.alertError(err.message);
}
onUploadComplete(imageUrlOnServer);
uploadModal.find('.upload-btn').on('click', function() {
var url = uploadModal.find('#uploadFromUrl').val();
if (!url) {
return;
}
socket.emit('user.uploadProfileImageFromUrl', {url: url, uid: ajaxify.data.theirid}, function(err, imageUrlOnServer) {
if (err) {
return app.alertError(err.message);
}
onUploadComplete(imageUrlOnServer);
uploadModal.modal('hide');
uploadModal.modal('hide');
});
return false;
});
});
return false;
});
return false;
});
$('#removeUploadedPictureBtn').on('click', function() {
modal.find('#removeUploadedPictureBtn').on('click', function() {
socket.emit('user.removeUploadedPicture', {uid: ajaxify.data.theirid}, function(err, imageUrlOnServer) {
modal.modal('hide');
if (err) {
return app.alertError(err.message);
}
onRemoveComplete(imageUrlOnServer);
$('#change-picture-modal').modal('hide');
});
})
});
}
function handleEmailConfirm() {
@@ -348,24 +371,6 @@ define('forum/account/edit', ['forum/account/header', 'uploader', 'translator'],
}, callback);
}
function updateImages() {
var currentPicture = $('#user-current-picture').attr('src');
if (gravatarPicture) {
$('#user-gravatar-picture').attr('src', gravatarPicture);
}
if (uploadedPicture) {
$('#user-uploaded-picture').attr('src', uploadedPicture);
}
$('#gravatar-box').toggle(!!gravatarPicture);
$('#uploaded-box').toggle(!!uploadedPicture);
$('#gravatar-box .fa-check').toggle(currentPicture !== uploadedPicture);
$('#uploaded-box .fa-check').toggle(currentPicture === uploadedPicture);
}
function getCharsLeft(el, max) {
return el.length ? '(' + el.val().length + '/' + max + ')' : '';
}