Wiki source code of Development-Examples-Calendar Component
Last modified by Pascal Robert on 2010/09/13 00:31
Show last authors
author | version | line-number | content |
---|---|---|---|
1 | Here is a little example on how to write a "calendar" component: | ||
2 | |||
3 | So you have a specific month, some of the dates are links (that will depend on what the calendar is for) and some basics navigations (next/previous month, year). | ||
4 | |||
5 | That's how the html could look like: | ||
6 | |||
7 | {{code}} | ||
8 | |||
9 | |||
10 | <webobject name = "Table"> | ||
11 | <tr> | ||
12 | <td align = "left" valign = "top" colspan = "7"> | ||
13 | <webobject name = "Month"></webobject> | ||
14 | <webobject name = "HasNavigation"> | ||
15 | <webobject name = "YearLink"><webobject name = "Year"></webobject></webobject> | ||
16 | </webobject> | ||
17 | </td> | ||
18 | </tr> | ||
19 | <webobject name = "Rows"> | ||
20 | <tr> | ||
21 | <webobject name = "Columns"> | ||
22 | <td align = "right" valign = "top"> | ||
23 | <webobject name = "HasLink"> | ||
24 | <webobject name = "IsCurrentDay"></webobject><webobject name = "Link"><webobject name = "Day"></webobject></webobject><webobject name = "IsCurrentDay"></webobject> | ||
25 | </webobject> | ||
26 | <webobject name = "HasNoLink"> | ||
27 | <webobject name = "Day"></webobject> | ||
28 | </webobject> | ||
29 | </td> | ||
30 | </webobject> | ||
31 | </tr> | ||
32 | </webobject> | ||
33 | <webobject name = "HasNavigation"> | ||
34 | <tr> | ||
35 | <td align = "left" valign = "top" colspan ="3"> | ||
36 | <webobject name = "HasPreviousMonth"> | ||
37 | <small><webobject name = "PreviousMonthLink"><webobject name = "PreviousMonth"></webobject></webobject></small> | ||
38 | </webobject> | ||
39 | </td> | ||
40 | <td align = "left" valign = "top"> | ||
41 | |||
42 | </td> | ||
43 | <td align = "right" valign = "top" colspan ="3"> | ||
44 | <webobject name = "HasNextMonth"> | ||
45 | <small><webobject name = "NextMonthLink"><webobject name = "NextMonth"></webobject></webobject></small> | ||
46 | </webobject> | ||
47 | </td> | ||
48 | </tr> | ||
49 | </webobject> | ||
50 | </webobject> | ||
51 | |||
52 | {{/code}} | ||
53 | |||
54 | And here is the wod: | ||
55 | |||
56 | {{code}} | ||
57 | |||
58 | |||
59 | Table: WOGenericContainer{ | ||
60 | elementName = "table"; | ||
61 | border = "0"; | ||
62 | cellSpacing = "0"; | ||
63 | cellPadding = "0"; | ||
64 | }; | ||
65 | HasNavigation: WOConditional | ||
66 | { | ||
67 | condition = hasNavigation; | ||
68 | }; | ||
69 | |||
70 | YearLink: WOHyperlink{ | ||
71 | action = displayYear; | ||
72 | }; | ||
73 | Year: SpanString{ | ||
74 | value = month.year; | ||
75 | isBold = true; | ||
76 | isSmall = true; | ||
77 | class = "Label"; | ||
78 | }; | ||
79 | Rows: WORepetition{ | ||
80 | count = rowCount; | ||
81 | index = rowIndex; | ||
82 | }; | ||
83 | Columns: WORepetition{ | ||
84 | count = columnCount; | ||
85 | index = columnIndex; | ||
86 | }; | ||
87 | Month: SpanString{ | ||
88 | value = month.monthName.toUpperCase; | ||
89 | isBold = true; | ||
90 | isSmall = true; | ||
91 | class = "Label"; | ||
92 | }; | ||
93 | DayName: SpanString{ | ||
94 | value = dayName; | ||
95 | isSmall = true; | ||
96 | class = "Label"; | ||
97 | }; | ||
98 | HasLink: WOConditional{ | ||
99 | condition = hasLink; | ||
100 | }; | ||
101 | HasNoLink: WOConditional{ | ||
102 | condition = hasLink; | ||
103 | negate = true; | ||
104 | }; | ||
105 | IsCurrentDay: WOConditional{ | ||
106 | condition = isCurrentDay; | ||
107 | }; | ||
108 | Link: WOHyperlink{ | ||
109 | action = displayDay; | ||
110 | }; | ||
111 | Day: SpanString{ | ||
112 | value = day.day; | ||
113 | isSmall = true; | ||
114 | isBold = isCurrentDay; | ||
115 | isItalic = isCurrentDay; | ||
116 | class = "Label"; | ||
117 | }; | ||
118 | HasNextMonth: WOConditional{ | ||
119 | condition = hasNextMonth; | ||
120 | }; | ||
121 | NextMonthLink: WOHyperlink{ | ||
122 | action = displayNextMonth; | ||
123 | }; | ||
124 | NextMonth: SpanString | ||
125 | { | ||
126 | value = nextMonthName; | ||
127 | isSmall = true; | ||
128 | class = "Label"; | ||
129 | }; | ||
130 | HasPreviousMonth: WOConditional{ | ||
131 | condition = hasPreviousMonth; | ||
132 | }; | ||
133 | PreviousMonthLink: WOHyperlink{ | ||
134 | action = displayPreviousMonth; | ||
135 | }; | ||
136 | PreviousMonth: SpanString{ | ||
137 | value = previousMonthName; | ||
138 | isSmall = true; | ||
139 | class = "Label"; | ||
140 | }; | ||
141 | |||
142 | {{/code}} | ||
143 | |||
144 | The component implementation is left to the imagination of the reader. |