Side view based on current XML content

Having trouble deploying Oxygen XML Web Author? Got a bug to report? Post it all here.
NicoAMP
Posts: 97
Joined: Tue Mar 06, 2018 2:07 pm
Contact:

Side view based on current XML content

Post by NicoAMP »

Hello,

In my Oxygen Web Author framework, I try to build a custom side view that use current XML content.
So I get the content in a var called currentXmlDocument.
But my problem is that currentXmlDocument variable is populated after the side view installation.

How can I resolve this issue?
Thanks for help.

Code: Select all

let currentXmlDocument = '';

(function () {
  class TocViewRenderer extends sync.view.ViewRenderer {
    constructor(editor) {
      super();
      this.selectionListener_ = this.updateOnSelectionChanged.bind(this);
      this.open_ = false;
      this.renderTimer_ = 0;
    }

    editorChanged(editor) {
      this.actionsManager_ = editor.getActionsManager();
    }

    install(element) {
      console.log('install Toc side view');
      this.container_ = element;
      console.log(currentXmlDocument); //is empty here
      element.innerHTML = currentXmlDocument;
    }
    opened() { }

    closed() { }

    updateOnSelectionChanged() { }

    update() { }

    getTitle() {
      return "Toc navigation";
    }

    getIcon() {
      return sync.ext.Registry.extensionURL + "/static/nav-toc24.png";
    }
  }

  workspace.getViewManager().addView("nav-toc");
  workspace.getViewManager().installView("nav-toc", new TocViewRenderer(), 'left');

})();


goog.events.listen(
  workspace,
  sync.api.Workspace.EventType.EDITOR_LOADED,
  function (e) {
    let editor = e.editor;
    console.log(editor.getUrl());
    editor.getContent(function cb(e, content) {
      currentXmlDocument = content;
      console.log(currentXmlDocument);
    });

  }
);
Regards,
Nicolas
Nicolas Delobel
AmeXio
nicolas.delobel at group.amexio.net
cristi_talau
Posts: 496
Joined: Thu Sep 04, 2014 4:22 pm

Re: Side view based on current XML content

Post by cristi_talau »

Hello,

You can modify the JS code like this:

Code: Select all

    
    editorChanged(editor) {
      this.actionsManager_ = editor.getActionsManager();
      this.container_.textContent = 'Loading...';
      editor.getContent((e, content) => {
        this.container_ = content;
      });
    }

    install(element) {
      console.log('install Toc side view');
      this.container_ = element;
    }
Some remarks:
  • In some cases (for example when using the DITA Map side-view), the editor can be changed multiple times. So it makes sense to update the side-view when the editor is changed.
  • You do not need to listen for EDITOR_LOADED events. The "editorChanged" callback is triggered in this case.
  • There will be a short window of time between the side-view installation and when the editor content becomes available. You can display a loading message during this period.
Best,
Cristian
NicoAMP
Posts: 97
Joined: Tue Mar 06, 2018 2:07 pm
Contact:

Re: Side view based on current XML content

Post by NicoAMP »

Hello Cristian,

Thanks a lot. It works well :)

I have another question.
In this side view innerHTML I have some links (file URL) that I would like to open in the current browser tab.

Code: Select all

<a href="http://127.0.0.1:9081/oxygen-webapp/app/oxygen.html?url=file%3A%2FC%3A%2FPROJETS%2FXXX%2Finputs%2Fsn_e189(1)%2Fsn_e189%2Fs9ml%2Ftoc.xhtml&showSave=true">test</a>
<a href="http://127.0.0.1:9081/oxygen-webapp/app/oxygen.html?url=file%3A%2FC%3A%2FPROJETS%2FXXX%2Finputs%2Fsn_e189(1)%2Fsn_e189%2Fs9ml%2Fchapter04%2Ffun008.html&showSave=true">test2</a>
I add this code to stay in the same tab

Code: Select all

goog.events.listen(
  workspace,
  sync.api.Workspace.EventType.EDITOR_LOADED,
  function (e) {
    var editor = e.editor;
    console.log("EDITOR_LOADED");
    //editor.getContent(callback).then(html => { console.log(html); });
    editor.listen(sync.api.Editor.EventTypes.LINK_OPENED, e => {
      if (!e.external) {
        e.linkTarget = sync.api.Editor.LinkOpenedEvent.Target.SELF;
      }
    });
  }
);
I works but the whole page is reloaded, not only the editor area.
Is it possible to have the same behavior as when i click on
image.png
image.png (1.31 KiB) Viewed 1084 times
?

Thanks a lot.
Regards,
Nicolas
Nicolas Delobel
AmeXio
nicolas.delobel at group.amexio.net
cristi_talau
Posts: 496
Joined: Thu Sep 04, 2014 4:22 pm

Re: Side view based on current XML content

Post by cristi_talau »

Hello,

The code that you wrote should work unless the "Change editors without page reload" option is disabled in the Administration Page [1] or you are on an old version (older than 21.1.1).

Another possible cause is another plugin/framework that sets "linkTarget" to blank.

Best,
Cristian

[1] https://www.oxygenxml.com/doc/versions/ ... out-reload
Post Reply