mbk-lab
/
nextcloud
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Partly fix cropper in IE8 and don't use a dialog for it

This commit is contained in:
kondou 2013-09-03 17:40:41 +02:00
parent ce263df4c7
commit 4724d60ecd
2 changed files with 34 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
settings/js/personal.js
View File

@ -55,16 +55,17 @@ function updateAvatar () {
}
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');
$cropperImage = $('#cropper img');
$cropper.on('load', function() {
$cropperbox.show();
$cropperImage.attr('src', OC.Router.generate('core_avatar_get_tmp'));
$cropper.Jcrop({
// Looks weird, but on('load', ...) doesn't work in IE8
$cropperImage.ready(function(){
$('#displayavatar').hide();
$cropper.show();
$cropperImage.Jcrop({
onChange: saveCoords,
onSelect: saveCoords,
aspectRatio: 1,
@ -72,21 +73,13 @@ function showAvatarCropper() {
boxWidth: 500,
setSelect: [0, 0, 300, 300]
});
$cropperbox.ocdialog({
buttons: [{
text: t('settings', 'Crop'),
click: sendCropData,
defaultButton: true
}],
close: function(){
$(this).remove();
}
});
});
}
function sendCropData() {
$('#displayavatar').show();
$cropper.hide();
var cropperdata = $('#cropper').data();
var data = {
x: cropperdata.x,
@ -224,6 +217,15 @@ $(document).ready(function(){
}
});
});
$('#abortcropperbutton').click(function(){
$('#displayavatar').show();
$cropper.hide();
});
$('#sendcropperbutton').click(function(){
sendCropData();
});
} );
OC.Encryption = {

21
settings/templates/personal.php
View File

@ -84,13 +84,20 @@ if($_['passwordChangeSupported']) {
<form id="avatar" method="post" action="<?php p(\OC_Helper::linkToRoute('core_avatar_post')); ?>">
<fieldset class="personalblock">
<legend><strong><?php p($l->t('Profile picture')); ?></strong></legend>
<div class="avatardiv"></div><br>
<div class="warning hidden"></div>
<div class="inlineblock button" id="uploadavatarbutton"><?php p($l->t('Upload new')); ?></div>
<input type="file" class="hidden" name="files[]" id="uploadavatar">
<div class="inlineblock button" id="selectavatar"><?php p($l->t('Select new from Files')); ?></div>
<div class="inlineblock button" id="removeavatar"><?php p($l->t('Remove image')); ?></div><br>
<?php p($l->t('Either png or jpg. Ideally square but you will be able to crop it.')); ?>
<div id="displayavatar">
<div class="avatardiv"></div><br>
<div class="warning hidden"></div>
<div class="inlineblock button" id="uploadavatarbutton"><?php p($l->t('Upload new')); ?></div>
<input type="file" class="hidden" name="files[]" id="uploadavatar">
<div class="inlineblock button" id="selectavatar"><?php p($l->t('Select new from Files')); ?></div>
<div class="inlineblock button" id="removeavatar"><?php p($l->t('Remove image')); ?></div><br>
<?php p($l->t('Either png or jpg. Ideally square but you will be able to crop it.')); ?>
</div>
<div id="cropper" class="hidden">
<img>
<div class="inlineblock button" id="abortcropperbutton"><?php p($l->t('Abort')); ?></div>
<div class="inlineblock button primary" id="sendcropperbutton"><?php p($l->t('Choose as profile image')); ?></div>
</div>
</fieldset>
</form>
<?php endif; ?>