diff --git a/src/css/metacatui-common.responsive.css b/src/css/metacatui-common.responsive.css index ee879ccc4..41d10496f 100644 --- a/src/css/metacatui-common.responsive.css +++ b/src/css/metacatui-common.responsive.css @@ -357,11 +357,10 @@ transition: bottom 0.3s; } + /* Default position of portal pages nav on mobile. */ + /* This will be changed by PortalEditorView */ + .PortalView .section-links-container, .Editor.Portal .section-links-toggle-container { - bottom: 73px; - } - - .PortalView .section-links-container { bottom: 0; } diff --git a/src/js/views/EditorView.js b/src/js/views/EditorView.js index 3fe778db0..7c13aaff1 100644 --- a/src/js/views/EditorView.js +++ b/src/js/views/EditorView.js @@ -294,16 +294,26 @@ function(_, $, Backbone, SignInView, EditorSubmitMessageTemplate){ * Show the editor footer controls (Save bar) */ showControls: function(){ - this.$(".editor-controls").removeClass("hidden").slideDown(); + var view = this; + this.$(".editor-controls").removeClass("hidden").slideDown(300, function(){ + if(typeof view.handleScroll === "function"){ + view.handleScroll() + } + }); + }, /** * Hide the editor footer controls (Save bar) */ hideControls: function(){ - this.hideSaving(); - - this.$(".editor-controls").slideUp(); + var view = this; + this.hideSaving(); + this.$(".editor-controls").slideUp(300, function(){ + if(typeof view.handleScroll === "function"){ + view.handleScroll() + } + }); }, /** diff --git a/src/js/views/portals/editor/PortalEditorView.js b/src/js/views/portals/editor/PortalEditorView.js index 016b1790c..e4cfa8e41 100644 --- a/src/js/views/portals/editor/PortalEditorView.js +++ b/src/js/views/portals/editor/PortalEditorView.js @@ -896,17 +896,30 @@ function(_, $, Backbone, Portal, PortalImage, Filters, EditorView, SignInView, * This function is called whenever the window is scrolled. */ handleScroll: function() { - var menu = $(".section-links-toggle-container")[0], - menuHeight = $(menu).height(), - editorFooterHeight = 73, - hiddenHeight = (menuHeight * -1) + 73; - var currentScrollPos = window.pageYOffset; - if(MetacatUI.appView.prevScrollpos > currentScrollPos) { - menu.style.bottom = "73px"; - } else { - menu.style.bottom = hiddenHeight +"px"; + try { + + var menu = $(".section-links-toggle-container")[0], + editorFooter = this.$("#editor-footer")[0], + editorFooterHeight = editorFooter ? editorFooter.offsetHeight : 0; + menuHeight = menu ? menu.offsetHeight : 0, + hiddenHeight = (menuHeight * -1) + editorFooterHeight, + currentScrollPos = window.pageYOffset; + + if(!menu){ + return + } + if(MetacatUI.prevScrollpos >= currentScrollPos) { + // when scrolling upward + menu.style.bottom = editorFooterHeight + "px"; + } else { + // when scrolling downward + menu.style.bottom = hiddenHeight + "px"; + } + MetacatUI.prevScrollpos = currentScrollPos; + + } catch (error) { + console.log("There was an error adjusting menu position on scroll. Error details: " + error); } - MetacatUI.appView.prevScrollpos = currentScrollPos; }, /**