diff --git a/src/js/yunohost/controllers/postinstall.js b/src/js/yunohost/controllers/postinstall.js index b356844d..d8fc96a7 100644 --- a/src/js/yunohost/controllers/postinstall.js +++ b/src/js/yunohost/controllers/postinstall.js @@ -50,7 +50,7 @@ } store.set('maindomain', domain); }); - }, false); // We disable enableSlide because that causes some issues with accordion when using the 'previous' button + }); }); }); @@ -60,9 +60,7 @@ if (!store.get('maindomain')) { c.redirect_to('#/postinstall/domain'); } else { - c.view('postinstall/postinstall_3', { 'domain': store.get('maindomain').toLowerCase() }, - function() { }, - false); // We disable enableSlide because that causes some issues with accordion when using the 'previous' button + c.view('postinstall/postinstall_3', { 'domain': store.get('maindomain').toLowerCase() }); } }); diff --git a/src/js/yunohost/helpers.js b/src/js/yunohost/helpers.js index 5256d624..0ba638e2 100644 --- a/src/js/yunohost/helpers.js +++ b/src/js/yunohost/helpers.js @@ -29,19 +29,17 @@ $('#slider-container').addClass('notransition'); // Delete the left/right temporary stuff only used during animation $('#slideTo').css('display', 'none'); + $('#slideTo').html(""); $('#slideBack').css('display', 'none'); + $('#slideBack').html(""); // Set the margin-left back to 0 $('#slider-container').css('margin-left', '0'); // c.f. the stackoverflow thread $('#slider-container')[0].offsetHeight; // Remove the binding to this event handler for next times - //$("#slider-container").off(transitionEvent); // Re-enable transition effects $('#slider-container').removeClass('notransition'); } - // Now we add the transition event to detect the end of the transition effect - transitionEvent && $("#slider-container").on(transitionEvent, resetSliders) - /** * Helpers @@ -307,12 +305,11 @@ // Render view (cross-browser) - view: function (view, data, callback, enableSlide) { + view: function (view, data, callback) { c = this; // Default callback = typeof callback !== 'undefined' ? callback : function() {}; - enableSlide = (typeof enableSlide !== 'undefined') ? enableSlide : true; // Change to false to disable animation // Hide loader and modal c.hideLoader(); @@ -324,17 +321,17 @@ // Update content helper var leSwap = function() { rendered.swap(function() { - // Slide direction - if (enableSlide) { - $('.slide, .btn-breadcrumb a:not(:last-child)').on('click', function() { - $(this).addClass('active'); - if ($(this).hasClass('back') || $(this).parent('.btn-breadcrumb').length) { - store.set('slide', 'back'); - } else { - store.set('slide', 'to'); - } - }); - } + // Clicking on those kind of CSS elements will trigger a + // slide effect i.e. the next view rendering will have + // store.get('slide') set to 'back' or 'to' + $('.slide, .btn-breadcrumb a:not(:last-child)').on('click', function() { + $(this).addClass('active'); + if ($(this).hasClass('back') || $(this).parent('.btn-breadcrumb').length) { + store.set('slide', 'back'); + } else { + store.set('slide', 'to'); + } + }); // Paste
 helper
                     c.prePaste();
@@ -348,7 +345,7 @@
             };
 
             // Slide back effect
-            if (enableSlide && store.get('slide') == 'back') {
+            if (store.get('slide') == 'back') {
 
                 store.clear('slide');
                 // Disable transition while we tweak CSS
@@ -378,12 +375,18 @@
 
                 // Re-add transition effect
                 $('#slider-container').removeClass('notransition');
+
+                // add the transition event to detect the end of the transition effect
+                transitionEvent
+                    && $("#slider-container").off(transitionEvent)
+                    && $("#slider-container").on(transitionEvent, resetSliders);
+
                 // And actually play the transition effect that will move the container from left to right
                 $('#slider-container').css('margin-left', '0px');
             }
             // Slide to effect
-            else if (enableSlide && store.get('slide') == 'to') {
-                store.clear('slide');
+            else if (store.get('slide') == 'to') {
+
                 // Disable transition while we tweak CSS
                 $('#slider-container').addClass('notransition');
                 // "Delete" the right part of the slider
@@ -411,6 +414,13 @@
 
                 // Re-add transition effect
                 $('#slider-container').removeClass('notransition');
+
+                // add the transition event to detect the end of the transition effect
+                var transitionEvent = whichTransitionEvent();
+                transitionEvent
+                    && $("#slider-container").off(transitionEvent)
+                    && $("#slider-container").on(transitionEvent, resetSliders);
+
                 // And actually play the transition effect that will move the container from right to left
                 $('#slider-container').css('margin-left', '-100%');
             }