eLabSDK.Page.Storage
Functions
| Name | Description |
|---|---|
| addSection(sectionTitle, content) | Add a custom content section to storage unit or equipment detail pages. |
This creates a new collapsible table section on storage unit or equipment viewer pages.
The section includes a header with the specified title and a content area with custom HTML.
Returns an object with helper methods to manipulate the section (setTitle, setContent,
showProgress, hideProgress) or null if not on a compatible page. The section is automatically
positioned after equipment specifications. Use this to display custom information, integration
data, or additional functionality related to the storage unit or equipment.
addTopNotice(noticeToAdd) | Add a warning or informational notice to the top of storage unit or equipment pages.
This displays a prominent notice banner at the top of storage unit or equipment view/edit
pages. The notice can include an icon and custom HTML content, styled with warning colors
to draw attention. Useful for displaying important information, warnings, maintenance alerts,
or contextual help. The notice is only added once (checked by ID) to prevent duplicates.
ready(fn) | Execute a callback when the storage/equipment page is fully loaded and ready.
This ensures your callback is executed only after the storage unit or equipment page has
finished initializing and is ready for interaction. If the page is already loaded when this
is called, the callback executes immediately. Otherwise, it waits for the page initialization
event. Use this to ensure page elements exist before attempting to manipulate them or add
custom functionality.
addActionToStorageDetail(btnConfig) | Add a custom action button to storage unit or equipment detail pages.
This adds a custom button to the action toolbar on storage unit or equipment detail pages.
The button appears in the top toolbar alongside standard actions like "Edit", "Delete", etc.
Use this to add custom operations related to storage units or equipment, such as custom
exports, integrations, or specialized actions.
addSection(sectionTitle, content)
Add a custom content section to storage unit or equipment detail pages.
This creates a new collapsible table section on storage unit or equipment viewer pages.
The section includes a header with the specified title and a content area with custom HTML.
Returns an object with helper methods to manipulate the section (setTitle, setContent,
showProgress, hideProgress) or null if not on a compatible page. The section is automatically
positioned after equipment specifications. Use this to display custom information, integration
data, or additional functionality related to the storage unit or equipment.
Kind: global function
Returns: Object ⎮ null - Section controller object with helper methods, or null if page type incompatiblestring - returns.id - The unique ID assigned to this sectionfunction - returns.setTitle - Update section title: setTitle(newTitle)function - returns.setContent - Update section content: setContent(newContent, asHTML)function - returns.showProgress - Display progress indicator: showProgress(message)function - returns.hideProgress - Hide progress indicator
| Param | Type | Description |
|---|---|---|
| sectionTitle | string | The title text to display in the section header |
| content | string | HTML content to display in the section body |
Example
// Add custom analytics section to storage unit
eLabSDK.ready(function() {
var storagePage = new eLabSDK.Page.Storage();
storagePage.ready(function() {
var section = storagePage.addSection(
'Usage Analytics',
'<p>Loading analytics data...</p>'
);
if (section) {
// Show loading
section.showProgress('Loading data...');
// Load data
$.get('/api/v1/storage/analytics/123', function(data) {
section.hideProgress();
section.setContent(
'<p>Capacity: ' + data.capacity + '%</p>' +
'<p>Last accessed: ' + data.lastAccess + '</p>',
true
);
});
}
});
});
Example
// Add integration section with dynamic updates
eLabSDK.ready(function() {
var storagePage = new eLabSDK.Page.Storage();
storagePage.ready(function() {
var section = storagePage.addSection(
'LIMS Integration',
'<div id="limsStatus">Checking connection...</div>'
);
if (section) {
checkLIMSConnection(function(status) {
if (status.connected) {
section.setContent(
'<p style="color:green;">✓ Connected to LIMS</p>' +
'<p>Last sync: ' + status.lastSync + '</p>',
true
);
} else {
section.setTitle('LIMS Integration (Disconnected)');
section.setContent(
'<p style="color:red;">✗ Connection failed</p>',
true
);
}
});
}
});
});
Example
// Add section with updateable content
eLabSDK.ready(function() {
var storagePage = new eLabSDK.Page.Storage();
storagePage.ready(function() {
var section = storagePage.addSection('Temperature Log', '');
if (section) {
// Update every 30 seconds
setInterval(function() {
section.showProgress('Updating...');
$.get('/api/v1/temperature/current', function(temp) {
section.hideProgress();
section.setContent(
'Current Temperature: ' + temp + '°C',
false
);
});
}, 30000);
}
});
});
addTopNotice(noticeToAdd)
Add a warning or informational notice to the top of storage unit or equipment pages.
This displays a prominent notice banner at the top of storage unit or equipment view/edit
pages. The notice can include an icon and custom HTML content, styled with warning colors
to draw attention. Useful for displaying important information, warnings, maintenance alerts,
or contextual help. The notice is only added once (checked by ID) to prevent duplicates.
Kind: global function
| Param | Type | Description |
|---|---|---|
| noticeToAdd | Object | Configuration object for the notice |
| noticeToAdd.id | string | Unique identifier for the notice (prevents duplicates) |
| noticeToAdd.icon | string | FontAwesome icon class (e.g., 'fas fa-exclamation-circle', 'fas fa-thermometer-half') |
| noticeToAdd.contents | string | HTML content to display in the notice |
Example
// Add temperature warning to freezer page
eLabSDK.ready(function() {
var storagePage = new eLabSDK.Page.Storage();
storagePage.ready(function() {
storagePage.addTopNotice({
id: 'tempWarning',
icon: 'fas fa-thermometer-half',
contents: '<p><strong>Temperature Alert:</strong> Freezer temperature is above threshold.</p>'
});
});
});
Example
// Add maintenance notice
eLabSDK.ready(function() {
var storagePage = new eLabSDK.Page.Storage();
storagePage.ready(function() {
storagePage.addTopNotice({
id: 'maintenanceNotice',
icon: 'fas fa-tools',
contents: '<div>' +
'<strong>Scheduled Maintenance</strong>' +
'<p>This storage unit will be offline for maintenance on Friday, 3:00 PM - 5:00 PM.</p>' +
'</div>'
});
});
});
Example
// Conditional notice based on storage data
eLabSDK.ready(function() {
var storagePage = new eLabSDK.Page.Storage();
storagePage.ready(function() {
$.get('/api/v1/storageunits/123', function(storage) {
if (storage.capacity > 90) {
storagePage.addTopNotice({
id: 'capacityWarning',
icon: 'fas fa-exclamation-triangle',
contents: '<p><strong>High Capacity:</strong> Storage unit is at ' +
storage.capacity + '% capacity. Consider relocating samples.</p>'
});
}
});
});
});
ready(fn)
Execute a callback when the storage/equipment page is fully loaded and ready.
This ensures your callback is executed only after the storage unit or equipment page has
finished initializing and is ready for interaction. If the page is already loaded when this
is called, the callback executes immediately. Otherwise, it waits for the page initialization
event. Use this to ensure page elements exist before attempting to manipulate them or add
custom functionality.
Kind: global function
| Param | Type | Description |
|---|---|---|
| fn | function | Callback function to execute when page is ready |
Example
// Add custom section after page loads
eLabSDK.ready(function() {
var storagePage = new eLabSDK.Page.Storage();
storagePage.ready(function() {
console.log('Storage page is ready');
var section = storagePage.addSection(
'Custom Information',
'<p>Additional storage details...</p>'
);
});
});
Example
// Load external data after page ready
eLabSDK.ready(function() {
var storagePage = new eLabSDK.Page.Storage();
storagePage.ready(function() {
var storageUnitID = getStorageUnitIDFromPage();
$.get('/api/custom/storage/' + storageUnitID, function(data) {
displayCustomData(data);
});
});
});
Example
// Add notice after page loads
eLabSDK.ready(function() {
var storagePage = new eLabSDK.Page.Storage();
storagePage.ready(function() {
storagePage.addTopNotice({
id: 'infoNotice',
icon: 'fas fa-info-circle',
contents: '<p>This storage unit requires special handling.</p>'
});
});
});
addActionToStorageDetail(btnConfig)
Add a custom action button to storage unit or equipment detail pages.
This adds a custom button to the action toolbar on storage unit or equipment detail pages.
The button appears in the top toolbar alongside standard actions like "Edit", "Delete", etc.
Use this to add custom operations related to storage units or equipment, such as custom
exports, integrations, or specialized actions.
Kind: global function
| Param | Type | Description |
|---|---|---|
| btnConfig | Object | Configuration object for the button |
| btnConfig.label | string | The text label to display on the button |
| [btnConfig.id] | string | Optional unique ID for the button element |
| btnConfig.action | function | Callback function to execute when button is clicked |
Example
// Add export button to storage unit page
eLabSDK.ready(function() {
var storagePage = new eLabSDK.Page.Storage();
storagePage.ready(function() {
storagePage.addActionToStorageDetail({
label: 'Export Contents',
id: 'exportStorageBtn',
action: function() {
var storageID = getStorageUnitIDFromPage();
exportStorageContents(storageID);
}
});
});
});
Example
// Add sync button for equipment
eLabSDK.ready(function() {
var storagePage = new eLabSDK.Page.Storage();
storagePage.ready(function() {
storagePage.addActionToStorageDetail({
label: 'Sync to LIMS',
id: 'syncEquipmentBtn',
action: function() {
var equipmentID = getEquipmentIDFromPage();
$.post('/api/lims/sync-equipment', { equipmentID: equipmentID }, function() {
alert('Equipment data synced to LIMS');
});
}
});
});
});
Example
// Add button to generate QR code
eLabSDK.ready(function() {
var storagePage = new eLabSDK.Page.Storage();
storagePage.ready(function() {
storagePage.addActionToStorageDetail({
label: 'Generate QR Code',
action: function() {
var storageID = getStorageUnitIDFromPage();
generateQRCodeForStorage(storageID);
}
});
});
});
© 2023 eLabNext
Updated about 18 hours ago