Fixes visibility of the moving sidebar

diff --git a/web/viewer.css b/web/viewer.css
index f771fd7e6dd2100a7fba2bd4dc42cdbd3b603abf..acaca9865547c326d8fb0c5e8d48a9ec209d6f8d 100644 (file)
--- a/web/viewer.css
+++ b/web/viewer.css
@@ -52,6 +52,9 @@ body {
   -webkit-transition-duration: 200ms;
   -webkit-transition-timing-function: ease;
 }
+#outerContainer.sidebarMoving > #sidebarContainer {
+  visibility: visible;
+}
 #outerContainer.sidebarOpen > #sidebarContainer {
   visibility: visible;
   left: 0px;

diff --git a/web/viewer.js b/web/viewer.js
index 9822f07c6301516bffc816b7916498b0cc515e1e..35b00b33175ff43414457289055f22f5b7deff2d 100644 (file)
--- a/web/viewer.js
+++ b/web/viewer.js
@@ -1353,18 +1353,21 @@ window.addEventListener('load', function webViewerLoad(evt) {
   thumbsView.addEventListener('scroll', updateThumbViewArea, true);
 
   var mainContainer = document.getElementById('mainContainer');
+  var outerContainer = document.getElementById('outerContainer');
   mainContainer.addEventListener('transitionend', function(e) {
     if (e.target == mainContainer) {
       var event = document.createEvent('UIEvents');
       event.initUIEvent('resize', false, false, window, 0);
       window.dispatchEvent(event);
+      outerContainer.classList.remove('sidebarMoving');
     }
   }, true);
 
   document.getElementById('sidebarToggle').addEventListener('click',
     function() {
       this.classList.toggle('toggled');
-      document.getElementById('outerContainer').classList.toggle('sidebarOpen');
+      outerContainer.classList.add('sidebarMoving');
+      outerContainer.classList.toggle('sidebarOpen');
       updateThumbViewArea();
     });