ngx-bloomsight

A client side angular library to work with bloomsight.io

Badges

Installation

Install using npm by running

npm install @bloomscorp/ngx-bloomsight

Usage/Examples

Configuration

Use the app.module.ts to configure the library.

import {NgxBloomsightModule} from '@bloomscorp/ngx-bloomsight';

@NgModule({
    declarations: [AppComponent],
    imports: [
        BrowserModule,
        AppRoutingModule,
        NgxBloomsightModule.forRoot({
            propertyToken: '65143f755c403e030c222340',
            isDevelopmentMode: true,
            stopAll: false,
            ...
        }),
    ],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule { }

Below is the table with all the possible options that can be configured.

Option	Type	Description	Mandatory	Default
propertyToken	string	bloomsight.io property token	✅	NA
isDevelopmentMode	boolean	if true, then logs data in the browser console	✅	NA
observePageViaWebAPI	boolean	if true, will detect page view event based on web APIs. However, if false, pageViewObserver should be used to trigger page view event	❌	true
stopSimpleEvent	boolean	stops only simple event tracking	❌	false
stopDataEvent	boolean	stops only data event tracking	❌	false
stopPageViewEvent	boolean	stops only page view event tracking	❌	false
stopAll	boolean	stops all event tracking	❌	false
logOnly	boolean	tracks event but doesn't save to database. Should be used only when isDevelopmentMode: true	❌	false

Page View Event

To tracking website visits for your angular application just initialize BloomsightEventService service in app.component.ts.

import {BloomsightEventService} from '@bloomscorp/ngx-bloomsight';

constructor(public bloomsightService: BloomsightEventService) { }

Simple Event

Use the resolveSimpleEvent method to log simple events

import {BloomsightEventService} from '@bloomscorp/ngx-bloomsight';

constructor(public bloomsightService: BloomsightEventService) { }

this.bloomsightService
    .resolveSimpleEvent('65d735b122354c8ba6a489c2', 'Contact Us CTA button');

Option	Type	Description	Mandatory	Default
eventToken	string	Id of simple event	✅	NA
label	string	a label/name for the event for future reference	❌	''

Data Event

Use the resolveDataEvent method to log data events

import {BloomsightEventService} from '@bloomscorp/ngx-bloomsight';

constructor(public bloomsightService: BloomsightEventService) { }

this.bloomsightService.resolveDataEvent(
    '66d735b122355c8ba6a456f8', 
    {
        productId: 120,
        sku: 'PROD021298'
    },
    'Add to Wishlist CTA button'
);

Option	Type	Description	Mandatory	Default
eventToken	string	Id of data event	✅	NA
eventData	Object	additional metadata in key, value format	✅	NA
label	string	a label/name for the event for future reference	❌	''

Send Email

Use sendEmail method to send email

import {BloomsightMailService} from '@bloomscorp/ngx-bloomsight';

constructor(public bloomsightMailService: BloomsightMailService) { }

this.bloomsightMailService.sendEmail(
  '66d735b122355c8ba6a456f8', 
  '63d735h822355s6ba6a4556k',
  '61d895h922355b6ba6a4587a',
  ...
)

Option	Type	Description	Mandatory	Default
engineId	string	Id of the engine that will be used to send email	✅	NA
templateId	string	Id of the email template that will be used as email body	✅	NA
templateOwnerId	string	Id of the user who has created the template	✅	NA
emailMetaData	FormData	attachment & variables used in the template & their respective values in key, value format	✅	NA
onSuccess	function	pass a function to trigger on successfully sending email	✅	NA
onError	function	pass a function to trigger when an error occurs	✅	NA

License

MIT

Support

Report issues or feature requests here