Skip to content

Use viewport threshold percentage to control elements visibility#566

Merged
jalal246 merged 35 commits intomainfrom
dev/wip_7_17
Jul 30, 2022
Merged

Use viewport threshold percentage to control elements visibility#566
jalal246 merged 35 commits intomainfrom
dev/wip_7_17

Conversation

@jalal246
Copy link
Member

@jalal246 jalal246 commented Jul 16, 2022 •
edited
Loading

  • Remove all separate class interfaces in the utility classes. Use class as a type instead.
  • Enhance registration. All essential data will be assigned and registered even with DFlex being framework agnostic. Register functions still have the capability to create a DFlex-Node instance, along with its container, and scroll. This decreases the scripting time for the first interactive draging without blocking the initial mount during registration Support concurrent elements registration by default #565.
  • Use different types for threshold. Previously all thresholds used were external thresholds. I added a new type internal to apply the threshold percentage correctly for the scroll. An internal threshold is a threshold that checks the dragged inside the given area and is always smaller than the working area.
  • Use essential geometry for Point<number>, Point<boolean> for scroll.
  • Add more indicators to enhance scrolling. DFlex can identify thresholds, calculate invisible areas,s and based on this information do scroll animation.
  • Bind scrolling data with scroll listeners. So when scrolling DFlexScrollContainer can do all the related calculations without reading from DOM.
  • Synchronously update element visibility when scrolling. Avoid any gap that may appear during the scroll. Also, still, the visible area is the scrolling area. Elements' position won't be updated if it's not visible. But the current approach updates visibility and then scrolls so visibility is calculated ahead before taking any action.
  • Thresholds are now direction-dependent. If drag is in the bottom but going up then the threshold is false.
  • Differentiate the mechanism from the container.

@github-actions github-actions bot added the Store label Jul 17, 2022
@jalal246 jalal246 changed the title init Use viewport threshold percentage to control elements visibility Jul 18, 2022
@github-actions github-actions bot added the Utils label Jul 20, 2022
@jalal246 jalal246 marked this pull request as draft July 22, 2022 20:12
@jalal246 jalal246 marked this pull request as ready for review July 24, 2022 17:08
@jalal246 jalal246 enabled auto-merge (squash) July 30, 2022 14:46
@jalal246 jalal246 merged commit 9f98ec3 into main Jul 30, 2022
@jalal246 jalal246 deleted the dev/wip_7_17 branch July 30, 2022 15:01
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

Core DnD Draggable-only Store Test 🧪 Utils

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

1 participant

@jalal246