qipp-services-dialog

General

The dialog module includes the lightbox factory, the flashMessage provider and the dialog provider.

Install

npm i qipp-services-dialog

Angular usage

lightbox factory

The lighbox factory relies on blueimp Gallery which also relies on jQuery. Therefore these dependencies must be installed in your application and fully available in the window object.

This factory extends blueimp Gallery with a textFactory. Two arguments are expected, an object with templateUrl and scope properties, and a callback.

dialog provider

The dialog provider relies on the lightbox factory. It generates a dialog modal which expects a given scope, a template URL and some options:

// In this example we are using the helper module:
dialog($scope, helper.template('language-select'))

Note that events are broadcasted when the dialog is currently being closed and has been closed (respectively the dialogclose and dialogclosed events):

scope.$on('dialogclosed', function () {
    // Do something.
})

flashMessage provider

The flashMessage provider is base upon the dialog one. Four arguments could be provided to configure this modal: message, type, delay, hideDelay. Only the first argument is mandatory. Three types of modal are defined: info (default one), succes and error.

$scope.info = 'test'
flashMessage($scope.info, 'success', false, 7000)

Note that the hideDelay argument could be set to minus one in order to make the modal never disappear.

Tools

Linting with StandardJS

Please refer to the JavaScript Standard Style for general rules.

npm run lint

Unit testing with Karma

npm test

Requirements

Angular

• angular 1.4.3
• blueimp-gallery 2.15.2
• jQuery 2.1.4

Qipp modules

• qipp-services-helper 1.0.0
• qipp-services-template 0.1.0

Licence

Released under the MIT license by qipp.