Angular directive

sra-data-table source template

This widget extends the sra-data directive by placing the data in a HTML Table. You have full control on what goes in the header, body, and footer. The body can also have a label to go with the data.

The data-sra-args-data parameter should list all the paths to the SIM data you will be using for the entire table as follows:

     data-sra-args-data = "/Car/REFERENCE/DriverName;/Car/REFERENCE/Number"

Each table element where data is inserted can take a class and HTML, but they have to be written in JavaScript. The JavaScript should reference the "data" object to display SIM data or a constant can be used For example, if you want to have a constant for the header, it would be written as follows:

     data-sra-args-header       = "'Some Constant'"
     data-sra-args-header-class = "'myHeaderClass'"
     <!-- or if using the data object -->
     data-sra-args-header       = "'Driver = ' + (data.Car.REFERENCE.DriverName.ValueFormatted|sraEncodeEntities)"

NOTE: All data should be cleansed with a call to the sraEncodeEntities filter. For the rows, each row must be given a name and listed in the order to display them. They are assigned to the row-names parameter separated with semicolons, commas or spaces as follows:

     data-sra-args-row-names = "carnum;name"

Once each row has a name, then a Class, HTML, or Label can be assigned to those rows by using their name in the argument variable name as follows:

     data-sra-args-row-name-label       = "(translations.NAME|sraEncodeEntities) + ':'"
     data-sra-args-row-name             = "(data.Car.REFERENCE.DriverName.ValueFormatted|sraEncodeEntities)"
     data-sra-args-row-name-class       = "'myNameClass'"
     data-sra-args-row-name-label-class = "'myNameLabelClass'"
     data-sra-args-row-name-value-class = "'myNameValueClass'"
     data-sra-args-row-carnum-label     = "(translations.CARNUMBER|sraEncodeEntities) + ':'"
     data-sra-args-row-carnum           = "(data.Car.REFERENCE.CarNumber.ValueFormatted|sraEncodeEntities)"

Example from the CrewChief App:


<sra-data-table
     id                                  = "SIMRacingApps-App-CrewChief-CarTrack"
     data-sra-args-data                  = "Car/REFERENCE/DriverName;Car/REFERENCE/Number;Car/REFERENCE/DriverRating;Session/Name;Car/REFERENCE/Status;Car/REFERENCE/Description;Track/Description;Track/Length;Track/Category;Track/PitSpeedLimit"
     data-sra-args-row-names             = "drivername;rating;session;cardesc;trackdesc;trackinfo;pitinfo"
     data-sra-args-row-drivername        = "(data.Car.REFERENCE.DriverName.ValueFormatted|sraEncodeEntities)"
     data-sra-args-row-rating            = "(data.Car.REFERENCE.DriverRating.ValueFormatted+' #'+data.Car.REFERENCE.Number.ValueFormatted)|sraEncodeEntities"
     data-sra-args-row-session           = "(data.Session.Name.ValueFormatted+' - '+data.Car.REFERENCE.Status.ValueFormatted)|sraEncodeEntities"
     data-sra-args-row-cardesc           = "data.Car.REFERENCE.Description.ValueFormatted|sraEncodeEntities"
     data-sra-args-row-trackdesc         = "data.Track.Description.ValueFormatted|sraEncodeEntities"
     data-sra-args-row-trackinfo         = "((data.Track.Length.Value|sraNumber:1)+' '+data.Track.Length.UOMDesc+' '+data.Track.Category.ValueFormatted)|sraEncodeEntities"
     data-sra-args-row-pitinfo           = "(translations.PITROADSPEEDLIMIT+': '+(data.Track.PitSpeedLimit|sraNumber:0))|sraEncodeEntities"
></sra-data-table>

Dependencies:

Name	Type	Description
data-sra-args-font-size		The size of the font as a percentage. Default is to inherit from the CSS file. @since 1.8
data-sra-args-line-height		The line height of the line as a percentage. Defatul is to inherit from the CSS file. @since 1.8
data-sra-args-data		The list of semicolon separated paths to the SIM data.
data-sra-args-table-class		The class to be assigned to the <table> element
data-sra-args-header		The HTML to be assigned to the <thead.tr.td> element
data-sra-args-header-class		The Class to be assigned to the <thead.tr.td> element
data-sra-args-footer		The HTML to be assigned to the <tfoot.tr.td> element
data-sra-args-footer-class		The Class to be assigned to the <tfoot.tr.td> element
data-sra-args-row-names		A space separated list of row names
data-sra-args-row-(name)		The HTML to assign to the <tbody.tr.td> row for this name.
data-sra-args-row-(name)-class		The Class to assign to the <tbody.tr> row for this name.
data-sra-args-row-(name)-label-class		The Class to assign to the <tbody.tr.td> row for this name's label.
data-sra-args-row-(name)-value-class		The Class to assign to the <tbody.tr.td> row for this name's value.
data-sra-args-interval	integer	The interval, in milliseconds, that this widget will update from the server. Default is 500.