enable hyperlinks in C4 elements and fix samples

[SebastienAndreo]

I implemented the possibility to embed hyperlink in the C4 elements. This feature makes your svg elements clickable and navigable.

I also corrected some incompatible changes in the plantuml engine.

[anorm]

I usually accomplish the same thing by writing

@startuml
!include <C4/C4_Context>
System(google[[https://google.com]], "Google", "An internet search engine")
@enduml

Your addition is more user friendly, though.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[SebastienAndreo]

CAn we reopen the MR

[Potherca]

@SebastienAndreo We're still calibrating the stale bot. At your request, I have re-opened this MR and marked it so the bot won't auto-close it again, so the other maintainers have some more time to take a look at your contribution.

[FastNinja]

what would it take to move this PR forward?

[Potherca]

@FastNinja What needs to happen is that the commits are rebased (to resolve the code conflicts) and a review needs to take place. Currently 2 reviewers are required so, not counting myself, at least one other maintainer needs to find time for a review.

[adrianvlupu]

Hi,

Because adding links to entities is simple enough and doesn't require it to pass through the create System/Container/Component function, I think overcomplicating the functions should be avoided.

!unquoted procedure Container($alias, $label, $techn, $descr="", $sprite="", $tags="")

Personally I use this to create links:
Container(example, "Example", "Example", "Example") [[https://google.com]]

[Potherca]

Both suggestions (by @anorm and @adrianvlupu) seem easy enough and would not require any code changes:

System(google[[https://google.com]], "Google", "An internet search engine")
/' or '/
Container(example, "Example", "Example", "Example") [[https://google.com]]

@SebastienAndreo As choosing which features to add/implement is just as important as deciding what not to, we might have to consider closing this MR without merging its proposed changes into the codebase...

Either way, we should make sure we add a section to the documentation about how to add links.

---

As most active contributors/maintainers, can we get your opinions on whether this should be included or not? 👍 / 👎

• @adrianvlupu: Nay 👎
• @aheil: Yay (see comment below please)
• @kirchsth: Nay?
• @RicardoNiepel : Yay / Nay?

[SebastienAndreo]

I tested @adrianvlupu 's solution and it works fine in my context also.
You can close the MR

[kirchsth]

@Potherca, @adrianvlupu, @RicardoNiepel, @aheil: the link pattern works with elements and even Rel() calls can be modelled with links like below:

@startuml
!include https://raw.githubusercontent.com/plantuml-stdlib/C4-PlantUML/master/C4_Container.puml

Person(personAlias, "Label", "Optional Description")
Container(containerAlias, "Label", "Technology", "Optional Description")

Rel_R(personAlias, containerAlias, [[http://plantuml.com/class-diagram mixed label]]) 

' this would produce a cleaner model
Rel_R(personAlias, containerAlias, "clean modelled", $link="http://plantuml.com/class-diagram produces")
@enduml

We could add it like the $tags="..." extension: In all my samples I set the $tags as "keyword argument" that it can be used if required and if not required it can be ignored in the calls (without any empty default arguments)

!unquoted procedure System($alias, $label, $descr="", $sprite="", $tags="", $link="")
...
System(example, "Example", $link="https://google.com")

If we want a cleaner model we should add it as "keyword argument".

[aheil]

Personally, I don't see any reason not to allow clickable hyperlinks.
That would add additional value for documentation.

If I understood this right, it works for SVG export anyway.
How would those links appear in PNGs or other export formats? Would this confuse the user/viewer of the diagram?

Actually, that's something I always wanted to add to my EIP extension as well.

[kirchsth]

@aheil: I checked it on the plantuml server. If you check the png preview then the html-img control supports the png itself which is calculated via .../png/.... url

http://www.plantuml.com/plantuml/png/bO_FIWCn48VlUOfn4Mp1TY-U1A5IZnLBqLCfPPeCtU3a3vc4wjkRNLb1HTHJ9iFCx_jc8HbJBexLcVMQYo7eSevotRO9J_EZpLqv5A6aWy_ayrm7rqP6t-_C91ksXtPvDLlthQVxLUjGCgNQsY_h1bfFQHxxVBMc9C5Ful3SiaMvX6Q51-Ac5Wyns-2HuOv49plycYbijxrEjHcPWu1c59aPYyU43fnz8GFS9-rswWCxqMFr3VP8klE1m_7rPxHI6-BzvhFlryX_wqr1gGl8dHKuXS86OWgcQ084pOGr6Lmmn7-1DyF6-poJgQUSi_NFDyslJYDLwfaBygOElG40

and plantuml can calculate the corresponding map via e.g. changed url to .../map/...

http://www.plantuml.com/plantuml/map/bO_FIWCn48VlUOfn4Mp1TY-U1A5IZnLBqLCfPPeCtU3a3vc4wjkRNLb1HTHJ9iFCx_jc8HbJBexLcVMQYo7eSevotRO9J_EZpLqv5A6aWy_ayrm7rqP6t-_C91ksXtPvDLlthQVxLUjGCgNQsY_h1bfFQHxxVBMc9C5Ful3SiaMvX6Q51-Ac5Wyns-2HuOv49plycYbijxrEjHcPWu1c59aPYyU43fnz8GFS9-rswWCxqMFr3VP8klE1m_7rPxHI6-BzvhFlryX_wqr1gGl8dHKuXS86OWgcQ084pOGr6Lmmn7-1DyF6-poJgQUSi_NFDyslJYDLwfaBygOElG40

and then you can combine both results in a html page like below

I found a description of the required command line argument -pipemap : https://forum.plantuml.net/5037/please-provide-command-line-option-generate-png-map-data-html?show=5037#q5037 (but I couldn't get it working)

[Potherca]

I am closing this in favor of #135.