Manual Control
Findify's Merchant.JS (MJS) library exposes a simple API that you can use to manage widgets, listen for and trigger different events, or utilize external analytics - thus further customizing the look and feel of the Findify integration. The MJS iterates over window.findifyCallbacks
array and injects the findify
object there. You can also access window.findify
when MJS is fully loaded.
To wait until Findify is loaded push your callbacks into
window.findifyCallbacks
array.window.findifyCallbacks = [ (findify) => { ...your code here } ]
Element | Description |
---|---|
findify.analytics | The @findify/analytics instance. It allows for the triggering of events from outside components and listens for them. |
findify.config | The immutable configuration of your store. Use findify.config.toJS() to see it as a normal Javascript object. |
findify.emit | Emit system events, such as 'show mobile facets'. |
findify.listen | Listen for system events. |
findify.invalidate | Invalidates modules cache[only for Devtools]. |
findify.widgets | The collection of methods to create/modify already injected widgets. Read more below. |
Manage Widgets
Attach new widget
window.findify.widgets.attach(selector, type, config)
selector | CSS selector or DOM node where you attach the widget. |
type | The type of widget - autocomplete , recommendation , search , smart-collection . |
config | The configuration which will extend the default configuration for this type of widget eq:{ appendTo: 'body', key: 'test' } . |
Remove Existing Widget
window.findify.widgets.detach(key)
The key
is the unique name of the widget. You can provide it in HTML element by adding data-findify-key="test"
or in config when attaching feature.
Get Widgets by Key
window.findify.widgets.get(key)
You can get a widget by its key. If it was not provided, the increment number will be used.
Find Widgets by Type
window.findify.widgets.findByType(type)
Find all widgets with given type.
Get List of Widgets
window.findify.list()
This function will return an array of widgets on the page, so you can access their agents and send a request.
window.findify.widgets
.list()
.find(widget => widget.type === 'autocomplete').agent
.set('q', 'test query')
.on('suggestions', (list) => {
console.log(list)
})
Updated about 1 year ago