diff options
| -rw-r--r-- | settings/css/settings.css | 11 | ||||
| -rw-r--r-- | settings/js/federationsettingsview.js | 29 | ||||
| -rw-r--r-- | settings/js/personal.js | 6 | ||||
| -rw-r--r-- | settings/templates/personal.php | 10 |
4 files changed, 37 insertions, 19 deletions
diff --git a/settings/css/settings.css b/settings/css/settings.css index 4428f6130d6..3183355ac90 100644 --- a/settings/css/settings.css +++ b/settings/css/settings.css @@ -7,14 +7,14 @@ input#openid, input#webdav { width:20em; } /* PERSONAL */ -#avatar { +#avatarform { width: 160px; padding-right: 0; } -#avatar .avatardiv { +#avatarform .avatardiv { margin-bottom: 10px; } -#avatar .warning { +#avatarform .warning { width: 100%; } #uploadavatarbutton, @@ -26,7 +26,7 @@ input#openid, input#webdav { width:20em; } .jcrop-holder { z-index: 500; } -#avatar #cropper { +#avatarform #cropper { float: left; z-index: 500; /* float cropper above settings page to prevent unexpected flowing from dynamically sized element */ @@ -82,6 +82,7 @@ input#openid, input#webdav { width:20em; } height: 20px; min-width: 200px; } +#avatarform > h2 span, #personal-settings-container > div h2 span[class^="icon-"] { display: inline-block; margin-left: 5px; @@ -120,7 +121,7 @@ input#openid, input#webdav { width:20em; } padding-right: 0; min-width: 60%; } -#avatar, +#avatarform, #passwordform { margin-bottom: 0; padding-bottom: 0; diff --git a/settings/js/federationsettingsview.js b/settings/js/federationsettingsview.js index 6a10d9f7f7e..997f4fef3f1 100644 --- a/settings/js/federationsettingsview.js +++ b/settings/js/federationsettingsview.js @@ -30,19 +30,26 @@ 'phone', 'email', 'website', - 'address' + 'address', + 'avatar' ]; var self = this; _.each(this._inputFields, function(field) { + var scopeOnly = field === 'avatar'; + // Initialize config model - self._config.set(field, $('#' + field).val()); + if (!scopeOnly) { + self._config.set(field, $('#' + field).val()); + } self._config.set(field + 'Scope', $('#' + field + 'scope').val()); // Set inputs whenever model values change - self.listenTo(self._config, 'change:' + field, function () { - self.$('#' + field).val(self._config.get(field)); - }); + if (!scopeOnly) { + self.listenTo(self._config, 'change:' + field, function () { + self.$('#' + field).val(self._config.get(field)); + }); + } self.listenTo(self._config, 'change:' + field + 'Scope', function () { self._onScopeChanged(field, self._config.get(field + 'Scope')); }); @@ -54,8 +61,8 @@ render: function() { var self = this; _.each(this._inputFields, function(field) { - var $heading = self.$('#' + field + 'form > h2'); - var $icon = self.$('#' + field + 'form > h2 > span'); + var $heading = self.$('#' + field + 'form h2'); + var $icon = self.$('#' + field + 'form h2 > span'); var scopeMenu = new OC.Settings.FederationScopeMenu(); self.listenTo(scopeMenu, 'select:scope', function(scope) { @@ -65,8 +72,9 @@ $icon.on('click', _.bind(scopeMenu.show, scopeMenu)); // Fix absolute position according to the heading text length - // TODO: fix position without magic numbers - var pos = ($heading.width() - $heading.find('label').width()) - 68; + // TODO: find alternative to those magic number + var diff = field === 'avatar' ? 104 : 68; + var pos = ($heading.width() - $heading.find('label').width()) - diff; scopeMenu.$el.css('right', pos); self._onScopeChanged(field, self._config.get(field + 'Scope')); @@ -76,6 +84,9 @@ _registerEvents: function() { var self = this; _.each(this._inputFields, function(field) { + if (field === 'avatar') { + return; + } self.$('#' + field).keyUpDelayedOrEnter(_.bind(self._onInputChanged, self)); }); }, diff --git a/settings/js/personal.js b/settings/js/personal.js index 7a8d43d1475..9045851ba0c 100644 --- a/settings/js/personal.js +++ b/settings/js/personal.js @@ -192,7 +192,7 @@ function avatarResponseHandler (data) { if (typeof data === 'string') { data = JSON.parse(data); } - var $warning = $('#avatar .warning'); + var $warning = $('#avatarform .warning'); $warning.hide(); if (data.status === "success") { updateAvatar(); @@ -271,7 +271,7 @@ $(document).ready(function () { }); var federationSettingsView = new OC.Settings.FederationSettingsView({ - el: '#personal-settings-container' + el: '#personal-settings' }); federationSettingsView.render(); @@ -412,7 +412,7 @@ $(document).ready(function () { // Load the big avatar if (oc_config.enable_avatars) { - $('#avatar .avatardiv').avatar(OC.currentUser, 145); + $('#avatarform .avatardiv').avatar(OC.currentUser, 145); } // Show token views diff --git a/settings/templates/personal.php b/settings/templates/personal.php index 3f59954b6dd..d1eebe1aacd 100644 --- a/settings/templates/personal.php +++ b/settings/templates/personal.php @@ -32,10 +32,14 @@ </div> </div> +<div id="personal-settings"> <?php if ($_['enableAvatars']): ?> <div id="personal-settings-avatar-container"> - <form id="avatar" class="section" method="post" action="<?php p(\OC::$server->getURLGenerator()->linkToRoute('core.avatar.postAvatar')); ?>"> - <h2><?php p($l->t('Profile picture')); ?></h2> + <form id="avatarform" class="section" method="post" action="<?php p(\OC::$server->getURLGenerator()->linkToRoute('core.avatar.postAvatar')); ?>"> + <h2> + <label><?php p($l->t('Profile picture')); ?></label> + <span class="icon-loading"/> + </h2> <div id="displayavatar"> <div class="avatardiv"></div> <div class="warning hidden"></div> @@ -54,6 +58,7 @@ <div class="inlineblock button" id="abortcropperbutton"><?php p($l->t('Cancel')); ?></div> <div class="inlineblock button primary" id="sendcropperbutton"><?php p($l->t('Choose as profile picture')); ?></div> </div> + <input type="hidden" id="avatarscope" value="<?php p($_['avatarScope']) ?>"> </form> </div> <?php endif; ?> @@ -187,6 +192,7 @@ if($_['displayNameChangeSupported']) { <?php } ?> +</div> <div id="groups" class="section"> <h2><?php p($l->t('Groups')); ?></h2> |