As you already know, the Table Content component is used to display data in one row, in one column, or in several columns. However, displaying data as a calendar requires a more complex layout of such data. The
Table Calendar component is available just for these purposes.
This component is responsible for a graphic layout according to days of the week. A template is called for each of these days. So what will be displayed for a particular day is up to you.
Component Properties
Basic
|
|
| Width |
It defines the total width of a calendar. |
| Height |
It defines the total height of a calendar. |
| Date From |
The date from which days are to be displayed (in the YYYY-MM-DD SQL format) |
| Date To |
The date to which days are to be displayed (in the YYYY-MM-DD SQL format) |
Display
|
|
| Display Mode |
It defines the layout of a calendar to be displayed. |
Display (Month)
|
|
| Template (Day of the Week) |
It defines the name of the template that will display days of the week that are displayed in a separate row above the days. |
| Template (Content of a Day) |
It defines the name of the template that will display the content for a particular day. |
| Display Sat/Sun |
It defines the display of Saturdays and Sundays in a calendar. |
| Column Width |
It defines the width of a column. |
| Row Width |
It defines the height of a row. |
An Example for Displaying Events in the Current Month
For these purposes, you will need a table containing the date, name and description of some event, related to a particular date (for the purposes of our example, we will have the
event table with the
id,
date,
name, and
text fields, for example).
We insert a Table Calendar component with the following settings in any place within the presentation (e.g. into some panel in the global layout):
Basic
|
|
| Width |
200px |
| Height |
|
| Date From |
{php: TDateTime::bom()->asString()} |
| Date To |
{php: TDateTime::eom()->asString()} |
Display
|
|
| Display Mode |
month |
Display (Month)
|
|
| Template (Day of the Week) |
calendar_weekdays |
| Template (Content of a Date) |
calendar_days |
| Display Sat/Sun |
yes |
Thanks to inserting
{php: } into the
Date From and
Date To properties, we get a universal display for the current month every time.
If you do not understand the
TDateTime::bom()->asString() call, I will explain you further details.
TDateTime is a class for work with a date. The
bom() method is static; therefore, initializing an object by means of
new is not required and this method can be called directly by means of
TDateTime::bom(). This
bom() method returns an object of the
TDateTime class with the date that is the first day of the month. The last
asString() method returns the text representation of a date in the SQL format because the Table Calendar component requires such format.
A Template for Displaying Days of the Week
Let’s return to the implementation of a calendar. It is necessary to create a template that will display days of the week. This display is solved by means of templates because this allows adjusting everything to the page design. So we will create a template named
calendar_weekdays and insert the following code into its content:
<b>
{php: translate($dayOfWeekShort)}
</b>The Table Calendar component exports the following variables for this template that can be used for displaying:
| $dayOfWeek |
The name of a day ("Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"). |
| $dayOfWeekShort |
The short name of a day ("mon", "tue", "wed", "thu", "fri", "sat", "sun"). |
| $dayOfWeekIndex |
The index of a day (0 to 6, i.e. 0 for Monday to 6 for Sunday). |
Thanks to the
translate function, we can translate days of the week into the current language of a presentation. Therefore, it is not necessary to create templates for each language separately.
A Template for Displaying the Content of a Day
Let’s create a template named
calendar_days with the following content:
{php: date("j", _strtotime($date))}The Table Calendar component exports the following variables for this template that can be used for displaying:
| $date |
The date for a particular day in the YYYY-MM-DD SQL format. |
The result of displaying both templates will be the following table for the Czech version:
Different Displaying Days Depending on Different Table Content
Such calendar will not take the complete content of the
event table for individual days that we have created as an example. Typically, the day is displayed for which there is any record in different font, in bold type or with different background, if need be.
To achieve this change of the display, we will modify the
calendar_days template by inserting the following PHP script instead of the original
{php: date("j", _strtotime($date))} script used to display the number of a day:
$records = getTable("akce")->getRecords("filter=date=".$date);
if (count($records))
echo "<a href='akce.php?filter_date=".$date."'><b>".date("j", _strtotime($date))."</b></a>";
else
echo date("j", _strtotime($date));The output of this script will be a link leading to a list of events of a given day if there is at least one record passing this filtration, or only the number of the day if there is no such record.
Then the result of such display may be the following table, for example:
As you can see, what will be displayed in a calendar table is only up to you. Everything can be adjusted to the design of your presentation.
For Visual PHP™
