owntracks / frontend

🌍 Web interface for OwnTracks built with Vue.js
MIT License
357 stars 53 forks source link

Update date/time picker to only load data on confirmation #43

Closed Outlet2048 closed 3 months ago

Outlet2048 commented 3 years ago

If you select a period of time that is already a long time ago, the loading time is extended by the fact that the program immediately loads all data. Even before the user confirms the specified period.

So if the user selects a time period that starts more than a year ago, the program loads the entire last year. This leads to a crash of the tab.

Suggestions:

  1. Start loading the data only when the user presses the green check mark.
  2. A functionality for bookmarks. Allow the user to tag a period and later search for tags. -> Only the mentioned period will be loaded. I personally like this functionality very much

Thanks!

linusg commented 3 years ago

Start loading the data only when the user presses the green check mark.

That sounds reasonable. In the meantime you can set the start and end date in the URL before loading it. You can also create a browser bookmark with the specific start and end date if you wish to view that same period later.

I like the Grafana time range picker for example:

image

So instead of two separate date/time pickers it should probably become one explicit date/time range picker.

A functionality for bookmarks. Allow the user to tag a period and later search for tags. -> Only the mentioned period will be loaded. I personally like this functionality very much

That's a great idea IMO but I'd prefer to not implement this in the frontend - that would mean that 1) it only persists in the browser you're currently using and 2) other parts of the OwnTracks ecosystem can't use it. It should be a feature of the recorder and its API instead. Feel free to file an issue describing your proposal here: https://github.com/owntracks/recorder

Outlet2048 commented 3 years ago

Thank you for your reply!

Feel free to file an issue describing your proposal here: https://github.com/owntracks/recorder

Good point, I'll make sure to file an issue over there instead.

streiman commented 3 years ago

I just installed owntracks and the frontend. And I also imported my Google location data since 2013. But it is impossible to view i.e. March 2015 because the frontend tries to load a lot of data the moment I select the start date and the website stalls :(

I also would like to have some predefined buttons like the "Now" in the datepicker: toda, yesterday, this week, this month. That would be great. And if you select "today" it would be super handy to have navigation buttons to switch from day to day - but maybe this is more related to timeline view.

linusg commented 3 years ago

But it is impossible to view i.e. March 2015 because the frontend tries to load a lot of data the moment I select the start date and the website stalls :(

Just amend the URL's query parameters for now - ...&start=2014-12-31T23%3A00%3A00&end=2015-12-31T22%3A59%3A59&....

streiman commented 3 years ago

Yes, that works. But it breaks a little bit the idea of a shining ui 😉

Tofee commented 2 years ago

I second the need for a date range picker. I don't know anything about Vue, but what about using something like this ? https://github.com/mengxiong10/vue2-datepicker Maybe the integration could be simple, for someone who knows Vue.js?...