Auto-refresh

[georgehrke]

We should implement this in two steps:

• periodically check for updates of event in known calendars
• periodically check for new or updated calendars

---

Want to back this issue? Post a bounty on it! We accept bounties via Bountysource.

[georgehrke]

requires #209

[georgehrke]

Let's implement #40 first.

Otherwise stuff like keeping events being edited locked will be a huge pain.

[cl4x]

no news on this features? in 1.7.0 the autorefresh do not work

[georgehrke]

in 1.7.0 the autorefresh do not work

Not surprising, since this issue is still open 😉

Please check the information on the right. It contains all the information you need:

[cl4x]

ok sorry, i have see this

[vchrizz]

using following workaround until this issue is fixed:
in file core/templates/layout.user.php add after <title>

                <?php
			// if loaded app is calendar, add html meta tag to refresh page every 60 seconds
			if ($_['appid']=='calendar') {
				print '<meta http-equiv="refresh" content="60">';
			}
		?>

[georgehrke]

I would strongly advise anyone against using that workaround, because it just reloads the calendar app every 60 seconds, no matter whether you are just creating / editing an event or not. Definitely not a solution.

[vchrizz]

correct, thanks for pointing that out, i should have mentioned that!
as i do not use the app via webbrowser, but manage my events via smartphone (synced from another calendar app), this is not a problem in my case.
for explanation: i use a tablet on a wall to display the nextcloud calendar (in a webbrowser) and for that it is not practical to be forced to manually refresh the page to see the recent calendar status.
(if 60 seconds is too fast, you may also set it to some higher value like 300 seconds for a refresh every 5 minutes)

[dev-zero]

Will the tasks app automatically profit from the implementation in the calendar app or should I open a separate feature request there if I would like to see automatically refreshed task lists?

[georgehrke]

@dev-zero No, this issue is only about the calendar app. The tasks app will need to implement this separately.

[JonathanTreffler]

It would be nice if this feature would also be implemented for the Dashboard Widget of the Calendar App.

[piiskop]

The client app should create a connection to the server so that every time something will be changed the server sends out the signal to all the clients and only the changed part will be updated.

[azul]

I investigated this some. Here's my findings:

Calendars

The app keeps track of the calendars in display in a vue store module called calendars.
Calendars can be removed and added - but this does not trigger a reload of the unerlying data.

TimeRanges

The only loads the events it currently has to display. It uses TimeRanges to keep track of these. If you move to the next timespan (day, week, month) the calendar indicator will spin to indicate it's loading. If you move back and forth it will use the cached data and not query the server.
One can clear those TimeRanges with:

$store.commit('clearFetchedTimeRanges')

This will trigger requests when navigating to previously visited timespans.

CalendarObjects

However even though these request will display new events it contains it will not update existing events. That's because when parsing the data it is turned into CalendarObjects which are stored indexed by their id and will not be updated if an object with the same id already exists:

// src/store/calendarObjects.js
	/**
	 * Adds an array of calendar-objects to the store
	 *
	 * @param {Object} state The store data
	 * @param {Object} data The destructuring object
	 * @param {Object[]} data.calendarObjects Calendar-objects to add
	 */
	appendCalendarObjects(state, { calendarObjects = [] }) {
		for (const calendarObject of calendarObjects) {
			if (!state.calendarObjects[calendarObject.id]) {
				Vue.set(state.calendarObjects, calendarObject.id, calendarObject)
			}
		}
	},

This is the function called from getEventsFromCalendarInTimeRange when the calendars are displayed.
So even if the TimeRange has been removed and therefore reloaded the calendar in the view will not update because hte old data structure is not replaced.

So in order to effectively reload a calendar I need to take these steps from the console (assuming Vue Dev tools are installed and active and the Calendar component is selected as $vm0:

$vm0.$store.commit('deleteCalendarObject',  {
  calendarObject: {
    id: $vm0.$store.getters.enabledCalendars[0].calendarObjects[0]
  }
})
// ... repeat this for all calendar objects
$vm0.$store.commit('deleteCalendarObject',  {
  calendarObject: {
    id: $vm0.$store.getters.enabledCalendars[0].calendarObjects[3]
  }
})
$vm0.$store.commit('clearFetchedTimeRanges')
$vm0.$store.commit('deleteCalendar', {calendar: $vm0.$store.getters.enabledCalendars[0]})
$vm0.$store.dispatch('getPublicCalendars', {tokens: $vm0.$route.params.tokens.split("-")})

[azul]

Looks like the calendar itself has a ctag property that will tell us if anything in the calendar was updated. That seems very useful in order to avoid invalidating the caches without needs.

After reading the sabredav docs some more it seems like sync tokens are what we want to use:

• Remember the sync token when loading the calendar initially.
• Query for syncs using the sync token regularly.
• If there was an update compare the ids of the changed objects and the objects that have been loaded already.
• Fetch the updates from the server for the intersection of the two sets - objects that have been updated and were loaded already.
• cleanup the objects that were removed.

[azul]

Looks like the sync token approach would require at least some work on nextcloud/cdav-library#9.