openElements() not opening elements

Technical Support
1

Hi,

Below code prints (true,true), but i don’t see toolsOverlay, toolStylePopup both element
to be open when page loads. It remain close there.Is there any mistake or i left something?

instance.openElements([‘toolsOverlay’]);

instance.docViewer.on(‘documentLoaded’, () => {

instance.openElements(['toolStylePopup']);

console.log(instance.isElementOpen('toolStylePopup'),instance.isElementOpen('toolsOverlay'));

})

My requirement is when i click on shapeToolGroupButton ( Shape button ), automatically,
toolsOverlay and toolStylePopup should be open for current selected shape, so that i do not have to click again to get the option of color,thickness etc. Is it possible to do that?

If not then any alternative to achieve this.

Regards
Abhishek Maurya

2

Hi,

The reason why they don’t display in the viewer is that the toolStylePopup doesn’t know where it should locate itself.

You can listen to the toolModeUpdated event, check the tool names, and then open the component. The code below opens the style popup component when the current tool mode is rectangle tool.

instance.docViewer.on('toolModeUpdated', (currTool) => {
  if (currTool.name === 'AnnotationCreateRectangle') {
    setTimeout(() => {
      instance.openElements(['toolStylePopup']);
    }, 0);
  }
})

To gain max flexibility, I would suggest you to modify the UI source code, build it, and then integrate the custom UI into your app. If you are going this way then this guide can be helpful https://pdfjs.express/documentation/ui-customization/advanced-customization.

1 Like