New Release: Mobiscroll 5.19 & 5.19.1& 5.19.2

Announcements
1

What’s New

Happy to introduce event connections to the timeline view, cursor time indicator and other quality of life improvements.

Showing event connections and dependencies

Events can now be connected with simple, directional or bidirectional lines. You can pass the connections as a simple data structure that expects a from , to and optional color , arrow and cssClass properties. It works with eventIDs, any color, from/to or bidirectional arrows and a cssClass for things like dashed lines. The lightweight SVG connections are generated on the fly, so if you move events around, the connections will be updated on drop.

Use event connections to show dependency, sequencing or any kind of connection that is relevant to the use-case. You can get creative and dynamically change the color of the connections on event hover, or show/hide them dynamically to show event clusters.

Play around with this live example, start moving the events around and see how the connections are updated.


Event connections

Cursor time indicator for the scheduler and timeline

Besides the live current time indicator that is available in the timeline and scheduler components we are now showing the time indicator where the mouse cursor is positioned. This will not just help people get a better sense of the event times they are about to create but is useful on event resize. It follows the same stying as the live time indicator, so it’s not distracting but it is there when someone needs it.This feature is active by default, you should be able to see it for ever scheduler and timeline starting with 5.19.


Cursor time indicator

Simplifying programatic navigation to events

We frequently come across situations when we have to navigate to a specific event. Maybe it’s a notification or maybe the user just needs to see it. With the new navigateToEvent method we simplify the code for programmatically scrolling to a specific event. This was previously only possible by getting the start time of the event and using the navigate method to move the view.
Both methods work, this is just a new and simpler way of doing it.

Print module improvements

We have added a number of fixes and improvements to the print module making for nicer PDFs and printed pages across the event calendar components. This makes the print module a little better by smoothing out some rough edges.

What’s next

We are working on new templating capabilities, simplifying planning for long projects that span weeks or months and even years with the timeline view and cooking up some useful examples for real-time filtering and search.

Read the full blog post

MOBISCROLL 5.19

Agenda

NEW

  • We added the navigateToEvent method which can be used to move the view to the specified event.

Datepicker

FIXED

  • We fixed an issue where the picker was not opening with Android TalkBack.

Eventcalendar

NEW

  • We added the navigateToEvent method which can be used to move the view to the specified event.

FIXED

  • We fixed the updateRecurringEvent util function to don’t override the start date of the original recurring event.

Print module

NEW

  • The document title will be used as default file name when saving the print as pdf in supported browsers.
  • We added dynamic page breaks to avoid cutting rows in half.

FIXED

  • We fixed a FOUC issue when opening the print popup window
  • The Prev, Next and Today buttons are now hidden in the calendar header when printing.
  • We fixed an issue where some resources were not showing up when printing the timeline component.
  • We fixed an issue in angular that prevented printing of more than one page from the timeline component.
  • We fixed a missing right border on the calendar view when printing the page.

Scheduler

NEW

  • We added the navigateToEvent method which can be used to move the view to the specified event.
  • We added a cursor indicator which displays the time where the cursor is positioned in the time labels section. In case of event drag & drop it will display the start/end time of the updated event.

FIXED

  • We fixed an issue where the day view was not loaded correctly if the specified startDay was different than the first weekday specified by the locale options.
  • We fixed the today button which scrolled to the wrong time if the display timezone was different from the local timezone.

Select

FIXED

  • We fixed an issue where the picker was not opening with Android TalkBack.
  • We added the missing invalid option to the Angular component.

Timeline

NEW

  • We added event connection support. Events can be linked with lines, optionally with arrows to illustrate the direction of the connection.
  • We added the navigateToEvent method which can be used to move the view to the specified event.
  • We added a cursor indicator which displays the time where the cursor is positioned in the time labels section. In case of event drag & drop it will display the start/end time of the updated event.

FIXED

  • We fixed an issue where an extra resource row was rendered if a resource had an empty array as children.
  • We fixed SSR issues, where the markup coming from the server was different compared to the markup rendered by the client.
  • We fixed an issue where event drag got stuck, if the event was dragged on a longer distance while scrolling.
  • We fixed the today button which scrolled to the wrong time if the display timezone was different from the local timezone.

MOBISCROLL 5.19.1

Datepicker

FIXED

  • We added the missing exclusiveEndDates input option to the Angular component.
  • We fixed the styling of the multiple month and year view, where on certain sizes we displayed too many months in a row, causing the day week headers not aligning properly with the day columns.
  • We fixed an issue, when the end date displayed in the input field was before the start date, when timezones were used.

Eventcalendar

FIXED

  • We fixed the styling of the multiple month and year view, where on certain sizes we displayed too many months in a row, causing the day week headers not aligning properly with the day columns.

Forms

FIXED

  • We fixed an issue where the prompt dialog closed automatically if the input was autofilled with a value.
  • We fixed the styling of the stepper input, where the native spin buttons were visible in Firefox.

Popup

FIXED

  • We fixed an issue where the popup threw an error in React 18 strict mode, if it was displayed initially open.

Scheduler

FIXED

  • We fixed an issue with the cursor time indicator, which caused an error in Angular, if drag options were enabled dynamically.

Timeline

FIXED

  • We fixed an issue where the timeline was rendered incorrectly when changing the rtl option dynamically.
  • We fixed an issue with the cursor time indicator, which caused an error in Angular, if drag options were enabled dynamically.
  • We improved the vertical spacing of the events to fix the display of the connection lines.

MOBISCROLL 5.19.2

All Components

FIXED

  • We fixed an issue which caused a compilation error with typescript >= 4.8.0.

Datepicker

FIXED

  • We fixed an issue where dynamically changing the number of displayed month caused the picker to jump to a different year.
  • We fixed an issue where it was possible to navigate outside of the specified min and max dates from the header navigation.
  • We fixed the month name display in the calendar header in week view, when navigating from the header navigation.
  • We fixed an issue where the datepicker was not closed if another datepicker was opened and the showOnFocus option was enabled.

Eventcalendar

FIXED

  • We fixed the minimum height of the calendar view to display at least 2 labels when using the Windows theme in desktop mode.

Print module

FIXED

  • We fixed a styling issue, where the header days were not properly aligned with the grid columns, if the grid had vertical scrollbar.

Scheduler

FIXED

  • We fixed the alignment of the all-day text for the Material theme and in RTL mode for all other themes.

For the full changelog please visit our release history.

PS. You will find an upgrade guide for moving from Mobiscroll 4 to Mobiscroll 5.

Download the latest version now