• Description
• How to use it
• 1. Open a new External screen
• 2. Sending custom data in External Screen and options
• WebSocket Events on Docviewer:
• 3. Prompting the HasChanges Dialog in ExternalScreens

Description

Build.One allows the users to open different popups from the application and to communicate between the popups using WebSocket events. The ExternalScreen class can be used to handle these cases

How to use it

1. Open a new External screen

To open a new external screen you need to use the global akioma.launchExternalScreen method.

Example

akioma.launchExternalScreen({
      autostartObjects: 'DocViewerFrame',
      baseLayoutObject: 'AkiomaMainLayout',
      screen: {
           width: 900,
           height: 700
      }
});

The most basic attributes are the baseLayoutObject and autostartObjects, the name of the layout and the initial auto starting object in layout(desktop).

The baseLayoutObject default is read from the sessionData.baseLayoutObject property if it hasn't been specified in the attributes.

Besides the baseLayoutObject and autostartObjects, there is an option to specify the initial size and position of the popup using the "screen" object parameter.

When using the method to launchExternalScreen if the popup is already opened it will emit a "launchContainer" socket event, that means it will not open a new popup but try to use the existing one for launching.

When trying to open the ExternalScreen if the popup is blocked, a notification message will appear informing the user that the popup could not be opened. Enabling popups from your browser will fix this issue.

2. Sending custom data in External Screen and options

If required to read custom data inside the external screen, the custom data can be specified in the launchExternalScreen options.

Example

const ExternScreenOpts = {
	launchContainer: WindowName,
	baseLayoutObject: 'AkiomaDocviewerMainLayout',
	autostartObjects: 'mainDesktopDocViewerW',
	name: 'DocViewer',
	screenNamespace: WindowName,
	custom: {
		stamm_id: cStammId,
		id: oWin.opt.id
	},
	onBeforeScreenUnload: () => {
		// close the linked
		akioma.ExternalScreen.popups.forEach(popup => popup.close());
	},
	onBeforeScreenLoadClosed: () => {
		for (var i in akioma.oWindowsParentCell.childs) {

			var win = akioma.oWindowsParentCell.childs[i];

			if (win.opt.name === 'sStammDetailWindow') {
				var oRibbon = win.getDescendant('ribbon');
				oRibbon.enableItem('StammDossierExternalWindow');
				oRibbon.enableItem('StammDossierExternalDocumentWindow');
			}
		}

		akioma.VuexStore.dispatch('taskbar/clearAllExternalScreens'); // remove header color for all externalScreens opened from taskbar
	};
};

ExternScreenOpts.onBeforeScreenUnload = () => {
	// close the linked
	akioma.ExternalScreen.popups.forEach(popup => popup.close());
};

akioma.launchExternalScreen(ExternScreenOpts);

Above you can see an example of sending the custom data inside the "custom" property value of the params.

• The user can also specify the launchContainer name. The screen that will be launched when the popup is already opened via websocket events.
• It is also possible to specify the onBeforeScreenUnload callback, that will be called before the popup is unloaded or if the main opener window is unloaded.
• The onBeforeScreenLoadClosed event callback is called before the screen actually loads and if it has been closed.

WebSocket Events on Docviewer:

Below we have the list of most recent Docviewer events that can be handled via callback by using the callback method setters from the ExternalScreen class.

3. Prompting the HasChanges Dialog in ExternalScreens

External screens can also have changes that are bound to a secondary external screen. In this case it is possible to programmatically prompt the user with the has changes dialog by adding an EventBeforeSelect on the corresponding Grid object.

In the EventBeforeSelect it is required to return a payload object with the setting "promptCursorChange" set to true. This will block the record selection and prompt the user with the Has Changes dialog.

The getExternalPopup method from the ExternalScreen class can be used to retrieve the External Screen window object based on provided screenNamespace used when launching the External Screen Popup.

Example:

/**
* Method to execute before row selecting to display ExternalScreen hasChanges prompt
* @param grid
*/
export function onBeforeGridRowSelect(grid: akioma.swat.Grid) {
    const payload:any = {};
    const DocviewerExternalScreen = akioma.ExternalScreen.getExternalPopup('sDocViewerExternalWindow');
    const hasChangesExternal:boolean = DocviewerExternalScreen.akioma.swat.Root.getFirstChildByType('businessEntity').hasChanges();

    if(hasChangesExternal) {
        payload.promptCursorChange = true;
    }

    return payload;
}

Back to Documentation

Back to Home Page