VgControlsHidden @Injectable Service

Service to handle when controls are hidden or shown.

The Provider for the Dependency Injection is vg-player.

Methods

state(value:boolean):void

Sets the state of the controls. Hidden is true and shown is false. To change this value will execute the isHidden Observable.

Properties

isHidden :Observable

Returns an Observable that returns a boolean when the controls are shown (false) or hidden (true).

How to use

This is an example of how to use this Service in a Component:

// Imports and @Component() decorator
// This component must be inside VgPlayer
export class MyCustomComponent implements OnDestroy {
    subscriptions: Subscription[] = [];

    constructor(private controlsHidden: VgControlsHidden) {

    }

    // @Output from vg-player component
    onPlayerReady() {
        this.subscriptions.push(this.controlsHidden.isHidden.subscribe(this.onHideControls.bind(this)));
    }

    hideControls() {
        this.hidden.state(true);
    }

    showControls() {
        this.hidden.state(false);
    }

    onHideControls(state:boolean) {
        console.log('Are controls hidden?', state);
    }

    ngOnDestroy() {
        this.subscriptions.forEach(s => s.unsubscribe());
    }
}