angular-opileak-navbar

Angular component for opileak apps top naviagtion menu

Stats

stars 🌟issues ⚠️updated 🛠created 🐣size 🏋️‍♀️
angular-opileak-navbar
Minified + gzip package size for angular-opileak-navbar in KB

Readme

Angular Opileak Navbar

Barra de navegación superior de las applicaciones de Opileak Toolbox (OTB)

Instalación

Este modulo tiene las siguientes dependencias:

  • angular
  • angular-material
  • angular-opileak-oauth

Para instalar el módulo se usa el siguiente comando

npm install --save 'git+ssh://git@gitlab.dinamicarea.es:opileak-components/angular-opileak-navbar.git#develop'

Configuración

Es posible configurar distintos aspectos del módulo. Para hacerlo, debe usar el opileakNavbarConfigProvider durante la fase de configuracion de su aplicación.

opileakNavbarConfigProvider.configure({
    // Opciones de configuración y sus valores por defecto.
    getAvatarImageLink: (userId) => {
        // Url de destino al hacer click en el avatar del usuario.
        return 'http://inicio.opileak.es';
    },
    getAvatarImageSource: (userId) => {
        // Url fuente de la imagen de avatar del usuario.
        return `http://oauth-api.opileak.es/2/img/user/${userId}`;
    },
    getAppClientLogoSource: (appClientId) => {
        // Url fuente del logo de la aplicación con la id dada.
        return `http://oauth-api.opileak.es/oauth-api/2/img/client/${appClientId}`
    },    
});

ES6 (Webpack, SystemJS, etc)

Para usar este módulo debes incluirlo en tu aplicacion de angular como

import opkNavbar from 'angular-opileak-navbar'

angular.module('app', [
  /* otras dependencias */
  opkNavbar
])

ES5 (Gulp, Grunt, etc)

Si no estas usando ES6 o un empaquetador como webpack asegurate de añadir el script siguiente al html

<script src="node_modules/angular-opileak-navbar/dist/angular-opileak-navbar.min.js" />

Tambien existe un archivo css disponible en dist/angular-opileak-navbar.css

En este caso deberás incluir el modulo a la aplicacion de angular como

angular.module('app',  [
  /* otras dependencias */
  'opileak.navbar'
])

Uso

Despues de esto puedes usar la navbar en cualquier sitio como

<opk-navbar></opk-navbar>

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.