@adapt-retail/adapt-event

Dispatch events eventa to adapt and other.

Usage no npm install needed!

<script type="module">
  import adaptRetailAdaptEvent from 'https://cdn.skypack.dev/@adapt-retail/adapt-event';
</script>

README

@adapt-retail/adapt-data

⚠️ This package has not been released as a stable release, and changes may occur.

Easy dispatching of events in Adapt Retail.

Install

npm install @adapt-retail/adapt-event

Usage

The event class will help you dispatch events in Adapt Retail. You can use it to track whatever event you like, but we got some preconfigured events for you.

Import to project

When installed, simply import the package with normal node syntax.

// EcmaScript6 and up
import AdaptEvent from '@adapt-retail/adapt-event';

Dispatching events

/*
 * @param event
 * @param description (optional)
 * @param position (optional)
 * 
 * @return void
 */
AdaptEvent.dispatch( 'Event name', 'Description' );

If you dispatching an MouseEvent, add the event as the third parameter to track where the click occur.

var logo = document.querySelector( '.logo' );

logo.addEventListener( 'click', function( event ) {
    AdaptEvent.dispatch( 'click', 'on-logo', event );
} );

Plugins

It is possible to extend the functionality of the AdaptEvent using plugins. This could be f.eks. extending the event to match other display networks, such as Google Double Click and AdForm.

Read how to build your own in the documentation

AdaptEvent.addPlugin( new Plugin );

Default plugins

We are also including some default plugins to make your life easier.

Read more in the documentation

// Import and add plugin
import {
    AdaptEvent,
    AdaptClickEvent,
    AdaptGoogleAnalythics
} from '@adapt-retail/adapt-event';

AdaptEvent.addPlugin( new AdaptClickEvent );
AdaptEvent.addPlugin( new AdaptGoogleAnalythics );


// Track a click 
document.querySelector( '.logo' ).adaptClick( function( event ) {
    ...
}, 'a-click', 'logo' );

// Track click and navigate to url
document.querySelector( '.logo' )
    .adaptClickAndNavigate( 'https://adaptretail.com', 'navigate', 'from-logo' );

Development

# Install dependencies
npm install

# Run test suit
npm run test

# Run test suite on file change
npm run tdd