locale.html 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <style>
  5. /* http://code.google.com/p/fullcalendar/issues/detail?id=193 */
  6. .fc .fc-sat, .fc .fc-sun { background-color:red }
  7. </style>
  8. <link href='../dist/fullcalendar.css' rel='stylesheet' />
  9. <link href='../dist/fullcalendar.print.css' rel='stylesheet' media='print' />
  10. <script src='../lib/jquery/dist/jquery.js'></script>
  11. <script src='../lib/moment/moment.js'></script>
  12. <script src='../dist/fullcalendar.js'></script>
  13. <script>
  14. var date = new Date();
  15. var d = date.getDate();
  16. var m = date.getMonth();
  17. var y = date.getFullYear();
  18. $(document).ready(function() {
  19. $('#calendar').fullCalendar({
  20. header: {
  21. left: 'nextYear,next,prev,prevYear today',
  22. center: 'month,agendaWeek,basicWeek,agendaDay,basicDay',
  23. right: 'title prev,next'
  24. },
  25. editable: true,
  26. isRTL: true,
  27. firstDay: 1,
  28. //weekends: false,
  29. //hiddenDays: [ 4 ], // hide thursday
  30. //weekNumbers: true,
  31. minTime: '8am',
  32. maxTime: '11:30pm',
  33. firstHour: 9,
  34. monthNames: ["januari", "februari", "maart", "april", "mei", "juni","juli", "augustus", "september", "oktober", "november", "december"],
  35. monthNamesShort: ["jan", "feb", "maa", "apr", "mei", "jun", "jul", "aug","sep", "okt", "nov", "dec"],
  36. dayNames: ['zondag', 'maandag', 'dinsdag', 'woensdag','donderdag', 'vrijdag', 'zaterdag'],
  37. dayNamesShort: ["zo", "ma", "di", "wo", "do", "vr", "za", "zo"],
  38. //timeFormat: 'H(:mm)t',
  39. //timeFormat: 'MMMM,dddd',
  40. weekMode: 'variable',
  41. dayClick: function(dayDate, allDay, ev, view) {
  42. console.log('dayClick - ' + dayDate + ' - allDay:' + allDay + ' --- ' + view.title);
  43. },
  44. eventDrop: function(event, dayDelta, minuteDelta, allDay, revertFunc, jsEvent, ui, view) {
  45. console.log('DROP ' + event.title);
  46. console.log(dayDelta + ' days');
  47. console.log(minuteDelta + ' minutes');
  48. console.log('allDay: ' + allDay);
  49. console.log(event.start);
  50. //console.log(minuteDelta + ' minutes');
  51. },
  52. eventResize: function(event, dayDelta, minuteDelta, revertFunc, jsEvent, ui, view) {
  53. console.log('RESIZE!! ' + event.title);
  54. console.log(dayDelta + ' days');
  55. console.log(minuteDelta + ' minutes');
  56. console.log(event.end);
  57. //console.log(minuteDelta + ' minutes');
  58. },
  59. events: [
  60. {
  61. title: 'All Day Event',
  62. start: new Date(y, m, 1)
  63. },
  64. {
  65. title: 'Long Event',
  66. start: new Date(y, m, d-5),
  67. end: new Date(y, m, d-2)
  68. },
  69. {
  70. id: 999,
  71. title: 'Repeating Event',
  72. start: new Date(y, m, d-3, 16, 0),
  73. allDay: false
  74. },
  75. {
  76. id: 999,
  77. title: 'Repeating Event',
  78. start: new Date(y, m, d+4, 16, 0),
  79. allDay: false
  80. },
  81. {
  82. title: 'Meeting',
  83. start: new Date(y, m, d, 10, 30),
  84. allDay: false
  85. },
  86. {
  87. title: 'Lunch',
  88. start: new Date(y, m, d, 12, 0),
  89. end: new Date(y, m, d, 14, 0),
  90. allDay: false
  91. },
  92. {
  93. title: 'Birthday Party',
  94. start: new Date(y, m, d+1, 19, 0),
  95. end: new Date(y, m, d+1, 22, 30),
  96. allDay: false
  97. },
  98. {
  99. title: 'Click for Google',
  100. start: new Date(y, m, 28),
  101. end: new Date(y, m, 29),
  102. url: 'http://google.com/'
  103. }
  104. ]
  105. });
  106. });
  107. </script>
  108. </head>
  109. <body style='font-size:12px'>
  110. <div id='calendar' style='width:900px;margin:20px auto 0;font-family:arial'></div>
  111. </body>
  112. </html>