Using the showPopupWindow() method

There are two showPopupWindow() methods available in the API. Both of these look identical and function in the same way. The only difference is that when supplying the x and y values in the methods options object you should consider if you require the want the popup window to be positioned within the current windows bounds or within the views bounds.
 

Window showPopupWindow()
The window version fin.Window.showPopupWindow() you have to provider values for x and y which are the positions within the window bounds in which it is fired. If you are in the view context you will use the following code to put a popup window in the centre of the window:
 

          let view = fin.View.getCurrentSync();
          let win = await view.getCurrentWindow();
          let state = await win.getState();
          let width = 0;
          let height = 0;
          let popupHeight = 300;
          let popupWidth = 300;

          if (state == "maximized") {
              width = window.screen.width;
              height = window.screen.height;
          } else {
              let windowBounds = await win.getBounds();
              width = windowBounds.width;
              height = windowBounds.height;
          }

          win.showPopupWindow({
              initialOptions: {
                  contextMenu: false,
                  modalParentIdentity: win.identity,
                  backgroundColor: "#2f3136",
                  resizable: false,
                  waitForPageLoad: true,
                  saveWindowState: false,
                  frame: true,
                  cornerRounding: {
                      height: 5,
                      width: 5,
                  },
                  customData: {
                      data: "data",
                  }
              },
              url: 'http://127.0.0.1:8080/html/popupWindow.html',
              resultDispatchBehavior: 'close',
              blurBehavior: 'modal',
              focus: true,
              height: popupHeight,
              width: popupWidth,
              x: width / 2 - popupWidth / 2,
              y: height / 2 - popupHeight / 2
          });

View showPopupWindow()
We also have the view version of the fin.View.showPopupWindow() method which will use x and y coordinates from within the view bounds. Therefore to put a popup window in the centre of the current view you can use the following code:
 

          let view = fin.View.getCurrentSync();
          let win = view.getCurrentWindow();
          let viewBounds = await fin.me.getBounds();
          let popupHeight = 300;
          let popupWidth = 300;

            view.showPopupWindow({
              initialOptions: {
                  contextMenu: false,
                  modalParentIdentity: win.identity,
                  backgroundColor: "#2f3136",
                  resizable: false,
                  waitForPageLoad: true,
                  saveWindowState: false,
                  frame: true,
                  cornerRounding: {
                      height: 5,
                      width: 5,
                  },
                  customData: {
                      data: "data",
                  }
              },
              url: 'http://127.0.0.1:8080/html/popupWindow.html',
              resultDispatchBehavior: 'close',
              blurBehavior: 'modal',
              focus: true,
              height: popupHeight,
              width: popupWidth,
              x: viewBounds.width / 2 - popupWidth / 2,
              y: viewBounds.height / 2 - popupHeight / 2
          });