Skip to content
🚧 Create an invisible perimeter around an element and respond when its breached.
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
projects
.editorconfig
.gitignore
LICENSE
README.md
angular.json
package.json
tsconfig.json
tslint.json
yarn.lock

README.md

ngx-perimeter

license

Table of Contents

Problem

In our applications, we download javascript files or call an API etc after the user acts, like click, tab etc. Due to which we show the loading state after the user interaction.

Solution

The ngx-perimeter solves this by giving you infortion about user interaction before user even interacts with it. By using this project, based on the mouse movements (Desktop Applicaiton), if the mouse is near a element by some distance (input: padding), you get a notification using a event (breach) to act before the user acts.

You can also use the PerimeterStrategy to load routes if the user is near the route. Check @ngx-perimeter/strategy.

Install

Install and manage the ngx-perimeter using NPM. You may use yarn or npm.

npm install @ngx-perimeter/core --save

or

yarn add @ngx-perimeter/core

Usage

NgModule

Import the PerimeterModule in the NgModule and declare them in the "imports".

  • Step 1:
import { PerimeterModule } from '@ngx-perimeter/core';

@NgModule({
  imports: [
    PerimeterModule
  ]
})
  • Step 2: Use the ngxPerimeter directive
<button
  ngxPerimeter
  padding="50"
  (breach)="onBreach()"
>
  Button
</button>

Contribute

Please contribute by creating issues/PRs

License

© 2019 ngx-perimeter. All Rights Reserved.

You can’t perform that action at this time.