← Back to branch summary

~bac/juju-gui/trunkcopy

« back to all changes in this revision

Viewing changes to lib/yui/tests/calendar/tests/manual/calendar-example-night.html

  • Committer: kapil.foss at gmail
  • Date: 2012-07-13 18:45:59 UTC
  • Revision ID: kapil.foss@gmail.com-20120713184559-2xl7be17egsrz0c9
reshape

Show diffs side-by-side

added added

removed removed

Lines of Context:
lib/yui/tests/calendar/tests/manual/calendar-example-night.html
1
 
<!doctype html>
2
 
<html>
3
 
<head>
4
 
    <title>Calendar Example</title>
5
 
    <script type="text/javascript" src="../../../../build/yui/yui.js"></script>
6
 
<style>
7
 
.yui3-skin-sam .redtext {
8
 
        color:#ff0000;
9
 
}
10
 
</style>
11
 
</head>
12
 
<body class="yui3-skin-night">
13
 
<div id="mycalendar"></div>
14
 
<div id="currentDate"></div>
15
 
 
16
 
<script>
17
 
YUI({
18
 
base: '../../../../build/',
19
 
filter: "raw",
20
 
skin: "night"
21
 
}).use('calendar',  function(Y) {
22
 
 
23
 
 
24
 
Y.CalendarBase.CONTENT_TEMPLATE = Y.CalendarBase.TWO_PANE_TEMPLATE;
25
 
 
26
 
function myHeaderRenderer (curDate) {
27
 
                var ydate = Y.DataType.Date,
28
 
                    output = ydate.format(curDate, {format: "%B %Y"}) +
29
 
                             " &mdash; " +
30
 
                             ydate.format(ydate.addMonths(curDate, 1), {format: "%B %Y"});
31
 
                return output;
32
 
             };
33
 
 
34
 
 
35
 
var dYear = "2011";
36
 
var dMonth = "10";
37
 
var dDate = "10";
38
 
 
39
 
 
40
 
var newrules = {};
41
 
 
42
 
function addNewRule(ruleSet, path, ruleName) {
43
 
 
44
 
var currentObject = ruleSet;
45
 
 
46
 
for (var i = 0, len = path.length - 1; i <= len; i++) {
47
 
   if (i == len) {
48
 
    currentObject[path[i]] = ruleName;
49
 
   }
50
 
   else {
51
 
    currentObject[path[i]] = {};
52
 
    currentObject = currentObject[path[i]];
53
 
   }
54
 
}
55
 
 
56
 
return ruleSet;
57
 
 
58
 
};
59
 
 
60
 
newrules = addNewRule(newrules, [dYear, dMonth, dDate], "theweekends");
61
 
 
62
 
 
63
 
console.log(newrules);
64
 
 
65
 
 
66
 
             var myRules = {
67
 
                "2011": {
68
 
                "0-11": {
69
 
                        "all": {
70
 
                                "1,2": "theweekends"
71
 
                        }
72
 
                },
73
 
                        "all": {
74
 
                                "5": "thefifths"
75
 
                        }
76
 
                }
77
 
 
78
 
             };
79
 
 
80
 
 
81
 
function myFilter (oDate, oNode, rules) {
82
 
if (rules.indexOf("theweekends") >= 0) {
83
 
        //oNode.addClass('redtext');
84
 
}       
85
 
};           
86
 
 
87
 
         var calendar = new Y.Calendar({
88
 
                showNextMonth: true,
89
 
                showPrevMonth: true,
90
 
                selectionMode: "multiple",
91
 
                minimumDate: new Date(2011,0,1),
92
 
                maximumDate: new Date(2011,11,1),
93
 
                date: new Date(2011,10,1),
94
 
                headerRenderer: myHeaderRenderer,
95
 
                        width:'600px'});
96
 
                        
97
 
                calendar.render("#mycalendar");
98
 
 
99
 
                calendar.set("customRenderer", {rules: myRules, filterFunction: myFilter});
100
 
 
101
 
                calendar.set("enabledDatesRule", null);
102
 
                calendar.set("disabledDatesRule", "thefifths");
103
 
 
104
 
/*
105
 
                calendar.on("dateChange", function (ev) {console.log("New date value: " + ev.newVal); console.log("What about..." + calendar.get("date"));});
106
 
*/
107
 
 
108
 
 
109
 
                calendar.on("showPrevMonthChange", function (ev) {console.log("New show prev month val: " + ev.newVal);});
110
 
 
111
 
                calendar.set("showPrevMonth", true);
112
 
 
113
 
                calendar.selectDates([new Date(2011,9,4), new Date(2011,9,3), new Date(2011,10,8)]);
114
 
                calendar.selectDates([new Date(2011,9,5), new Date(2011,8,23), new Date(2011,11,21)]);
115
 
 
116
 
                console.log(calendar.get("selectedDates"));
117
 
 
118
 
 
119
 
 
120
 
});
121
 
</script>
122
 
</body>
123
 
</html>