Sparx Systems Forum

Enterprise Architect => Bugs and Issues => Topic started by: jack89 on January 21, 2021, 10:50:42 pm

Title: HTML export navigation links
Post by: jack89 on January 21, 2021, 10:50:42 pm

Hi all,

I usually export my EAPX project into HTML in order to share info with other stakeholders.

If I export my project on www. example. it/index.htm, I noticed that even if I navigate into a specific diagram, the link in the address bar (example. it) doesn't change. In this way, the final user doesn't know the specific link related to the diagram that he wants to share.

I know that I can address the specific diagram using the GUID (www. example. it//index.htm?guid=XXX).

My question is: Is there any way to show the detailed links during user navigation? In this way, if user wants to share diagram X he simply copy the link into navigation bar (example. it/index.htm?guid=DIAGRAM X)

Thank you in advance!

Title: Re: HTML export navigation links
Post by: Geert Bellekens on January 21, 2021, 10:52:49 pm

At one of my clients they did that, so it's definitely possible.

But I wasn't involved at the time, so I don't really know how exactly they managed that.
I can ask and report back.

Geert

Title: Re: HTML export navigation links
Post by: Geert Bellekens on January 22, 2021, 05:58:56 pm

Here's what they have in the Body - Diagram template

Code: [Select]

<div class="PageBody">
#IMAGE#
<div class="ObjectTitle">#NAME# : #TYPE# diagram</div>
<table border="0" cellpadding="0" cellspacing="0" class="ObjectDetails">
<tr>
<td width="15%" class="ObjectDetailsTopic">Created:</td>
<td width="85%" class="ObjectDetailsValue">#CREATEDATE#</td>
</tr>
<tr>
<td width="15%" class="ObjectDetailsTopic">Modified:</td>
<td width="85%" class="ObjectDetailsValue">#MODDATE#</td>
</tr>
<tr style="padding-top: 10px;">
<td width="15%" class="ObjectDetailsTopic"><img src="#IMAGES#/plus03.gif" align="absmiddle" id="proj" onclick="parent.toggleData(this.id)" />Project:</td>
<td width="85%" class="ObjectDetailsValue"></td>
</tr>
<tr id="proj00" style="display: none;">
<td width="15%" class="ObjectDetailsTopic" style="padding-left: 18px;">Author:</td>
<td width="85%" class="ObjectDetailsValue">#AUTHOR#</td>
</tr>
<tr id="proj01" style="display: none;">
<td width="15%" class="ObjectDetailsTopic" style="padding-left: 18px;">Version:</td>
<td width="85%" class="ObjectDetailsValue">#VERSION#</td>
</tr>
<tr>
<td width="15%" class="ObjectDetailsTopic"><img src="#IMAGES#/plus03.gif" align="absmiddle" id="adv" onclick="parent.toggleData(this.id)" />Advanced:</td>
<td width="85%" class="ObjectDetailsValue"></td>
</tr>
<tr id="adv00" style="display: none;">
<td width="15%" class="ObjectDetailsTopic" style="padding-left: 18px;">ID:</td>
<td width="85%" class="ObjectDetailsValue">#GUID#</td>
</tr>
</table>
#NOTE#
<br/>
<div>Permanent link: <div id="#GUID#"></div>
<script>
var mypath="/index.html?guid=#GUID#";
mypath = mypath.replace("{","");
mypath = mypath.replace("}","");
document.getElementById("#GUID#").innerHTML = "https://sparxExport.myCompany.url"+mypath;
parent.history.replaceState("object or string", "#NAME#", mypath);
</script>
</div>

Pretty nifty solution  :)

Geert

Title: Re: HTML export navigation links
Post by: jack89 on January 22, 2021, 08:48:18 pm

Quote from: Geert Bellekens on January 22, 2021, 05:58:56 pm

Here's what they have in the Body - Diagram template

Code: [Select]

<div class="PageBody">
#IMAGE#
<div class="ObjectTitle">#NAME# : #TYPE# diagram</div>
<table border="0" cellpadding="0" cellspacing="0" class="ObjectDetails">
<tr>
<td width="15%" class="ObjectDetailsTopic">Created:</td>
<td width="85%" class="ObjectDetailsValue">#CREATEDATE#</td>
</tr>
<tr>
<td width="15%" class="ObjectDetailsTopic">Modified:</td>
<td width="85%" class="ObjectDetailsValue">#MODDATE#</td>
</tr>
<tr style="padding-top: 10px;">
<td width="15%" class="ObjectDetailsTopic"><img src="#IMAGES#/plus03.gif" align="absmiddle" id="proj" onclick="parent.toggleData(this.id)" />Project:</td>
<td width="85%" class="ObjectDetailsValue"></td>
</tr>
<tr id="proj00" style="display: none;">
<td width="15%" class="ObjectDetailsTopic" style="padding-left: 18px;">Author:</td>
<td width="85%" class="ObjectDetailsValue">#AUTHOR#</td>
</tr>
<tr id="proj01" style="display: none;">
<td width="15%" class="ObjectDetailsTopic" style="padding-left: 18px;">Version:</td>
<td width="85%" class="ObjectDetailsValue">#VERSION#</td>
</tr>
<tr>
<td width="15%" class="ObjectDetailsTopic"><img src="#IMAGES#/plus03.gif" align="absmiddle" id="adv" onclick="parent.toggleData(this.id)" />Advanced:</td>
<td width="85%" class="ObjectDetailsValue"></td>
</tr>
<tr id="adv00" style="display: none;">
<td width="15%" class="ObjectDetailsTopic" style="padding-left: 18px;">ID:</td>
<td width="85%" class="ObjectDetailsValue">#GUID#</td>
</tr>
</table>
#NOTE#
<br/>
<div>Permanent link: <div id="#GUID#"></div>
<script>
var mypath="/index.html?guid=#GUID#";
mypath = mypath.replace("{","");
mypath = mypath.replace("}","");
document.getElementById("#GUID#").innerHTML = "https://sparxExport.myCompany.url"+mypath;
parent.history.replaceState("object or string", "#NAME#", mypath);
</script>
</div>

Pretty nifty solution  :)

Geert

Thank you so much!

Title: Re: HTML export navigation links
Post by: jack89 on January 30, 2021, 02:28:33 am

With the displayed method, the link appears as a text inside the diagram.

Is there any method in order to display directly an hyperlink?