Navigating features in a timeline

Need help
1

image
image2549×901 309 KB

hi bubblers..
im trying to make a timeline for planned task..
the timeline shows 10 days at the time from current date..

but what i cant figure out the logic of is to make the workflow for moving forward or backwards in the navigation buttons above the timeline..:
image

so when you click forvard it goes 7 days forward and vlick backwards it goes 7 days backwards in the timeline..

also the zoom in and out buttons as you see here:
image
i want that to when you click on the plus it zooms in to show only 5 days and zoom out it shows 14 days and more out it shows 30 days

hope my explanation maked sense.. and that anyone can help out to get this to work :slight_smile:

2

You clearly have a datasource that gives you the list of dates. So that datasource needs to have conditionals to change the number dates it gives based on your actions.

  1. Put a Custom State onto the page and call it ‘number of dates’ and make it of type number and set the default value to 7 (or whatever you want to be the first number of dates seen on page load).
  2. Your data source that provides list of dates is likely a plugin which if built well will allow you to have a dynamic expression for the number of dates to create, and in that field add a dynamic expression tied to your custom state ‘number of dates’.
  3. When you click the buttons for next, or back, or zoom in or zoom out set the state of ‘number of dates’ to what it should be based on simple math, so ‘number of dates + 7’ or ‘number of dates - 7’.

All of this assumes your repeating group that shows the list of dates at top is setup properly for responsive settings so that if you have 40 dates or 4 dates it looks properly.

3

hi @boston85719
thank you.. your explanation helped me alot with this :slight_smile:

where im struggling is when it comes to the next and back buttons.. because the list of date plugin i have also have a “start date” field that i now have set to current date so i can imagine that to get that to also work it need to be current date + 7 days to move forward and current date - 7 days to move backwards..

but how do i make that logic with states with start date as current date to be the start point??

also.. is it possible to make a min and max date to show.. because i can see that when i come down to 1 day in still click zoom in it doesnt change the date.. but i need to click many times to get it to change dates again

4

Don’t use current date in the plugin. Use a custom state or a hidden variable instead. Then you can just update the custom state to be the date that you want.

1 Like