calendar-example.html revision 87fff29257e74dac31f23eac9e31c028a551057f
98N/A<!doctype html>
98N/A<html>
1244N/A<head>
98N/A <title>Calendar Example</title>
98N/A <script type="text/javascript" src="/build/yui/yui.js"></script>
919N/A<style>
919N/A.yui3-skin-sam .redtext {
919N/A color:#ff0000;
919N/A}
919N/A</style>
919N/A</head>
919N/A<body class="yui3-skin-sam">
919N/A<div id="mycalendar"></div>
919N/A<div id="currentDate"></div>
919N/A
919N/A<script>
919N/AYUI({
919N/Abase: '/build/',
919N/A filter: "raw"
919N/A}).use('calendar', function(Y) {
919N/A
919N/AY.CalendarBase.CONTENT_TEMPLATE = Y.CalendarBase.TWO_PANE_TEMPLATE;
98N/A
98N/Afunction myHeaderRenderer (curDate) {
98N/A var ydate = Y.DataType.Date,
98N/A output = ydate.format(curDate, {format: "%B %Y"}) +
156N/A " &mdash; " +
98N/A ydate.format(ydate.addMonths(curDate, 1), {format: "%B %Y"});
98N/A return output;
98N/A };
691N/A
1244N/A
98N/A var myRules = {
98N/A "2011": {
1116N/A "all": {
1116N/A "5": "thefifths"
98N/A }
156N/A }
98N/A
851N/A };
159N/A
764N/Afunction myFilter (oDate, oNode, rules) {
98N/A
98N/Aif (rules.indexOf("all_weekends") >= 0) {
199N/A oNode.addClass('redtext');
606N/A}
98N/A
606N/A};
606N/A
98N/A var calendar = new Y.Calendar({
98N/A contentBox: "#mycalendar",
606N/A showNextMonth: true,
606N/A showPrevMonth: true,
606N/A disabledDatesRule: "thefifths",
606N/A selectionMode: "multiple",
705N/A minimumDate: new Date(2011,1,1),
851N/A maximumDate: new Date(2011,11,1),
705N/A date: new Date(2011,10,1),
705N/A headerRenderer: myHeaderRenderer,
705N/A width:'600px'}).render();
851N/A
851N/A calendar.set("customRenderer", {rules: myRules, filterFunction: myFilter});
851N/A
705N/A});
705N/A</script>
705N/A</body>
851N/A</html>
705N/A