<commit_before># Angular Page Visibility

## Getting started
First, install it.

```bash
npm install angular-page-visibility --save
```

Then, import it into your `@NgModule`:

```bash
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AngularPageVisibilityModule } from 'angular-page-visibility';
import { AppComponent } from './app.component';

@NgModule( {
    declarations : [
        AppComponent
    ],
    imports : [
        BrowserModule,
        AngularPageVisibilityModule
    ],
    providers : [],
    bootstrap : [ AppComponent ]
} )
export class AppModule {
}
```

Then, use it in your component :

```bash
import { Component, OnDestroy, Inject, OnInit } from '@angular/core';
import { PageVisibilityService } from 'angular-page-visibility';
import { Subscription } from 'rxjs/Subscription';

@Component( {
    selector : 'app-root',
    templateUrl : './app.component.html',
    styleUrls : [ './app.component.scss' ]
} )
export class AppComponent implements OnDestroy, OnInit {
    private onPageVisibleSubscription: Subscription;
    private onPageNotVisibleSubscription: Subscription;
    private onPageVisibilityChangeSubscription: Subscription;
    title = 'app';

    constructor( private pageVisibilityService: PageVisibilityService ) {
    }

    ngOnInit(): void {
        this.onPageVisibleSubscription = this.pageVisibilityService.$onPageVisible.subscribe( ()=> {
            console.log( 'visible' );
        } );

        this.onPageNotVisibleSubscription = this.pageVisibilityService.$onPageNotVisible.subscribe( ()=> {
            console.log( 'notVisible' );
        } );

        this.onPageVisibilityChangeSubscription = this.pageVisibilityService.$onPageVisibilityChange.subscribe( () => {
            console.log( 'visibilityChange' );
            if ( this.pageVisibilityService.isPageVisible() ) {
                console.log( 'visible' );
            }
            if ( this.pageVisibilityService.isPageNotVisible() ) {
                console.log( 'notVisible' );
            }
        } );
    }

    ngOnDestroy(): void {
        this.onPageVisibleSubscription.unsubscribe();
        this.onPageNotVisibleSubscription.unsubscribe();
        this.onPageVisibilityChangeSubscription.unsubscribe();
    }
}

```

## For any questions, suggestions, or feature requests
[Please file an issue](https://github.com/olivierlsc/angular-page-visibility/issues)!<commit_msg>Update README with feature #1<commit_after># Angular Page Visibility

## Getting started
First, install it.

```bash
npm install angular-page-visibility --save
```

Then, import it into your `@NgModule`:

```bash
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AngularPageVisibilityModule } from 'angular-page-visibility';
import { AppComponent } from './app.component';

@NgModule( {
    declarations : [
        AppComponent
    ],
    imports : [
        BrowserModule,
        AngularPageVisibilityModule
    ],
    providers : [],
    bootstrap : [ AppComponent ]
} )
export class AppModule {
}
```

Then, use it in your component :

```bash
import { Component, OnDestroy, Inject, OnInit } from '@angular/core';
import { PageVisibilityService } from "angular-page-visibility";
import { Subscription } from "rxjs/Subscription";

@Component( {
    selector : 'app-root',
    templateUrl : './app.component.html',
    styleUrls : [ './app.component.scss' ]
} )
export class AppComponent implements OnDestroy, OnInit {
    private onPageVisibleSubscription: Subscription;
    private onPageNotVisibleSubscription: Subscription;
    private onPageVisibilityChangeSubscription: Subscription;
    title = 'app';

    constructor( private pageVisibilityService: PageVisibilityService ) {

    }


    ngOnInit(): void {
        console.log( 'OnInit' );
        if ( this.pageVisibilityService.isPageVisible() ) {
            console.log( 'visible' );
        }
        if ( this.pageVisibilityService.isPageNotVisible() ) {
            console.log( 'notVisible' );
        }
        this.onPageVisibleSubscription = this.pageVisibilityService.$onPageVisible.subscribe( ()=> {
            console.log( 'visible' );
        } );

        this.onPageNotVisibleSubscription = this.pageVisibilityService.$onPageNotVisible.subscribe( ()=> {
            console.log( 'notVisible' );
        } );

        this.onPageVisibilityChangeSubscription = this.pageVisibilityService.$onPageVisibilityChange.subscribe( ( isPageVisible: boolean ) => {
            console.log( 'visibilityChange' );
            if ( isPageVisible ) {
                console.log( 'visible' );
            } else {
                console.log( 'notVisible' );
            }
        } );
    }

    ngOnDestroy(): void {
        this.onPageVisibleSubscription.unsubscribe();
        this.onPageNotVisibleSubscription.unsubscribe();
        this.onPageVisibilityChangeSubscription.unsubscribe();
    }
}

```

## For any questions, suggestions, or feature requests
[Please file an issue](https://github.com/olivierlsc/angular-page-visibility/issues)!
{'fraction_non_alphanumeric': 0.11881573821581613, 'fraction_numerical': 0.00019477989871445267, 'mean_word_length': 3.11128903122498, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 9, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4833652', 'n_tokens_mistral': 1406, 'n_tokens_neox': 1375, 'n_words': 288}