Revisión del 10:49 15 oct 2018

CÓMO AGREGAR EL PLUGIN NICKCENTER EN CORDOVA

CÓMO AGREGAR LA LIBRERÍA NICKCENTER EN ANDROID

INTRODUCCION

NickCenter es una librería de Registro e Inicio de Sesión para desarrolladores, pudiendo ser activada o desactivada desde nuestro panel cuando se desee. Se encargará de todo lo necesario para registrar en nuestro sistema los usuarios que se den de alta y devolverá a la aplicación en la que se esté usando los datos de éstos en formato JSON. Dicho JSON podrá contener los siguientes campos, pudiendo no estar todos los expuestos a continuación:

user_id: ID del usuario. ( SIEMPRE SE INFORMARÁ )

email: Email del usuario. ( SIEMPRE SE INFORMARÁ )

added_date: Fecha en la que se dio de alta el perfil en NickCenter. ( SIEMPRE SE INFORMARÁ )

name: Nombre del usuario que se ha dado de alta. ( DEPENDERÁ DE SI SE HA REGISTRADO EL CAMPO )

last_name: Apellido del usuario que se ha dado de alta. ( DEPENDERÁ DE SI SE HA REGISTRADO EL CAMPO )

nick: Nick del perfil que se ha dado de alta. ( SIEMPRE SE INFORMARÁ )

telephone: Telefono del usuario que se ha dado de alta. ( DEPENDERÁ DE SI SE HA REGISTRADO EL CAMPO )

languaje: Idioma del telefono con el que el usuario se ha dado de alta. ( SIEMPRE SE INFORMARÁ )

country: Pais del usuario que se ha dado de alta. ( SIEMPRE SE INFORMARÁ )

update_date: Fecha en la que se actualizó el perfil de NickCenter. ( SOLO CUANDO HAYA HABIDO ALGUNA ACTUALIZACIÓN )

birth_date: Fecha de nacimiento del usuario que se ha dado de alta. ( DEPENDERÁ DE SI SE HA REGISTRADO EL CAMPO )

apps: JSON que contendrá las aplicaciones en las que el usuario ha sido registrado. Cabe destacar que solo se mostrarán aplicaciones que compartan el mismo desarrollador, nunca obtendremos datos de aplicaciones externas. ( SIEMPRE SE INFORMARA )

VERSIONES DE ANDROID SOPORTADAS

Esta librería soporta todas las versiones de Android superiores a la version 4.0 (API level 14 y nombre en código Ice Cream Sandwich).

PASOS A REALIZAR EN NUESTRO PANEL

Una vez nuestra aplicación esté registrada en nuestro panel, iremos a la sección de de Desarrolladores y hacemos click en NickCenter —> Añadir app a NickCenter.

Para añadir nuestra aplicación a NickCenter deberemos seguir cinco sencillos pasos:

1.- Selección de app: En este apartado tendremos que elegír la aplicación que queremos añadir a NickCenter y decidir si la librería estará activa o no al lanzar la aplicación seleccionada. Esto se podrá activar y desactivar siempre que se desee.

2.- Pantalla de registro: En este paso configuraremos lo referente a la vista de registro para los usuarios. Podremos elegir entre varios campos de los cuales, como se indica, el email y password siempre serán obligatorios, el resto, será al gusto del desarrollador; pudiendo elegir que el usuario pueda introducir su nombre, pero no siendo obligatorio para el registro.

3.- Pantalla de inicio de sesión: Como en el anterior paso, aquí, configuraremos lo referente a la pantalla de inicio de sesión para los usuarios. En este caso, como se indica, solo será obligatorio el campo password.

4.- Pantalla de recuperación de contraseña: En este caso, para la pantalla de recuperación de contraseña tan solo se pedira el email del usuario y por tanto, dicho email sera un campo obligatorio.

5.- Traducción: Este será el último paso para configurar nuestra aplicación, aquí deberemos seleccionar tanto los idiomas a los que estarán traducidos todos los campos que hemos configurado previamente; como su propia traducción a dichos idiomas. Una vez seleccionado el primer idioma, se pondrá como idioma por defecto de dicha aplicación. Para cambiar el idioma por defecto no tendremos más que generar las traducciones en más idiomas y modificar el campo "Traducción por defecto".

5.1.- Cabeceras y botones: En este primer paso generaremos las traducciones de las cabeceras de las pantallas y de sus botones.

5.2.- Configuración de campos: En el segúndo paso generaremos las traducciones de los campos seleccionados previamente para cada pantalla y de sus posibles errores.

5.3.- Traducciones generales: En el tercer y último paso generaremos las traducciones generales, traducciones que van asociadas a todas las pantallas y no a una/s en concreto como en los anteriores pasos.

Una vez finalizadas las traducciones, como se ha indicado previamente, aparecerá el idioma al que se han realizado las traducciones y se pondrá por defecto.

Si al finalizar dicha configuración no hemos quedado satisfechos con los campos seleccionados en alguna de sus pantallas, cuando procedamos a editar dicha pantalla y añadamos un nuevo campo que previamente no ha sido traducido, automáticamente se abrirá una pantalla para generar las traducciones para el IDIOMA POR DEFECTO. Si queremos generar la traducción para el resto de idiomas hemos de volver a realizar lo especificado en el paso 5.-Traducción.

PASOS A REALIZAR PARA LA INTALACIÓN DE LA LIBRERÍA EN LA APLICACIÓN

INSTALACIÓN:

1. -Disponemos de un repositorio maven para poder usar en Android Studio, para ello deberemos insertar lo siguiente en el archivo “build.gradle” de nuestra aplicación:

- En el apartado de repositories añadiremos:

   repositories {
       mavenCentral()
       maven { url 'https://maven.mobeleader.com' }
   }

En el apartado de repositories añadiremos las dependencias necesarias para usar la librería NickCenter. Serán tanto la propia librería de NickCenter como las librerías UtilsLib y RegisterLib.

   //noinspection GradleDynamicVersion
   implementation 'com.mobeleader.nickcenter:NickCenter:+'
   //noinspection GradleDynamicVersion
   implementation 'com.mobeleader.utils:UtilsLib:+'
   //noinspection GradleDynamicVersion
   implementation 'com.mobeleader.register:RegisterLib:+'

LANZAMIENTO:

Una vez configurada la librería, en la Activity o en el Fragment que se quiera lanzar deberemos añadir las siguientes lineas de código:

   String appName = 'Nombre de la APP en el nuestro panel';
   String appHash = 'Hash de la APP en nuestro panel';
   NCLib nclib = new NCLib(this, appName, appHash, "movil");
   nclib.checkAndLaunch();

appName: Será el nombre que se le ha dado a la aplicación al darla de alta en nuestro panel.

appHash: Será el hash dado por nuestro panel al dar de alta la aplicación en éste. Para acceder a el deberemos ir a la sección Desarrolladores --> Mis Apps y hacer click sobre la columna Hash de nuestra aplicación.

Por defecto las pantallas de NickCenter presentan el siguiente formato:

Si desea modificar las pantallas para que sean lo más parecidas a su aplicación la librería esta dotada de una serie de funciones que le permitirán maquetarlas a su gusto:

setViewsBackgroundColor(String viewsBackgroundColor): Determina el color de fondo de las pantallas.

setViewsBackgroundImage(int viewsBackgroundImage): Determina la imagen de fondo de cada pantalla.

setHeaderBackgroundColor(String headerBackgroundColor): Determina el color de fondo de la cabecera de las pantallas.

setHeaderBackgroundImage(int headerBackgroundImage): Determina la imagen de fondo de la cabecera de cada pantalla.

setHeaderBottomLineColor(String headerBottomLineColor): Determina el color de la linea que separa la cabecera con el resto de la pantalla.

setHeaderTextColor(String headerTextColor): Determina el color del texto de la cabecera de las pantallas.

setHeaderFont(String headerFont): Determina la fuente de los textos de las cabeceras.

setTextFieldsBackgroundColor(String textFieldsBackgroundColor): Determina el color de fondo de los textfields donde se ubican los campos de cada pantalla.

setTextFieldsPlaceholderColor(String textFieldsPlaceholderColor): Determina el color del texto descriptivo de cada textfield.

setTextFieldsTextColor(String textFieldsTextColor): Determina el color del texto de los textfields donde se ubican los campos de cada pantalla.

setTextFieldsFont(String textFieldsFont): Determina la fuente del texto de los textfields.

setButtonsNormalBackgroundColor(String buttonsNormalBackgroundColor): Determina el color de fondo de los botones de cada pantalla.

setButtonsHighlightedBackgroundColor(String buttonsHighlightedBackgroundColor): Determina el color de fondo de los botones de cada pantalla cuando se ha hecho click en éstos.

setButtonsNormalTextColor(String buttonsNormalTextColor): Determina el color del texto de cada boton cuando no se ha hecho click en éstos.

setButtonsHighlightedTextColor(String buttonsHighlightedTextColor): Determina el color del texto de cada boton cuando se ha hecho click en éstos.

setButtonsBorderColor(String buttonsBorderColor): Determina el color del borde de los botones.

setButtonsFont(String buttonsFont): Determina la fuente de los textos de los botones.

setTermsFontColor(String buttonsFont): Determina la fuente de los textos de los terminos y condiciones.

A continuación se expone un ejemplo en el que se maqueta a gusto del desarrollador las pantallas de NickCenter.

   String appName = 'Nombre de la APP en nuestro panel';
   String appHash = 'Hash de la APP en nuestro panel';
   
   NCLib nclib = new NCLib(this, appName, appHash, "movil");
   
   nclib.setViewsBackgroundImage(R.drawable.ic_launcher);
   nclib.setHeaderBackgroundColor("#f0f0f0");
   nclib.setHeaderBottomLineColor("#01e3fe");
   nclib.setHeaderTextColor("#7b7b7b");
   nclib.setTextFieldsBackgroundColor("#ebebeb");
   nclib.setTextFieldsPlaceholderColor("#7b7b7b");
   nclib.setButtonsNormalBackgroundColor("#7b7b7b");
   nclib.setButtonsHighlightedBackgroundColor("#000000");
   nclib.setButtonsNormalTextColor("#7b7b7b");
   nclib.setButtonsBorderColor("#01e3fe");
   
   nclib.checkAndLaunch();

COMPLETAR REGISTRO:

Una vez un usuario haya sido registrado en una de nuestras aplicaciones, cuando otra lance NickCenter, dicho usuario tan soló debera logearse sin necesidad de tener que registrarse otra vez para ésta última aplicación. Se puede dar el caso de que al registrarte en la primera aplicación tán solo fuera necesario email y contraseña, y que para la segunda aplicación fuera necesario registrarse con el telefono, cuando este tipo de casos se den, al logearte en la segunda aplicación se abrirá una nueva vista para completar el registro. Una vez completado dicho registro se tratará como un login normal.

FUNCIONES UTILES:

NickCenter está dotada de una función que permite al desarrollador cerrar la sesión ya iniciada por el usuario de manera que la siguiente vez que abra la aplicación y pase por donde se lanza la librería, el usuario deba volver a loguearse. Dicha funcion es :

closeSession(Context contexto): Cabe destacar que el contexto que se le ha de pasar a la función para cerrar la sesión ha de ser el mismo que se usa para el lanzamiento de la librería.

FUNCIONES DE PRECARGA DE DATOS:

NickCenter está dotada de una serie de funciones que permite al desarrollador precargar los datos del usuario en la pantalla del registro. De ésta manera si el desarrollador conoce los datos de los usuarios, al lanzar la librería los campos se autorellenarán en la pantalla del registro. Dichas funciones son:

setUserName(String name): Rellenará el campo "Nombre".

setUserSurname(String surName): Rellenará el campo "Apellidos".

setUserEmail(String email): Rellenará el campo "Email". El email ha de ser real, se comprobará tanto el formato de la cadena como la veracidad del propio email. Ejemplo: user@domain.com

setUserPhone(String phone): Rellenará el campo "Teléfono". Se validará el formato del teléfono; ha de ser un teléfono sin prefijo internacional. Ejemplo: 666777888

setUserNick(String nick): Rellenará el campo "Nick".

setUserGender(String gender): Rellenará el campo "Sexo". Será M para Hombre y F para mujer.

setUserBirthDate(String birthDate): Rellenará el campo "Fecha de Nacimiento". Ha de ser una fecha en formato inglés separado por /. Ejemplo: 1992/01/12.

LISTENERS:

NickCenter cuenta con una serie de listeners que permiten al desarrollador saber que parte de la librería se esta ejecutando y cual es su resultado. A continuación se expondrá un ejemplo de como lanzar la librería con listeners y cuales son todos éstos.

   String appName = 'Nombre de la APP en nuestro panel';
   String appHash = 'Hash de la APP en nuestro panel';
   
   NCLib nclib = new NCLib(this, appName, appHash, "movil");
   
   nclib.setNCListener(new NCLibListener(){
       @Override
       public void onError(String error){
           super.onError(error);
           Logger.d("LANZA EL ERROR --->"+error);
       }
   });
   
   nclib.checkAndLaunch();

onRegisterViewOpened(): Notifica cuando la vista de registro se ha lanzado.

onLoginViewOpened(): Notifica cuando la vista del login se ha lanzado.

onRescueViewOpened(): Notifica cuando la vista de recuperación de contraseña se ha lanzado.

onError(String error): Notificará cuando haya habido un error, normalmente se lanzará cuando el registro o el login hayan sido incorrectos, o cuando al recuperar la contraseña el email sea incorrecto. Se puede dar el caso de que de otro tipo de error como bien puede ser al conectarnos al sevidor.

onWarning(String warning): Notificará de alguna advertencia al desarrollador.

onFinished(): Notificará cuando la librería haya finalizado algun proceso. Cerrar las vistas de login y registro (con ellas se cierra la aplicación); e inicio de sesión, registro o recuperación de contraseña correcto.

onSessionClosed(): Notificará cuando se haya cerrado la sesión de NickCenter.

onActive(): Notificará cuando detecte que NickCenter esta activa para la aplicación.

onInactive(): Notificará cuando detecte que NickCenter esta inactiva para la aplicación.

onRegisterRegisterButtonClicked(): Notificará cuando se haga click en el botón de registarse en la vista de registro de usuario.

onRegisterLoginButtonClicked(): Notificará cuando se haga click en el botón de inicio de sesión en la vista de registro de usuario.

onRegisterCloseButtonClicked(): Notificará cuando se haga click en el botón de cerrar en la vista de registro de usuario.

onRegisterPerformed(JSONObject user): Notificará cuando haya habido un registro correcto. Se mandará un JSON con los datos obtenidos del usuario.

onLoginLoginButtonClicked(): Notificará cuando se haga click en el botón de inicio de sesión en la vista de inicio de sesión.

onLoginRegisterButtonClicked(): Notificará cuando se haga click en el botón de registrarse en la vista de inicio de sesión.

onLoginRescueButtonClicked(): Notificará cuando se haga click en el botón de recuperar contraseña en la vista de inicio de sesión.

onLoginCloseButtonClicked(): Notificará cuando se haga click en el botón de cerrar en la vista de inicio de sesión.

onLoginPerformed(JSONObject user): Notificará cuando haya habido un inicio de sesión correcto. Se mandará un JSON con los datos obtenidos del usuario.

onRescueRescueButtonClicked(): Notificará cuando se haga click en el botón de recuperar contraseña en la vista de recuperar contraseña.

- onRescueCloseButtonClicked(): Notificará cuando se haga click en el botón de cerrar en la vista de recuperar contraseña.

VERSIONES DE iOs SOPORTADAS

Este framework soporta todas las versiones de iOs superiores a las 10.0, en caso de que detecte una versión inferior no se lanzará.

PASOS A REALIZAR EN EL PANEL MOBELEADER

Una vez nuestra aplicación esté registrada en el Panel Mobeleader, [1](http://panel.mobeleader.com/index.php), iremos a la sección de de Desarrolladores y hacemos click en NickCenter —> Añadir app a NickCenter.

Para añadir nuestra aplicación a NickCenter deberemos seguir cinco sencillos pasos:

1.- Selección de app: En este apartado tendremos que elegír la aplicación que queremos añadir a NickCenter y decidir si la librería estará activa o no al lanzar la aplicación seleccionada. Esto se podrá activar y desactivar siempre que se desee.

2.- Pantalla de registro: En este paso configuraremos lo referente a la vista de registro para los usuarios. Podremos elegir entre varios campos de los cuales, como se indica, el email y password siempre serán obligatorios, el resto, será al gusto del desarrollador; pudiendo elegir que el usuario PUEDA introducir su nombre, pero no siendo obligatorio para el registro.