最近工作上寫的,目的是想弄個功能接近Google Calendar的東西
原本想拿個開源的專案回來改,不過查了比較流行的幾個專案都是用jQuery、react來寫的
而且坦白說都還滿大包的,好幾個複合需求湊起來就是這樣的大小
反而沒有看到單純用JavaScript刻的 Events Calendar
這下只好自己動手做了
gist link
不是什麼了不起的code,不過寫起來也花了一些時間
雖然說大部分的時間可能在觀察Google Calendar的行為(笑
使用上應該還算好拿來改的
CalendarEvent 依照自己的需求決定要多帶哪些數據
至少要有個顯示的內容跟一個日期
EventCalendar.requireEventData([{
"content": "test2",
"date_init": "2016/12/16 11:30:00",
"info": "test 2" // 這是示範用來作客製化行為的額外資料
}
]);
EventCalendar.setEventRenderFunction、EventCalendar.setEventMoreFunction可自訂事件處理
如果想做其它天期的顯示模式則可以參考 CalendarView 的繼承寫法自行撰寫
var calendar = EventCalendar.render(); // 畫出calendar
接著把畫完的calendar貼到想用的地方就可以了
歡迎改寫跟回報bug
原本想拿個開源的專案回來改,不過查了比較流行的幾個專案都是用jQuery、react來寫的
而且坦白說都還滿大包的,好幾個複合需求湊起來就是這樣的大小
反而沒有看到單純用JavaScript刻的 Events Calendar
這下只好自己動手做了
gist link
不是什麼了不起的code,不過寫起來也花了一些時間
雖然說大部分的時間可能在觀察Google Calendar的行為(笑
使用上應該還算好拿來改的
CalendarEvent 依照自己的需求決定要多帶哪些數據
至少要有個顯示的內容跟一個日期
EventCalendar.requireEventData([{
"content": "test2",
"date_init": "2016/12/16 11:30:00",
"info": "test 2" // 這是示範用來作客製化行為的額外資料
}
]);
EventCalendar.setEventRenderFunction、EventCalendar.setEventMoreFunction可自訂事件處理
如果想做其它天期的顯示模式則可以參考 CalendarView 的繼承寫法自行撰寫
var calendar = EventCalendar.render(); // 畫出calendar
接著把畫完的calendar貼到想用的地方就可以了
歡迎改寫跟回報bug
留言
張貼留言