From 9d230bcc75185e855d28656ab898ff05c15bebc8 Mon Sep 17 00:00:00 2001
From: Vincent Petry <pvince81@owncloud.com>
Date: Wed, 30 Oct 2013 20:45:47 +0100
Subject: [PATCH] Improve quota input field

- Added tooltip with examples
- The quota value returned by the server is now displayed after update
- Fixes #5346
---
 core/js/singleselect.js      | 15 ++++++++++++++-
 settings/js/users.js         | 13 +++++++++++--
 settings/templates/users.php |  4 ++--
 3 files changed, 27 insertions(+), 5 deletions(-)

diff --git a/core/js/singleselect.js b/core/js/singleselect.js
index 1a018b7414..0b7fc20a8f 100644
--- a/core/js/singleselect.js
+++ b/core/js/singleselect.js
@@ -1,8 +1,15 @@
 (function ($) {
 	$.fn.singleSelect = function () {
 		return this.each(function (i, select) {
-			var input = $('<input/>');
+			var input = $('<input/>'),
+			    inputTooltip = $(select).attr('data-inputtitle');
+			if (inputTooltip){
+				input.attr('title', inputTooltip);
+			}
 			select = $(select);
+			if ($.fn.tipsy){
+				input.tipsy({gravity: 'n', trigger: 'manual'});
+			}
 			input.css('position', 'absolute');
 			input.css(select.offset());
 			input.css({
@@ -29,6 +36,9 @@
 				} else {
 					event.stopImmediatePropagation();
 					input.show();
+					if ($.fn.tipsy){
+						input.tipsy('show');
+					}
 					select.css('background-color', 'white');
 					input.focus();
 				}
@@ -70,6 +80,9 @@
 
 			input.on('blur', function () {
 				$(this).change();
+				if ($.fn.tipsy){
+					$(this).tipsy('hide');
+				}
 			});
 		});
 	}
diff --git a/settings/js/users.js b/settings/js/users.js
index 4c2ad5417c..6222c0e70c 100644
--- a/settings/js/users.js
+++ b/settings/js/users.js
@@ -147,7 +147,11 @@ var UserList = {
 		quotaSelect.on('change', function () {
 			var uid = $(this).parent().parent().attr('data-uid');
 			var quota = $(this).val();
-			setQuota(uid, quota);
+			setQuota(uid, quota, function(returnedQuota){
+				if (quota !== returnedQuota) {
+					$(quotaSelect).find(':selected').text(returnedQuota);
+				}
+			});
 		});
 	},
 	// From http://my.opera.com/GreyWyvern/blog/show.dml/1671288
@@ -428,9 +432,14 @@ $(document).ready(function () {
 	});
 
 	$('select.quota, select.quota-user').singleSelect().on('change', function () {
+		var select = $(this);
 		var uid = $(this).parent().parent().attr('data-uid');
 		var quota = $(this).val();
-		setQuota(uid, quota);
+		setQuota(uid, quota, function(returnedQuota){
+			if (quota !== returnedQuota) {
+				select.find(':selected').text(returnedQuota);
+			}
+		});
 	});
 
 	$('#newuser').submit(function (event) {
diff --git a/settings/templates/users.php b/settings/templates/users.php
index b556ef4b92..3c7bfd9f03 100644
--- a/settings/templates/users.php
+++ b/settings/templates/users.php
@@ -41,7 +41,7 @@ $_['subadmingroups'] = array_flip($items);
 	<div class="quota">
 		<span><?php p($l->t('Default Storage'));?></span>
 			<?php if((bool) $_['isadmin']): ?>
-			<select class='quota'>
+			<select class='quota' data-inputtitle="<?php p($l->t('Please enter storage quota (ex: "512 MB" or "12 GB"')) ?>">
 				<option
 					<?php if($_['default_quota'] === 'none') print_unescaped('selected="selected"');?>
 						value='none'>
@@ -136,7 +136,7 @@ $_['subadmingroups'] = array_flip($items);
 			</td>
 			<?php endif;?>
 			<td class="quota">
-				<select class='quota-user'>
+				<select class='quota-user' data-inputtitle="<?php p($l->t('Please enter storage quota (ex: "512 MB" or "12 GB"')) ?>">
 					<option
 						<?php if($user['quota'] === 'default') print_unescaped('selected="selected"');?>
 							value='default'>