Calculate missing legend colors based on brightness

[kirchsth]

Some tags defines the background color but no font color (e.g. tag "v1.0"). In this case the legend text has to be chosen; atm it is fix the $LEGEND_UNDEFINED_FONT_COLOR.

If the background color is similar to the $LEGEND_UNDEFINED_FONT_COLOR the text cannot be read anymore.

PlantUML v.1.2021.6 can check the brightness of a color. Based on the new feature a light/dark legend color could be selected and the text would be readable again.

BR Helmut

related source

@startuml
!include https://raw.githubusercontent.com/kirchsth/C4-PlantUML/extended/C4_Container.puml

AddElementTag("v1.0", $borderColor="#d73027")
AddElementTag("v1.1", $fontColor="#d73027")
AddElementTag("backup", $fontColor="orange")

AddRelTag("backup", $textColor="orange", $lineColor="orange")

Person_Ext(user, "Customer", "People that need products")
Person(admin, "Administrator", "People that administrates the products via the new v1.1 components", $tags="v1.1")
Container(spa, "SPA", "angular", "The main interface that the customer interacts with via v1.0", $tags="v1.0")
Container(spaAdmin, "Admin SPA", "angular", "The administrator interface that the customer interacts with via new v1.1", $tags="v1.1")
Container(api, "API", "java", "Handles all business logic (incl. new v1.1 extensions)", $tags="v1.0+v1.1")
ContainerDb_Ext(db, "Database", "Microsoft SQL", "Holds product, order and invoice information")
Container_Ext(archive, "Archive", "Audit logging", "Stores 5 years", $tags="backup")

Rel(user, spa, "Uses", "https")
Rel(spa, api, "Uses", "https")
Rel_R(api, db, "Reads/Writes")
Rel(admin, spaAdmin, "Uses", "https")
Rel(spaAdmin, api, "Uses", "https")
Rel_L(api, archive, "Writes", "messages", $tags="backup")

SHOW_LEGEND()

rectangle currentLegend<<legendArea>> [
<#00000000,#00000000>|<color:#000000>**Current Legend**</color> |
|<#08427B><color:#073B6F> <U+25AF></color> <color:#FFFFFF> person </color> |
|<#438DD5><color:#3C7FC0> <U+25AF></color> <color:#FFFFFF> container </color> |
|<#686868><color:#8A8A8A> <U+25AF></color> <color:#FFFFFF> external_person </color> |
|<#B3B3B3><color:#A6A6A6> <U+25AF></color> <color:#FFFFFF> external_container </color> |
|<#D5CFEE><color:#d73027> <U+25AF></color> <color:#8B77E4> v1.0 (no text, no back color) </color> |
|<#D5CFEE><color:#D5CFEE> <U+25AF></color> <color:#d73027> v1.1 (no back color) </color> |
|<#D5CFEE><color:#D5CFEE> <U+25AF></color> <color:orange> backup (no back color) </color> |
|<color:orange> <U+2500></color> <color:orange> backup </color> |
]

' !global $LEGEND_DARK_COLOR = "#darkgreen"
' !global $LEGEND_LIGHT_COLOR = "#lightgreen"

' %darken(darkkhaki,50), #khaki
!global $LEGEND_DARK_COLOR = "#66622E"
!global $LEGEND_LIGHT_COLOR = "#khaki"

' !global $LEGEND_DARK_COLOR = "#606060"
' !global $LEGEND_LIGHT_COLOR = "#A0A0A0"

' !global $LEGEND_DARK_COLOR = $SYSTEM_BG_COLOR
' !global $LEGEND_LIGHT_COLOR = "#white" 

!unquoted function $contrast_color($color)
  !if %is_dark($color)
    !$value = $LEGEND_LIGHT_COLOR
  !else
    !$value = $LEGEND_DARK_COLOR
  !endif
  !return $value
!endfunction

!unquoted function $flat_color($color)
  !if %is_dark($color)
    !$value = $LEGEND_DARK_COLOR
  !else
    !$value = $LEGEND_LIGHT_COLOR
  !endif
  !return $value
!endfunction

rectangle newLegend<<legendArea>> [
<#00000000,#00000000>|<color:#000000>**New Legend**</color> |
|<#08427B><color:#073B6F> <U+25AF></color> <color:#FFFFFF> person </color> |
|<#438DD5><color:#3C7FC0> <U+25AF></color> <color:#FFFFFF> container </color> |
|<#686868><color:#8A8A8A> <U+25AF></color> <color:#FFFFFF> external_person </color> |
|<#B3B3B3><color:#A6A6A6> <U+25AF></color> <color:#FFFFFF> external_container </color> |
|<$contrast_color(#d73027)><color:#d73027> <U+25AF></color> <color:$flat_color(#d73027)> v1.0 (no text, no back color) </color> |
|<$contrast_color(#d73027)><color:$contrast_color(#d73027)> <U+25AF></color> <color:#d73027> v1.1 (no back color) </color> |
|<$contrast_color(orange)><color:$contrast_color(orange)> <U+25AF></color> <color:orange> backup (no back color) </color> |
|<color:orange> <U+2500></color> <color:orange> backup </color> |

<#00000000,#00000000>|<color:#000000>**Other samples**</color> |
|<$contrast_color(orange)><color:orange> <U+25AF></color> <color:$flat_color(orange)> orange border (no text, no back color) </color> |
|<$contrast_color(khaki)><color:khaki> <U+25AF></color> <color:$flat_color(khaki)> border with light legend color (no text, no back color) </color> |
|<$contrast_color(#66622E)><color:#66622E> <U+25AF></color> <color:$flat_color(#66622E)> border with dark legend color (no text, no back color) </color> |
]

Lay_R(user, admin)
Lay_R(admin, currentLegend)
Lay_R(admin, newLegend)
Lay_U(currentLegend, newLegend)
@enduml

[Potherca]

Fixed in #150