search

the-spot-net / phpbb-ext-tsn-tsn

phpBB Extension for the-spot.net overhaul of phpBB forums
MIT License
0 stars 0 forks source link

My Spot :: Hook up infinite scroll for feed #3

Closed neotsn closed 4 years ago

neotsn commented 4 years ago

For infinite scroll of search results, pass in the base64 encoded list of topic ids to exclude from the results, and re-run the search when the user gets 75% of the way down the list.

Store the returned topic ids in a hidden input... or make the request via ajax initially and store in the feed class.

neotsn commented 4 years ago

I have the infinite scroll functionality in place... JS triggers an AJAX Request, which is returned and injected into the page.

I have also split the data fetch from the template data binding assignments... but I have not yet decided if the first request should be ajax, or if it should only be subsequent requests. I am leaning toward the first request so that this feed is rendered only one way each time.

The complication here is that the query is paginated and based on time and changes to the topics, so a scroll fetching the next page could pull back the last topic from the previous page if a new topic came in at the top of the feed.

This probably explains why Facebook shows things out of order... Twitter, on the other hand, handles this with "new tweets" indication at the top of the page, so they can be injected up top...meaning the scroll through the feed picks up everything that is older than the last "newest" timestamp loaded onto the page.

I prefer twitter's approach because I hate having a feed out of order...but it means that the topics that already exist on the page need to be updated in place when they have changes...and using twitter's approach, they get moved to the top of the feed. New paginated topics get appended on the end of the feed.

On the other hand, if the user scrolls to the top to "Refresh the feed", the first page is requeried and the infinite scroll starts over..because the user's last place in the feed is now below the fold, and nothing down there matters as much. (Honestly that also bugs me as a user, because it's possible I was just about to read something of interest, but something more interesting happened up top.)

neotsn commented 4 years ago

So, after all that... here's my planned approach:

  1. Get the "now" timestamp, and store it as the marker
  2. Load the first page via AJAX request, returning everything that is new since user_last_seen time and marker
  3. Trigger a periodic check for topics that are newer than marker. a. If there are new topics, show a Snackbar with the option to refresh the feed to see what's new b. If the user clicks "Refresh", send back to step 1, and being from there.
  4. Infinite scroll only pulls back topics using the user_last_seen and marker timestamps so that the feed is continuous.
neotsn commented 4 years ago

It took a lot of work, but I got the html rendered for infinite scroll pagination, so this means 1, 2, and 4 are done... just have to hook up a health check and snackbar for 3

neotsn commented 4 years ago

Relevant details have been moved to #8 for the health check ticket.