🔔 Alert..!! Get 2 Month Free Cloud Hosting With $200 Bonus From Digital Ocean ACTIVATE DEAL

A rich calendar control for visualizing events implemented on top of AngularJS UI Bootstrap’s Datepicker plugin.

Bootstrap Calendar Plugins

Documentation

RichCC (v1.0)

A rich calendar control for visualizing events implemented on top of AngularJS UI Bootstrap's Datepicker plugin.

##Demo

Sample Preview @ http://richcc.azurewebsites.net/

##Sample Code Blocks

####Intializing Events [ { 'id': '1', 'initial': 'A', 'name': 'Event A', 'startDt': '01-02-2016', 'endDt': '01-06-2016', 'bgcolor': '#2ecc71', 'color': '#ffffff', 'subject': 'Will not have have access to e-mails. You can contact me on XXX-XXX-XXXX' }, { 'id': '2', 'initial': 'B', 'name': 'Event B', 'startDt': '01-02-2016', 'endDt': '01-02-2016', 'bgcolor': '#47a1de', 'color': '#ffffff', 'subject': 'Will not have have access to e-mails. You can contact me on XXX-XXX-XXXX' }, { 'id': '5', 'initial': 'E', 'name': 'Event E', 'startDt': '01-10-2016', 'endDt': '02-10-2016', 'bgcolor': '#ffc310', 'color': '#000000', 'subject': 'Will not have have access to e-mails. You can contact me on XXX-XXX-XXXX' }, { 'id': '3', 'initial': 'C', 'name': 'Event C', 'startDt': '01-07-2016', 'endDt': '01-08-2016', 'bgcolor': '#e67e22', 'color': '#ffffff', 'subject': 'Will not have have access to e-mails. You can contact me on XXX-XXX-XXXX' }, { 'id': '4', 'initial': 'D', 'name': 'Event D', 'startDt': '01-06-2016', 'endDt': '01-09-2016', 'bgcolor': '#e74c3c', 'color': '#ffffff', 'subject': 'Will not have have access to e-mails. You can contact me on XXX-XXX-XXXX' } ];

####Adding Tags

####Showing Light Mode - 'light'

####Showing Light Mode With Event Pop Up Hidden - 'eventPopupHide'

####For Events map on Month Mode

####Defaulting to Month View

##Capabilities

  1. View events for all days in a month

  2. View events for a day

  3. View events for all days in a month with light mode enabled

  4. View events for all months in a year

  5. View events for all months in a year in a heat map mode (inspired by GitHub)

##Adding dependency to your project angular.module('myModule', ['richcc.bootstrap.datepicker']);

##Note Since all modules have been built by refactoring the Angular JS UI BootStrap's Datepicker module, the module names have been changed so as to mitigate/prevent any instance clash.

Inline documentation + README last updated 15/03/2016. Please refer sample app in the repo for updated capabilities.


You May Also Like