Event scheduler is a jQuery plugin to let you bind events to a specific date. All dates are shown in a tape-look box which is scroll-able using the arrows or a mouse wheel. Clicking on a specific date opens the event container below the date container in which are listed all the events that are happening at the given day. An event contains a title, date, time, place, description, link and line color (not all fields are mandatory).
The plugin has a modern look and may be used for any kind of scheduling events (concerts, meetings, festivals and even in business purposes). As the width of the component is adjustable, you can feel free to use the scheduler on a full width as a single page or fit it in some small corner.
Responsive and adjustable width
The plugin is responsive and provides pretty much the same design/look on any kind of resolution and device. As for the width, it is fully adjustable and it’s all up to a user to set a desirable width. The width can be set through various ways hence you can use the number of pixels, percentage or ‘auto’ option. ‘auto’ option calculates width all by itself so that all dates would fit in the date container so that a user don’t need to scroll. ‘auto’ option can also used be used as an addition to the width in pixels or percentage (for example: ‘500px – auto’). This would mean that if width of 500px cuts one of the date boxes (dates) on half, the ‘auto’ option would change the width so slightly so that none of the date boxes is cut.
Colors
The component comes with 8 different color schemes which can be changed very easily. The colors are: blue, black, red, green, orange, purple, cyan and pink. Adding a new color is only a 1 minute job.
Easy to implement
Event scheduler uses Module pattern which allows it to create more than one instance of the component. It also means that each instance can use a different settings (explained in detail in the next section) therefore it allows users to customize it by their needs.
Implementing the plugin is very easy. All you have to do is to invoke escScheduler.init and pass desired settings as a parameter. All the magic happens afterwards. As the mouse wheel event is not implemented by jQuery, the plugin uses an outside library to include it.
All the events are stored locally in a json file therefore there is no need for a database or any other scripting/programming language besides Javascript. Note that it is very easy to adjust the component to work with a database simply by changing the ajax url in importEvents() function (keep in mind to follow the format of a json file).
Highly customizable
The plugin is highly customizable and enables their users to fit their needs. As already explained earlier, it provides functionalities to change the width and the color, however these are only two of many other options. You can set the begging date (in case you want event scheduler to start on some day in the past), alignment, whether you want or do not want the arrows, date type (to show the day in a week or a name of a month), localization and some more. Read the documentation for more informations.