tests/manual/calendar-example.html

	calendar-example.html revision d5c500d4fbd5a733124f1baee5671f3fbc35a245
2440N/A<!doctype html>
2440N/A<html>
2868N/A<head>
2868N/A    <title>Calendar Example</title>
2868N/A    <script type="text/javascript" src="/build/yui/yui.js"></script>
2868N/A<style>
2868N/A.yui3-skin-sam .redtext {
2868N/A    color:#ff0000;
2868N/A}
6983N/A</style>
6983N/A</head>
2868N/A<body class="yui3-skin-sam">
2868N/A<div id="mycalendar"></div>
2868N/A<div id="currentDate"></div>
2868N/A
6983N/A<script>
6983N/AYUI({
6983N/Abase: '/build/',
6983N/A    filter: "debug"
2868N/A}).use('array', 'calendar',  function(Y) {
2868N/A
2868N/A
2868N/AY.CalendarBase.CONTENT_TEMPLATE = Y.CalendarBase.TWO_PANE_TEMPLATE;
2868N/A
3215N/Afunction myHeaderRenderer (curDate) {
2868N/A            var ydate = Y.DataType.Date,
2868N/A                output = ydate.format(curDate, {format: "%B %Y"}) +
2440N/A                         " &mdash; " +
2440N/A                         ydate.format(ydate.addMonths(curDate, 1), {format: "%B %Y"});
2440N/A            return output;
2440N/A         };
2440N/A
2440N/A
2868N/Avar dYear = "2011";
2868N/Avar dMonth = "10";
2868N/Avar dDate = "10";
2868N/A
2868N/A
2868N/Avar newrules = {};
2868N/A
2440N/Afunction addNewRule(ruleSet, path, ruleName) {
2868N/A
2440N/Avar currentObject = ruleSet;
2440N/A
2440N/Afor (var i = 0, len = path.length - 1; i <= len; i++) {
2440N/A   if (i == len) {
2440N/A    currentObject[path[i]] = ruleName;
2440N/A   }
2868N/A   else {
2440N/A    currentObject[path[i]] = {};
2440N/A    currentObject = currentObject[path[i]];
2440N/A   }
2440N/A}
2440N/A
2440N/Areturn ruleSet;
2440N/A
2440N/A};
2440N/A
newrules = addNewRule(newrules, [dYear, dMonth, dDate], "theweekends");


//console.log(newrules);


         var myRules = {
            "2011": {
                "0-11": {
                    "all": {
                        "1,2": "theweekends"
                    }
                },
                "all": {
                    "5": "thefifths"
                }
            }

         };


function myFilter (oDate, oNode, rules) {
if (Y.Array.indexOf(rules, "theweekends") >= 0) {
    //oNode.addClass('redtext');
}
};

         var calendar = new Y.Calendar({
            showNextMonth: true,
            showPrevMonth: true,
            selectionMode: "multiple",
            minimumDate: new Date(2011,0,1),
            maximumDate: new Date(2011,11,1),
            date: new Date(2011,10,1),
            headerRenderer: myHeaderRenderer,
            width:'600px'});

        calendar.render("#mycalendar");

        calendar.set("customRenderer", {rules: myRules, filterFunction: myFilter});

        calendar.set("enabledDatesRule", null);
        calendar.set("disabledDatesRule", "thefifths");

/*
        calendar.on("dateChange", function (ev) {console.log("New date value: " + ev.newVal); console.log("What about..." + calendar.get("date"));});
*/


        calendar.on("showPrevMonthChange", function (ev) {//console.log("New show prev month val: " + ev.newVal);
                                                         });

        calendar.set("showPrevMonth", true);

        calendar.selectDates([new Date(2011,9,4), new Date(2011,9,3), new Date(2011,10,8)]);
        calendar.selectDates([new Date(2011,9,5), new Date(2011,8,23), new Date(2011,11,21)]);

        //console.log(calendar.get("selectedDates"));


});
</script>
</body>
</html>