From 6649b3638c19eb0cf8dc86432bf256905b647419 Mon Sep 17 00:00:00 2001
From: Jake Spurlock <whyisjake@git.wordpress.org>
Date: Wed, 25 Sep 2019 21:37:09 +0000
Subject: [PATCH] Themes: Improve Twenty Fifteen sticky sidebar logic

The current logic in TwentyFifteen (#30366) for making the sidebar sticky while still allowing to scroll through it when the sidebar height is larger than the viewport height is flawed and massively overcomplicated.
This can be mitigated by removing the admin bar specific logic and leaving most of the heavy lifting up to the browser.

Fixes #37536

Props DvanKooten, lukecavanagh, karmatosed, ianbelanger, davidbaumwald



git-svn-id: https://develop.svn.wordpress.org/trunk@46308 602fd350-edb4-49c9-b593-d223f7449a82
---
 .../themes/twentyfifteen/js/functions.js      | 83 +++++--------------
 tests/qunit/fixtures/wp-api-generated.js      |  2 +-
 2 files changed, 21 insertions(+), 64 deletions(-)

diff --git a/src/wp-content/themes/twentyfifteen/js/functions.js b/src/wp-content/themes/twentyfifteen/js/functions.js
index b9dddc85be..f26293edab 100644
--- a/src/wp-content/themes/twentyfifteen/js/functions.js
+++ b/src/wp-content/themes/twentyfifteen/js/functions.js
@@ -6,10 +6,8 @@
  */
 
 ( function( $ ) {
-	var $body, $window, $sidebar, adminbarOffset, top = false,
-	    bottom = false, windowWidth, windowHeight, lastWindowPos = 0,
-	    topOffset = 0, bodyHeight, sidebarHeight, resizeTimer,
-	    secondary, button;
+	var $body, $window, $sidebar, resizeTimer,
+		secondary, button;
 
 	function initMainNavigation( container ) {
 		// Add dropdown toggle that display child menu items.
@@ -96,71 +94,32 @@
 	}
 
 	// Sidebar scrolling.
-	function resize() {
-		windowWidth = $window.width();
-
-		if ( 955 > windowWidth ) {
-			top = bottom = false;
-			$sidebar.removeAttr( 'style' );
-		}
-	}
-
-	function scroll() {
-		var windowPos = $window.scrollTop();
-
-		if ( 955 > windowWidth ) {
-			return;
-		}
-
-		sidebarHeight = $sidebar.height();
-		windowHeight  = $window.height();
-		bodyHeight    = $body.height();
-
-		if ( sidebarHeight + adminbarOffset > windowHeight ) {
-			if ( windowPos > lastWindowPos ) {
-				if ( top ) {
-					top = false;
-					topOffset = ( $sidebar.offset().top > 0 ) ? $sidebar.offset().top - adminbarOffset : 0;
-					$sidebar.attr( 'style', 'top: ' + topOffset + 'px;' );
-				} else if ( ! bottom && windowPos + windowHeight > sidebarHeight + $sidebar.offset().top && sidebarHeight + adminbarOffset < bodyHeight ) {
-					bottom = true;
-					$sidebar.attr( 'style', 'position: fixed; bottom: 0;' );
-				}
-			} else if ( windowPos < lastWindowPos ) {
-				if ( bottom ) {
-					bottom = false;
-					topOffset = ( $sidebar.offset().top > 0 ) ? $sidebar.offset().top - adminbarOffset : 0;
-					$sidebar.attr( 'style', 'top: ' + topOffset + 'px;' );
-				} else if ( ! top && windowPos + adminbarOffset < $sidebar.offset().top ) {
-					top = true;
-					$sidebar.attr( 'style', 'position: fixed;' );
-				}
-			} else {
-				top = bottom = false;
-				topOffset = ( $sidebar.offset().top > 0 ) ? $sidebar.offset().top - adminbarOffset : 0;
-				$sidebar.attr( 'style', 'top: ' + topOffset + 'px;' );
-			}
-		} else if ( ! top ) {
-			top = true;
-			$sidebar.attr( 'style', 'position: fixed;' );
-		}
-
-		lastWindowPos = windowPos;
-	}
-
 	function resizeAndScroll() {
-		resize();
-		scroll();
+		var windowPos = $window.scrollTop(),
+			windowHeight = $window.height(),
+			sidebarHeight = $sidebar.height(),
+			bodyHeight = $body.height();
+
+		if( 955 < $window.width()
+			&& bodyHeight > sidebarHeight
+			&& ( windowPos + windowHeight ) >= sidebarHeight ) {
+
+			$sidebar.css({
+				position: "fixed",
+				bottom: sidebarHeight > windowHeight ? 0 : 'auto'
+			});
+		} else {
+			$sidebar.css('position', 'relative')
+		}
 	}
 
 	$( document ).ready( function() {
 		$body          = $( document.body );
 		$window        = $( window );
 		$sidebar       = $( '#sidebar' ).first();
-		adminbarOffset = $body.is( '.admin-bar' ) ? $( '#wpadminbar' ).height() : 0;
 
 		$window
-			.on( 'scroll.twentyfifteen', scroll )
+			.on( 'scroll.twentyfifteen', resizeAndScroll )
 			.on( 'load.twentyfifteen', onResizeARIA )
 			.on( 'resize.twentyfifteen', function() {
 				clearTimeout( resizeTimer );
@@ -169,9 +128,7 @@
 			} );
 		$sidebar.on( 'click.twentyfifteen keydown.twentyfifteen', 'button', resizeAndScroll );
 
-		resizeAndScroll();
-
-		for ( var i = 1; i < 6; i++ ) {
+		for ( var i = 0; i < 6; i++ ) {
 			setTimeout( resizeAndScroll, 100 * i );
 		}
 	} );
diff --git a/tests/qunit/fixtures/wp-api-generated.js b/tests/qunit/fixtures/wp-api-generated.js
index f9ce077692..3083545431 100644
--- a/tests/qunit/fixtures/wp-api-generated.js
+++ b/tests/qunit/fixtures/wp-api-generated.js
@@ -7434,7 +7434,7 @@ mockedApiResponse.StatusesCollection = {
         "public": false,
         "queryable": false,
         "slug": "pending",
-        "date_floating": false,
+        "date_floating": true,
         "_links": {
             "archives": [
                 {