Appendix C - Template ExampleBelow is a typical Screen Template example, how it may appear on your display device, and a detailed explanation of how the template translates to what your visitors will see on screen...
|Example Screen Template|
<h1>Today's Bookings</h1> <h2>%TODAY%</h2> <h3>%DATABASE%</h3> <table> <tr> <td>Times</td> <td>Venue</td> <td>Booking Type</td> <td>Client</td> </tr> <bookings> <tr%ONGOING%> <td>%START% - %FINISH%</td> <td>%VENUE%</td> <td>%TYPE%</td> <td>%CLIENT%</td> </tr> </bookings> </table> <br>Thank You For Visiting Us Today!
|Example Screen Output|
Friday, April 15, 2016
Thank You For Visiting Us Today!
Powered by https://mid.as
This simple screen starts by displaying 3 headings (<h1>, <h2>, and <h3>).
"Today's Bookings" is the first "static" heading.
The other two headings use global variables in the template, which are substituted with corresponding values when displayed on your display device(s).
The next section of the template is a standard HTML table.
The field variables in this row are substituted for real booking data when displayed on your display device(s)
Note the presence of the %ONGOING% variable (indicated in green) - this tells MIDAS that if the booking is currently ongoing ("in progress") to apply an "ongoing" class to the element.
So, for ongoing bookings <tr%ONGOING%> would be substituted with <tr class=ongoing>
For all other bookings, <tr%ONGOING%> would be substituted with <tr>
If we assume that the Example Screen Output shown above was what was displayed on the screen at 08.15 in the morning - at that point in time, one booking is "ongoing" - the one highlighted on the screen in red.
You could define the color/style of our "ongoing" class in an external style sheet and then include it using the "Custom .css Stylesheet" option.
In your external style sheet, you can change the styling of this special "ongoing" class, as follows: