Merge pull request #5342 from nextcloud/userlist-used-space

show used space in user list

lib/private/Files/Config/UserMountCache.php

@@ -24,6 +24,7 @@
 
 namespace OC\Files\Config;
 
+use OC\DB\QueryBuilder\Literal;
 use OCA\Files_Sharing\SharedMount;
 use OCP\DB\QueryBuilder\IQueryBuilder;
 use OCP\Files\Config\ICachedMountInfo;
@@ -193,7 +194,7 @@ class UserMountCache implements IUserMountCache {
 		if (is_null($user)) {
 			return null;
 		}
-		return new CachedMountInfo($user, (int)$row['storage_id'], (int)$row['root_id'], $row['mount_point'], $row['mount_id'], isset($row['path'])? $row['path']:'');
+		return new CachedMountInfo($user, (int)$row['storage_id'], (int)$row['root_id'], $row['mount_point'], $row['mount_id'], isset($row['path']) ? $row['path'] : '');
 	}
 
 	/**
@@ -224,7 +225,7 @@ class UserMountCache implements IUserMountCache {
 		$builder = $this->connection->getQueryBuilder();
 		$query = $builder->select('storage_id', 'root_id', 'user_id', 'mount_point', 'mount_id', 'f.path')
 			->from('mounts', 'm')
-			->innerJoin('m', 'filecache', 'f' , $builder->expr()->eq('m.root_id', 'f.fileid'))
+			->innerJoin('m', 'filecache', 'f', $builder->expr()->eq('m.root_id', 'f.fileid'))
 			->where($builder->expr()->eq('storage_id', $builder->createPositionalParameter($numericStorageId, IQueryBuilder::PARAM_INT)));
 
 		if ($user) {
@@ -332,4 +333,33 @@ class UserMountCache implements IUserMountCache {
 			->where($builder->expr()->eq('storage_id', $builder->createNamedParameter($storageId, IQueryBuilder::PARAM_INT)));
 		$query->execute();
 	}
+
+	public function getUsedSpaceForUsers(array $users) {
+		$builder = $this->connection->getQueryBuilder();
+
+		$slash = $builder->createNamedParameter('/');
+
+		$mountPoint = $builder->func()->concat(
+			$builder->func()->concat($slash, 'user_id'),
+			$slash
+		);
+
+		$userIds = array_map(function (IUser $user) {
+			return $user->getUID();
+		}, $users);
+
+		$query = $builder->select('m.user_id', 'f.size')
+			->from('mounts', 'm')
+			->innerJoin('m', 'filecache', 'f',
+				$builder->expr()->andX(
+					$builder->expr()->eq('m.storage_id', 'f.storage'),
+					$builder->expr()->eq('f.path', $builder->createNamedParameter('files'))
+				))
+			->where($builder->expr()->eq('m.mount_point', $mountPoint))
+			->andWhere($builder->expr()->in('m.user_id', $builder->createNamedParameter($userIds, IQueryBuilder::PARAM_STR_ARRAY)));
+
+		$result = $query->execute();
+
+		return $result->fetchAll(\PDO::FETCH_KEY_PAIR);
+	}
 }

lib/public/Files/Config/IUserMountCache.php

@@ -104,4 +104,16 @@ interface IUserMountCache {
 	 * @since 9.0.0
 	 */
 	public function remoteStorageMounts($storageId);
+
+	/**
+	 * Get the used space for users
+	 *
+	 * Note that this only includes the space in their home directory,
+	 * not any incoming shares or external storages.
+	 *
+	 * @param IUser[] $users
+	 * @return int[] [$userId => $userSpace]
+	 * @since 13.0.0
+	 */
+	public function getUsedSpaceForUsers(array $users);
 }

settings/Controller/UsersController.php

@@ -40,6 +40,7 @@ use OCP\AppFramework\Controller;
 use OCP\AppFramework\Http\DataResponse;
 use OCP\AppFramework\Utility\ITimeFactory;
 use OCP\BackgroundJob\IJobList;
+use OCP\Files\Config\IUserMountCache;
 use OCP\IConfig;
 use OCP\IGroupManager;
 use OCP\IL10N;
@@ -53,6 +54,7 @@ use OCP\Mail\IMailer;
 use OCP\IAvatarManager;
 use OCP\Security\ICrypto;
 use OCP\Security\ISecureRandom;
+use OCP\Util;
 
 /**
  * @package OC\Settings\Controller
@@ -96,6 +98,8 @@ class UsersController extends Controller {
 	private $keyManager;
 	/** @var IJobList */
 	private $jobList;
+	/** @var IUserMountCache */
+	private $userMountCache;
 
 	/**
 	 * @param string $appName
@@ -118,6 +122,7 @@ class UsersController extends Controller {
 	 * @param ICrypto $crypto
 	 * @param Manager $keyManager
 	 * @param IJobList $jobList
+	 * @param IUserMountCache $userMountCache
 	 */
 	public function __construct($appName,
 								IRequest $request,
@@ -138,7 +143,8 @@ class UsersController extends Controller {
 								ITimeFactory $timeFactory,
 								ICrypto $crypto,
 								Manager $keyManager,
-								IJobList $jobList) {
+								IJobList $jobList,
+								IUserMountCache $userMountCache) {
 		parent::__construct($appName, $request);
 		$this->userManager = $userManager;
 		$this->groupManager = $groupManager;
@@ -157,10 +163,11 @@ class UsersController extends Controller {
 		$this->crypto = $crypto;
 		$this->keyManager = $keyManager;
 		$this->jobList = $jobList;
+		$this->userMountCache = $userMountCache;
 
 		// check for encryption state - TODO see formatUserForIndex
 		$this->isEncryptionAppEnabled = $appManager->isEnabledForUser('encryption');
-		if($this->isEncryptionAppEnabled) {
+		if ($this->isEncryptionAppEnabled) {
 			// putting this directly in empty is possible in PHP 5.5+
 			$result = $config->getAppValue('encryption', 'recoveryAdminEnabled', 0);
 			$this->isRestoreEnabled = !empty($result);
@@ -200,7 +207,7 @@ class UsersController extends Controller {
 		}
 
 		$subAdminGroups = $this->groupManager->getSubAdmin()->getSubAdminsGroups($user);
-		foreach($subAdminGroups as $key => $subAdminGroup) {
+		foreach ($subAdminGroups as $key => $subAdminGroup) {
 			$subAdminGroups[$key] = $subAdminGroup->getGID();
 		}
 
@@ -222,6 +229,7 @@ class UsersController extends Controller {
 			'groups' => (empty($userGroups)) ? $this->groupManager->getUserGroupIds($user) : $userGroups,
 			'subadmin' => $subAdminGroups,
 			'quota' => $user->getQuota(),
+			'quota_bytes' => Util::computerFileSize($user->getQuota()),
 			'storageLocation' => $user->getHome(),
 			'lastLogin' => $user->getLastLogin() * 1000,
 			'backend' => $user->getBackendClassName(),
@@ -258,29 +266,31 @@ class UsersController extends Controller {
 	 */
 	public function index($offset = 0, $limit = 10, $gid = '', $pattern = '', $backend = '') {
 		// Remove backends
-		if(!empty($backend)) {
+		if (!empty($backend)) {
 			$activeBackends = $this->userManager->getBackends();
 			$this->userManager->clearBackends();
-			foreach($activeBackends as $singleActiveBackend) {
-				if($backend === get_class($singleActiveBackend)) {
+			foreach ($activeBackends as $singleActiveBackend) {
+				if ($backend === get_class($singleActiveBackend)) {
 					$this->userManager->registerBackend($singleActiveBackend);
 					break;
 				}
 			}
 		}
 
+		$userObjects = [];
 		$users = [];
 		if ($this->isAdmin) {
-			if($gid !== '' && $gid !== '_disabledUsers') {
+			if ($gid !== '' && $gid !== '_disabledUsers') {
 				$batch = $this->getUsersForUID($this->groupManager->displayNamesInGroup($gid, $pattern, $limit, $offset));
 			} else {
 				$batch = $this->userManager->search($pattern, $limit, $offset);
 			}
 
 			foreach ($batch as $user) {
-				if( ($gid !== '_disabledUsers' && $user->isEnabled()) ||
+				if (($gid !== '_disabledUsers' && $user->isEnabled()) ||
 					($gid === '_disabledUsers' && !$user->isEnabled())
 				) {
+					$userObjects[] = $user;
 					$users[] = $this->formatUserForIndex($user);
 				}
 			}
@@ -295,17 +305,17 @@ class UsersController extends Controller {
 			$subAdminOfGroups = $gids;
 
 			// Set the $gid parameter to an empty value if the subadmin has no rights to access a specific group
-			if($gid !== '' && $gid !== '_disabledUsers' && !in_array($gid, $subAdminOfGroups)) {
+			if ($gid !== '' && $gid !== '_disabledUsers' && !in_array($gid, $subAdminOfGroups)) {
 				$gid = '';
 			}
 
 			// Batch all groups the user is subadmin of when a group is specified
 			$batch = [];
-			if($gid === '') {
-				foreach($subAdminOfGroups as $group) {
+			if ($gid === '') {
+				foreach ($subAdminOfGroups as $group) {
 					$groupUsers = $this->groupManager->displayNamesInGroup($group, $pattern, $limit, $offset);
 
-					foreach($groupUsers as $uid => $displayName) {
+					foreach ($groupUsers as $uid => $displayName) {
 						$batch[$uid] = $displayName;
 					}
 				}
@@ -320,14 +330,21 @@ class UsersController extends Controller {
 					$this->groupManager->getUserGroupIds($user),
 					$subAdminOfGroups
 				));
-				if( ($gid !== '_disabledUsers' && $user->isEnabled()) ||
+				if (($gid !== '_disabledUsers' && $user->isEnabled()) ||
 					($gid === '_disabledUsers' && !$user->isEnabled())
 				) {
+					$userObjects[] = $user;
 					$users[] = $this->formatUserForIndex($user, $userGroups);
 				}
 			}
 		}
 
+		$usedSpace = $this->userMountCache->getUsedSpaceForUsers($userObjects);
+
+		foreach ($users as &$userData) {
+			$userData['size'] = isset($usedSpace[$userData['name']]) ? $usedSpace[$userData['name']] : 0;
+		}
+
 		return new DataResponse($users);
 	}
 
@@ -341,8 +358,8 @@ class UsersController extends Controller {
 	 * @param string $email
 	 * @return DataResponse
 	 */
-	public function create($username, $password, array $groups=[], $email='') {
-		if($email !== '' && !$this->mailer->validateMailAddress($email)) {
+	public function create($username, $password, array $groups = [], $email = '') {
+		if ($email !== '' && !$this->mailer->validateMailAddress($email)) {
 			return new DataResponse(
 				[
 					'message' => (string)$this->l10n->t('Invalid mail address')
@@ -357,7 +374,7 @@ class UsersController extends Controller {
 			if (!empty($groups)) {
 				foreach ($groups as $key => $group) {
 					$groupObject = $this->groupManager->get($group);
-					if($groupObject === null) {
+					if ($groupObject === null) {
 						unset($groups[$key]);
 						continue;
 					}
@@ -411,18 +428,18 @@ class UsersController extends Controller {
 			}
 			return new DataResponse(
 				[
-					'message' => (string) $message,
+					'message' => (string)$message,
 				],
 				Http::STATUS_FORBIDDEN
 			);
 		}
 
-		if($user instanceof IUser) {
-			if($groups !== null) {
-				foreach($groups as $groupName) {
+		if ($user instanceof IUser) {
+			if ($groups !== null) {
+				foreach ($groups as $groupName) {
 					$group = $this->groupManager->get($groupName);
 
-					if(empty($group)) {
+					if (empty($group)) {
 						$group = $this->groupManager->createGroup($groupName);
 					}
 					$group->addUser($user);
@@ -431,12 +448,12 @@ class UsersController extends Controller {
 			/**
 			 * Send new user mail only if a mail is set
 			 */
-			if($email !== '') {
+			if ($email !== '') {
 				$user->setEMailAddress($email);
 				try {
 					$emailTemplate = $this->newUserMailHelper->generateTemplate($user, $generatePasswordResetToken);
 					$this->newUserMailHelper->sendMail($user, $emailTemplate);
-				} catch(\Exception $e) {
+				} catch (\Exception $e) {
 					$this->log->error("Can't send new user mail to $email: " . $e->getMessage(), ['app' => 'settings']);
 				}
 			}
@@ -451,7 +468,7 @@ class UsersController extends Controller {
 
 		return new DataResponse(
 			[
-				'message' => (string) $this->l10n->t('Unable to create user.')
+				'message' => (string)$this->l10n->t('Unable to create user.')
 			],
 			Http::STATUS_FORBIDDEN
 		);
@@ -469,19 +486,19 @@ class UsersController extends Controller {
 		$userId = $this->userSession->getUser()->getUID();
 		$user = $this->userManager->get($id);
 
-		if($userId === $id) {
+		if ($userId === $id) {
 			return new DataResponse(
 				[
 					'status' => 'error',
 					'data' => [
-						'message' => (string) $this->l10n->t('Unable to delete user.')
+						'message' => (string)$this->l10n->t('Unable to delete user.')
 					]
 				],
 				Http::STATUS_FORBIDDEN
 			);
 		}
 
-		if(!$this->isAdmin && !$this->groupManager->getSubAdmin()->isUserAccessible($this->userSession->getUser(), $user)) {
+		if (!$this->isAdmin && !$this->groupManager->getSubAdmin()->isUserAccessible($this->userSession->getUser(), $user)) {
 			return new DataResponse(
 				[
 					'status' => 'error',
@@ -493,8 +510,8 @@ class UsersController extends Controller {
 			);
 		}
 
-		if($user) {
-			if($user->delete()) {
+		if ($user) {
+			if ($user->delete()) {
 				return new DataResponse(
 					[
 						'status' => 'success',
@@ -527,10 +544,10 @@ class UsersController extends Controller {
 	 */
 	public function setEnabled($id, $enabled) {
 		$enabled = (bool)$enabled;
-		if($enabled) {
-			$errorMsgGeneral = (string) $this->l10n->t('Error while enabling user.');
+		if ($enabled) {
+			$errorMsgGeneral = (string)$this->l10n->t('Error while enabling user.');
 		} else {
-			$errorMsgGeneral = (string) $this->l10n->t('Error while disabling user.');
+			$errorMsgGeneral = (string)$this->l10n->t('Error while disabling user.');
 		}
 
 		$userId = $this->userSession->getUser()->getUID();
@@ -547,13 +564,13 @@ class UsersController extends Controller {
 			);
 		}
 
-		if($user) {
+		if ($user) {
 			if (!$this->isAdmin && !$this->groupManager->getSubAdmin()->isUserAccessible($this->userSession->getUser(), $user)) {
 				return new DataResponse(
 					[
 						'status' => 'error',
 						'data' => [
-							'message' => (string) $this->l10n->t('Authentication error')
+							'message' => (string)$this->l10n->t('Authentication error')
 						]
 					],
 					Http::STATUS_FORBIDDEN
@@ -714,7 +731,7 @@ class UsersController extends Controller {
 				[
 					'status' => 'error',
 					'data' => [
-						'message' => (string) $this->l10n->t('Invalid mail address')
+						'message' => (string)$this->l10n->t('Invalid mail address')
 					]
 				],
 				Http::STATUS_UNPROCESSABLE_ENTITY
@@ -725,7 +742,7 @@ class UsersController extends Controller {
 
 		$data = $this->accountManager->getUser($user);
 
-		$data[AccountManager::PROPERTY_AVATAR] =  ['scope' => $avatarScope];
+		$data[AccountManager::PROPERTY_AVATAR] = ['scope' => $avatarScope];
 		if ($this->config->getSystemValue('allow_user_to_change_display_name', true) !== false) {
 			$data[AccountManager::PROPERTY_DISPLAYNAME] = ['value' => $displayname, 'scope' => $displaynameScope];
 			$data[AccountManager::PROPERTY_EMAIL] = ['value' => $email, 'scope' => $emailScope];
@@ -758,7 +775,7 @@ class UsersController extends Controller {
 						'websiteScope' => $data[AccountManager::PROPERTY_WEBSITE]['scope'],
 						'address' => $data[AccountManager::PROPERTY_ADDRESS]['value'],
 						'addressScope' => $data[AccountManager::PROPERTY_ADDRESS]['scope'],
-						'message' => (string) $this->l10n->t('Settings saved')
+						'message' => (string)$this->l10n->t('Settings saved')
 					]
 				],
 				Http::STATUS_OK
@@ -835,7 +852,7 @@ class UsersController extends Controller {
 
 			$uniqueUsers = [];
 			foreach ($groups as $group) {
-				foreach($group->getUsers() as $uid => $displayName) {
+				foreach ($group->getUsers() as $uid => $displayName) {
 					$uniqueUsers[$uid] = true;
 				}
 			}
@@ -929,19 +946,19 @@ class UsersController extends Controller {
 				[
 					'status' => 'error',
 					'data' => [
-						'message' => (string) $this->l10n->t('Forbidden')
+						'message' => (string)$this->l10n->t('Forbidden')
 					]
 				],
 				Http::STATUS_FORBIDDEN
 			);
 		}
 
-		if($mailAddress !== '' && !$this->mailer->validateMailAddress($mailAddress)) {
+		if ($mailAddress !== '' && !$this->mailer->validateMailAddress($mailAddress)) {
 			return new DataResponse(
 				[
 					'status' => 'error',
 					'data' => [
-						'message' => (string) $this->l10n->t('Invalid mail address')
+						'message' => (string)$this->l10n->t('Invalid mail address')
 					]
 				],
 				Http::STATUS_UNPROCESSABLE_ENTITY
@@ -953,7 +970,7 @@ class UsersController extends Controller {
 				[
 					'status' => 'error',
 					'data' => [
-						'message' => (string) $this->l10n->t('Invalid user')
+						'message' => (string)$this->l10n->t('Invalid user')
 					]
 				],
 				Http::STATUS_UNPROCESSABLE_ENTITY
@@ -966,7 +983,7 @@ class UsersController extends Controller {
 				[
 					'status' => 'error',
 					'data' => [
-						'message' => (string) $this->l10n->t('Unable to change mail address')
+						'message' => (string)$this->l10n->t('Unable to change mail address')
 					]
 				],
 				Http::STATUS_FORBIDDEN
@@ -984,7 +1001,7 @@ class UsersController extends Controller {
 					'data' => [
 						'username' => $id,
 						'mailAddress' => $mailAddress,
-						'message' => (string) $this->l10n->t('Email saved')
+						'message' => (string)$this->l10n->t('Email saved')
 					]
 				],
 				Http::STATUS_OK

settings/css/settings.css

@@ -55,7 +55,7 @@ input#openid, input#webdav {
 }
 
 #avatarform .jcrop-keymgr {
-	display:none !important;
+	display: none !important;
 }
 
 #displayavatar {
@@ -313,7 +313,7 @@ table.nostyle td {
 	max-width: 580px;
 }
 
-#security table th{
+#security table th {
 	opacity: .5;
 }
 
@@ -696,11 +696,17 @@ input#recoveryPassword {
 	height: 37px;
 }
 
-select.quota-user {
+#userlist td.quota {
 	position: relative;
+	width: 10em;
+}
+
+select.quota-user {
+	position: absolute;
 	left: 0;
 	top: 0;
 	width: 10em;
+	height: 34px;
 }
 
 select.quota.active {
@@ -711,6 +717,20 @@ input.userFilter {
 	width: 200px;
 }
 
+.quota_progress_container {
+	position: absolute;
+	left: 0;
+	top: 0;
+	width: 10em;
+	margin: 3px 3px 3px 0;
+	border-radius: 3px;
+}
+
+.quota_progress {
+	background-color: #eee;
+	height: 34px;
+}
+
 /* positioning fixes */
 #newuser {
 	padding-left: 3px;

settings/js/users/users.js

@@ -25,7 +25,7 @@ var UserList = {
 	 * Initializes the user list
 	 * @param $el user list table element
 	 */
-	initialize: function($el) {
+	initialize: function ($el) {
 		this.$el = $el;
 
 		// initially the list might already contain user entries (not fully ajaxified yet)
@@ -37,18 +37,20 @@ var UserList = {
 	 * Add a user row from user object
 	 *
 	 * @param user object containing following keys:
-	 * 			{
+	 *            {
 	 * 				'name': 			'username',
 	 * 				'displayname': 		'Users display name',
 	 * 				'groups': 			['group1', 'group2'],
 	 * 				'subadmin': 		['group4', 'group5'],
 	 *				'quota': 			'10 GB',
+	 *				'quota_bytes':		'10737418240',
 	 *				'storageLocation':	'/srv/www/owncloud/data/username',
 	 *				'lastLogin':		'1418632333'
 	 *				'backend':			'LDAP',
 	 *				'email':			'username@example.org'
 	 *				'isRestoreDisabled':false
-	 *				'isEnabled':		true
+	 *				'isEnabled':		true,
+	 *				'size':				156789
 	 * 			}
 	 */
 	add: function (user) {
@@ -109,13 +111,23 @@ var UserList = {
 				.append(menuImage);
 			$tr.find('td.userActions > span').replaceWith(menuLink);
 		} else if (OC.currentUser === user.name) {
-		 	$tr.find('td.userActions').empty();
+			$tr.find('td.userActions').empty();
 		}
 
 		/**
 		 * quota
 		 */
+		UserList.updateQuotaProgressbar($tr, user.quota_bytes, user.size);
+		$tr.data('size', user.size);
 		var $quotaSelect = $tr.find('.quota-user');
+		var humanSize = humanFileSize(user.size, true);
+		$quotaSelect.tooltip({
+			title:  t('settings', '{size} used', {size: humanSize}, 0 , {escape: false}).replace('&lt;', '<'),
+			delay: {
+				show: 100,
+				hide: 0
+			}
+		});
 		if (user.quota === 'default') {
 			$quotaSelect
 				.data('previous', 'default')
@@ -147,7 +159,7 @@ var UserList = {
 		 */
 		var lastLoginRel = t('settings', 'never');
 		var lastLoginAbs = lastLoginRel;
-		if(user.lastLogin !== 0) {
+		if (user.lastLogin !== 0) {
 			lastLoginRel = OC.Util.relativeModifiedDate(user.lastLogin);
 			lastLoginAbs = OC.Util.formatDate(user.lastLogin);
 		}
@@ -165,17 +177,17 @@ var UserList = {
 		$quotaSelect.on('change', UserList.onQuotaSelect);
 
 		// defer init so the user first sees the list appear more quickly
-		window.setTimeout(function(){
+		window.setTimeout(function () {
 			$quotaSelect.singleSelect();
 		}, 0);
 	},
 	// From http://my.opera.com/GreyWyvern/blog/show.dml/1671288
-	alphanum: function(a, b) {
-		function chunkify(t) {
+	alphanum: function (a, b) {
+		function chunkify (t) {
 			var tz = [], x = 0, y = -1, n = 0, i, j;
 
 			while (i = (j = t.charAt(x++)).charCodeAt(0)) {
-				var m = (i === 46 || (i >=48 && i <= 57));
+				var m = (i === 46 || (i >= 48 && i <= 57));
 				if (m !== n) {
 					tz[++y] = "";
 					n = m;
@@ -200,73 +212,73 @@ var UserList = {
 		}
 		return aa.length - bb.length;
 	},
-	preSortSearchString: function(a, b) {
+	preSortSearchString: function (a, b) {
 		var pattern = this.filter;
-		if(typeof pattern === 'undefined') {
+		if (typeof pattern === 'undefined') {
 			return undefined;
 		}
 		pattern = pattern.toLowerCase();
 		var aMatches = false;
 		var bMatches = false;
-		if(typeof a === 'string' && a.toLowerCase().indexOf(pattern) === 0) {
+		if (typeof a === 'string' && a.toLowerCase().indexOf(pattern) === 0) {
 			aMatches = true;
 		}
-		if(typeof b === 'string' && b.toLowerCase().indexOf(pattern) === 0) {
+		if (typeof b === 'string' && b.toLowerCase().indexOf(pattern) === 0) {
 			bMatches = true;
 		}
 
-		if((aMatches && bMatches) || (!aMatches && !bMatches)) {
+		if ((aMatches && bMatches) || (!aMatches && !bMatches)) {
 			return undefined;
 		}
 
-		if(aMatches) {
+		if (aMatches) {
 			return -1;
 		} else {
 			return 1;
 		}
 	},
-	doSort: function() {
+	doSort: function () {
 		// some browsers like Chrome lose the scrolling information
 		// when messing with the list elements
 		var lastScrollTop = this.scrollArea.scrollTop();
 		var lastScrollLeft = this.scrollArea.scrollLeft();
 		var rows = $userListBody.find('tr').get();
 
-		rows.sort(function(a, b) {
+		rows.sort(function (a, b) {
 			// FIXME: inefficient way of getting the names,
 			// better use a data attribute
 			a = $(a).find('.name').text();
 			b = $(b).find('.name').text();
 			var firstSort = UserList.preSortSearchString(a, b);
-			if(typeof firstSort !== 'undefined') {
+			if (typeof firstSort !== 'undefined') {
 				return firstSort;
 			}
 			return OC.Util.naturalSortCompare(a, b);
 		});
 
 		var items = [];
-		$.each(rows, function(index, row) {
+		$.each(rows, function (index, row) {
 			items.push(row);
-			if(items.length === 100) {
+			if (items.length === 100) {
 				$userListBody.append(items);
 				items = [];
 			}
 		});
-		if(items.length > 0) {
+		if (items.length > 0) {
 			$userListBody.append(items);
 		}
 		this.scrollArea.scrollTop(lastScrollTop);
 		this.scrollArea.scrollLeft(lastScrollLeft);
 	},
-	checkUsersToLoad: function() {
+	checkUsersToLoad: function () {
 		//30 shall be loaded initially, from then on always 10 upon scrolling
-		if(UserList.isEmpty === false) {
+		if (UserList.isEmpty === false) {
 			UserList.usersToLoad = 10;
 		} else {
 			UserList.usersToLoad = UserList.initialUsersToLoad;
 		}
 	},
-	empty: function() {
+	empty: function () {
 		//one row needs to be kept, because it is cloned to add new rows
 		$userListBody.find('tr:not(:first)').remove();
 		var $tr = $userListBody.find('tr:first');
@@ -278,16 +290,16 @@ var UserList = {
 		UserList.offset = 0;
 		UserList.checkUsersToLoad();
 	},
-	hide: function(uid) {
+	hide: function (uid) {
 		UserList.getRow(uid).hide();
 	},
-	show: function(uid) {
+	show: function (uid) {
 		UserList.getRow(uid).show();
 	},
-	markRemove: function(uid) {
+	markRemove: function (uid) {
 		var $tr = UserList.getRow(uid);
 		var groups = $tr.find('.groups').data('groups');
-		for(var i in groups) {
+		for (var i in groups) {
 			var gid = groups[i];
 			var $li = GroupList.getGroupLI(gid);
 			var userCount = GroupList.getUserCount($li);
@@ -296,13 +308,13 @@ var UserList = {
 		GroupList.decEveryoneCount();
 		UserList.hide(uid);
 	},
-	remove: function(uid) {
+	remove: function (uid) {
 		UserList.getRow(uid).remove();
 	},
-	undoRemove: function(uid) {
+	undoRemove: function (uid) {
 		var $tr = UserList.getRow(uid);
 		var groups = $tr.find('.groups').data('groups');
-		for(var i in groups) {
+		for (var i in groups) {
 			var gid = groups[i];
 			var $li = GroupList.getGroupLI(gid);
 			var userCount = GroupList.getUserCount($li);
@@ -311,40 +323,40 @@ var UserList = {
 		GroupList.incEveryoneCount();
 		UserList.getRow(uid).show();
 	},
-	has: function(uid) {
+	has: function (uid) {
 		return UserList.getRow(uid).length > 0;
 	},
-	getRow: function(uid) {
-		return $userListBody.find('tr').filter(function(){
+	getRow: function (uid) {
+		return $userListBody.find('tr').filter(function () {
 			return UserList.getUID(this) === uid;
 		});
 	},
-	getUID: function(element) {
+	getUID: function (element) {
 		return ($(element).closest('tr').data('uid') || '').toString();
 	},
-	getDisplayName: function(element) {
+	getDisplayName: function (element) {
 		return ($(element).closest('tr').data('displayname') || '').toString();
 	},
-	getMailAddress: function(element) {
+	getMailAddress: function (element) {
 		return ($(element).closest('tr').data('mailAddress') || '').toString();
 	},
-	getRestoreDisabled: function(element) {
+	getRestoreDisabled: function (element) {
 		return ($(element).closest('tr').data('restoreDisabled') || '');
 	},
-	getUserEnabled: function(element) {
+	getUserEnabled: function (element) {
 		return ($(element).closest('tr').data('userEnabled') || '');
 	},
-	initDeleteHandling: function() {
+	initDeleteHandling: function () {
 		//set up handler
 		UserDeleteHandler = new DeleteHandler('/settings/users/users', 'username',
-											UserList.markRemove, UserList.remove);
+			UserList.markRemove, UserList.remove);
 
 		//configure undo
 		OC.Notification.hide();
 		var msg = escapeHTML(t('settings', 'deleted {userName}', {userName: '%oid'})) + '<span class="undo">' +
 			escapeHTML(t('settings', 'undo')) + '</span>';
 		UserDeleteHandler.setNotification(OC.Notification, 'deleteuser', msg,
-										UserList.undoRemove);
+			UserList.undoRemove);
 
 		//when to mark user for delete
 		$userListBody.on('click', '.action-remove', function () {
@@ -352,7 +364,7 @@ var UserList = {
 			var uid = UserList.getUID(this);
 
 			if (OC.PasswordConfirmation.requiresPasswordConfirmation()) {
-				OC.PasswordConfirmation.requirePasswordConfirmation(function() {
+				OC.PasswordConfirmation.requirePasswordConfirmation(function () {
 					UserDeleteHandler.mark(uid);
 				});
 				return;
@@ -370,25 +382,25 @@ var UserList = {
 		if (UserList.updating) {
 			return;
 		}
-		if(!limit) {
+		if (!limit) {
 			limit = UserList.usersToLoad;
 		}
 		$userList.siblings('.loading').css('visibility', 'visible');
 		UserList.updating = true;
-		if(gid === undefined) {
+		if (gid === undefined) {
 			gid = '';
 		}
 		UserList.currentGid = gid;
 		var pattern = this.filter;
 		$.get(
 			OC.generateUrl('/settings/users/users'),
-			{ offset: UserList.offset, limit: limit, gid: gid, pattern: pattern },
+			{offset: UserList.offset, limit: limit, gid: gid, pattern: pattern},
 			function (result) {
 				//The offset does not mirror the amount of users available,
 				//because it is backend-dependent. For correct retrieval,
 				//always the limit(requested amount of users) needs to be added.
 				$.each(result, function (index, user) {
-					if(UserList.has(user.name)) {
+					if (UserList.has(user.name)) {
 						return true;
 					}
 					UserList.add(user);
@@ -407,16 +419,16 @@ var UserList = {
 					UserList.noMoreEntries = true;
 					$userList.siblings('.loading').remove();
 
-					if (pattern !== ""){
+					if (pattern !== "") {
 						$userListHead.hide();
 						$emptyContainer.show();
 						$emptyContainer.find('h2').html(t('settings', 'No user found for <strong>{pattern}</strong>', {pattern: pattern}));
 					}
 				}
 				UserList.offset += limit;
-			}).always(function() {
-				UserList.updating = false;
-			});
+			}).always(function () {
+			UserList.updating = false;
+		});
 	},
 
 	applyGroupSelect: function (element, user, checked) {
@@ -429,7 +441,7 @@ var UserList = {
 
 		var addUserToGroup = null,
 			removeUserFromGroup = null;
-		if(user) { // Only if in a user row, and not the #newusergroups select
+		if (user) { // Only if in a user row, and not the #newusergroups select
 			var handleUserGroupMembership = function (group, add) {
 				if (user === OC.getCurrentUser().uid && group === 'admin') {
 					return false;
@@ -446,7 +458,7 @@ var UserList = {
 				}
 
 				$.ajax({
-					url: OC.linkToOCS('cloud/users/' + user , 2) + 'groups',
+					url: OC.linkToOCS('cloud/users/' + user, 2) + 'groups',
 					data: {
 						groupid: group
 					},
@@ -454,7 +466,7 @@ var UserList = {
 					beforeSend: function (request) {
 						request.setRequestHeader('Accept', 'application/json');
 					},
-					success: function() {
+					success: function () {
 						GroupList.update();
 						if (add && UserList.availableGroups.indexOf(group) === -1) {
 							UserList.availableGroups.push(group);
@@ -466,7 +478,7 @@ var UserList = {
 							GroupList.decGroupCount(group);
 						}
 					},
-					error: function() {
+					error: function () {
 						if (add) {
 							OC.Notification.show(t('settings', 'Unable to add user to group {group}', {
 								group: group
@@ -541,7 +553,7 @@ var UserList = {
 		});
 	},
 
-	_onScroll: function() {
+	_onScroll: function () {
 		if (!!UserList.noMoreEntries) {
 			return;
 		}
@@ -550,28 +562,48 @@ var UserList = {
 		}
 	},
 
+	updateQuotaProgressbar: function ($tr, quota, size) {
+		var usedQuota;
+		if (quota > 0) {
+			usedQuota = Math.min(100, Math.round(size / quota * 100));
+		} else {
+			var usedInGB = size / (10 * Math.pow(2, 30));
+			//asymptotic curve approaching 50% at 10GB to visualize used stace with infinite quota
+			usedQuota = 95 * (1 - (1 / (usedInGB + 1)));
+		}
+		$tr.find('.quota_progress').width(usedQuota + '%');
+	},
+
 	/**
 	 * Event handler for when a quota has been changed through a single select.
 	 * This will save the value.
 	 */
-	onQuotaSelect: function(ev) {
+	onQuotaSelect: function (ev) {
 		var $select = $(ev.target);
+		var $tr = $select.closest('tr');
+		const size = $tr.data('size');
 		var uid = UserList.getUID($select);
 		var quota = $select.val();
 		if (quota === 'other') {
 			return;
 		}
-		if ((quota !== 'default' && quota !=="none") && (!OC.Util.computerFileSize(quota))) {
+		if ((quota !== 'default' && quota !== "none") && (!OC.Util.computerFileSize(quota))) {
 			// the select component has added the bogus value, delete it again
 			$select.find('option[selected]').remove();
 			OC.Notification.showTemporary(t('core', 'Invalid quota value "{val}"', {val: quota}));
 			return;
 		}
-		UserList._updateQuota(uid, quota, function(returnedQuota) {
+
+		UserList._updateQuota(uid, quota, function (returnedQuota) {
 			if (quota !== returnedQuota) {
 				$select.find(':selected').text(returnedQuota);
+				UserList.updateQuotaProgressbar($tr, OC.Util.computerFileSize(returnedQuota), size);
 			}
 		});
+
+		UserList.updateQuotaProgressbar($tr, OC.Util.computerFileSize(quota), size);
+		// remove the background color that the "other" option placed on the select
+		$select.css('background-color', 'transparent');
 	},
 
 	/**
@@ -580,7 +612,7 @@ var UserList = {
 	 * @param {String} quota quota value
 	 * @param {Function} ready callback after save
 	 */
-	_updateQuota: function(uid, quota, ready) {
+	_updateQuota: function (uid, quota, ready) {
 		if (OC.PasswordConfirmation.requiresPasswordConfirmation()) {
 			OC.PasswordConfirmation.requirePasswordConfirmation(_.bind(this._updateQuota, this, uid, quota, ready));
 			return;
@@ -604,7 +636,7 @@ var UserList = {
 	/**
 	 * Creates a temporary jquery.multiselect selector on the given group field
 	 */
-	_triggerGroupEdit: function($td, isSubadminSelect) {
+	_triggerGroupEdit: function ($td, isSubadminSelect) {
 		var $groupsListContainer = $td.find('.groupsListContainer');
 		var placeholder = $groupsListContainer.attr('data-placeholder') || t('settings', 'no group');
 		var user = UserList.getUID($td);
@@ -621,7 +653,7 @@ var UserList = {
 			$groupsSelect = $('<select multiple="multiple" class="subadminsselect multiselect button" title="' + placeholder + '"></select>')
 		}
 
-		function createItem(group) {
+		function createItem (group) {
 			if (isSubadminSelect && group === 'admin') {
 				// can't become subadmin of "admin" group
 				return;
@@ -652,7 +684,7 @@ var UserList = {
 
 		$groupsListContainer.addClass('hidden');
 		$td.find('.multiselect:not(.groupsListContainer):first').click();
-		$groupsSelect.on('dropdownclosed', function(e) {
+		$groupsSelect.on('dropdownclosed', function (e) {
 			$groupsSelect.remove();
 			$td.find('.multiselect:not(.groupsListContainer)').parent().remove();
 			$td.find('.multiselectoptions').remove();
@@ -664,7 +696,7 @@ var UserList = {
 	/**
 	 * Updates the groups list td with the given groups selection
 	 */
-	_updateGroupListLabel: function($td, groups) {
+	_updateGroupListLabel: function ($td, groups) {
 		var placeholder = $td.find('.groupsListContainer').attr('data-placeholder');
 		var $groupsEl = $td.find('.groupsList');
 		$groupsEl.text(groups.join(', ') || placeholder || t('settings', 'no group'));
@@ -682,23 +714,25 @@ $(document).ready(function () {
 	UserList.initDeleteHandling();
 
 	// Implements User Search
-	OCA.Search.users= new UserManagementFilter(UserList, GroupList);
+	OCA.Search.users = new UserManagementFilter(UserList, GroupList);
 
 	UserList.scrollArea = $('#app-content');
 
 	UserList.doSort();
 	UserList.availableGroups = $userList.data('groups');
 
-	UserList.scrollArea.scroll(function(e) {UserList._onScroll(e);});
+	UserList.scrollArea.scroll(function (e) {
+		UserList._onScroll(e);
+	});
 
 	$userList.after($('<div class="loading" style="height: 200px; visibility: hidden;"></div>'));
 
 	// TODO: move other init calls inside of initialize
 	UserList.initialize($('#userlist'));
 
-	var _submitPasswordChange = function(uid, password, recoveryPasswordVal, blurFunction) {
+	var _submitPasswordChange = function (uid, password, recoveryPasswordVal, blurFunction) {
 		if (OC.PasswordConfirmation.requiresPasswordConfirmation()) {
-			OC.PasswordConfirmation.requirePasswordConfirmation(function() {
+			OC.PasswordConfirmation.requirePasswordConfirmation(function () {
 				_submitPasswordChange(uid, password, recoveryPasswordVal, blurFunction);
 			});
 			return;
@@ -706,7 +740,11 @@ $(document).ready(function () {
 
 		$.post(
 			OC.generateUrl('/settings/users/changepassword'),
-			{username: uid, password: password, recoveryPassword: recoveryPasswordVal},
+			{
+				username: uid,
+				password: password,
+				recoveryPassword: recoveryPasswordVal
+			},
 			function (result) {
 				blurFunction();
 				if (result.status === 'success') {
@@ -733,11 +771,11 @@ $(document).ready(function () {
 			$tr.removeClass('row-warning');
 		};
 		blurFunction = _.bind(blurFunction, $input);
-		if(isRestoreDisabled) {
+		if (isRestoreDisabled) {
 			$tr.addClass('row-warning');
 			// add tooltip if the password change could cause data loss - no recovery enabled
 			$input.attr('title', t('settings', 'Changing the password will result in data loss, because data recovery is not available for this user'));
-			$input.tooltip({placement:'bottom'});
+			$input.tooltip({placement: 'bottom'});
 		}
 		$td.find('img').hide();
 		$td.children('span').replaceWith($input);
@@ -756,18 +794,18 @@ $(document).ready(function () {
 			})
 			.blur(blurFunction);
 	});
-	$('input:password[id="recoveryPassword"]').keyup(function() {
+	$('input:password[id="recoveryPassword"]').keyup(function () {
 		OC.Notification.hide();
 	});
 
-	var _submitDisplayNameChange = function($tr, uid, displayName, blurFunction) {
+	var _submitDisplayNameChange = function ($tr, uid, displayName, blurFunction) {
 		var $div = $tr.find('div.avatardiv');
 		if ($div.length) {
 			$div.imageplaceholder(uid, displayName);
 		}
 
 		if (OC.PasswordConfirmation.requiresPasswordConfirmation()) {
-			OC.PasswordConfirmation.requirePasswordConfirmation(function() {
+			OC.PasswordConfirmation.requirePasswordConfirmation(function () {
 				_submitDisplayNameChange($tr, uid, displayName, blurFunction);
 			});
 			return;
@@ -781,7 +819,7 @@ $(document).ready(function () {
 				displayName: displayName
 			}
 		}).success(function (result) {
-			if (result && result.status==='success' && $div.length){
+			if (result && result.status === 'success' && $div.length) {
 				$div.avatar(result.data.username, 32);
 			}
 			$tr.data('displayname', displayName);
@@ -799,7 +837,7 @@ $(document).ready(function () {
 		var uid = UserList.getUID($td);
 		var displayName = escapeHTML(UserList.getDisplayName($td));
 		var $input = $('<input type="text" value="' + displayName + '">');
-		var blurFunction = function() {
+		var blurFunction = function () {
 			var displayName = $tr.data('displayname');
 			$input.replaceWith('<span>' + escapeHTML(displayName) + '</span>');
 			$td.find('img').show();
@@ -821,9 +859,9 @@ $(document).ready(function () {
 			.blur(blurFunction);
 	});
 
-	var _submitEmailChange = function($tr, $td, $input, uid, mailAddress, blurFunction) {
+	var _submitEmailChange = function ($tr, $td, $input, uid, mailAddress, blurFunction) {
 		if (OC.PasswordConfirmation.requiresPasswordConfirmation()) {
-			OC.PasswordConfirmation.requirePasswordConfirmation(function() {
+			OC.PasswordConfirmation.requirePasswordConfirmation(function () {
 				_submitEmailChange($tr, $td, $input, uid, mailAddress, blurFunction);
 			});
 			return;
@@ -865,8 +903,8 @@ $(document).ready(function () {
 		var uid = UserList.getUID($td);
 		var mailAddress = escapeHTML(UserList.getMailAddress($td));
 		var $input = $('<input type="text">').val(mailAddress);
-		var blurFunction = function() {
-			if($td.find('.loading-small').css('display') === 'inline-block') {
+		var blurFunction = function () {
+			if ($td.find('.loading-small').css('display') === 'inline-block') {
 				// in Chrome the blur event is fired too early by the browser - even if the request is still running
 				return;
 			}
@@ -910,21 +948,21 @@ $(document).ready(function () {
 		var $tr = $($td).closest('tr');
 		var menudiv = $tr.find('.popovermenu');
 
-		if($tr.is('.active')) {
+		if ($tr.is('.active')) {
 			$tr.removeClass('active');
 			return;
 		}
 		$('#userlist tr.active').removeClass('active');
 		menudiv.find('.action-togglestate').empty();
-		if($tr.data('userEnabled')) {
-			$('.action-togglestate', $td).html('<span class="icon icon-close"></span><span>'+t('settings', 'Disable')+'</span>');
+		if ($tr.data('userEnabled')) {
+			$('.action-togglestate', $td).html('<span class="icon icon-close"></span><span>' + t('settings', 'Disable') + '</span>');
 		} else {
-			$('.action-togglestate', $td).html('<span class="icon icon-add"></span><span>'+t('settings', 'Enable')+'</span>');
+			$('.action-togglestate', $td).html('<span class="icon icon-add"></span><span>' + t('settings', 'Enable') + '</span>');
 		}
 		$tr.addClass('active');
 	});
 
-	$(document.body).click(function() {
+	$(document.body).click(function () {
 		$('#userlist tr.active').removeClass('active');
 	});
 
@@ -938,23 +976,23 @@ $(document).ready(function () {
 			OC.generateUrl('/settings/users/{id}/setEnabled', {id: uid}),
 			{username: uid, enabled: setEnabled},
 			function (result) {
-				if (result && result.status==='success'){
+				if (result && result.status === 'success') {
 					var count = GroupList.getUserCount(GroupList.getGroupLI('_disabledUsers'));
 					$tr.remove();
-					if(result.data.enabled == 1) {
+					if (result.data.enabled == 1) {
 						$tr.data('userEnabled', true);
-						GroupList.setUserCount(GroupList.getGroupLI('_disabledUsers'), count-1);
+						GroupList.setUserCount(GroupList.getGroupLI('_disabledUsers'), count - 1);
 					} else {
 						$tr.data('userEnabled', false);
-						GroupList.setUserCount(GroupList.getGroupLI('_disabledUsers'), count+1);
+						GroupList.setUserCount(GroupList.getGroupLI('_disabledUsers'), count + 1);
 					}
 				} else {
 					OC.dialogs.alert(result.data.message, t('settings', 'Error while changing status of {user}', {user: uid}));
 				}
 			}
-		).fail(function(result){
+		).fail(function (result) {
 			var message = 'Unknown error';
-			if( result.responseJSON &&
+			if (result.responseJSON &&
 				result.responseJSON.data &&
 				result.responseJSON.data.message) {
 				message = result.responseJSON.data.message;
@@ -962,13 +1000,13 @@ $(document).ready(function () {
 			OC.dialogs.alert(message, t('settings', 'Error while changing status of {user}', {user: uid}));
 		});
 	});
-	
+
 	// init the quota field select box after it is shown the first time
-	$('#app-settings').one('show', function() {
+	$('#app-settings').one('show', function () {
 		$(this).find('#default_quota').singleSelect().on('change', UserList.onQuotaSelect);
 	});
 
-	$('#newuser input').click(function() {
+	$('#newuser input').click(function () {
 		// empty the container also here to avoid visual delay
 		$emptyContainer.hide();
 		OC.Search = new OCA.Search($('#searchbox'), $('#searchresults'));
@@ -979,7 +1017,7 @@ $(document).ready(function () {
 	var _submitNewUserForm = function (event) {
 		event.preventDefault();
 		if (OC.PasswordConfirmation.requiresPasswordConfirmation()) {
-			OC.PasswordConfirmation.requirePasswordConfirmation(function() {
+			OC.PasswordConfirmation.requirePasswordConfirmation(function () {
 				_submitNewUserForm(event);
 			});
 			return;
@@ -1000,11 +1038,11 @@ $(document).ready(function () {
 			}));
 			return false;
 		}
-		if(!$('#CheckboxMailOnUserCreate').is(':checked')) {
+		if (!$('#CheckboxMailOnUserCreate').is(':checked')) {
 			email = '';
 		}
 		if ($('#CheckboxMailOnUserCreate').is(':checked') && $.trim(email) === '') {
-			OC.Notification.showTemporary( t('settings', 'Error creating user: {message}', {
+			OC.Notification.showTemporary(t('settings', 'Error creating user: {message}', {
 				message: t('settings', 'A valid email must be provided')
 			}));
 			return false;
@@ -1017,7 +1055,7 @@ $(document).ready(function () {
 			promise = $.Deferred().resolve().promise();
 		}
 
-		promise.then(function() {
+		promise.then(function () {
 			var groups = $('#newuser .groups').data('groups') || [];
 			$.post(
 				OC.generateUrl('/settings/users/users'),
@@ -1031,7 +1069,7 @@ $(document).ready(function () {
 					if (result.groups) {
 						for (var i in result.groups) {
 							var gid = result.groups[i];
-							if(UserList.availableGroups.indexOf(gid) === -1) {
+							if (UserList.availableGroups.indexOf(gid) === -1) {
 								UserList.availableGroups.push(gid);
 							}
 							var $li = GroupList.getGroupLI(gid);
@@ -1039,19 +1077,19 @@ $(document).ready(function () {
 							GroupList.setUserCount($li, userCount + 1);
 						}
 					}
-					if(!UserList.has(username)) {
+					if (!UserList.has(username)) {
 						UserList.add(result);
 						UserList.doSort();
 					}
 					$('#newusername').focus();
 					GroupList.incEveryoneCount();
-				}).fail(function(result) {
-					OC.Notification.showTemporary(t('settings', 'Error creating user: {message}', {
-						message: result.responseJSON.message
-					}, undefined, {escape: false}));
-				}).success(function(){
-					$('#newuser').get(0).reset();
-				});
+				}).fail(function (result) {
+				OC.Notification.showTemporary(t('settings', 'Error creating user: {message}', {
+					message: result.responseJSON.message
+				}, undefined, {escape: false}));
+			}).success(function () {
+				$('#newuser').get(0).reset();
+			});
 		});
 	};
 	$('#newuser').submit(_submitNewUserForm);
@@ -1060,7 +1098,7 @@ $(document).ready(function () {
 		$("#userlist .storageLocation").show();
 	}
 	// Option to display/hide the "Storage location" column
-	$('#CheckboxStorageLocation').click(function() {
+	$('#CheckboxStorageLocation').click(function () {
 		if ($('#CheckboxStorageLocation').is(':checked')) {
 			$("#userlist .storageLocation").show();
 			if (OC.isUserAdmin()) {
@@ -1078,7 +1116,7 @@ $(document).ready(function () {
 		$("#userlist .lastLogin").show();
 	}
 	// Option to display/hide the "Last Login" column
-	$('#CheckboxLastLogin').click(function() {
+	$('#CheckboxLastLogin').click(function () {
 		if ($('#CheckboxLastLogin').is(':checked')) {
 			$("#userlist .lastLogin").show();
 			if (OC.isUserAdmin()) {
@@ -1096,7 +1134,7 @@ $(document).ready(function () {
 		$("#userlist .mailAddress").show();
 	}
 	// Option to display/hide the "Mail Address" column
-	$('#CheckboxEmailAddress').click(function() {
+	$('#CheckboxEmailAddress').click(function () {
 		if ($('#CheckboxEmailAddress').is(':checked')) {
 			$("#userlist .mailAddress").show();
 			if (OC.isUserAdmin()) {
@@ -1114,7 +1152,7 @@ $(document).ready(function () {
 		$("#userlist .userBackend").show();
 	}
 	// Option to display/hide the "User Backend" column
-	$('#CheckboxUserBackend').click(function() {
+	$('#CheckboxUserBackend').click(function () {
 		if ($('#CheckboxUserBackend').is(':checked')) {
 			$("#userlist .userBackend").show();
 			if (OC.isUserAdmin()) {
@@ -1132,7 +1170,7 @@ $(document).ready(function () {
 		$("#newemail").show();
 	}
 	// Option to display/hide the "E-Mail" input field
-	$('#CheckboxMailOnUserCreate').click(function() {
+	$('#CheckboxMailOnUserCreate').click(function () {
 		if ($('#CheckboxMailOnUserCreate').is(':checked')) {
 			$("#newemail").show();
 			if (OC.isUserAdmin()) {
@@ -1149,14 +1187,14 @@ $(document).ready(function () {
 	// calculate initial limit of users to load
 	var initialUserCountLimit = UserList.initialUsersToLoad,
 		containerHeight = $('#app-content').height();
-	if(containerHeight > 40) {
-		initialUserCountLimit = Math.floor(containerHeight/40);
+	if (containerHeight > 40) {
+		initialUserCountLimit = Math.floor(containerHeight / 40);
 		if (initialUserCountLimit < UserList.initialUsersToLoad) {
 			initialUserCountLimit = UserList.initialUsersToLoad;
 		}
 	}
 	//realign initialUserCountLimit with usersToLoad as a safeguard
-	while((initialUserCountLimit % UserList.usersToLoad) !== 0) {
+	while ((initialUserCountLimit % UserList.usersToLoad) !== 0) {
 		// must be a multiple of this, otherwise LDAP freaks out.
 		// FIXME: solve this in LDAP backend in  8.1
 		initialUserCountLimit = initialUserCountLimit + 1;
@@ -1165,7 +1203,7 @@ $(document).ready(function () {
 	// trigger loading of users on startup
 	UserList.update(UserList.currentGid, initialUserCountLimit);
 
-	_.defer(function() {
+	_.defer(function () {
 		$('#app-content').trigger($.Event('apprendered'));
 	});
 

settings/templates/users/part.userlist.php

@@ -43,6 +43,7 @@
 			</td>
 		<?php endif;?>
 			<td class="quota">
+				<div class="quota_progress_container"><div class="quota_progress"></div></div>
 				<select class="quota-user" data-inputtitle="<?php p($l->t('Please enter storage quota (ex: "512 MB" or "12 GB")')) ?>">
 					<option	value='default'>
 						<?php p($l->t('Default'));?>

tests/Settings/Controller/UsersControllerTest.php

@@ -19,6 +19,7 @@ use OCP\AppFramework\Http;
 use OCP\AppFramework\Http\DataResponse;
 use OCP\AppFramework\Utility\ITimeFactory;
 use OCP\BackgroundJob\IJobList;
+use OCP\Files\Config\IUserMountCache;
 use OCP\IAvatar;
 use OCP\IAvatarManager;
 use OCP\IConfig;
@@ -79,6 +80,8 @@ class UsersControllerTest extends \Test\TestCase {
 	private $jobList;
 	/** @var \OC\Security\IdentityProof\Manager |\PHPUnit_Framework_MockObject_MockObject  */
 	private $securityManager;
+	/** @var IUserMountCache |\PHPUnit_Framework_MockObject_MockObject */
+	private $userMountCache;
 
 	protected function setUp() {
 		parent::setUp();
@@ -106,6 +109,7 @@ class UsersControllerTest extends \Test\TestCase {
 			->will($this->returnCallback(function ($text, $parameters = []) {
 				return vsprintf($text, $parameters);
 			}));
+		$this->userMountCache = $this->createMock(IUserMountCache::class);
 
 		/*
 		 * Set default avatar behaviour for whole test suite
@@ -149,7 +153,8 @@ class UsersControllerTest extends \Test\TestCase {
 				$this->timeFactory,
 				$this->crypto,
 				$this->securityManager,
-				$this->jobList
+				$this->jobList,
+				$this->userMountCache
 
 			);
 		} else {
@@ -175,7 +180,8 @@ class UsersControllerTest extends \Test\TestCase {
 						$this->timeFactory,
 						$this->crypto,
 						$this->securityManager,
-						$this->jobList
+						$this->jobList,
+						$this->userMountCache,
 					]
 				)->setMethods($mockedMethods)->getMock();
 		}
@@ -198,7 +204,7 @@ class UsersControllerTest extends \Test\TestCase {
 			->method('getEMailAddress')
 			->will($this->returnValue('foo@bar.com'));
 		$foo
-			->expects($this->once())
+			->expects($this->exactly(2))
 			->method('getQuota')
 			->will($this->returnValue('1024'));
 		$foo
@@ -228,7 +234,7 @@ class UsersControllerTest extends \Test\TestCase {
 			->method('getEMailAddress')
 			->will($this->returnValue('admin@bar.com'));
 		$admin
-			->expects($this->once())
+			->expects($this->exactly(2))
 			->method('getQuota')
 			->will($this->returnValue('404'));
 		$admin
@@ -260,7 +266,7 @@ class UsersControllerTest extends \Test\TestCase {
 			->method('getEMailAddress')
 			->will($this->returnValue('bar@dummy.com'));
 		$bar
-			->expects($this->once())
+			->expects($this->exactly(2))
 			->method('getQuota')
 			->will($this->returnValue('2323'));
 		$bar
@@ -331,6 +337,11 @@ class UsersControllerTest extends \Test\TestCase {
 			->method('getSubAdmin')
 			->will($this->returnValue($subadmin));
 
+		$this->userMountCache
+			->expects($this->once())
+			->method('getUsedSpaceForUsers')
+			->will($this->returnValue(['admin' => 200, 'bar' => 2000, 'foo' => 512]));
+
 		$expectedResponse = new DataResponse(
 			array(
 				0 => array(
@@ -339,6 +350,7 @@ class UsersControllerTest extends \Test\TestCase {
 					'groups' => array('Users', 'Support'),
 					'subadmin' => array(),
 					'quota' => 1024,
+					'quota_bytes' => 1024,
 					'storageLocation' => '/home/foo',
 					'lastLogin' => 500000,
 					'backend' => 'OC_User_Database',
@@ -346,6 +358,7 @@ class UsersControllerTest extends \Test\TestCase {
 					'isRestoreDisabled' => false,
 					'isAvatarAvailable' => true,
 					'isEnabled' => true,
+					'size' => 512,
 				),
 				1 => array(
 					'name' => 'admin',
@@ -353,6 +366,7 @@ class UsersControllerTest extends \Test\TestCase {
 					'groups' => array('admins', 'Support'),
 					'subadmin' => array(),
 					'quota' => 404,
+					'quota_bytes' => 404,
 					'storageLocation' => '/home/admin',
 					'lastLogin' => 12000,
 					'backend' => Dummy::class,
@@ -360,6 +374,7 @@ class UsersControllerTest extends \Test\TestCase {
 					'isRestoreDisabled' => false,
 					'isAvatarAvailable' => false,
 					'isEnabled' => true,
+					'size' => 200,
 				),
 				2 => array(
 					'name' => 'bar',
@@ -367,6 +382,7 @@ class UsersControllerTest extends \Test\TestCase {
 					'groups' => array('External Users'),
 					'subadmin' => array(),
 					'quota' => 2323,
+					'quota_bytes' => 2323,
 					'storageLocation' => '/home/bar',
 					'lastLogin' => 3999000,
 					'backend' => Dummy::class,
@@ -374,6 +390,7 @@ class UsersControllerTest extends \Test\TestCase {
 					'isRestoreDisabled' => false,
 					'isAvatarAvailable' => true,
 					'isEnabled' => false,
+					'size' => 2000,
 				),
 			)
 		);
@@ -404,7 +421,7 @@ class UsersControllerTest extends \Test\TestCase {
 			->method('getEMailAddress')
 			->will($this->returnValue('foo@bar.com'));
 		$foo
-			->expects($this->once())
+			->expects($this->exactly(2))
 			->method('getQuota')
 			->will($this->returnValue('1024'));
 		$foo
@@ -434,7 +451,7 @@ class UsersControllerTest extends \Test\TestCase {
 			->method('getEMailAddress')
 			->will($this->returnValue('admin@bar.com'));
 		$admin
-			->expects($this->once())
+			->expects($this->exactly(2))
 			->method('getQuota')
 			->will($this->returnValue('404'));
 		$admin
@@ -466,7 +483,7 @@ class UsersControllerTest extends \Test\TestCase {
 			->method('getEMailAddress')
 			->will($this->returnValue('bar@dummy.com'));
 		$bar
-			->expects($this->once())
+			->expects($this->exactly(2))
 			->method('getQuota')
 			->will($this->returnValue('2323'));
 		$bar
@@ -545,6 +562,11 @@ class UsersControllerTest extends \Test\TestCase {
 			->method('getSubAdmin')
 			->will($this->returnValue($subadmin));
 
+		$this->userMountCache
+			->expects($this->once())
+			->method('getUsedSpaceForUsers')
+			->will($this->returnValue(['admin' => 200, 'bar' => 2000, 'foo' => 512]));
+
 		$expectedResponse = new DataResponse(
 			[
 				0 => [
@@ -553,6 +575,7 @@ class UsersControllerTest extends \Test\TestCase {
 					'groups' => ['SubGroup1'],
 					'subadmin' => [],
 					'quota' => 2323,
+					'quota_bytes' => 2323,
 					'storageLocation' => '/home/bar',
 					'lastLogin' => 3999000,
 					'backend' => Dummy::class,
@@ -560,6 +583,7 @@ class UsersControllerTest extends \Test\TestCase {
 					'isRestoreDisabled' => false,
 					'isAvatarAvailable' => true,
 					'isEnabled' => true,
+					'size' => 2000,
 				],
 				1=> [
 					'name' => 'foo',
@@ -567,6 +591,7 @@ class UsersControllerTest extends \Test\TestCase {
 					'groups' => ['SubGroup2', 'SubGroup1'],
 					'subadmin' => [],
 					'quota' => 1024,
+					'quota_bytes' => 1024,
 					'storageLocation' => '/home/foo',
 					'lastLogin' => 500000,
 					'backend' => 'OC_User_Database',
@@ -574,6 +599,7 @@ class UsersControllerTest extends \Test\TestCase {
 					'isRestoreDisabled' => false,
 					'isAvatarAvailable' => true,
 					'isEnabled' => true,
+					'size' => 512,
 				],
 				2 => [
 					'name' => 'admin',
@@ -581,6 +607,7 @@ class UsersControllerTest extends \Test\TestCase {
 					'groups' => ['SubGroup2'],
 					'subadmin' => [],
 					'quota' => 404,
+					'quota_bytes' => 404,
 					'storageLocation' => '/home/admin',
 					'lastLogin' => 12000,
 					'backend' => Dummy::class,
@@ -588,6 +615,7 @@ class UsersControllerTest extends \Test\TestCase {
 					'isRestoreDisabled' => false,
 					'isAvatarAvailable' => false,
 					'isEnabled' => true,
+					'size' => 200,
 				],
 			]
 		);
@@ -617,7 +645,7 @@ class UsersControllerTest extends \Test\TestCase {
 			->method('getEMailAddress')
 			->will($this->returnValue('foo@bar.com'));
 		$foo
-			->expects($this->once())
+			->expects($this->exactly(2))
 			->method('getQuota')
 			->will($this->returnValue('1024'));
 		$foo
@@ -647,7 +675,7 @@ class UsersControllerTest extends \Test\TestCase {
 			->method('getEMailAddress')
 			->will($this->returnValue('admin@bar.com'));
 		$admin
-			->expects($this->once())
+			->expects($this->exactly(2))
 			->method('getQuota')
 			->will($this->returnValue('404'));
 		$admin
@@ -679,7 +707,7 @@ class UsersControllerTest extends \Test\TestCase {
 			->method('getEMailAddress')
 			->will($this->returnValue('bar@dummy.com'));
 		$bar
-			->expects($this->once())
+			->expects($this->exactly(2))
 			->method('getQuota')
 			->will($this->returnValue('2323'));
 		$bar
@@ -717,6 +745,11 @@ class UsersControllerTest extends \Test\TestCase {
 			->method('getSubAdmin')
 			->will($this->returnValue($subadmin));
 
+		$this->userMountCache
+			->expects($this->once())
+			->method('getUsedSpaceForUsers')
+			->will($this->returnValue(['admin' => 200, 'bar' => 2000, 'foo' => 512]));
+
 		$expectedResponse = new DataResponse(
 			array(
 				0 => array(
@@ -725,6 +758,7 @@ class UsersControllerTest extends \Test\TestCase {
 					'groups' => array('Users', 'Support'),
 					'subadmin' => array(),
 					'quota' => 1024,
+					'quota_bytes' => 1024,
 					'storageLocation' => '/home/foo',
 					'lastLogin' => 500000,
 					'backend' => 'OC_User_Database',
@@ -732,6 +766,7 @@ class UsersControllerTest extends \Test\TestCase {
 					'isRestoreDisabled' => false,
 					'isAvatarAvailable' => true,
 					'isEnabled' => true,
+					'size' => 512,
 				),
 				1 => array(
 					'name' => 'admin',
@@ -739,6 +774,7 @@ class UsersControllerTest extends \Test\TestCase {
 					'groups' => array('admins', 'Support'),
 					'subadmin' => array(),
 					'quota' => 404,
+					'quota_bytes' => 404,
 					'storageLocation' => '/home/admin',
 					'lastLogin' => 12000,
 					'backend' => Dummy::class,
@@ -746,6 +782,7 @@ class UsersControllerTest extends \Test\TestCase {
 					'isRestoreDisabled' => false,
 					'isAvatarAvailable' => false,
 					'isEnabled' => true,
+					'size' => 200,
 				),
 				2 => array(
 					'name' => 'bar',
@@ -753,6 +790,7 @@ class UsersControllerTest extends \Test\TestCase {
 					'groups' => array('External Users'),
 					'subadmin' => array(),
 					'quota' => 2323,
+					'quota_bytes' => 2323,
 					'storageLocation' => '/home/bar',
 					'lastLogin' => 3999000,
 					'backend' => Dummy::class,
@@ -760,6 +798,7 @@ class UsersControllerTest extends \Test\TestCase {
 					'isRestoreDisabled' => false,
 					'isAvatarAvailable' => true,
 					'isEnabled' => true,
+					'size' => 2000,
 				),
 			)
 		);
@@ -784,7 +823,7 @@ class UsersControllerTest extends \Test\TestCase {
 			->method('getEMailAddress')
 			->will($this->returnValue(null));
 		$user
-			->expects($this->once())
+			->expects($this->exactly(2))
 			->method('getQuota')
 			->will($this->returnValue('none'));
 		$user
@@ -825,6 +864,11 @@ class UsersControllerTest extends \Test\TestCase {
 			->method('getSubAdmin')
 			->will($this->returnValue($subadmin));
 
+		$this->userMountCache
+			->expects($this->once())
+			->method('getUsedSpaceForUsers')
+			->will($this->returnValue(['foo' => 512]));
+
 		$expectedResponse = new DataResponse(
 			array(
 				0 => array(
@@ -833,6 +877,7 @@ class UsersControllerTest extends \Test\TestCase {
 					'groups' => null,
 					'subadmin' => array(),
 					'quota' => 'none',
+					'quota_bytes' => 0,
 					'storageLocation' => '/home/foo',
 					'lastLogin' => 500000,
 					'backend' => 'OC_User_Database',
@@ -840,6 +885,7 @@ class UsersControllerTest extends \Test\TestCase {
 					'isRestoreDisabled' => false,
 					'isAvatarAvailable' => true,
 					'isEnabled' => true,
+					'size' => 512,
 				)
 			)
 		);
@@ -860,6 +906,11 @@ class UsersControllerTest extends \Test\TestCase {
 			->with('')
 			->will($this->returnValue([]));
 
+		$this->userMountCache
+			->expects($this->once())
+			->method('getUsedSpaceForUsers')
+			->will($this->returnValue([]));
+
 		$expectedResponse = new DataResponse([]);
 		$response = $controller->index(0, 10, '','', Dummy::class);
 		$this->assertEquals($expectedResponse, $response);
@@ -915,6 +966,7 @@ class UsersControllerTest extends \Test\TestCase {
 				'isRestoreDisabled' => false,
 				'isAvatarAvailable' => true,
 				'isEnabled' => true,
+				'quota_bytes' => false,
 			),
 			Http::STATUS_CREATED
 		);
@@ -1001,6 +1053,7 @@ class UsersControllerTest extends \Test\TestCase {
 				'isRestoreDisabled' => false,
 				'isAvatarAvailable' => true,
 				'isEnabled' => true,
+				'quota_bytes' => false,
 			),
 			Http::STATUS_CREATED
 		);
@@ -1093,6 +1146,7 @@ class UsersControllerTest extends \Test\TestCase {
 				'isRestoreDisabled' => false,
 				'isAvatarAvailable' => true,
 				'isEnabled' => true,
+				'quota_bytes' => false,
 			),
 			Http::STATUS_CREATED
 		);
@@ -1560,6 +1614,7 @@ class UsersControllerTest extends \Test\TestCase {
 			'isRestoreDisabled' => false,
 			'isAvatarAvailable' => true,
 			'isEnabled' => $enabled,
+			'quota_bytes' => false,
 		];
 
 		return [$user, $result];
@@ -2393,6 +2448,7 @@ class UsersControllerTest extends \Test\TestCase {
 				'lastLogin' => 0,
 				'displayname' => 'John Doe',
 				'quota' => null,
+				'quota_bytes' => false,
 				'subadmin' => array(),
 				'email' => 'abc@example.org',
 				'isRestoreDisabled' => false,

tests/lib/Files/Config/UserMountCacheTest.php

@@ -13,6 +13,7 @@ use OC\Files\Mount\MountPoint;
 use OC\Log;
 use OC\User\Manager;
 use OCP\Files\Config\ICachedMountInfo;
+use OC\Files\Storage\Storage;
 use OCP\IConfig;
 use OCP\IDBConnection;
 use OCP\IUserManager;
@@ -310,7 +311,7 @@ class UserMountCacheTest extends TestCase {
 		});
 	}
 
-	private function createCacheEntry($internalPath, $storageId) {
+	private function createCacheEntry($internalPath, $storageId, $size = 0) {
 		$internalPath = trim($internalPath, '/');
 		$inserted = $this->connection->insertIfNotExist('*PREFIX*filecache', [
 			'storage' => $storageId,
@@ -320,7 +321,7 @@ class UserMountCacheTest extends TestCase {
 			'name' => basename($internalPath),
 			'mimetype' => 0,
 			'mimepart' => 0,
-			'size' => 0,
+			'size' => $size,
 			'storage_mtime' => 0,
 			'encrypted' => 0,
 			'unencrypted_size' => 0,
@@ -455,4 +456,34 @@ class UserMountCacheTest extends TestCase {
 		$cachedMounts = $this->cache->getMountsForFileId($rootId);
 		$this->assertEmpty($cachedMounts);
 	}
+
+	public function testGetUsedSpaceForUsers() {
+		$user1 = $this->userManager->get('u1');
+		$user2 = $this->userManager->get('u2');
+
+		/** @var Storage $storage1 */
+		list($storage1, $rootId) = $this->getStorage(2);
+		$folderId = $this->createCacheEntry('files', 2, 100);
+		$fileId = $this->createCacheEntry('files/foo', 2, 7);
+		$storage1->getCache()->put($folderId, ['size' => 100]);
+		$storage1->getCache()->update($fileId, ['size' => 70]);
+
+		$mount1 = $this->getMockBuilder(MountPoint::class)
+			->setConstructorArgs([$storage1, '/u1/'])
+			->setMethods(['getStorageRootId', 'getNumericStorageId'])
+			->getMock();
+
+		$mount1->expects($this->any())
+			->method('getStorageRootId')
+			->will($this->returnValue($rootId));
+
+		$mount1->expects($this->any())
+			->method('getNumericStorageId')
+			->will($this->returnValue(2));
+
+		$this->cache->registerMounts($user1, [$mount1]);
+
+		$result = $this->cache->getUsedSpaceForUsers([$user1, $user2]);
+		$this->assertEquals(['u1' => 100], $result);
+	}
 }