Page 1 of 1

Embed Angular App in Oxygen Web Dialog (modal)

Posted: Wed Mar 04, 2020 9:00 pm
by Alper B
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.

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

Posted: Thu Mar 05, 2020 2:31 pm
by cristi_talau
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

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

Posted: Thu Mar 05, 2020 5:03 pm
by Alper B
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.

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

Posted: Thu Mar 05, 2020 5:18 pm
by cristi_talau
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

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

Posted: Mon Mar 09, 2020 12:12 pm
by Alper B
Hello Cristian,

Thanks, it worked using:

Code: Select all

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