These are just a few examples of how the MonthlyCalendar component can be configured. The demos are all single-page applications that run entirely on the client, and links to the JavaScript source and CSS files are included on each page.
Event editing: With the mouse, new events can be created by double-clicking on a day or dragging from a day. If dragging, the new event must be at least a half day long to be created.
On a touch device, an event must be selected before it can be moved or resized. To create a new event, make sure no existing event is selected, then tap and hold on a day, and optionally drag to another day. The new event must be at least a half day long, as with mice.
Internet Explorer 8 users: The demos use CSS3 features which are not supported by Internet Explorer 8 and earlier.
Tablet users: Touch to see the rollover annotations. The demos may have minor problems on some Android 4 browsers.
Worker
DataPer-day data shown as clickable text and icons, a shared detail panel, and day background gradients generated from the data.
Job
Schedule #1Movable, resizable multi-day events with icons, labels and a shared detail panel showing the calendar's selection and layout capabilities.
Job
Schedule #2Movable, resizable multi-day events with clickable icons and shared detail and popup panels on a resizable calendar.
Training EventsEvents with a detail panel, per-day annotations, and custom day background shading on a resizable calendar.
Event
FeedbackAlternative ways to show selection, rollover and edit feedback for events, on a resizable calendar.
Event
HeightMovable variable-height events with heights set in different ways, on a resizable calendar.
WEBDiagrams Framework Demos
The generic WEBDiagrams diagramming component and toolkit can be configured to display many types and styles of diagrams. The diagrams operate entirely in the client browser, and can be used with any client-side toolkit. These demos show a few simple techniques which can be combined with professional graphics to build attractive functional diagrams.
OilfieldMouse/touch-sensitive element areas, a rollover panel for well detail, and diagram scrolling and scaling options.





