#-- Mermaid Js macro integration :
# - Call @importMermaidJs first
# - create a DIV like
graph TD (...)
# - Call @initMermaidJs
-->
<#macro importMermaidJs zoom=true>
<#if mermaidIsLoaded?? && mermaidIsLoaded>
<#else>
<#if zoom>
#if>
#if>
<#assign mermaidIsLoaded = true />
#macro>
<#macro initMermaidJs zoom=true>
<#if mermaidIsInitialized?? && mermaidIsInitialized>
<#else>
#if>
<#assign mermaidIsInitialized = true />
#macro>
<#macro mermaidGraph zoomControls=true zoomPos='top' zoomAlign='end' download=true>
<#local align='justify-content-${zoomAlign} is-justify-content-${zoomAlign}' />
<#if zoomPos='top'>
<@div class='d-flex is-flex ${align} '>
<#if zoomControls>
<@mermaidToolBar />
#if>
<#if download>
#if>
@div>
#if>
<@div class='mermaid' params=' style="opacity:0"'>${mdgraph}@div>
<#if zoomPos !='top'>
<@div class='d-flex is-flex ${align}'>
<#if zoomControls >
<@mermaidToolBar />
#if>
<#if download>
#if>
@div>
#if>
#macro>
<#macro mermaidToolBar>
<@button color='default' id='zoom-in' title='#i18n{mermaidjs.zoomIn}' buttonIcon='search-minus' />
<@button color='default' id='zoom-out' title='#i18n{mermaidjs.zoomOut}' buttonIcon='search-plus' />
<@button color='default' id='reset' title='#i18n{mermaidjs.reset}' buttonIcon='search' />
#macro>
<#macro mermaidHelp zoom=true download=true>
<@box class='text-white bg-info'>
<@boxHeader title='#i18n{mermaidjs.help.title}' />
<@boxBody class='text-dark'>
<@ul>
#i18n{mermaidjs.help.info}
<#if zoom>#i18n{mermaidjs.help.zoom}#if>
<#if download>#i18n{mermaidjs.help.download}#if>
@ul>
@boxBody>
@box>
#macro>