Socket
Socket
Sign inDemoInstall

@palmabit/angular-cookie-law

Package Overview
Dependencies
0
Maintainers
6
Versions
7
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

    @palmabit/angular-cookie-law

Angular module that provides a banner to inform users about cookie law


Version published
Maintainers
6
Install size
29.8 kB
Created

Readme

Source

Angular cookie law provides:

  • a directive for a popup banner that informs users about cookies
  • a directive that blocks some code or another directive until cookies are accepted
  • a service to block external services (eg. YouTube, Facebook) until cookies are accepted

Install

You can install this package with npm.

npm
npm i @palmabit/angular-cookie-law --save

Add a <script> and <style> to your index.html:

<link rel="stylesheet" href="/node_modules/angular-cookie-law/dist/angular-cookie-law.min.css">

<script src="/node_modules/angular-cookie-law/dist/angular-cookie-law.min.js"></script>

Usage

First, you need to inject angular-cookie-law into your angular module.

angular.module('myApp', ['angular-cookie-law']);

CookieLawBanner directive

You could insert this directive at the beginning of <body> tag.

<cookie-law-banner position="top" message="Your custom message" policy-url="http://link-to-your-policy"></cookie-law-banner>

This directive creates a banner that informs users about cookies that contains a button to accept them.

Options

From version 0.2.0, all banner texts are refreshed if one of these attributes change: message, acceptText, declineText, policyText, policyURL.

position
position: 'top'

Position of the banner (variants: "top", "bottom". default: "top").

message
message: 'Your custom message'

The message to be shown with banner (default: "We use cookies to track usage and preferences").

acceptButton
acceptButton: true

Show or hide accept button (default: true).

acceptText
acceptText: 'Your custom text'

The text for accept button (default: "I Understand").

declineButton
declineButton: false

Show or hide decline button (default: false).

declineText
declineText: 'Your custom text'

The text for decline button (default: "Disable Cookies").

policyButton
policyButton: false

Show or hide policy link button (default: false).

policyText
policyText: 'Your custom text'

The text for policy link button (default: "Privacy Policy").

policyURL
policyURL: '/privacy-policy/'

The URL to show privacy policy (default: "/privacy-policy/").

policyBlank
policyBlank: false

Set true to open privacy policy page in other tab (default: false).

expireDays
expireDays: 365

Days number for the accept cookie expiration (default: 365).

element
element: 'body'

Element to append/prepend cookieBar to. Remember . for class or # for id. (default: "body").

CookieLawWait directive

<cookie-law-wait>
    <div>...</div>
</cookie-law-wait>

The divs inside <cookie-law-wait> directive is loaded only after cookies are accepted.

CookieLawService

This service provides a function to know if cookies are accepted.

First, you need to inject CookieLawService into your angular controller or directive.

angular.module('myApp').controller('MyCtrl', ['CookieLawService']);
isEnabled

This function tells you if cookies are accepted.

CookieLawService.isEnabled(); //true or false

Events

Accept event

The event cookieLaw.accept is triggered when cookies are accepted.

$scope.$on('cookieLaw.accept', function() {
    //callback function
});
Dismiss event

The event cookieLaw.dismiss is triggered when cookies banner is closed.

$scope.$on('cookieLaw.dismiss', function() {
    //callback function
});
Decline event

The event cookieLaw.decline is triggered when cookies are declined.

$scope.$on('cookieLaw.decline', function() {
    //callback function
});

To change the name of the cookie, simply add the following line to your code.

angular.module('angular-cookie-law').value('cookieLawName', 'cookieMessage');

Author

palmabit.com

License

The MIT License (MIT). Please see License File for more information.

Keywords

FAQs

Last updated on 30 Nov 2018

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc