This afternoon saw the release of the latest versions of both plugins, ICS Calendar 10.10.0 and ICS Calendar Pro 4.8.0. These are the first releases under a new development process that will ensure fewer small updates moving forward.
These updates are mostly focused on three things:
- General bug fixes and performance improvements
- Refactored jQuery to allow developers (including me!) to hook into ICS Calendar events
- Improvements to Full view in Pro
I’m most eager to see how users respond to some of these key improvements in Full view, as the integration of FullCalendar.io becomes more seamless. This version improves handling of the search filter and color key/feed toggle checkboxes, and, critically, finally achieves proper support for ICS Calendar’s Timezone (tz) parameter, which has been causing headaches for some users since European countries switched over to Daylight Saving Time this week.
Regarding the search filter and color toggles, Full view introduces a new way of handling these: rather than completely hiding non-matching events (with the associated layout “jumps” that occur), it scales them back to 10% opacity. I think this is a pretty neat effect, and it is a more accurate UX, in that it makes clear what these tools are really doing: they are not performing an active search that reloads any calendar content; they are simply hiding the currently visible events that don’t match the selected criteria.
Ultimately, the problem with these tools and how they interact with Full view comes down to the fact that FullCalendar dynamically re-renders the calendar when you switch months or layout tabs, whereas the other built-in views in ICS Calendar do not. (The other views all load the entire range of the calendar into HTML, and then just selectively show or hide months as you navigate around.)
Because hiding the events entirely was causing redrawing issues with Full view, this approach of changing the opacity is a better alternative, as it does not change the spacing or position of any events in the calendar.
The best part of this change is that it is purely using CSS to alter the appearance of the events, so if you prefer to have non-matching events hidden entirely, you can just add a bit of your own CSS to override the default behavior.
Here’s the CSS in the plugin:
.ics-calendar.layout-full .hidden_in_main { opacity: 0.1 !important; }
To hide the events entirely, I recommend using this CSS:
.ics-calendar.layout-full .hidden_in_main { visibility: hidden !important; }
As always… feedback is encouraged!
—Scott