mirror of
https://github.com/wassname/DefinitelyTyped.git
synced 2026-09-09 11:13:57 +08:00
Add FullCalendar 1.6.1 definition
This commit is contained in:
Neil Stalker
@@ -63,6 +63,7 @@ List of Definitions
|
||||
* [FlexSlider](http://www.woothemes.com/flexslider/) (by [Diullei Gomes](https://github.com/Diullei))
|
||||
* [Foundation](http://foundation.zurb.com/) (by [Boris Yankov](https://github.com/borisyankov))
|
||||
* [FPSMeter](http://darsa.in/fpsmeter/) (by [Aaron Lampros](https://github.com/alampros))
|
||||
* [FullCalendar](http://arshaw.com/fullcalendar/) (by [Neil Stalker](https://github.com/nestalk))
|
||||
* [Gamepad](http://www.w3.org/TR/gamepad/) (by [Kon](http://phyzkit.net/))
|
||||
* [glDatePicker](http://glad.github.com/glDatePicker/) (by [Dániel Tar](https://github.com/qcz))
|
||||
* [GreenSock Animation Platform (GSAP)](http://www.greensock.com/get-started-js/) (by [Robert S.](https://github.com/codeBelt))
|
||||
|
||||
@@ -0,0 +1,832 @@
|
||||
/// <reference path="fullCalendar.d.ts" />
|
||||
/// <reference path="../jquery/jquery.d.ts"/>
|
||||
/// <reference path="../jqueryui/jqueryui.d.ts"/>
|
||||
|
||||
// All examples from http://arshaw.com/fullcalendar/docs/
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
})
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
weekends: false
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
dayClick: function () {
|
||||
alert('a day has been clicked!');
|
||||
}
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar('next');
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
events: 'http://www.google.com/your_feed_url/'
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
events: {
|
||||
url: 'http://www.google.com/your_feed_url/',
|
||||
className: 'gcal-event', // an option!
|
||||
currentTimezone: 'America/Chicago' // an option!
|
||||
}
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
eventSources: [
|
||||
|
||||
// source with no options
|
||||
"http://www.google.com/your_feed_url1/",
|
||||
|
||||
// source with no options
|
||||
"http://www.google.com/your_feed_url2/",
|
||||
|
||||
// source WITH options
|
||||
{
|
||||
url: "http://www.google.com/your_feed_url3/",
|
||||
className: 'nice-event'
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
height: 650
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar('option', 'height', 700);
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
contentHeight: 600
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar('option', 'contentHeight', 650);
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
aspectRatio: 2
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar('option', 'aspectRatio', 1.8);
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
viewDisplay: function (view) {
|
||||
alert('The new title of the view is ' + view.title);
|
||||
}
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
windowResize: function (view) {
|
||||
alert('The calendar has adjusted to a window resize');
|
||||
}
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar('render');
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
dragOpacity: {
|
||||
month: .2,
|
||||
'': .5
|
||||
}
|
||||
});
|
||||
|
||||
var view: FullCalendar.View = <any>$('#calendar').fullCalendar('getView');
|
||||
alert("The view's title is " + view.title);
|
||||
|
||||
$(document).ready(function () {
|
||||
|
||||
var date = new Date();
|
||||
var d = date.getDate();
|
||||
var m = date.getMonth();
|
||||
var y = date.getFullYear();
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
header: {
|
||||
left: 'prev,next today',
|
||||
center: 'title',
|
||||
right: 'month,basicWeek,basicDay'
|
||||
},
|
||||
editable: true,
|
||||
events: [
|
||||
{
|
||||
title: 'All Day Event',
|
||||
start: new Date(y, m, 1)
|
||||
},
|
||||
{
|
||||
title: 'Long Event',
|
||||
start: new Date(y, m, d - 5),
|
||||
end: new Date(y, m, d - 2)
|
||||
},
|
||||
{
|
||||
id: 999,
|
||||
title: 'Repeating Event',
|
||||
start: new Date(y, m, d - 3, 16, 0),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
id: 999,
|
||||
title: 'Repeating Event',
|
||||
start: new Date(y, m, d + 4, 16, 0),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
title: 'Meeting',
|
||||
start: new Date(y, m, d, 10, 30),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
title: 'Lunch',
|
||||
start: new Date(y, m, d, 12, 0),
|
||||
end: new Date(y, m, d, 14, 0),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
title: 'Birthday Party',
|
||||
start: new Date(y, m, d + 1, 19, 0),
|
||||
end: new Date(y, m, d + 1, 22, 30),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
title: 'Click for Google',
|
||||
start: new Date(y, m, 28),
|
||||
end: new Date(y, m, 29),
|
||||
url: 'http://google.com/'
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
$(document).ready(function () {
|
||||
|
||||
var date = new Date();
|
||||
var d = date.getDate();
|
||||
var m = date.getMonth();
|
||||
var y = date.getFullYear();
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
header: {
|
||||
left: 'prev,next today',
|
||||
center: 'title',
|
||||
right: 'month,basicWeek,basicDay'
|
||||
},
|
||||
defaultView: 'basicWeek',
|
||||
editable: true,
|
||||
events: [
|
||||
{
|
||||
title: 'All Day Event',
|
||||
start: new Date(y, m, 1)
|
||||
},
|
||||
{
|
||||
title: 'Long Event',
|
||||
start: new Date(y, m, d - 5),
|
||||
end: new Date(y, m, d - 2)
|
||||
},
|
||||
{
|
||||
id: 999,
|
||||
title: 'Repeating Event',
|
||||
start: new Date(y, m, d - 3, 16, 0),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
id: 999,
|
||||
title: 'Repeating Event',
|
||||
start: new Date(y, m, d + 4, 16, 0),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
title: 'Meeting',
|
||||
start: new Date(y, m, d, 10, 30),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
title: 'Lunch',
|
||||
start: new Date(y, m, d, 12, 0),
|
||||
end: new Date(y, m, d, 14, 0),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
title: 'Birthday Party',
|
||||
start: new Date(y, m, d + 1, 19, 0),
|
||||
end: new Date(y, m, d + 1, 22, 30),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
title: 'Click for Google',
|
||||
start: new Date(y, m, 28),
|
||||
end: new Date(y, m, 29),
|
||||
url: 'http://google.com/'
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
$(document).ready(function () {
|
||||
|
||||
var date = new Date();
|
||||
var d = date.getDate();
|
||||
var m = date.getMonth();
|
||||
var y = date.getFullYear();
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
header: {
|
||||
left: 'prev,next today',
|
||||
center: 'title',
|
||||
right: 'month,basicWeek,basicDay'
|
||||
},
|
||||
defaultView: 'basicDay',
|
||||
editable: true,
|
||||
events: [
|
||||
{
|
||||
id: 1,
|
||||
title: "Long Event",
|
||||
start: new Date(y, m, d, 14, 0),
|
||||
end: new Date(y, m, d + 3),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "Repeating Event",
|
||||
start: new Date(y, m, d - 1),
|
||||
allDay: true
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "Repeating Event",
|
||||
start: new Date(y, m, d + 6),
|
||||
allDay: true
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: "Meeting",
|
||||
start: new Date(y, m, d, 9, 0),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
title: "Click for Facebook",
|
||||
start: new Date(y, m, d, 16),
|
||||
end: new Date(y, m, d),
|
||||
url: "http://facebook.com/",
|
||||
allDay: false
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
$(document).ready(function () {
|
||||
|
||||
var date = new Date();
|
||||
var d = date.getDate();
|
||||
var m = date.getMonth();
|
||||
var y = date.getFullYear();
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
editable: true,
|
||||
header: {
|
||||
left: 'prev,next today',
|
||||
center: 'title',
|
||||
right: 'month,agendaWeek,agendaDay'
|
||||
},
|
||||
defaultView: 'agendaWeek',
|
||||
events: [
|
||||
{
|
||||
title: 'All Day Event',
|
||||
start: new Date(y, m, 1)
|
||||
},
|
||||
{
|
||||
title: 'Long Event',
|
||||
start: new Date(y, m, d - 5),
|
||||
end: new Date(y, m, d - 2)
|
||||
},
|
||||
{
|
||||
id: 999,
|
||||
title: 'Repeating Event',
|
||||
start: new Date(y, m, d - 3, 16, 0),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
id: 999,
|
||||
title: 'Repeating Event',
|
||||
start: new Date(y, m, d + 4, 16, 0),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
title: 'Meeting',
|
||||
start: new Date(y, m, d, 10, 30),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
title: 'Lunch',
|
||||
start: new Date(y, m, d, 12, 0),
|
||||
end: new Date(y, m, d, 14, 0),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
title: 'Birthday Party',
|
||||
start: new Date(y, m, d + 1, 19, 0),
|
||||
end: new Date(y, m, d + 1, 22, 30),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
title: 'Click for Google',
|
||||
start: new Date(y, m, 28),
|
||||
end: new Date(y, m, 29),
|
||||
url: 'http://google.com/'
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
$(document).ready(function () {
|
||||
|
||||
var date = new Date();
|
||||
var d = date.getDate();
|
||||
var m = date.getMonth();
|
||||
var y = date.getFullYear();
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
header: {
|
||||
left: 'prev,next today',
|
||||
center: 'title',
|
||||
right: 'month,agendaWeek,agendaDay'
|
||||
},
|
||||
defaultView: 'agendaDay',
|
||||
editable: true,
|
||||
events: [
|
||||
{
|
||||
id: 1,
|
||||
title: "Long Event",
|
||||
start: new Date(y, m, d),
|
||||
end: new Date(y, m, d + 3),
|
||||
allDay: true
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "Repeating Event",
|
||||
start: new Date(y, m, d - 1),
|
||||
allDay: true
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "Repeating Event",
|
||||
start: new Date(y, m, d + 6),
|
||||
allDay: true
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: "Meeting",
|
||||
start: new Date(y, m, d, 10, 0),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
title: "Click for Facebook",
|
||||
start: new Date(y, m, d, 11, 30),
|
||||
end: new Date(y, m, d),
|
||||
url: "http://facebook.com/",
|
||||
allDay: false
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
$('#my-prev-button').click(function () {
|
||||
$('#calendar').fullCalendar('prev');
|
||||
});
|
||||
|
||||
$('#my-next-button').click(function () {
|
||||
$('#calendar').fullCalendar('next');
|
||||
});
|
||||
|
||||
$('#my-today-button').click(function () {
|
||||
$('#calendar').fullCalendar('today');
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar('gotoDate', 1, 0, 1);
|
||||
|
||||
$('#my-button').click(function () {
|
||||
var d: Date = <any>$('#calendar').fullCalendar('getDate');
|
||||
alert("The current date of the calendar is " + d);
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
events: [
|
||||
{
|
||||
title: 'My Event',
|
||||
start: '2010-01-01T14:30:00',
|
||||
allDay: false
|
||||
}
|
||||
// other events here...
|
||||
],
|
||||
timeFormat: 'H(:mm)' // uppercase H for 24-hour clock
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
buttonText: {
|
||||
prev: '<',
|
||||
next: '>'
|
||||
}
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
dayClick: function (date, allDay, jsEvent, view) {
|
||||
|
||||
if (allDay) {
|
||||
alert('Clicked on the entire day: ' + date);
|
||||
} else {
|
||||
alert('Clicked on the slot: ' + date);
|
||||
}
|
||||
|
||||
alert('Coordinates: ' + jsEvent.pageX + ',' + jsEvent.pageY);
|
||||
|
||||
alert('Current view: ' + view.name);
|
||||
|
||||
// change the day's background color just for fun
|
||||
$(this).css('background-color', 'red');
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
eventClick: function (calEvent, jsEvent, view) {
|
||||
|
||||
alert('Event: ' + calEvent.title);
|
||||
alert('Coordinates: ' + jsEvent.pageX + ',' + jsEvent.pageY);
|
||||
alert('View: ' + view.name);
|
||||
|
||||
// change the border color just for fun
|
||||
$(this).css('border-color', 'red');
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
events: [
|
||||
{
|
||||
title: 'My Event',
|
||||
start: '2010-01-01',
|
||||
url: 'http://google.com/'
|
||||
}
|
||||
// other events here
|
||||
],
|
||||
eventClick: function (event) {
|
||||
if (event.url) {
|
||||
window.open(event.url);
|
||||
return false;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
|
||||
eventSources: [
|
||||
|
||||
// your event source
|
||||
{
|
||||
url: '/myfeed.php',
|
||||
type: 'POST',
|
||||
data: {
|
||||
custom_param1: 'something',
|
||||
custom_param2: 'somethingelse'
|
||||
},
|
||||
error: function () {
|
||||
alert('there was an error while fetching events!');
|
||||
},
|
||||
color: 'yellow', // a non-ajax option
|
||||
textColor: 'black' // a non-ajax option
|
||||
}
|
||||
|
||||
// any other sources...
|
||||
|
||||
]
|
||||
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
|
||||
events: {
|
||||
url: '/myfeed.php',
|
||||
type: 'POST',
|
||||
data: {
|
||||
custom_param1: 'something',
|
||||
custom_param2: 'somethingelse'
|
||||
},
|
||||
error: function () {
|
||||
alert('there was an error while fetching events!');
|
||||
},
|
||||
color: 'yellow', // a non-ajax option
|
||||
textColor: 'black' // a non-ajax option
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
|
||||
events: {
|
||||
url: '/myfeed.php',
|
||||
cache: true
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
|
||||
eventSources: [
|
||||
|
||||
// your event source
|
||||
{
|
||||
url: '/myfeed.php', // use the `url` property
|
||||
color: 'yellow', // an option!
|
||||
textColor: 'black' // an option!
|
||||
}
|
||||
|
||||
// any other sources...
|
||||
|
||||
]
|
||||
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
events: '/myfeed.php'
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
events: [
|
||||
{
|
||||
title: 'event1',
|
||||
start: '2010-01-01'
|
||||
},
|
||||
{
|
||||
title: 'event2',
|
||||
start: '2010-01-05',
|
||||
end: '2010-01-07'
|
||||
},
|
||||
{
|
||||
title: 'event3',
|
||||
start: '2010-01-09 12:30:00',
|
||||
allDay: false // will make the time show
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
|
||||
eventSources: [
|
||||
|
||||
// your event source
|
||||
{
|
||||
events: [ // put the array in the `events` property
|
||||
{
|
||||
title: 'event1',
|
||||
start: '2010-01-01'
|
||||
},
|
||||
{
|
||||
title: 'event2',
|
||||
start: '2010-01-05',
|
||||
end: '2010-01-07'
|
||||
},
|
||||
{
|
||||
title: 'event3',
|
||||
start: '2010-01-09 12:30:00',
|
||||
}
|
||||
],
|
||||
color: 'black', // an option!
|
||||
textColor: 'yellow' // an option!
|
||||
}
|
||||
|
||||
// any other event sources...
|
||||
|
||||
]
|
||||
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
events: function (start, end, callback) {
|
||||
$.ajax({
|
||||
url: 'myxmlfeed.php',
|
||||
dataType: 'xml',
|
||||
data: {
|
||||
// our hypothetical feed requires UNIX timestamps
|
||||
start: Math.round(start.getTime() / 1000),
|
||||
end: Math.round(end.getTime() / 1000)
|
||||
},
|
||||
success: function (doc) {
|
||||
var events = [];
|
||||
$(doc).find('event').each(function () {
|
||||
events.push({
|
||||
title: $(this).attr('title'),
|
||||
start: $(this).attr('start') // will be parsed
|
||||
});
|
||||
});
|
||||
callback(events);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
|
||||
eventSources: [
|
||||
|
||||
// your event source
|
||||
{
|
||||
events: function (start, end, callback) {
|
||||
// ...
|
||||
},
|
||||
color: 'yellow', // an option!
|
||||
textColor: 'black' // an option!
|
||||
}
|
||||
|
||||
// any other sources...
|
||||
|
||||
]
|
||||
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
eventSources: [
|
||||
'/feed1.php',
|
||||
'/feed2.php'
|
||||
]
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
eventClick: function (event, element) {
|
||||
|
||||
event.title = "CLICKED!";
|
||||
|
||||
$('#calendar').fullCalendar('updateEvent', event);
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
events: [
|
||||
// my event data
|
||||
],
|
||||
eventColor: '#378006'
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
events: [
|
||||
{
|
||||
title: 'My Event',
|
||||
start: '2010-01-01',
|
||||
description: 'This is a cool event'
|
||||
}
|
||||
// more events here
|
||||
],
|
||||
eventRender: function (event, element) {
|
||||
element.qtip({
|
||||
content: event.description
|
||||
});
|
||||
}
|
||||
});
|
||||
$('#my-draggable').draggable({
|
||||
revert: true, // immediately snap back to original position
|
||||
revertDuration: 0 //
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
droppable: true,
|
||||
drop: function (date, allDay) {
|
||||
alert("Dropped on " + date + " with allDay=" + allDay);
|
||||
}
|
||||
});
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
droppable: true,
|
||||
dropAccept: '.cool-event',
|
||||
drop: function () {
|
||||
alert('dropped!');
|
||||
}
|
||||
});
|
||||
|
||||
$('#draggable1').draggable();
|
||||
$('#draggable2').draggable();
|
||||
|
||||
$(document).ready(function () {
|
||||
|
||||
var date = new Date();
|
||||
var d = date.getDate();
|
||||
var m = date.getMonth();
|
||||
var y = date.getFullYear();
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
theme: true,
|
||||
header: {
|
||||
left: 'prev,next today',
|
||||
center: 'title',
|
||||
right: 'month,agendaWeek,agendaDay'
|
||||
},
|
||||
editable: true,
|
||||
events: [
|
||||
{
|
||||
title: 'All Day Event',
|
||||
start: new Date(y, m, 1)
|
||||
},
|
||||
{
|
||||
title: 'Long Event',
|
||||
start: new Date(y, m, d - 5),
|
||||
end: new Date(y, m, d - 2)
|
||||
},
|
||||
{
|
||||
id: 999,
|
||||
title: 'Repeating Event',
|
||||
start: new Date(y, m, d - 3, 16, 0),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
id: 999,
|
||||
title: 'Repeating Event',
|
||||
start: new Date(y, m, d + 4, 16, 0),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
title: 'Meeting',
|
||||
start: new Date(y, m, d, 10, 30),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
title: 'Lunch',
|
||||
start: new Date(y, m, d, 12, 0),
|
||||
end: new Date(y, m, d, 14, 0),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
title: 'Birthday Party',
|
||||
start: new Date(y, m, d + 1, 19, 0),
|
||||
end: new Date(y, m, d + 1, 22, 30),
|
||||
allDay: false
|
||||
},
|
||||
{
|
||||
title: 'Click for Google',
|
||||
start: new Date(y, m, 28),
|
||||
end: new Date(y, m, 29),
|
||||
url: 'http://google.com/'
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
$(document).ready(function () {
|
||||
/* initialize the external events
|
||||
-----------------------------------------------------------------*/
|
||||
$('#external-events div.external-event').each(function () {
|
||||
|
||||
// create an Event Object (http://arshaw.com/fullcalendar/docs/event_data/Event_Object/)
|
||||
// it doesn't need to have a start or end
|
||||
var eventObject = {
|
||||
title: $.trim($(this).text()) // use the element's text as the event title
|
||||
};
|
||||
|
||||
// store the Event Object in the DOM element so we can get to it later
|
||||
$(this).data('eventObject', eventObject);
|
||||
|
||||
// make the event draggable using jQuery UI
|
||||
$(this).draggable({
|
||||
zIndex: 999,
|
||||
revert: true, // will cause the event to go back to its
|
||||
revertDuration: 0 // original position after the drag
|
||||
});
|
||||
|
||||
});
|
||||
/* initialize the calendar
|
||||
-----------------------------------------------------------------*/
|
||||
|
||||
$('#calendar').fullCalendar({
|
||||
header: {
|
||||
left: 'prev,next today',
|
||||
center: 'title',
|
||||
right: 'month,agendaWeek,agendaDay'
|
||||
},
|
||||
editable: true,
|
||||
droppable: true, // this allows things to be dropped onto the calendar !!!
|
||||
drop: function (date, allDay) { // this function is called when something is dropped
|
||||
|
||||
// retrieve the dropped element's stored Event Object
|
||||
var originalEventObject = $(this).data('eventObject');
|
||||
|
||||
// we need to copy it, so that multiple events don't have a reference to the same object
|
||||
var copiedEventObject: any = $.extend({}, originalEventObject);
|
||||
|
||||
// assign it the date that was reported
|
||||
copiedEventObject.start = date;
|
||||
copiedEventObject.allDay = allDay;
|
||||
|
||||
// render the event on the calendar
|
||||
// the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/)
|
||||
$('#calendar').fullCalendar('renderEvent', copiedEventObject, true);
|
||||
|
||||
// is the "remove after drop" checkbox checked?
|
||||
if ($('#drop-remove').is(':checked')) {
|
||||
// if so, remove the element from the "Draggable Events" list
|
||||
$(this).remove();
|
||||
}
|
||||
|
||||
}
|
||||
});
|
||||
});
|
||||
Vendored
+188
@@ -0,0 +1,188 @@
|
||||
// Type definitions for FullCalendar 1.6.1
|
||||
// Project: http://arshaw.com/fullcalendar/ (http://arshaw.com/fullcalendar/)
|
||||
// Definitions by: Neil Stalker <https://github.com/nestalk>
|
||||
// Definitions: https://github.com/borisyankov/DefinitelyTyped
|
||||
|
||||
/// <reference path="../jquery/jquery.d.ts"/>
|
||||
|
||||
declare module FullCalendar {
|
||||
export interface Calendar {
|
||||
formatDate(date: Date, format: string, options?: Options): string;
|
||||
formatDates(date1: Date, date2: Date, format: string, options?: Options): string;
|
||||
parseDate(dateString: string, ignoreTimezone?: boolean): Date;
|
||||
parseISO8601(dateString: string, ignoreTimezone?: boolean): Date;
|
||||
version: string;
|
||||
}
|
||||
|
||||
export interface Options {
|
||||
header?: {
|
||||
left: string;
|
||||
center: string;
|
||||
right: string;
|
||||
}
|
||||
theme?: boolean
|
||||
buttonIcons?: {
|
||||
prev: string;
|
||||
next: string;
|
||||
}
|
||||
firstDay?: number;
|
||||
isRTL?: boolean;
|
||||
weekends?: boolean;
|
||||
weekMode?: string;
|
||||
weekNumbers?: boolean;
|
||||
weekNumberCalculation?: any; // String/Function
|
||||
height?: number;
|
||||
contentHeight?: number;
|
||||
aspectRation?: number;
|
||||
viewDisplay?: (view: View) => void;
|
||||
windowResize?: (view: View) => void;
|
||||
dayRender?: (date: Date, cell: HTMLTableDataCellElement) => void;
|
||||
|
||||
defaultView?: string;
|
||||
|
||||
year?: number;
|
||||
month?: number;
|
||||
date?: number;
|
||||
|
||||
timeFormat?: any; // String/ViewOptionHash
|
||||
columnFormat?: any; // String/ViewOptionHash
|
||||
titleFormat?: any; // String/ViewOptionHash
|
||||
buttonText?: ButtonTextObject;
|
||||
monthNames?: Array<string>;
|
||||
monthNamesShort?: Array<string>;
|
||||
dayNames?: Array<string>;
|
||||
dayNamesShort?: Array<string>;
|
||||
weekNumberTitle?: number;
|
||||
|
||||
dayClick?: (date: Date, allDay: boolean, jsEvent: Event, view: View) => void;
|
||||
eventClick?: (event: EventObject, jsEvent: Event, view: View) => any; // return type boolean or void
|
||||
eventMouseover?: (event: EventObject, jsEvent: Event, view: View) => void;
|
||||
eventMouseout?: (event: EventObject, jsEvent: Event, view: View) => void;
|
||||
|
||||
selectable?: any; // Boolean/ViewOptionHash
|
||||
selectHelper?: any; // Boolean/Function
|
||||
unselectAuto?: boolean;
|
||||
unselectCancel?: string;
|
||||
select?: (startDate: Date, endDate: Date, allDay: boolean, jsEvent: Event, view: View) => void;
|
||||
unselect?: (view: View, jsEvent: Event) => void;
|
||||
|
||||
eventSources?: Array<EventSource>;
|
||||
allDayDefault?: boolean;
|
||||
ignoreTimezone?: boolean;
|
||||
eventDataTransform?: (eventData: any) => EventObject;
|
||||
startParam?: string;
|
||||
endParam?: string
|
||||
lazyFetching?: boolean;
|
||||
loading?: (isLoading: boolean, view: View) => void;
|
||||
|
||||
eventColor?: string;
|
||||
eventBackgroundColor?: string;
|
||||
eventBorderColor?: string;
|
||||
eventTextColor?: string;
|
||||
eventRender?: (event: EventObject, element: HTMLDivElement, view: View) => void;
|
||||
eventAfterRender?: (event: EventObject, element: HTMLDivElement, view: View) => void;
|
||||
eventAllAfterRender?: (view: View) => void;
|
||||
|
||||
editable?: boolean;
|
||||
disableDragging?: boolean;
|
||||
disableResizing?: boolean;
|
||||
dragRevertDuration?: number;
|
||||
dragOpacity?: any; // Float/ViewOptionHash
|
||||
eventDragStart?: (event: EventObject, jsEvent: Event, ui: any, view: View) => void;
|
||||
eventDragStop?: (event: EventObject, jsEvent: Event, ui: any, view: View) => void;
|
||||
eventDrop?: (event: EventObject, dayDelta: number, minuteDelta: number, revertFunc: Function, jsEvent: Event, ui: any, view: View) => void;
|
||||
eventResizeStart?: (event: EventObject, jsEvent: Event, ui: any, view: View) => void;
|
||||
eventResizeStop?: (event: EventObject, jsEvent: Event, ui: any, view: View) => void;
|
||||
eventResize?: (event: EventObject, dayDelta: number, minuteDelta: number, revertFunc: Function, jsEvent: Event, ui: any, view: View) => void;
|
||||
|
||||
droppable?: boolean;
|
||||
dropAccept?: any; // String/Function
|
||||
drop?: (date: Date, allDay: boolean, jsEvent: Event, ui: any) => void;
|
||||
}
|
||||
|
||||
export interface View {
|
||||
name: string;
|
||||
title: string;
|
||||
start: Date;
|
||||
End: Date;
|
||||
visStart: Date;
|
||||
visEnd: Date;
|
||||
}
|
||||
|
||||
export interface ViewOptionHash {
|
||||
month?: any;
|
||||
week?: any;
|
||||
day?: any;
|
||||
agenda?: any;
|
||||
agendaDay?: any;
|
||||
agendaWeek?: any;
|
||||
basic?: any;
|
||||
basicDay?: any;
|
||||
basicWeek?: any;
|
||||
''?: any;
|
||||
}
|
||||
|
||||
export interface AgendaOptions {
|
||||
allDaySlot?: boolean;
|
||||
allDayText?: string;
|
||||
axisFormat?: string;
|
||||
slotMinutes?: number;
|
||||
snapMinutes?: number;
|
||||
defaultEventMinutes?: number;
|
||||
firstHour?: number;
|
||||
minTime?: any; // Integer/String
|
||||
maxTime?: any; // Integer/String
|
||||
}
|
||||
|
||||
export interface ButtonTextObject {
|
||||
prev?: string;
|
||||
next?: string;
|
||||
prevYear?: string;
|
||||
nextYear?: string;
|
||||
today?: string;
|
||||
month?: string;
|
||||
week?: string;
|
||||
day?: string;
|
||||
}
|
||||
|
||||
export interface EventObject {
|
||||
id?: any // String/number
|
||||
title: string;
|
||||
allDay?: boolean;
|
||||
start: Date;
|
||||
end?: Date;
|
||||
url?: string;
|
||||
className?: any; // string/Array<string>
|
||||
editable?: boolean;
|
||||
source?: EventSource;
|
||||
color?: string;
|
||||
backgroundColor?: string;
|
||||
borderColor?: string;
|
||||
textColor?: string;
|
||||
}
|
||||
|
||||
export interface EventSource extends JQueryAjaxSettings {
|
||||
events?: any;
|
||||
color?: string;
|
||||
backgroundColor?: string;
|
||||
borderColor?: string;
|
||||
textColor?: string;
|
||||
className?: any; // string/Array<string>
|
||||
editable?: boolean;
|
||||
allDayDefault?: boolean;
|
||||
ignoreTimezone?: boolean;
|
||||
eventTransform?: any;
|
||||
startParam?: string;
|
||||
endParam?: string
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
interface JQuery {
|
||||
fullCalendar(options: FullCalendar.Options): JQuery;
|
||||
fullCalendar(method: string, ...args: Array<any>): JQuery;
|
||||
}
|
||||
|
||||
interface JQueryStatic {
|
||||
fullCalendar: FullCalendar.Calendar;
|
||||
}
|
||||
Reference in New Issue
Block a user