Learn about our RFC process, Open RFC meetings & more.Join in the discussion! »

@netcreaties/ngx-smart-banner

1.2.0 • Public • Published

NgxSmartBanner

Angular service for the imlementation of a smart banner to notify your users about your available app.

This package is inspired by smartbannerjs and smart-app-banner

Peer dependencies

Dependency Description
@angular/cdk/platform To determine if the user comes from an android or ios device
ngx-cookie-service Provides a Universal compatible service to get or create cookies

Usage

Add the package as a dependency to your project using:

npm install @netcreaties/ngx-smart-banner
yarn add @netcreaties/ngx-smart-banner

Add the module to your app.module imports:

import { NgxSmartBannerModule } from '@netcreaties/ngx-smart-banner';
...
 
@NgModule({
    imports: [NgxSmartBannerModule],
    ...
})

Import the service in your app.component and initialize with settings

import { NgxSmartBannerService } from '@netcreaties/ngx-smart-banner';
 
 
constructor(
    private readonly ngxSmartBannerServiceNgxSmartBannerService,
    private readonly viewContainerRefViewContainerRef,
) {
    this.ngxSmartBannerService.initialize({
        viewContainerRef: this.viewContainerRef,
        daysHidden: 15,
        daysReminder: 90,
    });
}

Configuration options

The following configuration options are available

Option Default Description
title Smart application Name of your application
author Smartbanner author The company name, for example
price FREE Price in string
priceSuffix.ios - On the App Store Suffix that should be added after price
priceSuffix.andorid - In Google Play Suffix that should be added after price
icon.ios Icon url for IOS devices, can be relative or absolute
icon.android Icon url for android devices, can be relative or absolute
closeLabel Close Label for close button
buttonLabel VIEW Label for the view button
buttonUrl.ios Url to store location ex. https://ios/application-url
buttonUrl.android Url to google play ex. https://android/application-url
enabledPlatforms ['Android', 'IOS'] Platforms to be enabled
viewContainerRef (Required) NULL View container ref the service uses to create the component in
daysHidden NULL Days to hide the smart banner after pressing exit button, null for indefinitely
daysReminder NULL Days to hide the smart banner after pressing the view button, null for indefinitely
rating.ios 5 Star rating on App store (0-5)
rating.android 5 Star rating on play store (0-5)

Service events

Event Description
onOpen Executes when smart banner is created
onClose Executes when smart banner is destroyed

TODO

  • Create demo
  • Add events?

Install

npm i @netcreaties/ngx-smart-banner

DownloadsWeekly Downloads

2

Version

1.2.0

License

MIT

Unpacked Size

278 kB

Total Files

32

Last publish

Collaborators

  • avatar