Page tree

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Code Block
languagejs
titleGlobal Hooks
linenumberstrue
collapsetrue
 * Event Listener for adding new taskbar items when a new container has been launched
 * @param {ak_window} containerControl Window container launched
 */
akioma.swat.GlobalEmitter.on( akioma.swat.GlobalHooks.LAUNCH.AFTER_LOAD, ( containerControl : akioma.swat.Window | akioma.swat.Frame ) => {
  const primaryDataSource = containerControl.dynObject.getLink( "PRIMARYSDO:TARGET" );
  const isLoginScreen = window.app.sessionData.loginScreen === containerControl.controller.opt.name;
  if ( containerControl.controller.bMainWindow || containerControl.controller.opt.modal || isLoginScreen )
    return;

  if ( akioma.ExternalScreen.externalScreenContainer === containerControl.controller.opt.name )
    return;

  if ( containerControl.controller.view !== "window" || !primaryDataSource )
    return;
  const primaryDataSourceControl = primaryDataSource.controller;
  // after fill add taskbar item and group
  primaryDataSourceControl.addAfterFillOnceCallback( () => {
    const titleShortTemplateCompiled = primaryDataSourceControl.getRecordDescription( containerControl.controller.opt.titleShort );
    const selfHdl = primaryDataSource.getValue( "selfhdl" );
    buildone.addTaskbarItem( containerControl as akioma.swat.Window, selfHdl, titleShortTemplateCompiled );
  } );
} );

/**
 * Event listener called on an after save changes on a dataSource/businessEntity,
 * used for updating the group title after a dataSource saveChanges operation
 * @param {ak_businessEntity} dataSource Datasource object
 */
akioma.swat.GlobalEmitter.on( akioma.swat.GlobalHooks.DATASOURCE.AFTER_SAVE_CHANGES, async ( dataSource : akioma.swat.DataSource ) => {
  const containerControl = dataSource.container?.controller;
  const primaryDataSource = containerControl.dynObject?.getLink( "PRIMARYSDO:TARGET" );

  if ( containerControl?.view !== "window" || !primaryDataSource )
    return;

  const TaskbarObject = akioma.swat.MasterLayout.getBaseLayoutObject().getFirstChildByType( "grouptaskbar" ) as akioma.swat.Taskbar;

  const primaryDataSourceControl = primaryDataSource.controller;
  const SelfHdl = primaryDataSource.getValue( "selfhdl" );

  const res = await buildone.getRelatedPersonByUniqueKey( SelfHdl );
  const resArray = res.split( "|" );
  const parentId = resArray[ 0 ];
  const title = resArray[ 1 ];
  let groupData;
  if (parentId) {
    groupData = {
      id: parentId,
      title
    };
  } else {
    const shortTemplate = containerControl.opt.titleShort || containerControl.opt.TITLE;
    const titleShortTemplateCompiled = primaryDataSourceControl.getRecordDescription(shortTemplate);
    groupData = {
      id : TaskbarObject.getActiveGroupId(),
      title : titleShortTemplateCompiled
    };
  }
  TaskbarObject.updateGroup( groupData );
} );

/**
 * Listener on desktop toggle mode to enable/disable header Taskbar
 * @param {boolean} isDesktopMode Desktop state
 */
akioma.swat.GlobalEmitter.on( akioma.swat.GlobalHooks.DESKTOP.AFTER_TOGGLE, ( isDesktopMode : boolean ) => {
  const taskbarObject = akioma.swat.MasterLayout.getBaseLayoutObject().getFirstChildByType( "grouptaskbar" ) as akioma.swat.Taskbar;

  if ( !taskbarObject )
    return;

  if ( isDesktopMode )
    taskbarObject.enable();
  else
    taskbarObject.disable();
} );

/**
 * Event listener called after a window close event operation
 * @param {ak_window} windowControl Window object closed
 */
akioma.swat.GlobalEmitter.on( akioma.swat.GlobalHooks.WINDOW.CLOSE, ( windowControl : akioma.swat.Window ) => {
  const taskbarObject = akioma.swat.MasterLayout.getBaseLayoutObject().getFirstChildByType( "grouptaskbar" ) as akioma.swat.Taskbar;

  taskbarObject.removeItem( windowControl.controller.opt.id );
} );


/**
 * Event listener called on a focus event of a window, used for selecting the taskbar
 * @param {ak_window} win Window object
 */
akioma.swat.GlobalEmitter.on( akioma.swat.GlobalHooks.WINDOW.FOCUS, ( windowControl : akioma.swat.Window ) => {
  if ( !window.akioma.root || !window.akioma.root.dynObject )
    return;

  const taskbarObject = akioma.swat.MasterLayout.getBaseLayoutObject().getFirstChildByType( "grouptaskbar" ) as akioma.swat.Taskbar;

  if ( !taskbarObject ) {
    return;
  }
  taskbarObject.selectItem( windowControl.controller.opt.id, !windowControl.controller.disableFocusSelect );

} );

/**
 * Event listener called on a window has errors state change, used for setting the taskbar has errors state
 * @param windowControl
 * @param hasErrors
 */
akioma.swat.GlobalEmitter.on( akioma.swat.GlobalHooks.WINDOW.HAS_ERRORS, ( { windowControl, hasErrors } : { windowControl : akioma.swat.Window, hasErrors : boolean } ) => {
  const taskbarObject = akioma.swat.MasterLayout.getBaseLayoutObject().getFirstChildByType( "grouptaskbar" ) as akioma.swat.Taskbar;
  if ( !taskbarObject )
    return;

  taskbarObject.setItemHasErrors( windowControl.controller.opt.id, hasErrors );
} );

/**
 * Event listener called on a window has changes state change, used for setting the taskbar has changes state
 * @param windowControl
 * @param hasChanges 
 */
akioma.swat.GlobalEmitter.on(akioma.swat.GlobalHooks.WINDOW.HAS_CHANGES, ( { windowControl, hasChanges } : { windowControl : akioma.swat.Window, hasChanges : boolean } ) => {
  const baseLayoutObject = akioma.swat.MasterLayout.getBaseLayoutObject() as akioma.swat.Frame;
  if ( !baseLayoutObject )
    return;
  const taskbarObject = baseLayoutObject.getFirstChildByType( "grouptaskbar" ) as akioma.swat.Taskbar;
  if ( !taskbarObject )
    return;

  taskbarObject.setItemHasChanges( windowControl.controller.opt.id, hasChanges );
} );


External screens:


External screen items can be added from ClientLogic as seen in the example below:

This should be used together with launching the external screen usingĀ akioma.launchExternalScreen, see documentation of ExternalScreen

Code Block
languagejs
titleExternal screen taskbar item
linenumberstrue
collapsetrue
const taskbarObject = akioma.swat.MasterLayout.getBaseLayoutObject().getFirstChildByType( "grouptaskbar" ) as akioma.swat.Taskbar;
const activeGroupId : string        = taskbarObject.getActiveGroupId();
const activeGroup                   = taskbarObject.getGroupById( activeGroupId );

taskbarObject.addExternalItem( {
       // must be item id so the taskbar is recognized as external and displayed red
       id    : activeGroup.item_active,
       title : response.MessageDetail
});

Styling for GroupTaskbar

The following SASS variables are available for customizing the appearance of the GroupTaskbar:

Code Block
languagesass
titleGroupTaskbar variables
linenumberstrue
collapsetrue
$taskbar_item_bgColor: #e4e4e4 !default;
$taskbar_item_active_bgColor: #394c61 !default;
$taskbar_item_external_screen_bgColor: #7a1d17 !default;
$taskbar_item_external_screen_color: #fff !default;
$taskbar_item_color: #000 !default;
$taskbar_item_active_color: #fff !default;
$taskbar_item_padding: 11px 40px 11px 10px !default;
$taskbar_item_max_width: 250px !default;
$taskbar_group_bgColor: #e4e4e4 !default;
$taskbar_group_active_bgColor: #394c61 !default;
$taskbar_group_color: #000 !default;
$taskbar_group_active_color: #fff !default;
$taskbar_group_width: 250px !default;
$taskbar_group_max_width: 250px !default;
$taskbar_group_border_bottom: solid 1px white !default;
$taskbar_group_content_min_width: 220px !default;
$taskbar_group_content_max_width: 220px !default;
$taskbar_group_content_padding: 10px 40px 10px 7px !default;
$taskbar_bgColor: #fff !default;
$taskbar_font_family: roboto, arial, helvetica !default;
$taskbar_close_icon_fill: #fff !default;



Taskbar (DataView template)

...