Oxygen XML Forum

Posted: **Mon Aug 16, 2021 9:10 am**

Hi team.

I have created a new oxy button in Web Author and trying to call the attribute view when this button is clicked. So far I could not find the operation which opens this attribute view in the sidebar.

Can you please help me on this?

Regards
Srinarayan

Posted: **Mon Aug 16, 2021 2:31 pm**

Hi Sean,

We do not provide an out-of-the-box action to focus the attributes side view.
You will have to create a custom action that when invoked focuses the view using the sync.view.ViewManager [1] API:

Code: Select all

workspace.getViewManager().focusView('attributes-panel-table');

.
You can then register the action with the ActionsManager[2] by an ID and configure the oxy button to invoke the action with that ID.

Regards,
Michael

1. https://www.oxygenxml.com/maven/com/oxy ... ew__anchor
2. https://www.oxygenxml.com/maven/com/oxy ... on__anchor

Posted: **Mon Aug 16, 2021 4:45 pm**

Hi Michael,

I registered an action like you suggested -> editor.getActionsManager().registerAction('edit.attribute', globalAttrs.urnDialogNew);

And then I wrote a java script for getting the action and running it.

function editAttributes() {
var allActions = authorAccess.getEditorAccess().getActionsProvider().getAuthorCommonActions();
var action = allActions.get("edit.attribute");

if (typeof action.actionPerformed === "function") {
action.actionPerformed(null);
} else if (typeof action.run === "function") {
action.run();
}
}

But when I tried running the action from the css button I am getting an error like this: 'Could not evaluate script: TypeError: Cannot read property "actionPerformed" from null'

Please help in resolving this error.

Posted: **Mon Aug 16, 2021 5:19 pm**

Hello,

I was referring to client-side JS code [1].
You can implement a custom JS action as in this example [2] in whose actionPerformed implementation just executes

Code: Select all

workspace.getViewManager().focusView('attributes-panel-table');

Regards,
Michael

1. https://www.oxygenxml.com/doc/versions/ ... lugin.html
2. https://www.oxygenxml.com/maven/com/oxy ... ction.html

Posted: **Tue Aug 17, 2021 9:04 am**

Hi Michael,

I have implemented the custom JS action just like mentioned in the [1] with the actionPerformed implementation.

Just to check I have added this action to the context menu also. It is able to focus the attribute view from the context menu.

But from the CSS button it is not. It says that it cannot read property of actionPerformed from null. I dont understand this because the action is working from the context menu.

Can you please help in resolving this error?

Regards,
Vivek.

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

Posted: **Tue Aug 17, 2021 1:21 pm**

Hi,

In order to try to reproduce the issue, could you share:

the full stack trace of the error displayed in the browser's console when invoking the action from the oxyButton form control ?

The oxyButtont configuration that you are using

Michael

Posted: **Tue Aug 17, 2021 1:30 pm**

Hi Michael,

I am now able to assign the action to the button like this:

oxy_button(actionID, "edit.attribute", enableInReadOnlyContext, true);

But there is a small issue. When the editor is loaded for the first time, the button is not having the intended display name which is set for the action. Instead the button text is "Unknown". But when there is a change in the content(refresh) the button text("Unknown") is replaced by the display name of the action.

I think the action is not working immediately after the editor is loaded. Is there something that I have to do specifically to resolve this issue?

Regards,
Srinarayan

Posted: **Tue Aug 17, 2021 1:40 pm**

I suspect there is a timing issue between the document rendering and your action registering.

Have you used the sync.api.Workspace.EventType.EDITOR_LOADED event to register the action?

If that is the case you could try registering the action on the sync.api.Workspace.EventType.BEFORE_EDITOR_LOADED that is triggered before the document rendering.

Posted: **Tue Aug 17, 2021 1:48 pm**

Hi Michael,

I had used BEFORE. Unfortunately, I do not think the action is being registered with the below code.

workspace.listen(sync.api.Workspace.EventType.BEFORE_EDITOR_LOADED, function(e) {
var editor = e.editor;
// Register the newly created action.
editor.getActionsManager().registerAction('edit.attribute', new WebLinkAction(editor));

addToContextMenu(editor, 'edit.attribute');

// Refresh the action enabled/disabled status when the selection changes.
editor.getSelectionManager().listen(
sync.api.SelectionManager.EventType.SELECTION_CHANGED, function() {
editor.getActionsManager().refreshActionsStatus('edit.attribute')
});
});

The error I am getting from using this is "Unknown action ID: edit.attribute. The document must have an associated Document Type in which an action with the given ID must be declared."

This is not the case when I am not using the BEFORE.

Regards,
Srinarayan

Posted: **Tue Aug 17, 2021 2:55 pm**

When deploying the JS snippet you shared i am getting an error in the browser's developer console because of the piece of code:

Code: Select all

    // Refresh the action enabled/disabled status when the selection changes.
  editor.getSelectionManager().listen(
      sync.api.SelectionManager.EventType.SELECTION_CHANGED, function() {
        editor.getActionsManager().refreshActionsStatus(actionId)
      });
  });

This code should be executed on the sync.api.Workspace.EventType.EDITOR_LOADED event when the editor is fully loaded.

After completely removing this snippet everything works as expected with a custom action.
I replaced the code from WebLinkAction.prototype.actionPerformed with console.log('TEST'); to check that the action is invoked from the oxyButton.

It would be great if you could do the same and check whether the action is correctly invoked.

Do you have any errors in the browser's developer console?

Posted: **Tue Aug 17, 2021 3:19 pm**

Hi,

I have removed the piece of code that you have mentioned and used "sync.api.Workspace.EventType.BEFORE_EDITOR_LOADED". But still I am getting the same error as I have mentioned earlier. "Unknown action ID: edit.attribute. The document must have an associated Document Type in which an action with the given ID must be declared."

Even with that snippet of code for the BEFORE_EDITOR_LOADED, the error is same.

It's not the case when using "sync.api.Workspace.EventType.EDITOR_LOADED" as the action is being ran successfully except the display name issue.

Regards,
Srinarayan

Posted: **Tue Aug 17, 2021 3:29 pm**

The warning that you mention seems to be generated due to an invocation of a server-side action from JS (your custom action maybe?) so an action is invoked when pressing the button.
Have you tested whether the actionPerformed is called for your action ?
Are there any console errors when this issue occurs?

Posted: **Tue Aug 17, 2021 3:33 pm**

Yes, the warning is generated when I click the button. The actionPerformed is not being called. The same error warning is being printed in the console too.

"Error Unknown action ID: edit.attribute. The document must have an associated Document Type in which an action with the given ID must be declared."

Posted: **Tue Aug 17, 2021 3:37 pm**

I did not reproduce the issue.
This is the entire code i am using, except the action declaration:

Code: Select all

  workspace.listen(sync.api.Workspace.EventType.BEFORE_EDITOR_LOADED, function(e) {
    console.log('HEREERERE')
    var editor = e.editor;
// Register the newly created action.
    var actionId = 'edit.attribute'

    editor.getActionsManager().registerAction(actionId, new WebLinkAction());
  });

Maybe you can try with my exact code.
If the issue still reproduces we might need the code for the action you are registering?
Another important factor might be the exact Web Author version you are testing your code on.

Posted: **Tue Aug 17, 2021 4:05 pm**

Hi,

We are using the Oxygen v23. How do I share my code here? shall I just paste it here?

Posted: **Tue Aug 17, 2021 4:13 pm**

Yes, you can paste the entire JS code here so i can reproduce your exact environment.

Posted: **Tue Aug 17, 2021 4:17 pm**

Here is the JS code:

Code: Select all

WebLinkAction = function(editor) {
  // shortcut is Meta+L on Mac and Ctrl+L on other platforms.
  sync.actions.AbstractAction.call(this, 'M1 L');
  this.editor = editor;
};
WebLinkAction.prototype = Object.create(sync.actions.AbstractAction.prototype);
WebLinkAction.prototype.constructor = WebLinkAction;

WebLinkAction.prototype.getDisplayName = function() {
  return 'Edit Profiling attributes';
};
WebLinkAction.prototype.actionPerformed = function(callback) {
        console.log("test");
   workspace.getViewManager().focusView('attributes-panel-table');
};
workspace.listen(sync.api.Workspace.EventType.BEFORE_EDITOR_LOADED, function(e) {
    var editor = e.editor;
// Register the newly created action.
     var actionId = 'edit.attribute';
		editor.getActionsManager().registerAction(actionId, new WebLinkAction());
         });



function addToContextMenu(editor, actionId) {
  editor.listen(sync.api.Editor.EventTypes.ACTIONS_LOADED, function(e) {
    var contextualItems = e.actionsConfiguration.contextualItems;
    if (contextualItems) {
      contextualItems.push({
        id: actionId,
        type: "action"
      });
    }
  });
}

Posted: **Tue Aug 17, 2021 4:35 pm**

I deployed your code in a v23 instance and all works perfectly.

Is there any chance that you have the action declared and registered multiple times with a different code in separate locations?

To make sure that the actionPerformed code executed is the expected one you can try to run in the browser's developer console the following snippet of JS code:

Code: Select all

workspace.currentEditor.getActionsManager().getActionById('edit.attribute').actionPerformed

It should print the actionPerformed function's code to make sure it is the one with the console.log.

Posted: **Tue Aug 17, 2021 4:39 pm**

Yes, it is printing the exact code written for that action.

"ƒ (callback) {
console.log("test");
workspace.getViewManager().focusView('attributes-panel-table');
}"

Posted: **Tue Aug 17, 2021 4:59 pm**

In a clean Web Author installation without any other changes besides the JS code that you shared with me, the code should work as expected as I cannot reproduce the issue you are experiencing.

Do you have any other customizations at framework/plugin level, anything other than the JS snippet you sent to me?
Is an action with this ID defined at framework level, using the Oxygen Editor/Author UI ?

These might interact with this action somehow.

One more thing that I would try is to change the action ID in the CSS and the JS code with something like 'myDummyId'.

Posted: **Thu Aug 19, 2021 8:34 am**

Hi,

I am thinking to try in Oxygen v22.1.0 setup. Will this exact code work there or are there some modifications that have to be done?

Regards,
Srinarayan.

Posted: **Thu Aug 19, 2021 9:56 am**

Hi,

The code you shared with me should work on the latest version. I suspect you have other changes to your Web Author environment interfering with this behavior.

The best approach is to install a fresh Web Author instance and just add the code to a basic plugin and add the CSS adding just the oxyButton to a framework.

Posted: **Thu Aug 19, 2021 11:43 am**

Hi,

Thanks for your support. I have tried deploying in a different directory altogether and it worked.

Regards,
Srinarayan

Oxygen XML Forum

Calling attribute View Operation in Web Author

Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author

Re: Calling attribute View Operation in Web Author