npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

qipp-services-helper

v1.1.1

Published

Helper service for Angular application.

Downloads

5

Readme

qipp-services-helper Build Status npm version

General

The helper provider is toolbox of several methods.

Install

npm i qipp-services-helper

Angular usage

One first important step is to create a configuration module for your application that will be used as a hash table for the service, out of a constant definition:

;(function () {
    'use strict'

    angular
        .module('myConfig', [])
        .constant('config', {
            controllers: {},
            domain: '',
            domainSpecificTemplates: {},
            routePrefix: '/',
            templates: {},
            templatePrefix: '/static/templates/',
            templateSuffix: '.html',
            urls: {}
        })

}())

Note that these settings are mandatory.

A default parameter must be set in the config phase of your angular application:

helperProvider.defaults.module = 'config'

config method

Use the config() method to access keys from your configuration module:

helper.config('someKey')

param method

The param() method is internally used by the url() one. It serializes a given object by creating a string of url parameters:

var obj = {
    keyA: valueA,
    keyB: valueB
}
helper.param(obj) // 'keyA=valueA&keyB=valueB'

localize method

The localize() method returns the translated value of its first argument. The second argument should be an object of keys/values used for parameters injection. The last argument should be a boolean that, if true, will allow HTML in the first argument:

// Examples with locale set to be 'fr_FR'.
helper.localize('Hello')                           // 'Bonjour'
helper.localize('Hello {name}!', {name: 'Fabian'}) // 'Bonjour Fabian'
helper.localize('<h1>Hello</h1>', null, true)      // '<h1>Bonjour</h1>'

url method

The url() method returns the URL, which is set in your configuration module, for a given id (parsing the urls object) passed as first argument. The second argument should be parameters to be replaced in the url. The third one should be a boolean, set to true, in order to return an absolute URL:

// Your configuration module:
;(function () {
    'use strict'

    angular
        .module('myConfig', [])
        .constant('config', {
            urls: {
                'fr_FR': {
                    'localeUrl': '/localized/path'
                },
                'specialUrl': '/special/path',
                'paramUrl': '/path/with/:param'
            }
        })

}())
var params = {
    param: 'test',
    paramA: 123,
    paramB: 456
}
helper.url('specialUrl')              // '/special/path'
helper.url('paramUrl', params)        // '/path/with/test?paramA=123&paramB=456'
helper.url('paramUrl', {paramA: 123}) // '/path/with?paramA=123'
helper.url('/test', '', true)         // 'http://app.qipp.com/test'
helper.url('localeUrl')               // '/localized/path'

template method

The template() method returns a template URL for a given template id, regarding to your configuration module:

// Your configuration module example:
;(function () {
    'use strict'

    angular
        .module('myConfig', [])
        .constant('config', {
            templatePrefix: '/templates/',
            templateSuffix: '.html'
        })

}())
helper.template('test')       // '/templates/test.html'
helper.template('things/:id') // '/templates/things/show.html'

setHeader method

The setHeader() method could be used in order to set the $rootScope.header property to a given header name:

helper.setHeader('test')

setFooter method

The setFooter() method could be used in order to set the $rootScope.footer property to a given footer name:

helper.setFooter('test')

setTemplateId method

The setTemplateId() method could be used in order to expose the template route as an id in the $rootScope and hence for setting a CSS id:

helper.setTemplateId({id: '123'}); // $rootScope.templateId === '_123'

setTemplateClass method

The setTemplateClass() method could be used in order to expose the template route as a class in the $rootScope and hence for setting a CSS class:

helper.setTemplateClass({id: 'i987/abc'}) // $rootScope.templateClass === 'i987'

isMobile method

The isMobile() method returns a boolean if the browser is mobile or not:

helper.isMobile()

isValidDate

The isValidDate() method returns a boolean set to true for valid dates:

helper.isValidDate(new Date())             // true
helper.isValidDate(new Date('2013-13-13')) // false

getDate method

The getDate() method returns a date formated regarding to the second and third boolean arguments which are respectively the local time and midnight:

helper.getDate(new Date())             // return the date
helper.getDate(new Date(), true)       // return the date - local time
helper.getDate(new Date(), false)      // return the date - universal time
helper.getDate(new Date(), true, true) // return the date - hour set to midnight

getNextDate method

The getNextDate() method returns the next date by computing the provided date as first argument with a given interval as second argument. Interval could be once, daily, biweekly, monthly, yearly:

helper.getNextDate(new Date())             // return the date
helper.getNextDate(new Date(), 'biweekly') // return the date + two weeks

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

Qipp modules

Licence

Released under the MIT license by qipp.