Widgets
status
5 min
this widget visually represents a status using a combination of icons and colors the status widget can be used alone or combined with another widget inside a https //docs jigx com/examples/group https //docs jigx com/examples/group widget/group the status returned is based on a boolean condition configuration options core options statuses define at least one or more statuses based on conditions first evaluated to true will be used the statuses property includes when the condition when the status should be shown icon the icon that should be shown | other options bottom the titles https //docs jigx com/examples/titles component will be added to the bottom of the widget color choose a color from the provided color palette # for the icon the default color is black if the property is not specified in the yaml footer add text to the footer of the widget footeralign align the footer text to left , right , center placeholder specify a placeholder text to display if there is no data, for example title no data to display top the titles https //docs jigx com/examples/titles component will be added to the top of the widget examples and code snippets status widget (2x2) in this example the status widget is configured to show a positive icon for the when true property examples see the complete example using static data in github https //github com/jigx com/jigx samples/blob/main/quickstart/jigx samples/jigs/widgets/status/static data/status static jigx see the complete example using dynamic data in github https //github com/jigx com/jigx samples/blob/main/quickstart/jigx samples/jigs/widgets/status/dynamic data/status dynamic jigx status (static) widgets statusstatic 2x2 type widget status options statuses \ when true icon check circle 1 color color2 bottom type component titles options title correct align center style ispositive true status with expression widgets 2x2 type widget status options statuses \ when =@ctx datasources trip dynamic flight = 'a 0123' ? true \ false icon check circle 1 color color2 bottom type component titles options title flight was found align center style ispositive true status (dynamic) widgets statusdd 2x2 type widget status options statuses \ when =@ctx system isoffline != true icon check circle 1 color color2 bottom type component titles options title online align center style ispositive true \ when =@ctx system isoffline icon alert circle color color4 bottom type component titles options title offline align center style isnegative true grid item # grid item for the static jig children \ type component grid item options size "2x2" children type component jig widget options jigid status widgetid statusstatic 2x2 status widget (2x4) in this example the status widget is configured to show different icons and details depending on the status of a mobile device's battery the when property is used three times to detemine the status and depending if the when evaluates to true then the details for that when property is shown examples see the complete example in github https //github com/jigx com/jigx samples/blob/main/quickstart/jigx samples/jigs/widgets/2x4/status 1 2x4 jigx status 1 2x4 widgets status1 2x4 type widget status options statuses \# battery less than 25 % \ when =@ctx datasources device battery <= 25 ? true\ false icon battery charge top type component titles options icon mobile phone 1 title =@ctx datasources device device owner subtitle =@ctx datasources device device name align center iconcolor color14 bottom type component titles options title =@ctx datasources device battery & ' ' & '%' subtitle battery align center color negative \# battery less than 50 % \ when =@ctx datasources device battery <= 50 ? true\ false icon battery charge top type component titles options icon mobile phone 1 title =@ctx datasources device device owner subtitle =@ctx datasources device device name align center iconcolor color14 bottom type component titles options title =@ctx datasources device battery & ' ' & '%' subtitle battery align center color warning \# battery more than 50 % \ when =@ctx datasources device battery > 50 ? true\ false icon battery charge top type component titles options icon mobile phone 1 title =@ctx datasources device device owner subtitle =@ctx datasources device device name align center iconcolor color14 bottom type component titles options title =@ctx datasources device battery & ' ' & '%' subtitle battery align center color positive datasource title status widget 1 (2x4) type jig default datasources device type datasource static options data \ device name iphone 14 pro device owner barry hudson battery 30 # try to change the number grid item # grid item for the jig children \ type component grid item options size "2x4" children type component jig widget options jigid status 1 2x4 widgetid status1 2x4 status widget(4x2) in this example the status widget shows that 4 tests failed with component titles to provide more information examples see the complete example in github https //github com/jigx com/jigx samples/blob/main/quickstart/jigx samples/jigs/widgets/4x2/status 1 4x2 jigx status 1 4x2 jigx widgets status1 4x2 type widget status options footer text test statuses \ when true # use an expression to eveluate the true statement icon remove circle color negative bottom type component titles options title 4 tests subtitle failed align center grid item # grid item for the jig children \ type component grid item options size "4x2" children type component jig widget options jigid status 1 4x2 widgetid status1 4x2