Logo

    Home

    Documentation

    Use Cases

    Training

    Applications

    Release Notes

    External Screen

    External Screen

    • 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.

    icon
    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.
    icon
    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

    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.

    Method
    Description
    launchContainer
    Event triggered from launchExternalScreen if already opened and launchContainer param is specified
    refresh
    Event triggered to handle layout visibility in External Screen. (eg. clearing screens, expanding panels etc.)
    activeWindow
    Event triggered on taskbar item selected or window in focus changed
    closeExternalWindow
    Event triggered when a window is closed
    refreshScheme
    Event for triggering refresh data in external screen

    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:

    Back to DocumentationDocumentation

    Back to Home Page

    Logo
    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);
    /**
    * 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;
    }