JarCasting#Bootstrap Calendar
A simple calendar plugin for jQuery and Twitter Bootstrap.
Works inline, in dropdowns, and in the responsive navbar!
##Package Manager You can now install via bower
##Dependencies
##Options
- popover_options (Bootstrap popover object)
- tooltip_options (Bootstrap tooltip object)
- days (array)
- default: default: ["S", "M", "T", "W", "T", "F", "S"]
- months (array)
- default: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]
- show_days (boolean)
- default: true
- req_ajax (object)
- req_ajax.type (string) {'get', 'post'}
- req_ajax.url (string)
- events (array of event array)
- req_ajax.type (string) {'get', 'post'}
- req_ajax.url (string)
- Event (array)
- 0 (string): date ex: "17/4/2013"
- 1 (string): title ex: "hello world!"
- 2 (string): link ex: "http://github.com"
- 3 (string): color ex: "#333"
- 4 (string): html popover ex: "Text for the content of popover...description of event...image..."
##Use example
Note: that each event in the example has a diferent behavior
The blue event has a hover popover
array(
"27/4/2013",
'github drinkup',
'https://github.com/blog/category/drinkup',
'blue'
)
The green event has a click popover
array(
"7/4/2013",
'bootstrap logo popover!',
'#',
'#51a351',
'<img src="http://bit.ly/XRpKAE" />'
)
The red event has a hover tooltip
array(
"17/4/2013",
'octocat!',
'https://github.com/logos',
'red',
'new github logo <img src="http://git.io/Xmayvg" />'
)
###Javascript:
$(document).ready( function(){
theMonths = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
theDays = ["S", "M", "T", "W", "T", "F", "S"];
$('#calendar_test').calendar({
months: theMonths,
days: theDays,
req_ajax: {
type: 'get',
url: 'json.php'
}
});
});
###PHP:
<?php
$month = isset($_GET['month']) ? $_GET['month'] : date('n');
$year = isset($_GET['year']) ? $_GET['year'] : date('Y');
$array = array(
array(
"7/$month/$year",
'bootstrap logo popover!',
'#',
'#51a351',
'<img src="http://bit.ly/XRpKAE" />'
),
array(
"17/$month/$year",
'octocat!',
'https://github.com/logos',
'blue',
'new github logo <img src="http://git.io/Xmayvg" />'
),
array(
"27/$month/$year",
'github drinkup',
'https://github.com/blog/category/drinkup',
'red'
)
);
header('Content-Type: application/json');
echo json_encode($array);
exit;
?>
##Credits original bic_calendar by bic.cat.
bootstrap_calendar fork (english localization and updates) by xero