eLabSDK.Page

Functions

Name	Description
getUniqueID()	Generate a unique random identifier string.

This creates a random alphanumeric string prefixed with an underscore, suitable for
use as a unique DOM element ID, callback identifier, or any other purpose requiring
unique identifiers. The ID is generated using Math.random() and base-36 encoding,
producing strings like "_x8j4k2m9p". Use this when you need to create unique IDs
for dynamically generated elements or event handlers.
addButton(btn) | Add a custom button to the top navigation bar of the page.

This adds an eLabSDK.GUI.Button to the top page navigation area, prepending it to the
left side of the navigation bar. The button is automatically wrapped in a list item and
rendered with a pointer cursor. Use this to add custom actions and features accessible
from the main page navigation, such as export buttons, quick actions, or custom tools.
showToast(config) | Display a toast notification message to the user.

This shows a non-intrusive toast message at the top of the page to provide feedback,
notifications, or status updates to the user. Toast messages automatically disappear
after a configurable timeout and can be dismissed by the user. Use this for success
messages, warnings, errors, or any temporary notifications that don't require immediate
user interaction.
clearTopMenu() | Hide all items in the top personal menu.

This hides the personal menu items in the top navigation bar (user profile, settings,
logout, etc.). Use this in locked-down or kiosk environments where you want to minimize
distractions and prevent users from accessing personal settings or navigating away from
the current workflow. The menu items are hidden but not removed from the DOM.
clearRibbonMenu(cfg) | Hide ribbon menu items to create a focused interface.

This hides the ribbon navigation bar items using either display:none or visibility:hidden.
You can also optionally hide the sub-ribbon menu. Use this in locked-down environments,
guided workflows, or kiosk modes where you want to minimize navigation options and keep
users focused on specific tasks. The difference between hide modes: 'display' removes
items from layout flow, while 'visibility' keeps space but makes items invisible.
getPageType() | Determine if the current page is in the admin or members area.

This checks the current URL to determine whether the user is on an admin page or a
regular members page. Returns 'admin' for administrative pages (system settings,
account management) and 'members' for all other pages. Use this to conditionally
enable features, customize behavior, or restrict functionality based on the page
context.
getAdminPageType() | Determine the specific type of admin page currently displayed.

This checks the current URL to identify which admin section the user is viewing.
Returns 'accountManagement' for account details pages, 'systemSettings' for system
settings pages, or an empty string if not on a recognized admin page. Use this for
admin-specific customizations, conditional features, or specialized functionality
that should only appear in certain admin contexts.
getCurrentLocation() | Determine the specific type of page currently being viewed.

This analyzes the current URL path to identify which specific page or section the user
is viewing. Returns a descriptive string identifying the page type (e.g., 'sampleList',
'experimentBrowser', 'inventoryBrowser'), or an empty string if the page type is not
recognized. Use this for page-specific customizations, conditional features, or to
determine the appropriate context for your SDK functionality.

getUniqueID()

Generate a unique random identifier string.

Kind: global function
Returns: string - A unique identifier string starting with underscore (e.g., '_x8j4k2m9p')
Example

// Create unique ID for dynamically added element
var page = new eLabSDK.Page();
var uniqueId = page.getUniqueID();
var $div = $('<div id="' + uniqueId + '">My Content</div>');
$('body').append($div);

Example

// Use for event handler registration
var page = new eLabSDK.Page();
var handlerId = page.getUniqueID();
$('#container').on('click.' + handlerId, '.item', function() {
  console.log('Item clicked');
});

Example

// Generate multiple unique IDs
var page = new eLabSDK.Page();
for (var i = 0; i < 5; i++) {
  var id = page.getUniqueID();
  console.log('Generated ID ' + (i+1) + ': ' + id);
}

addButton(btn)

Add a custom button to the top navigation bar of the page.

Kind: global function

Param	Type	Description
btn	`eLabSDK.GUI.Button`	An eLabSDK.GUI.Button instance to add to the navigation

Example

// Add custom export button to page navigation
eLabSDK.ready(function() {
  var exportBtn = new eLabSDK.GUI.Button({
    label: 'Export Data',
    icon: 'fa-download',
    type: 'success',
    action: function() {
      exportCurrentPageData();
    }
  });
  
  var page = new eLabSDK.Page();
  page.addButton(exportBtn);
});

Example

// Add multiple buttons to navigation
eLabSDK.ready(function() {
  var page = new eLabSDK.Page();
  
  var button1 = new eLabSDK.GUI.Button({
    label: 'Quick Action',
    icon: 'fa-bolt'
  });
  
  var button2 = new eLabSDK.GUI.Button({
    label: 'Settings',
    icon: 'fa-cog'
  });
  
  page.addButton(button1);
  page.addButton(button2);
});

Example

// Add button with counter
eLabSDK.ready(function() {
  var notificationBtn = new eLabSDK.GUI.Button({
    label: 'Alerts',
    icon: 'fa-bell',
    type: 'warning'
  });
  notificationBtn.addCounter({
    source: '/api/v1/notifications/count'
  });
  
  var page = new eLabSDK.Page();
  page.addButton(notificationBtn);
});

showToast(config)

Display a toast notification message to the user.

Kind: global function

Param	Type	Default	Description
config	`Object`		Configuration object for the toast message
config.message	`string`		The message text to display in the toast
[config.duplicates]	`boolean`	`false`	Whether to allow duplicate toast messages to appear simultaneously
[config.autoclose]	`number`	`7500`	Time in milliseconds before the toast auto-closes (default: 7.5 seconds)
[config.onClose]	`function`		Optional callback function to execute when the toast closes

Example

// Show simple success message
var page = new eLabSDK.Page();
page.showToast({
  message: 'Data saved successfully!'
});

Example

// Show message with custom timeout
var page = new eLabSDK.Page();
page.showToast({
  message: 'Processing your request...',
  autoclose: 3000  // Close after 3 seconds
});

Example

// Show toast with callback
var page = new eLabSDK.Page();
page.showToast({
  message: 'Operation completed',
  autoclose: 2000,
  onClose: function() {
    console.log('Toast closed');
    refreshPageData();
  }
});

Example

// Allow duplicate messages
var page = new eLabSDK.Page();
page.showToast({
  message: 'Item added to cart',
  duplicates: true,  // Allow multiple "Item added" toasts
  autoclose: 2000
});

Example

// Show error message that stays longer
var page = new eLabSDK.Page();
page.showToast({
  message: 'Error: Failed to save changes. Please try again.',
  autoclose: 10000  // Stay visible for 10 seconds
});

clearTopMenu()

Hide all items in the top personal menu.

Kind: global function
Example

// Hide top menu for kiosk mode
eLabSDK.ready(function() {
  var page = new eLabSDK.Page();
  page.clearTopMenu();
  console.log('Kiosk mode enabled - top menu hidden');
});

Example

// Create focused data entry environment
eLabSDK.ready(function() {
  var page = new eLabSDK.Page();
  page.clearTopMenu();
  page.clearRibbonMenu({ hideMode: 'display' });
  
  // Add only essential buttons
  var saveBtn = new eLabSDK.GUI.Button({
    label: 'Save & Exit',
    type: 'success',
    action: function() {
      saveAndReturn();
    }
  });
  page.addButton(saveBtn);
});

Example

// Conditional menu hiding for specific users
eLabSDK.ready(function() {
  var user = new eLabSDK.User();
  var role = user.getUserRole();
  
  if (role.role === 'Guest' || role.role === 'Limited') {
    var page = new eLabSDK.Page();
    page.clearTopMenu();
  }
});

clearRibbonMenu(cfg)

Hide ribbon menu items to create a focused interface.

Kind: global function

Param	Type	Description
cfg	`Object`	Configuration object for ribbon menu hiding
cfg.hideMode	`string`	How to hide items: 'display' uses display:none, any other value uses visibility:hidden
[cfg.removeSubRibbon]	`boolean`	If true, also hides the sub-ribbon menu bar

Example

// Hide ribbon menu with display:none
eLabSDK.ready(function() {
  var page = new eLabSDK.Page();
  page.clearRibbonMenu({
    hideMode: 'display'
  });
});

Example

// Hide ribbon menu but preserve layout space
eLabSDK.ready(function() {
  var page = new eLabSDK.Page();
  page.clearRibbonMenu({
    hideMode: 'visibility'
  });
});

Example

// Hide both ribbon and sub-ribbon
eLabSDK.ready(function() {
  var page = new eLabSDK.Page();
  page.clearRibbonMenu({
    hideMode: 'display',
    removeSubRibbon: true
  });
});

Example

// Create minimal interface for focused workflow
eLabSDK.ready(function() {
  var page = new eLabSDK.Page();
  
  // Hide all navigation
  page.clearTopMenu();
  page.clearRibbonMenu({
    hideMode: 'display',
    removeSubRibbon: true
  });
  
  // Add only workflow-specific button
  var completeBtn = new eLabSDK.GUI.Button({
    label: 'Complete Workflow',
    type: 'success',
    action: function() {
      completeWorkflow();
    }
  });
  page.addButton(completeBtn);
});

getPageType()

Determine if the current page is in the admin or members area.

Kind: global function
Returns: string - Either 'admin' or 'members' indicating the page area
Example

// Check page type and customize accordingly
eLabSDK.ready(function() {
  var page = new eLabSDK.Page();
  var pageType = page.getPageType();
  
  if (pageType === 'admin') {
    console.log('On admin page - enabling admin features');
    enableAdminFeatures();
  } else {
    console.log('On members page - standard features');
  }
});

Example

// Conditionally add buttons based on page type
eLabSDK.ready(function() {
  var page = new eLabSDK.Page();
  
  if (page.getPageType() === 'members') {
    var exportBtn = new eLabSDK.GUI.Button({
      label: 'Export Data',
      icon: 'fa-download'
    });
    page.addButton(exportBtn);
  }
});

Example

// Log current page context
eLabSDK.ready(function() {
  var page = new eLabSDK.Page();
  var pageType = page.getPageType();
  console.log('Current page type: ' + pageType);
});

getAdminPageType()

Determine the specific type of admin page currently displayed.

Kind: global function
Returns: string - One of: 'accountManagement', 'systemSettings', or '' (empty string)
Example

// Check admin page type and customize
eLabSDK.ready(function() {
  var page = new eLabSDK.Page();
  var adminType = page.getAdminPageType();
  
  if (adminType === 'accountManagement') {
    console.log('On account management page');
    addAccountManagementFeatures();
  } else if (adminType === 'systemSettings') {
    console.log('On system settings page');
    addSystemSettingsFeatures();
  }
});

Example

// Add page-specific buttons
eLabSDK.ready(function() {
  var page = new eLabSDK.Page();
  var adminType = page.getAdminPageType();
  
  if (adminType === 'systemSettings') {
    var backupBtn = new eLabSDK.GUI.Button({
      label: 'Backup Settings',
      icon: 'fa-save',
      action: function() {
        backupSystemSettings();
      }
    });
    page.addButton(backupBtn);
  }
});

Example

// Conditional feature enablement
eLabSDK.ready(function() {
  var page = new eLabSDK.Page();
  var adminType = page.getAdminPageType();
  
  console.log('Admin page type: ' + (adminType || 'Not admin page'));
});

getCurrentLocation()

Determine the specific type of page currently being viewed.

Kind: global function
Returns: string - A string identifying the page type, or empty string if unrecognized.
Possible return values include: 'sampleList', 'experimentTemplate', 'inventoryBrowser',
'settingPage', 'advancedSampleSearch', 'experimentJournal', 'groupMembers',
'experimentBrowser', 'experimentList', 'storageUnitViewer', 'sampleTypeEdit',
'equipmentViewer', 'editStudy', 'sampleArchive', 'storageUnitEdit', 'oAuthCallback',
'equipmentPage', and more.
Example

// Detect page and customize accordingly
eLabSDK.ready(function() {
  var page = new eLabSDK.Page();
  var location = page.getCurrentLocation();
  
  switch(location) {
    case 'sampleList':
      console.log('On sample list page');
      addSampleListFeatures();
      break;
    case 'experimentBrowser':
      console.log('On experiment browser');
      addExperimentBrowserFeatures();
      break;
    case 'inventoryBrowser':
      console.log('On inventory browser');
      addInventoryFeatures();
      break;
    default:
      console.log('Page type: ' + (location || 'unknown'));
  }
});

Example

// Conditionally add page-specific buttons
eLabSDK.ready(function() {
  var page = new eLabSDK.Page();
  
  if (page.getCurrentLocation() === 'sampleList') {
    var bulkEditBtn = new eLabSDK.GUI.Button({
      label: 'Bulk Edit Samples',
      icon: 'fa-edit',
      action: function() {
        openBulkEditDialog();
      }
    });
    page.addButton(bulkEditBtn);
  }
});

Example

// Track page views
eLabSDK.ready(function() {
  var page = new eLabSDK.Page();
  var location = page.getCurrentLocation();
  
  if (location) {
    trackAnalytics('page_view', { page_type: location });
  }
});

Example

// Enable features for multiple related pages
eLabSDK.ready(function() {
  var page = new eLabSDK.Page();
  var location = page.getCurrentLocation();
  
  var inventoryPages = ['sampleList', 'inventoryBrowser', 'sampleArchive', 'advancedSampleSearch'];
  
  if (inventoryPages.indexOf(location) > -1) {
    console.log('On an inventory page - enabling inventory features');
    enableInventoryCustomizations();
  }
});