This demo showcases how the flat Scheduler looks like with its default set of minimal configurations. Here, some of the
documentary shows are displayed as events parallel to its relevant telecast timings. The show names are given as
event's subject and simply notified of the start and end of it.
More Details...
| |
12:00 AM | | 1:00 AM | | 2:00 AM | | 3:00 AM | | 4:00 AM | | 5:00 AM | | 6:00 AM | | 7:00 AM | | 8:00 AM | | 9:00 AM | | 10:00 AM | | 11:00 AM | | 12:00 PM | | 1:00 PM | | 2:00 PM | | 3:00 PM | | 4:00 PM | | 5:00 PM | | 6:00 PM | | 7:00 PM | | 8:00 PM | | 9:00 PM | | 10:00 PM | | 11:00 PM | |
| Explosion of Betelgeuse Star 4:00 AM - 5:30 AM Space Centre USA Alien Civilization 8:30 AM - 10:30 AM Space Centre USA | The Cycle of Seasons 12:00 AM - 2:00 AM Research Centre of USA Thule Air Crash Report 6:30 AM - 8:30 AM Newyork City Space Galaxies and Planets 11:30 AM - 1:00 PM Space Centre USA | Blue Moon Eclipse 4:00 AM - 5:30 AM Space Centre USA The Cycle of Seasons 9:00 AM - 10:30 AM Research Centre of USA | Meteor Showers in 2021 7:30 AM - 9:00 AM Space Centre USA | Lifecycle of Bumblebee 12:30 AM - 2:00 AM San Fransisco Mysteries of Bermuda Triangle 4:00 AM - 5:30 AM Bermuda Milky Way as Melting pot 6:30 AM - 8:30 AM Space Centre USA Alien Civilization 10:30 AM - 12:30 PM Space Centre USA | Glaciers and Snowflakes 5:30 AM - 7:00 AM Himalayas Sky Gazers 9:00 AM - 10:30 AM Greenland | Life on Mars 3:30 AM - 4:30 AM Space Centre USA Facts of Humming Birds 7:00 AM - 9:00 AM California | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | |
|
Description
The JavaScript Scheduler, a.k.a. event calendar, facilitates almost all calendar features, thus allowing users
to manage their time efficiently. It features easy resource scheduling, appointments rescheduling through
editor pop-ups, drag and drop, and a resizing action. It includes wide variety of view modes with unique
configuration options for each view. The available view modes are listed below, out of which the Week
view is set as active.
Day
Week
Work Week
Month
Agenda
Month Agenda
Timeline Day
Timeline Week
Timeline Work Week
Timeline Month
To navigate between views and dates, the navigation options are available at the Scheduler header bar and the
active view option is highlighted by default. The date range of the active view will also be displayed in the
header bar, clicking on which will open a calendar popup for ease of desired date selection.
Touch actions on Mobile mode
Action
Description
Single Tap
Single tapping on events, opens the popup showing event information
Single tapping on cells, will display a “+” icon on the cell. Again tapping on it will open the
new event editor.
Tap hold
Tap holding on events, opens a small popup at the top holding the options to edit or delete and
also displays the selected event's subject. As a continuation of this action, if user keeps on
single tapping on other events, it will allow the multiple event selection. Also, the previous
popup remains in opened state, showing the count of the number of events selected.
Tap holding the events will also open the tooltip on Scheduler.
Tap hold the event and try moving it over the scheduler to enable drag and drop action.
Module Injection
The key Scheduler functionalities are maintained as individual feature-wise modules. Therefore to avail with a
particular feature, appropriate module needs to be injected using Schedule.Inject() method. For
example, to work with the day view on Scheduler – it is necessary to inject the Day module like Schedule.Inject(Day).
Note:In case, if the module of active view is not injected from the application end – then
the Scheduler is configured to display the first available option in the views property.