Test and measurement

Resource Picker `<smart-resource-picker>`

ResourcePicker selects an instrument or a channel: it lists the resources the application has found, grouped by interface and named by alias, filters them as text is typed, and reads a typed resource string before it is accepted.

JavaScript TypeScript Angular React Vue Blazor

<smart-resource-picker> · 10 properties, 5 methods, 4 events · source/modules/smart.resourcepicker.js

Usage in Angular

The Angular wrapper is ResourcePickerComponent from ResourcePickerModule: every property is an input, every event an output named on<Event>, and the methods are called on the component reference from @ViewChild. A method that returns a value returns a Promise of it, resolved once the component has rendered; its ...Sync() twin returns the value at once, or null before the component has rendered. Unknown bindings are rejected at compile time.

import { ResourcePickerModule, ResourcePickerComponent } from 'smart-industrial/angular/resourcepicker';

<smart-resource-picker #resourcePicker [value]="'GPIB0::16::INSTR'"
    (onRefreshRequest)="onRefreshRequest($event)"></smart-resource-picker>

@ViewChild('resourcePicker', { read: ResourcePickerComponent }) resourcePicker!: ResourcePickerComponent;
// methods are called on the component reference
this.resourcePicker.open();

Properties

Input	Type, default	Description
`[resources]` resources	array	Sets or retrieves the resources found. Each is an object with name (the resource string), alias, description, kind (gpib, tcpip, usb, serial, pxi, daq or other; worked out from the name when absent), available and an optional id. A plain string is taken as a resource name; null and anything else that is not an object is skipped, with one console warning per list.
`[value]` value	string	Sets or retrieves the resource string in force.
`[kinds]` kinds	array	Sets or retrieves the kinds listed. Empty lists every kind.
`[allowCustom]` allowCustom	boolean false	Accepts a typed resource the list does not have, once it parses as a resource name.
`[availableOnly]` availableOnly	boolean false	Lists only the resources that are available.
`[refreshable]` refreshable	boolean true	Shows the refresh button, which raises refreshRequest.
`[busy]` busy	boolean false	Shows discovery in progress: the refresh button waits and the empty list says so. The application sets it while it searches.
`[label]` label	string	Sets or retrieves the label above the field, which also names the combobox.
`[placeholder]` placeholder	string	Sets or retrieves the text shown when nothing is selected. Empty uses the localized default.
`[readonly]` readonly	boolean false	Shows the value without allowing a change.

Methods

Method	Description
`open(): void`	Opens the list.
`close(): void`	Closes the list and shows the value again.
`select(name: string): void`	Selects a resource by name and raises change. A name the list does not have is taken only when custom entries are allowed and it parses; otherwise the hint says so. `name` string The resource string or id.
`parse(name: any): Promise<any>` and `parseSync(name: any): any` static: `customElements.get('smart-resource-picker').parse(…)`; the wrapper's method of this name calls the element and fails	Also available as a static method of the class. Reads a resource string into its parts by the VISA resource syntax (IVI VPP-4.3): { kind, interface, ... } with the fields of its kind - board, address (0 to 30) and secondary (0 to 30, or 96 to 126 as the bus code some tools write; reported as written) for GPIB; board, host, addressType (ipv4, ipv6 or hostname), device, port, socket and protocol (vxi-11, hislip or socket) for LAN, where the host is an IPv4 address of four octets 0 to 255, an RFC 1123 host name or an IPv6 address - in brackets as VISA writes it (TCPIP0::[fe80::1]::inst0::INSTR), or bare where that is unambiguous, and the port is 0 to 65535; vendor, product (0 to 0xFFFF), serial and interfaceNumber for USB; board and port for serial (ASRL3, ASRLCOM3, and device paths such as ASRL/dev/ttyUSB0, whose board is null); board, bus (0 to 255), device (0 to 31), function (0 to 7), chassis and slot for PXI, from any of its three forms - PXI[bus]::device[::function], PXI[interface]::[bus-]device[.function] and PXI[interface]::CHASSISn::SLOTn[::FUNCn] - where only the last names a slot and the others give slot null, since a PCI device number is not a slot; device, channelType, channel and channelEnd for DAQ. The trailing ::INSTR may be left out, as the syntax allows. Text that is not a resource, including one that breaks these ranges (GPIB0::31::INSTR, TCPIP0::999.1.1.1::INSTR, PXI0::2::11::INSTR), is { kind: "other", name, reason } with reason the rule it broke in English, or null; empty text is null. `name` string The resource string.
`isValid(name: any): Promise<any>` and `isValidSync(name: any): boolean` static: `customElements.get('smart-resource-picker').isValid(…)`; the wrapper's method of this name calls the element and fails	Also available as a static method of the class. True for a name the picker recognises as a resource: one that parse() reads as a kind other than "other", within the VISA ranges. `name` string The resource string.

Events

The data of an event is in event.detail. change reports a resource the resource picker has already set as value, and open and close report its list opening and closing; while readonly is true the list stays closed. refreshRequest is a request: the picker raises it only while busy is false and shows the new list when the application sets resources.

Output	Description and detail
`(onChange)` change	This event is triggered when a resource is selected from the list or typed and accepted. `value` string The resource string. `previousValue` string The one before. `resource` object The entry of the list, or null for a typed resource. `parsed` object The parts of the name, as parse() reads them.
`(onRefreshRequest)` refreshRequest	This event is triggered when the refresh button is pressed. The application performs the discovery, sets busy while it runs and assigns the resources it found.
`(onOpen)` open	This event is triggered when the list opens.
`(onClose)` close	This event is triggered when the list closes.

CSS variables

The component declares 4 CSS variables; the CSS page shows how to set them.

--smart-resource-height --smart-resource-background --smart-resource-border --smart-resource-list-background