[ARVADOS] updated: 91448ce45fff609f1b4c03d3db2cf9a465909b5c

Git user git at public.curoverse.com
Wed Sep 6 11:06:46 EDT 2017


Summary of changes:
 .../assets/javascripts/components/collections.js   |  4 +-
 .../assets/javascripts/components/save_ui_state.js | 43 +++++++++++++++++++++-
 2 files changed, 44 insertions(+), 3 deletions(-)

       via  91448ce45fff609f1b4c03d3db2cf9a465909b5c (commit)
      from  232feac2fbd5310d48f9058848326457f88732cc (commit)

Those revisions listed above that are new to this repository have
not appeared on any other notification email; so we list those
revisions in full, below.


commit 91448ce45fff609f1b4c03d3db2cf9a465909b5c
Author: Tom Clegg <tclegg at veritasgenetics.com>
Date:   Wed Sep 6 11:06:07 2017 -0400

    12033: Document SaveUIState.
    
    Arvados-DCO-1.1-Signed-off-by: Tom Clegg <tclegg at veritasgenetics.com>

diff --git a/apps/workbench/app/assets/javascripts/components/collections.js b/apps/workbench/app/assets/javascripts/components/collections.js
index 78a6c8e..6022889 100644
--- a/apps/workbench/app/assets/javascripts/components/collections.js
+++ b/apps/workbench/app/assets/javascripts/components/collections.js
@@ -125,14 +125,14 @@ window.CollectionsSearch = {
         return m('form', {
             onsubmit: function() {
                 vnode.state.searchActive(vnode.state.searchEntered())
-                vnode.state.forgetSavedState = true
+                vnode.state.forgetSavedHeight = true
                 return false
             },
         }, [
             m(SaveUIState, {
                 defaultState: '',
                 currentState: vnode.state.searchActive,
-                forgetSavedState: vnode.state.forgetSavedState,
+                forgetSavedHeight: vnode.state.forgetSavedHeight,
                 saveBodyHeight: true,
             }),
             vnode.state.loader && [
diff --git a/apps/workbench/app/assets/javascripts/components/save_ui_state.js b/apps/workbench/app/assets/javascripts/components/save_ui_state.js
index b24aef3..3dc81fe 100644
--- a/apps/workbench/app/assets/javascripts/components/save_ui_state.js
+++ b/apps/workbench/app/assets/javascripts/components/save_ui_state.js
@@ -2,6 +2,47 @@
 //
 // SPDX-License-Identifier: AGPL-3.0
 
+// SaveUIState avoids losing scroll position due to navigation
+// events, and saves/restores other caller-specified UI state.
+//
+// It does not display any content itself: do not pass any children.
+//
+// The problem being solved:
+//
+// Page 1 loads some content dynamically (e.g., via infinite scroll)
+// after the initial render. User scrolls down, clicks a link, and
+// lands on page 2. User clicks the Back button, and lands on page
+// 1. Page 1 renders its initial content while waiting for AJAX.
+//
+// But (without SaveUIState) the document body is small now, so the
+// browser resets scroll position to the top of the page. Even if we
+// end up displaying the same dynamic content, the user's place on the
+// page has been lost.
+//
+// SaveUIState fixes this by stashing the current body height when
+// navigating away from page 1. When navigating back, it restores the
+// body height even before the page has loaded, so the browser does
+// not reset the scroll position.
+//
+// SaveUIState also saves/restores arbitrary UI state (like text typed
+// in a search box) in response to navigation events.
+//
+// See CollectionsSearch for an example.
+//
+// Attributes:
+//
+// {getter-setter} currentState: the current UI state
+//
+// {any} defaultState: value to initialize currentState with, if
+// nothing is stashed in browser history.
+//
+// {boolean} forgetSavedHeight: the body height loaded from the
+// browser history (if any) is outdated; we should let the browser
+// determine the correct body height from the current page
+// content. Set this when dynamic content has been reset.
+//
+// {boolean} saveBodyHeight: save/restore body height as described
+// above.
 window.SaveUIState = {
     saveState: function() {
         var state = history.state || {}
@@ -33,7 +74,7 @@ window.SaveUIState = {
         vnode.state.onupdate(vnode)
     },
     onupdate: function(vnode) {
-        if (vnode.attrs.saveBodyHeight && vnode.attrs.forgetSavedState) {
+        if (vnode.attrs.saveBodyHeight && vnode.attrs.forgetSavedHeight) {
             document.body.style['min-height'] = null
         }
     },

-----------------------------------------------------------------------


hooks/post-receive
-- 




More information about the arvados-commits mailing list