Embed Angular App in Oxygen Web Dialog (modal)

Alper B
Posts: 9
Joined: Mon Jan 27, 2020 6:26 pm

Embed Angular App in Oxygen Web Dialog (modal)

Post by Alper B » Wed Mar 04, 2020 9:00 pm

Hello,

We have developped some Angular views browsed with JXBrowser, when we call an action with Oxygen XML Author. In order to keep these Angular apps in our webapp, we tried to embed them in an Oxygen Web Dialog (inspired by tutorials [1] and [2]).
My problem is that this code produces a 404 error:

Code: Select all

this.dialog.getElement().innerHTML = '<object type="text/html" data="../resources/dist/insertDuInvLink/index.html"></object>';
index.html is located in the resource folder of my project.

Is it the wrong way to embed the Angular app in the dialog?


[1]: https://www.oxygenxml.com/maven/com/oxy ... ction.html
[2]: https://www.oxygenxml.com/maven/com/oxy ... ialog.html

Regards,
Alper.

cristi_talau
Posts: 286
Joined: Thu Sep 04, 2014 4:22 pm

Re: Embed Angular App in Oxygen Web Dialog (modal)

Post by cristi_talau » Thu Mar 05, 2020 2:31 pm

Hello,

I understand you want to load some static resources defined in your project in a dialog. It all depends on the place where your resources are located:
1. If you develop a plugin, you should use the WebappStaticResourcesFolder extension type [1].
2. If you develop a framework, all the resources found in the "web" subfolder of your framework folder are available at the base URL indicated by this variable "sync.ext.Registry.extensionURL".
3. If you add your files as an overlay over the Web Author WAR file (which is not recommended), just make sure that the folder with your resources is in the correct place relative to the main "oxygen.html" page.

Best regards,
Cristian

[1] https://www.oxygenxml.com/doc/versions/ ... Cresources

Alper B
Posts: 9
Joined: Mon Jan 27, 2020 6:26 pm

Re: Embed Angular App in Oxygen Web Dialog (modal)

Post by Alper B » Thu Mar 05, 2020 5:03 pm

Hi,

Thanks for the hints. We are in the second case.

Okey to place static resources in the web subfolder of the framework folder, but can you explain more about the variable "sync.ext.Registry.extensionURL" please?

Thank you!

Regards,
Alper.

cristi_talau
Posts: 286
Joined: Thu Sep 04, 2014 4:22 pm

Re: Embed Angular App in Oxygen Web Dialog (modal)

Post by cristi_talau » Thu Mar 05, 2020 5:18 pm

Hello,

If you use "sync.ext.Registry.extensionURL" in JS , it evaluates to an URL like: "./rest/v22.0.0/load/framework/6%252Fdita%252Fditamap.framework%252FDITA/". If you want to access a file located in the <framework-dir>/web/resources/index.html you need to use the URL

sync.ext.Registry.extensionURL + 'resources/index.html'

Best,
Cristian

Alper B
Posts: 9
Joined: Mon Jan 27, 2020 6:26 pm

Re: Embed Angular App in Oxygen Web Dialog (modal)

Post by Alper B » Mon Mar 09, 2020 12:12 pm

Hello Cristian,

Thanks, it worked using:

Code: Select all

sync.ext.Registry.getExtensionURL()
Best regards,
Alper

Post Reply