Nose Picker's Maven

    angular-window-events

    1.1.6 • Public • Published

    angular-window-events

    npm version Build Status js-standard-style

    Easy window event handling! Support focus, blur, show, and hide.

    • Support for $broadcasting of events.
    • A windowState service for tracking state and adding event handlers.
    • Support for show and hide for browsers that support the W3C Page Visibility spec.
    • Support for IE9 and up. IE10 if you want show and hide support.

    Usage Example

    angular
      .module('myApp', [
        'window-events'
      ])
     
      .controller('MyCtrl', function ($scope, windowState) {
        if (windowState.isShowing) alert('Hello!')
     
        var deregisterHide = windowState.on('hide', function (event, eventType) {
          alert('No, please look at me!')
        })
     
        windowState.on('show', function (event, eventType) {
          alert('Oh, you left? I had not noticed.')
          deregisterHide()
        })
     
        $scope.$on('windowBlur', function (event, eventType) {
          alert('Pay attention; I need your focus.')
        })
      })

    Quick Guide

    Installation

    $ npm install angular-window-events

    Or download from master/release

    Event Handling

    windowState Service

    Methods
    .controller('myCtrl', function (windowState) {
      function eventHandler (event, eventType) {
        // Do things
      }
     
      windowState.on('focus', eventHandler)
      // Returns deregistration function. Calling it is the same as...
      windowState.off('focus', eventHandler)
      // Or, to remove all handlers for an eventType...
      windowState.off('focus')
     
      // Multiple event types can also be passed at once
      windowState.on('blur focus hide show', eventHandler)
      // As with the `off` method
      windowState.off('blur focus hide show', eventHandler)
    })
    Properties
    windowState.hasVisibilitySupport // => boolean
    windowState.isShowing // => boolean
    windowState.isHidden // => boolean
    windowState.isFocused // => boolean
    windowState.isBlurred // => boolean

    $scope.$on

    You can also use the $scope.$on method to attach event handlers. When using $scope.$on, the window events are broadcast under the following names:

    • windowBlur
    • windowFocus
    • windowHide
    • windowShow
    $scope.$on('windowHide', function (event, eventType) {
      // Do things
    })

    Install

    npm i angular-window-events

    DownloadsWeekly Downloads

    1

    Version

    1.1.6

    License

    MIT

    Last publish

    Collaborators

    • shaungrady