{"id":19424456,"url":"https://github.com/ericwenn/kalendar","last_synced_at":"2026-03-16T22:32:41.137Z","repository":{"id":12851749,"uuid":"15527639","full_name":"ericwenn/kalendar","owner":"ericwenn","description":"Revamped version of my flat_calendar plugin. Now offers more features and easier customization.","archived":false,"fork":false,"pushed_at":"2014-05-02T13:42:42.000Z","size":244,"stargazers_count":21,"open_issues_count":3,"forks_count":11,"subscribers_count":6,"default_branch":"master","last_synced_at":"2025-04-11T20:44:25.390Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":"bodacea/datascienceforbeginners","license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ericwenn.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2013-12-30T12:48:28.000Z","updated_at":"2022-03-20T19:27:32.000Z","dependencies_parsed_at":"2022-08-28T09:32:14.934Z","dependency_job_id":null,"html_url":"https://github.com/ericwenn/kalendar","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ericwenn%2Fkalendar","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ericwenn%2Fkalendar/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ericwenn%2Fkalendar/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ericwenn%2Fkalendar/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ericwenn","download_url":"https://codeload.github.com/ericwenn/kalendar/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250663544,"owners_count":21467366,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-10T13:44:11.772Z","updated_at":"2025-09-23T11:20:28.810Z","avatar_url":"https://github.com/ericwenn.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"kalendar\n========\n\nRevamped version of my flat_calendar plugin. Now offers more features and easier customization.  \nSupports both custom and Google Calendar events. \n\nFeatures\n------\n\n* __Multiday events__ — Events can last for days and kalendar will show them correctly\n* __Google Calendar support__ — Include your calendarID and an APIkey and kalendar will show your google events as well.\n* __Customizable__ — Easy to change kalendar’s color with 4 predefined colorsets.\n* __Good performance__ — kalendar won’t use much of your precious power. Stuff are unloaded when it isn’t needed.\n\n\nCustomizations \n------\n\n* __First day of the week__ — Default is monday but could be any day of the month\n* __Toggle daylabel__\n* __Starting month/year__ — Decide which month you would like to display from start\n* __Color__\n* __Eventhooks__\n\nFAQ\n-------\n\n__When I insert the calendar, all the days are stacked upon each other. Why?__  \nThere needs to be a height set on the calendar element since some inner elements use absolute positioning.\n\nUsage\n-------\n\nflat_calendar could be initialized with both HTML and JS, but I have discountinued developing with HTML support. flat_calendar is still available as a repo https://github.com/ericwenn/flat_calendar if you would like HTML support.  \nThe reason for this is as the plugin grew more complex and more customizations were added initializing with HTML became harder. Both to write but also for me to parse.\n\nSo kalendar only supports JS initialization, and it is for the best.\n\nFirst of all though, you have to import the .css and .js file to your project.\n\n### Simple kalendar\n\n```javascript\njQuery(\".kalendar-element\").kalendar();\t\n```\nThis will display a red, awesome but pretty useless calendar. No events, no customizations, no funnies.\n\n### Customized kalendar\n\nWhen initializing your kalendar, include a set of options. These are all of the available:  \n__Especially note the tracking variable__\n```javascript\n$('.example').kalendar({\n\n\t// Events are objects, placed inside of an array\n\tevents: [\n\t\t{\n\t\t\ttitle: \"Title of event\",\n\t\t\tstart: {\n\t\t\t\tdate: YYYYMMDD or \"YYYYMMDD\",\t// \"20131230\"\n\t\t\t\ttime: \"HH.MM\"\t\t\t\t\t// \"12.00\"\n\t\t\t},\n\t\t\tend: {\n\t\t\t\tdate: YYYYMMDD or \"YYYYMMDD\",\t// \"20131230\"\n\t\t\t\ttime: \"HH.MM\"\t\t\t\t\t// \"20.00\"\n\t\t\t},\n\t\t\tlocation: \"Location\",\t\t\t\t// \"London\"\n\t\t\turl: \"http://*.*\",\t\t\t\t\t// \"http://example.com\"\n\t\t\tcolor: \"string\"\t\t\t\t\t\t// \"red\" string containing reference to the eventcolorsobject\n\t\t}\n\t],\n\t// Custom colorsets to set a specific color to an event. If one of the three variables isn’t set the inherit value will be used.\n\teventcolors: {\n\t\tyellow: {\n\t\t\tbackground: \"#FC0\",\t\t\t\t\t// Backgroundcolor, optional\n\t\t\ttext: \"#000\",\t\t\t\t\t\t// Text color, optional\n\t\t\tlink: \"#000\"\t\t\t\t\t\t// Link color, optional\n\t\t}\n\t}\n\n\t// Currently available colors are: red, blue, green, yellow. Red is the default.\n\tcolor: \"blue\",\n\n\t// Default is Monday, but any day of the week is applicable.\n\tfirstDayOfWeek: \"Sunday\",\n\n\t// Google Calendar reference are objects, place inside of an array to support multiple calendars.\n\t// If you are unsure how to get an API-key visit: https://developers.google.com/google-apps/calendar/firstapp\n\t// If you are unsure how to get your calendar visit: https://support.google.com/calendar/answer/63962?hl=en\n\tgoogleCal: [{\n\t\tcalendar: \"calendarID\",\n\t\tapikey: \"APIkey\"\n\t},\n\t{\n\t\tcalendar: \"calendarID\",\n\t\tapikey: \"APIkey\"\n\t}],\n\n\t// Any name is possible, but note that not all names might fit in the UI\n\n\tmonthHuman: [[\"JAN\",\"January\"],[\"FEB\",\"February\"], etc... ],\n\n\t// Regarding name lengths same applies here\n\n\tdayHuman: [[\"S\",\"Sunday\"],[\"M\",\"Monday\"], etc... ],\n\n\t// The text which represents links for events\n\n\turlText: \"View on Web\",\n\n\t// Callbackevents will be fired when a certain criteria is met. The following are the currently supported events\n\n\tonInitiated: function() {},\t\t\t\t\t// After the kalendar have been fully initiated. E.g when everything is loaded\n\tonGoogleParsed: function() {},\t\t\t\t// After Google Calendar events, if they exist, have been parsed\n\tonMonthChanged: function() {},\t\t\t\t// After events passed to the plugin have been parsed\n\tonDayShow: function() {},\t\t\t\t\t// When a specific day have started to load. E.g when a day with an event attached to it is clicked\n\tonGridShow: function() {},\t\t\t\t\t// When the grid of days have started to load. E.g when a specific dayview have been cancelled\n\tonDayClick: function(e) {}\t\t\t\t\t// When a day gets clicked, no matter if it contains any event or not. Passed to this function is whether the day \t\t\t\t\t\t\t\t\t\t\t\t is from this month or if it’s the current day. This can be accessed in the variable e.data.info\n\n\t// I decided to track people using this plugin in order to make it even better. \n\t// The things I collect are current URL, color or kalendar, whether you decided to show days or not and your selected first day of the week.\n\t// Pass this variable as false and no tracking whatsoever will be done.\n\t// ***TRUE IS SET AS DEFAULT*** \n\ttracking: true\n});\n\n```\n\nTodo\n-----\n* Reccuring events, both for Google Calendar but also custom ones.\n* Add minified version\n* Weeknumber\n\n\nChangelog\n----\n`v1.2.0 2014-01-08`: Added callback events and colors for events.  \n`v1.1.0 2014-01-04`: Added links for events.  \n`v1.0.0 2013-12-30`: First version published, yay!  \n\n\nThanks\n-----\nI hope you will like using this plugin as much as I did creating it.  \nIf you have __any__ questions regarding this plugin, or just in general, please contact me.\n\n\nEric Wennerberg\nhttp://ericwenn.se\nhttps://twitter.com/ericwenn","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fericwenn%2Fkalendar","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fericwenn%2Fkalendar","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fericwenn%2Fkalendar/lists"}