LDAP Wizard: Use Ajax Spinner to indicate something is happening, especiall port...

diff --git a/apps/user_ldap/css/settings.css b/apps/user_ldap/css/settings.css
index 2f12108b090b70802481ec097c37d3ab414fba15..65bff3aadb7e99c47c2af613de518f83220d0ee2 100644 (file)
--- a/apps/user_ldap/css/settings.css
+++ b/apps/user_ldap/css/settings.css
@@ -5,6 +5,7 @@
 
 .tablecell {
        display: table-cell !important;
+       white-space: nowrap;
 }
 
 .tablerow {
@@ -75,6 +76,10 @@
        color: #FF3B3B;
 }
 
+.wizSpinner {
+       height: 15px;
+}
+
 #ldap fieldset p label {
        width: 20%;
        max-width: 200px;

diff --git a/apps/user_ldap/js/settings.js b/apps/user_ldap/js/settings.js
index df5de87460142e58c4f2905f431b9fc371d510d1..0ccf7ecf42508666158919dbba72e5f6eeced598 100644 (file)
--- a/apps/user_ldap/js/settings.js
+++ b/apps/user_ldap/js/settings.js
@@ -128,6 +128,7 @@ var LdapWizard = {
        checkPortInfoShown: false,
        saveBlacklist: {},
        userFilterGroupSelectState: 'enable',
+       spinner: '<img class="wizSpinner" src="'+ OC.imagePath('core', 'loading.gif') +'">',
 
        ajax: function(param, fnOnSuccess, fnOnError) {
                $.post(
@@ -168,15 +169,18 @@ var LdapWizard = {
                        param = 'action=guessBaseDN'+
                                        '&ldap_serverconfig_chooser='+$('#ldap_serverconfig_chooser').val();
 
+                       LdapWizard.showSpinner('#ldap_base');
                        LdapWizard.ajax(param,
                                function(result) {
                                        LdapWizard.applyChanges(result);
+                                       LdapWizard.hideSpinner('#ldap_base');
                                        if($('#ldap_base').val()) {
                                                $('#ldap_base').removeClass('invisible');
                                                LdapWizard.hideInfoBox();
                                        }
                                },
                                function (result) {
+                                       LdapWizard.hideSpinner('#ldap_base');
                                        $('#ldap_base').removeClass('invisible');
                                        LdapWizard.showInfoBox('Please specify a port');
                                }
@@ -193,9 +197,11 @@ var LdapWizard = {
                        param = 'action=guessPortAndTLS'+
                                        '&ldap_serverconfig_chooser='+$('#ldap_serverconfig_chooser').val();
 
+                       LdapWizard.showSpinner('#ldap_port');
                        LdapWizard.ajax(param,
                                function(result) {
                                        LdapWizard.applyChanges(result);
+                                       LdapWizard.hideSpinner('#ldap_port');
                                        if($('#ldap_port').val()) {
                                                LdapWizard.checkBaseDN();
                                                $('#ldap_port').removeClass('invisible');
@@ -203,6 +209,7 @@ var LdapWizard = {
                                        }
                                },
                                function (result) {
+                                       LdapWizard.hideSpinner('#ldap_port');
                                        $('#ldap_port').removeClass('invisible');
                                        LdapWizard.showInfoBox('Please specify the BaseDN');
                                }
@@ -278,6 +285,7 @@ var LdapWizard = {
                param = 'action=determineAttributes'+
                                '&ldap_serverconfig_chooser='+$('#ldap_serverconfig_chooser').val();
 
+               LdapWizard.showSpinner('#ldap_loginfilter_attributes');
                LdapWizard.ajax(param,
                        function(result) {
                                $('#ldap_loginfilter_attributes').find('option').remove();
@@ -287,6 +295,7 @@ var LdapWizard = {
                                        $('#ldap_loginfilter_attributes').append(
                                                                "<option value='"+attr+"'>"+attr+"</option>");
                                }
+                               LdapWizard.hideSpinner('#ldap_loginfilter_attributes');
                                LdapWizard.applyChanges(result);
                                $('#ldap_loginfilter_attributes').multiselect('refresh');
                                $('#ldap_loginfilter_attributes').multiselect('enable');
@@ -296,6 +305,7 @@ var LdapWizard = {
                                $('#ldap_loginfilter_attributes').multiselect(
                                                                        {noneSelectedText : 'No attributes found'});
                                $('#ldap_loginfilter_attributes').multiselect('disable');
+                               LdapWizard.hideSpinner('#ldap_loginfilter_attributes');
                        }
                );
        },
@@ -307,6 +317,7 @@ var LdapWizard = {
                param = 'action=determineGroupsFor'+type+
                                '&ldap_serverconfig_chooser='+$('#ldap_serverconfig_chooser').val();
 
+               LdapWizard.showSpinner('#'+multisel);
                LdapWizard.ajax(param,
                        function(result) {
                                $('#'+multisel).find('option').remove();
@@ -315,11 +326,13 @@ var LdapWizard = {
                                        objc = result.options[multisel][i];
                                        $('#'+multisel).append("<option value='"+objc+"'>"+objc+"</option>");
                                }
+                               LdapWizard.hideSpinner('#'+multisel);
                                LdapWizard.applyChanges(result);
                                $('#'+multisel).multiselect('refresh');
                                $('#'+multisel).multiselect('enable');
                        },
                        function (result) {
+                               LdapWizard.hideSpinner('#'+multisel);
                                $('#'+multisel).multiselect('disable');
                        }
                );
@@ -332,6 +345,7 @@ var LdapWizard = {
                param = 'action=determine'+type+'ObjectClasses'+
                                '&ldap_serverconfig_chooser='+$('#ldap_serverconfig_chooser').val();
 
+               LdapWizard.showSpinner('#'+multisel);
                LdapWizard.ajax(param,
                        function(result) {
                                $('#'+multisel).find('option').remove();
@@ -340,10 +354,12 @@ var LdapWizard = {
                                        objc = result.options[multisel][i];
                                        $('#'+multisel).append("<option value='"+objc+"'>"+objc+"</option>");
                                }
+                               LdapWizard.hideSpinner('#'+multisel);
                                LdapWizard.applyChanges(result);
                                $('#'+multisel).multiselect('refresh');
                        },
                        function (result) {
+                               LdapWizard.hideSpinner('#'+multisel);
                                //TODO: error handling
                        }
                );
@@ -379,6 +395,11 @@ var LdapWizard = {
                }
        },
 
+       hideSpinner: function(id) {
+               $(id+' + .wizSpinner').remove();
+               $(id + " + button").css('display', 'inline');
+       },
+
        init: function() {
                if($('#ldap_port').val()) {
                        $('#ldap_port').removeClass('invisible');
@@ -510,6 +531,11 @@ var LdapWizard = {
                LdapWizard.checkInfoShown = true;
        },
 
+       showSpinner: function(id) {
+               $(LdapWizard.spinner).insertAfter($(id));
+               $(id + " + img + button").css('display', 'none');
+       },
+
        toggleRawFilter: function(container, moc, mg, stateVar) {
                if($(container).hasClass('invisible')) {
                        $(container).removeClass('invisible');